/* ONVAO — pages publiques (vitrine). Légères, sans script, lisibles partout. */
:root{
  --fond:#f7f6f2;--carte:#ffffff;--encre:#151a20;--doux:#4d5561;--trait:#e3e0d7;
  --or:#b8892c;--or-clair:#f4ead3;--vert:#0b8f66;--vert-fonce:#08704f;--vert-clair:#e3f3ec;
  --rayon:14px;--ombre:0 1px 2px rgba(21,26,32,.06),0 8px 24px rgba(21,26,32,.06);
}
@media (prefers-color-scheme:dark){:root{
  --fond:#111418;--carte:#1a1f25;--encre:#f1efe9;--doux:#b3b7bd;--trait:#2c333b;
  --or:#d6ae57;--or-clair:#2e2717;--vert:#2fbf8c;--vert-fonce:#5fd3a8;--vert-clair:#16302a;
  --ombre:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.25);
}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fond);color:var(--encre);font:17px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
a{color:var(--vert-fonce)}
.evite{position:absolute;left:-9999px}.evite:focus{left:16px;top:16px;background:var(--carte);padding:8px 12px;z-index:9}
.cadre{max-width:1080px;margin:0 auto;padding:0 20px}
header.haut{position:sticky;top:0;z-index:5;background:color-mix(in srgb,var(--fond) 92%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--trait)}
header.haut .cadre{display:flex;align-items:center;gap:18px;min-height:64px}
.marque{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:.08em;text-decoration:none;color:var(--encre);font-size:18px}
.marque svg{width:32px;height:32px}
nav.menu{display:flex;gap:18px;margin-left:auto;align-items:center;flex-wrap:nowrap}
nav.menu a{color:var(--doux);text-decoration:none;font-size:15px}
nav.menu a:hover,nav.menu a[aria-current]{color:var(--encre)}
.bouton{display:inline-block;background:var(--vert);color:#fff!important;text-decoration:none;font-weight:700;padding:12px 20px;border-radius:12px;border:0;line-height:1.2}
.bouton:hover{background:var(--vert-fonce)}
.bouton.creux{background:transparent;color:var(--encre)!important;border:1.5px solid var(--trait)}
.bouton.petit{padding:9px 14px;font-size:15px}
.ariane{font-size:14px;color:var(--doux);padding-top:18px}
.ariane a{color:var(--doux)}
.une{padding:56px 0 40px}
.une h1{font-size:clamp(30px,5vw,50px);line-height:1.12;margin:0 0 16px;letter-spacing:-.01em;max-width:18em}
.une .chapeau{font-size:clamp(18px,2.2vw,21px);color:var(--doux);max-width:40em;margin:0 0 26px}
.une .actions{display:flex;gap:12px;flex-wrap:wrap}
.pastille{display:inline-block;background:var(--or-clair);color:var(--or);font-weight:700;font-size:13px;letter-spacing:.06em;text-transform:uppercase;padding:5px 10px;border-radius:99px;margin-bottom:14px}
section.bloc{padding:40px 0;border-top:1px solid var(--trait)}
section.bloc h2{font-size:clamp(24px,3.2vw,32px);line-height:1.2;margin:0 0 14px}
section.bloc>.cadre>p.intro{color:var(--doux);max-width:44em;margin:0 0 24px}
.grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.carte{background:var(--carte);border:1px solid var(--trait);border-radius:var(--rayon);padding:20px;box-shadow:var(--ombre)}
.carte h3{margin:0 0 8px;font-size:18px;line-height:1.3}
.carte p{margin:0;color:var(--doux);font-size:16px}
.liste{padding-left:1.1em;margin:0}.liste li{margin:6px 0}
.duo{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:start}
@media (max-width:820px){.duo{grid-template-columns:1fr}nav.menu .cache-mobile{display:none}}
@media (max-width:560px){nav.menu a:not(.bouton){display:none}.une{padding-top:36px}}
.encadre{background:var(--vert-clair);border-radius:var(--rayon);padding:20px}
.encadre.or{background:var(--or-clair)}
.tarifs{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;align-items:stretch}
.tarif{background:var(--carte);border:1px solid var(--trait);border-radius:var(--rayon);padding:24px;display:flex;flex-direction:column;gap:10px;box-shadow:var(--ombre)}
.tarif.vedette{border:2px solid var(--vert)}
.tarif .nom{font-weight:800;letter-spacing:.06em}
.tarif .prix{font-size:40px;font-weight:800;line-height:1}
.tarif .prix small{font-size:15px;font-weight:600;color:var(--doux)}
.tarif .pastille{align-self:flex-start;margin:0}
.tarif .bouton{margin-top:auto;text-align:center}
.tarif ul{padding-left:1.1em;margin:4px 0 8px}.tarif li{margin:5px 0;font-size:15.5px}
table.comparatif{width:100%;border-collapse:collapse;background:var(--carte);border-radius:var(--rayon);overflow:hidden;font-size:15px}
table.comparatif th,table.comparatif td{padding:10px 12px;border-bottom:1px solid var(--trait);text-align:center}
table.comparatif th:first-child,table.comparatif td:first-child{text-align:left}
.defile{overflow-x:auto;-webkit-overflow-scrolling:touch}
details.faq{background:var(--carte);border:1px solid var(--trait);border-radius:12px;padding:14px 18px;margin:10px 0}
details.faq summary{cursor:pointer;font-weight:700}
details.faq p{color:var(--doux);margin:10px 0 0}
.appel{text-align:center;padding:52px 0}
.appel h2{margin:0 0 10px}
.appel p{color:var(--doux);margin:0 0 22px}
footer.bas{border-top:1px solid var(--trait);padding:32px 0 44px;font-size:15px;color:var(--doux)}
footer.bas .colonnes{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:18px}
footer.bas a{color:var(--doux);text-decoration:none;display:block;margin:5px 0}
footer.bas a:hover{color:var(--encre)}
footer.bas b{color:var(--encre)}
.note{font-size:14px;color:var(--doux)}
