@font-face{font-family:"Archivo";font-weight:700;font-style:normal;font-display:swap;src:url(fonts/archivo-700.ttf) format("truetype")}
@font-face{font-family:"Archivo";font-weight:800;font-style:normal;font-display:swap;src:url(fonts/archivo-800.ttf) format("truetype")}
/* Gabarit "shanina" (vague 2) : sombre, cinema, editorial. Noir olive, creme, or chaud.
   Aucune couleur ici : tout vient des variables --c-* du bloc THEME de chaque page.
   Structure : en-tete a filets, titre geant en degrade, bandes plein ecran, image en etoile, cartes sombres. */

/* ---------- Police (auto-hebergee, Google Fonts, licence SIL OFL) ---------- */
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:100 900;font-display:swap;src:url("fonts/hanken-grotesk-latin-var.woff2") format("woff2")}

:root{
  --font:"Hanken Grotesk",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --gut:20px;
  --w:76rem;
  --head-h:64px;
  --r-s:6px;--r-m:10px;--r-l:14px;
  --ease:cubic-bezier(.2,.7,.2,1);
  --grad:linear-gradient(96deg,var(--c-grad-1) 0%,var(--c-grad-2) 48%,var(--c-grad-3) 100%);
}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--c-bg);color-scheme:dark}
body{margin:0;font-family:var(--font);font-size:1.0625rem;line-height:1.65;color:var(--c-ink);background:var(--c-bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
html,body{scroll-padding-top:calc(var(--head-h) + 12px)}
@media (prefers-reduced-motion:no-preference){html,body{scroll-behavior:smooth}}
img{display:block;max-width:100%}
svg{width:1em;height:1em;flex:none}
a{color:var(--c-link)}
h1,h2,h3,h4,p,ul,ol,dl,dd,figure,blockquote{margin:0}
ul,ol{padding:0;list-style:none}
button{font:inherit;color:inherit}
::selection{background:var(--c-accent);color:var(--c-accent-ink)}
:focus-visible{outline:2px solid var(--c-focus);outline-offset:3px;border-radius:3px}
.wrap{width:100%;max-width:var(--w);margin-inline:auto;padding-inline:var(--gut)}
.nw{white-space:nowrap}
.muted{color:var(--c-ink-faint)}

.skip{position:absolute;left:12px;top:-60px;z-index:500;background:var(--c-accent);color:var(--c-accent-ink);padding:10px 14px;border-radius:var(--r-s);text-decoration:none;font-weight:700}
.skip:focus{top:12px}

/* texte en degrade (repli : couleur unie) */
.mega,.statement__txt em,.strip__n,.person__name,.rating__n,.foot__mega,.figures dd,.clinic__band span{color:var(--c-grad-2)}
@supports (background-clip:text) or (-webkit-background-clip:text){
  .mega,.statement__txt em,.strip__n,.person__name,.rating__n,.foot__mega,.figures dd{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
}

/* ---------- Etiquettes, boutons, liens ---------- */
.label{font-size:.75rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;line-height:1.4;color:var(--c-ink-faint)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;padding:10px 22px;border:1px solid transparent;border-radius:9999px;font-family:inherit;font-size:.8125rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;line-height:1.2;text-decoration:none;cursor:pointer;transition:background-color .2s,border-color .2s,color .2s}
.btn svg{width:1.15em;height:1.15em}
.btn--sm{min-height:38px;padding:7px 16px;font-size:.75rem}
.btn--block{display:flex;width:100%}
.btn--gold,.btn--primary{background:var(--c-accent);color:var(--c-accent-ink)}
.btn--gold:hover,.btn--primary:hover{background:var(--c-accent-hover)}
.btn--line,.btn--ghost{background:transparent;border-color:var(--c-line-strong);color:var(--c-ink)}
.btn--line:hover,.btn--ghost:hover{border-color:var(--c-accent);color:var(--c-accent)}
.link{display:inline-flex;align-items:center;gap:8px;font-size:.8125rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--c-accent);text-decoration:none;border-bottom:1px solid var(--c-line-strong);padding-bottom:3px}
.link:hover{border-bottom-color:var(--c-accent)}
.linklike{background:none;border:0;padding:0;cursor:pointer;color:inherit;text-decoration:underline;text-underline-offset:3px}
.stars{display:inline-flex;gap:2px;color:var(--c-star);vertical-align:-1px}
.stars svg{width:14px;height:14px}

/* ---------- En-tete : marque, filets, bouton ---------- */
.nav__toggle{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.top{position:fixed;z-index:200;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;gap:16px;height:var(--head-h);padding:0 var(--gut);background:linear-gradient(to bottom,color-mix(in srgb,var(--c-bg) 88%,transparent),transparent);transition:background-color .3s}
.top::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0;background:color-mix(in srgb,var(--c-bg) 90%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--c-line);transition:opacity .3s}
.top.is-solid::before,html:not(.js) .top::before{opacity:1}
.brand{font-size:.9375rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--c-ink);text-decoration:none;white-space:nowrap}
.brand small{font-weight:400;font-size:inherit;color:var(--c-ink-soft)}
.menu{display:none}
.top__cta{display:none}
.top__btn{display:inline-flex;align-items:center;min-height:40px;padding:6px 16px;border:1px solid var(--c-line-strong);border-radius:9999px;font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;background:color-mix(in srgb,var(--c-bg) 60%,transparent)}
.top__btn-close{display:none}
.nav__toggle:checked ~ .top .top__btn-open{display:none}
.nav__toggle:checked ~ .top .top__btn-close{display:inline}
.nav__toggle:focus-visible ~ .top .top__btn{outline:2px solid var(--c-focus);outline-offset:3px}
/* menu telephone : panneau plein ecran sous l'en-tete, jamais sous le bandeau */
.nav__toggle:checked ~ .top .menu{display:flex;flex-direction:column;position:fixed;z-index:190;top:var(--head-h);left:0;right:0;bottom:var(--bar-h,0px);padding:20px var(--gut) 28px;overflow-y:auto;background:var(--c-bg);border-top:1px solid var(--c-line)}
.nav__toggle:checked ~ .top .menu a{display:block;padding:18px 0;border-bottom:1px solid var(--c-line);font-size:1.75rem;font-weight:300;letter-spacing:-.01em;color:var(--c-ink);text-decoration:none}
.nav__toggle:checked ~ .top .menu a:hover{color:var(--c-accent)}

/* ---------- Hero ---------- */
.hero{position:relative;display:flex;flex-direction:column;min-height:calc(100svh - var(--bar-h,0px));min-height:calc(100vh - var(--bar-h,0px));min-height:calc(100dvh - var(--bar-h,0px));padding-top:calc(var(--head-h) + 8px);overflow:hidden;isolation:isolate}
.hero__bg{position:absolute;inset:0;z-index:-2;background:var(--c-warm)}
.hero__bg img{width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.hero__shade{position:absolute;inset:0;z-index:-1;background:
  linear-gradient(to top,var(--c-bg) 0%,color-mix(in srgb,var(--c-bg) 55%,transparent) 38%,transparent 70%),
  linear-gradient(to right,color-mix(in srgb,var(--c-bg) 72%,transparent),transparent 62%)}
.mega{margin:0 var(--gut);font-weight:300;font-size:clamp(2.75rem,12.2vw,5rem);line-height:.98;letter-spacing:-.035em;text-transform:uppercase;overflow-wrap:anywhere;text-wrap:balance;padding-bottom:.06em}
.hero__body{display:flex;flex-direction:column;gap:14px;margin-top:auto;padding:28px var(--gut) 18px;max-width:46rem}
.hero__body h1{font-size:clamp(1.5rem,1.15rem + 1.4vw,2.25rem);line-height:1.2;font-weight:300;letter-spacing:-.015em;text-wrap:balance}
.hero__body .lead{order:3;font-size:1.0625rem;line-height:1.6;color:var(--c-ink-soft);max-width:34rem}
.row-cta{order:2;display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.lead{font-size:1.125rem;line-height:1.65;color:var(--c-ink-soft);max-width:38rem}
.hero__meta{display:grid;grid-template-columns:1fr 1fr;gap:1px;margin:0;border-top:1px solid var(--c-line-strong);background:var(--c-line-strong)}
.hero__meta>div{padding:14px var(--gut);background:color-mix(in srgb,var(--c-bg) 86%,transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.hero__meta dt{font-size:.6875rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--c-ink-faint);line-height:1.4}
.hero__meta dd{margin-top:2px;font-size:.9375rem;line-height:1.4;color:var(--c-ink)}

/* ---------- Sections ---------- */
.sec{padding:72px 0}
.sec--alt{background:var(--c-bg-2);border-block:1px solid var(--c-line)}
.sec-head{margin-bottom:34px}
.sec-head h2{margin-top:12px;font-size:clamp(1.875rem,1.3rem + 2.6vw,3.5rem);line-height:1.08;font-weight:300;letter-spacing:-.028em;text-wrap:balance;max-width:20em}
.sec-head .lead{margin-top:16px}

/* ---------- Enonce et chiffres ---------- */
.statement__txt{font-size:clamp(1.5rem,1.05rem + 2.2vw,2.75rem);line-height:1.2;font-weight:300;letter-spacing:-.022em;color:var(--c-ink);max-width:24em;text-wrap:balance}
.statement__txt em{font-style:normal}
.figures{display:grid;gap:0;margin-top:44px;border-top:1px solid var(--c-line-strong)}
.figures>div{display:flex;flex-direction:column-reverse;gap:4px;padding:20px 0;border-bottom:1px solid var(--c-line)}
.figures dd{font-size:clamp(2.25rem,1.6rem + 2.6vw,3.5rem);line-height:1;font-weight:200;letter-spacing:-.03em;font-variant-numeric:lining-nums tabular-nums}
.figures dt{font-size:.9375rem;line-height:1.45;color:var(--c-ink-soft);max-width:22rem}

/* ---------- Services : bandes plein ecran ---------- */
.services{padding-top:24px}
.strip{position:relative;display:flex;align-items:flex-end;min-height:34rem;margin-top:14px;overflow:hidden;isolation:isolate;background:var(--c-warm)}
.strip__img{position:absolute;inset:0;z-index:-2}
.strip__img img{width:100%;height:100%;object-fit:cover}
.strip__shade{position:absolute;inset:0;z-index:-1;background:
  linear-gradient(to top,color-mix(in srgb,var(--c-bg) 96%,transparent) 0%,color-mix(in srgb,var(--c-bg) 62%,transparent) 48%,color-mix(in srgb,var(--c-bg) 20%,transparent) 100%)}
.strip__in{display:flex;flex-direction:column;gap:16px;padding-block:44px}
.strip__n{font-size:.8125rem;font-weight:700;letter-spacing:.14em;margin:0}
.strip__title{font-size:clamp(2.5rem,1.6rem + 4.4vw,5.5rem);line-height:1;font-weight:300;letter-spacing:-.035em;text-transform:uppercase;overflow-wrap:anywhere}
.card{max-width:26rem;padding:22px;border:1px solid var(--c-line-strong);border-radius:var(--r-m);background:color-mix(in srgb,var(--c-surface) 90%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.card .label{display:flex;align-items:center;gap:10px}
.card .label::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--c-accent);flex:none}
.card__lead{margin-top:14px;padding-bottom:16px;border-bottom:1px solid var(--c-line);font-size:1.0625rem;line-height:1.5;color:var(--c-ink)}
.ticks{display:grid;gap:8px;margin:16px 0 20px}
.ticks li{display:flex;gap:10px;align-items:flex-start;font-size:.9688rem;line-height:1.45;color:var(--c-ink-soft)}
.ticks svg{width:16px;height:16px;margin-top:3px;color:var(--c-accent)}

/* ---------- La clinique : bandeau geant et image en etoile ---------- */
.clinic{--star:min(74vw,24rem);position:relative;padding:72px 0 80px;overflow:hidden;isolation:isolate}
.clinic__stage{position:relative}
.clinic__band{border-block:1px solid var(--c-line);padding-block:6px;white-space:nowrap;overflow:hidden;user-select:none}
.clinic__band span{display:inline-block;font-size:clamp(3.5rem,18vw,9rem);font-weight:200;letter-spacing:-.04em;line-height:1.1;text-transform:uppercase;color:var(--c-line-strong);padding-left:var(--gut)}
.clinic__star{position:absolute;left:50%;top:50%;width:var(--star);aspect-ratio:1/1;transform:translate(-50%,-50%)}
.clinic__star img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;filter:brightness(1.55) contrast(1.05) saturate(1.1);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M50 0C50 28 72 50 100 50C72 50 50 72 50 100C50 72 28 50 0 50C28 50 50 28 50 0Z'/%3E%3C/svg%3E") center/100% 100% no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M50 0C50 28 72 50 100 50C72 50 50 72 50 100C50 72 28 50 0 50C28 50 50 28 50 0Z'/%3E%3C/svg%3E") center/100% 100% no-repeat}
.clinic__in{position:relative;margin-top:calc(var(--star) / 2 + 28px)}
.pledges{display:grid;gap:0;margin-top:8px;border-top:1px solid var(--c-line-strong)}
.pledges li{display:grid;grid-template-columns:3rem 1fr;gap:2px 12px;padding:20px 0;border-bottom:1px solid var(--c-line)}
.pledges__n{grid-row:1/3;font-size:.8125rem;font-weight:700;letter-spacing:.12em;color:var(--c-accent);padding-top:.35em}
.pledges h3{font-size:1.375rem;line-height:1.3;font-weight:400;letter-spacing:-.01em}
.pledges p{color:var(--c-ink-soft);font-size:1rem;line-height:1.55}

/* ---------- Equipe ---------- */
.person{position:relative;display:grid;gap:18px;padding-block:26px;border-top:1px solid var(--c-line)}
.person__name{font-size:clamp(2.25rem,1.3rem + 4.6vw,5.5rem);line-height:1;font-weight:300;letter-spacing:-.035em;text-transform:uppercase;overflow-wrap:anywhere;padding-bottom:.06em}
.person__img{width:min(100%,20rem);aspect-ratio:4/5;overflow:hidden;border-radius:var(--r-m);border:1px solid var(--c-line-strong);background:var(--c-warm)}
.person__img img{width:100%;height:100%;object-fit:cover}
.person__txt{display:grid;gap:12px;align-content:start;max-width:32rem}
.person__txt>p:not(.label):not(.chip){color:var(--c-ink-soft)}
.chip{justify-self:start;padding:5px 12px;border:1px solid var(--c-line-strong);border-radius:9999px;font-size:.8125rem;line-height:1.4;color:var(--c-ink)}

/* ---------- Galerie ---------- */
.reel{display:grid;grid-template-columns:1fr 1fr;gap:14px 12px}
.tile{display:grid;gap:10px;align-content:start}
.tile img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;border-radius:var(--r-m);border:1px solid var(--c-line-strong);background:var(--c-warm)}
.tile figcaption{display:grid;gap:2px;font-size:.875rem;line-height:1.4}
.tile figcaption b{font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.tile figcaption span{color:var(--c-ink-soft)}

/* ---------- Avis ---------- */
.rating{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:18px}
.rating__n{font-size:2.5rem;font-weight:200;letter-spacing:-.03em;line-height:1}
.quotes{display:grid;gap:14px}
.quote{padding:26px 22px;border:1px solid var(--c-line-strong);border-radius:var(--r-m);background:var(--c-surface)}
.quote blockquote{font-size:1.1875rem;line-height:1.6;font-weight:300;letter-spacing:-.003em}
.quote figcaption{display:flex;flex-direction:column;gap:2px;margin-top:20px;padding-top:14px;border-top:1px solid var(--c-line);font-size:.9375rem}
.quote figcaption b{font-weight:700}
.quote figcaption span{font-size:.75rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--c-ink-faint)}

/* ---------- FAQ ---------- */
.faq__grid{display:grid;gap:8px}
.toggles{border-top:1px solid var(--c-line-strong)}
.toggles details{border-bottom:1px solid var(--c-line-strong)}
.toggles summary{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:20px 2px;cursor:pointer;font-size:1.125rem;font-weight:400;line-height:1.4;list-style:none}
.toggles summary::-webkit-details-marker{display:none}
.toggles summary:hover{color:var(--c-accent)}
.toggles summary svg{width:22px;height:22px;margin-top:2px;color:var(--c-accent);transition:transform .25s var(--ease)}
.toggles details[open] summary svg{transform:rotate(45deg)}
.toggles details p{padding:0 2px 22px;max-width:40rem;color:var(--c-ink-soft)}

/* ---------- Contact et formulaire ---------- */
.contact__grid{display:grid;gap:40px}
.contact__info h2{margin-top:12px;font-size:clamp(1.875rem,1.3rem + 2.6vw,3.5rem);line-height:1.08;font-weight:300;letter-spacing:-.028em;text-wrap:balance}
.contact__info .lead{margin-top:16px}
.facts{display:grid;margin-top:30px;border-top:1px solid var(--c-line-strong)}
.facts>div{display:grid;gap:4px;padding:16px 0;border-bottom:1px solid var(--c-line)}
.facts dt{display:flex;align-items:center;gap:10px;font-size:.75rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--c-ink-faint)}
.facts dt svg{width:18px;height:18px;color:var(--c-accent)}
.facts dd{line-height:1.55}
.facts a:not(.link){color:var(--c-ink);text-decoration:none;border-bottom:1px solid var(--c-line-strong)}
.facts a:not(.link):hover{border-bottom-color:var(--c-accent)}
.facts .link{margin-top:8px}
.anchor-offset{display:block;height:0;position:relative;top:-90px}
.form{padding:24px 20px;border:1px solid var(--c-line-strong);border-radius:var(--r-l);background:var(--c-surface)}
.form h2,.form h3{font-size:1.75rem;font-weight:300;letter-spacing:-.02em;line-height:1.2}
.fine{margin:8px 0 22px;font-size:.9063rem;line-height:1.5;color:var(--c-ink-soft)}
.fields{display:grid;gap:16px;margin-bottom:18px}
.field label{display:block;margin-bottom:6px;font-size:.75rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--c-ink-soft)}
.field input,.field select,.field textarea{width:100%;min-height:48px;padding:11px 14px;border:1px solid var(--c-line-strong);border-radius:var(--r-s);background:var(--c-bg);color:var(--c-ink);font:inherit;font-size:1rem}
.field textarea{min-height:110px;resize:vertical}
.field input::placeholder,.field textarea::placeholder{color:var(--c-ink-faint)}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--c-focus);outline-offset:1px;border-color:var(--c-accent)}
.consent{display:grid;grid-template-columns:20px 1fr;gap:12px;align-items:start;margin-bottom:20px;font-size:.9063rem;line-height:1.5;color:var(--c-ink-soft)}
.consent input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--c-accent)}
.consent a{color:var(--c-link)}
.form__ok{display:none;margin-top:14px;padding:12px 14px;border-radius:var(--r-s);background:var(--c-bg-2);border:1px solid var(--c-accent);font-weight:600}
.form__ok.is-on{display:block}

/* ---------- Pied de page ---------- */
.foot{padding:56px 0 48px;border-top:1px solid var(--c-line);background:var(--c-bg);font-size:.9063rem;line-height:1.65;color:var(--c-ink-soft);overflow:hidden}
.foot__mega{font-size:clamp(4rem,22vw,13rem);font-weight:200;letter-spacing:-.045em;line-height:.9;text-transform:uppercase;padding-bottom:.08em;margin-bottom:28px}
.foot__links{display:flex;flex-wrap:wrap;gap:8px 22px;padding-bottom:22px;border-bottom:1px solid var(--c-line);font-size:.8125rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase}
.foot__links a,.foot__links .linklike{color:var(--c-ink);text-decoration:none;font-weight:600;letter-spacing:.1em;text-transform:uppercase}
.foot__links a:hover,.foot__links .linklike:hover{color:var(--c-accent)}
.foot__legal{display:grid;gap:10px;margin-top:22px;max-width:46rem}

/* ---------- Pages juridiques ---------- */
.legal-hero{padding:calc(var(--head-h) + 56px) 0 12px}
.legal-hero h1{margin-top:12px;font-size:clamp(2.25rem,1.5rem + 3.6vw,4.5rem);line-height:1.04;font-weight:300;letter-spacing:-.03em;text-wrap:balance}
.legal-hero .lead{margin-top:16px}
.legal{padding:20px 0 72px}
.legal .col{max-width:46rem}
.legal h2{margin:44px 0 12px;font-size:1.5rem;line-height:1.3;font-weight:400;letter-spacing:-.012em;scroll-margin-top:calc(var(--head-h) + 12px)}
.legal p,.legal li{color:var(--c-ink-soft)}
.legal p{margin-top:12px}
.legal ul{display:grid;gap:8px;margin:12px 0 0 1.2rem;list-style:disc}
.toc{margin:24px 0 0;padding:20px 22px;border:1px solid var(--c-line-strong);border-radius:var(--r-m);background:var(--c-surface)}
.toc strong{display:block;margin-bottom:10px;font-size:.75rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--c-ink-faint)}
.toc ol{display:grid;gap:6px;padding-left:1.4rem;list-style:decimal}
.toc a{color:var(--c-ink);text-decoration:none}
.toc a:hover{color:var(--c-accent)}

/* ---------- Apparitions (ajoutees par JS, jamais masquees par defaut) ---------- */
.js .rv-init{opacity:0;transform:translateY(14px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js .rv-init.rv-in{opacity:1;transform:none}

/* ---------- Petits ecrans : l'accueil tient au-dessus du bandeau ---------- */
@media (max-width:599px){
  .hero__meta{display:none}
  .hero__body{padding-bottom:24px}
}

/* ---------- Tablette ---------- */
@media (min-width:600px){
  :root{--gut:28px}
  .hero__meta{grid-template-columns:repeat(4,1fr)}
  .hero__meta>div{padding:16px var(--gut)}
  .figures{grid-template-columns:repeat(3,1fr);border-bottom:0}
  .figures>div{padding:24px 20px 24px 0;border-bottom:0;border-right:1px solid var(--c-line)}
  .figures>div+div{padding-left:24px}
  .figures>div:last-child{border-right:0}
  .reel{grid-template-columns:repeat(4,1fr);gap:16px}
  .quotes{grid-template-columns:1fr 1fr}
  .quote:last-child{grid-column:1/-1}
  .fields{grid-template-columns:1fr 1fr}
  .field--full{grid-column:1/-1}
  .form{padding:32px}
  .strip{min-height:36rem}
  .person{grid-template-columns:20rem 1fr;gap:20px 40px;align-items:start;padding-block:36px}
  .person__name{grid-column:1/-1}
  .person--alt{grid-template-columns:1fr 20rem}
  .person--alt .person__img{grid-column:2;grid-row:2}
  .person--alt .person__txt{grid-column:1;grid-row:2}
  .person__txt{align-self:center}
}

/* ---------- Ordinateur : navigation a filets ---------- */
@media (min-width:1024px){
  :root{--gut:48px;--head-h:72px}
  .top{display:grid;grid-template-columns:auto 1fr auto;gap:36px}
  .top__btn{display:none}
  .menu,.nav__toggle:checked ~ .top .menu{display:flex;flex-direction:row;position:static;padding:0;overflow:visible;border:0;background:none;align-items:center;gap:18px}
  .menu a,.nav__toggle:checked ~ .top .menu a{display:block;padding:0;border:0;font-size:.75rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--c-ink-soft);text-decoration:none;white-space:nowrap}
  .menu a:hover,.nav__toggle:checked ~ .top .menu a:hover{color:var(--c-accent)}
  .menu::before,.menu::after{content:"";height:1px;background:var(--c-line-strong);flex:1}
  .menu a:not(:last-child)::after{content:"";display:inline-block;width:clamp(24px,6vw,110px);height:1px;margin-left:18px;background:var(--c-line-strong);vertical-align:middle}
  .menu::before{display:none}
  .menu::after{display:none}
  .top__cta{display:inline-flex;align-items:center;min-height:42px;padding:8px 20px;border:1px solid var(--c-accent);border-radius:9999px;font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--c-accent);text-decoration:none;white-space:nowrap}
  .top__cta:hover{background:var(--c-accent);color:var(--c-accent-ink)}
  .mega{font-size:clamp(5rem,8.6vw,9.5rem);margin-top:6px}
  .hero__body{padding:36px var(--gut) 28px;max-width:52rem}
  .hero__body h1{font-size:clamp(2rem,1.5rem + 1.6vw,2.75rem)}
  .sec{padding:112px 0}
  .strip{min-height:42rem}
  .strip__in{display:grid;grid-template-columns:1fr minmax(0,26rem);grid-template-rows:auto 1fr;gap:0 48px;align-items:end;padding-block:56px}
  .strip__n{grid-column:1;grid-row:1;align-self:start}
  .strip__title{grid-column:1;grid-row:2;align-self:end}
  .card{grid-column:2;grid-row:1/3;justify-self:end;width:100%}
  .clinic{--star:min(30vw,30rem);padding:112px 0 120px}
  .clinic__in .sec-head{max-width:40rem}
  .quotes{grid-template-columns:repeat(3,1fr)}
  .quote:last-child{grid-column:auto}
  .quote{display:flex;flex-direction:column;justify-content:space-between}
  .faq__grid{grid-template-columns:5fr 7fr;gap:72px;align-items:start}
  .faq__grid .sec-head{margin-bottom:0;position:sticky;top:calc(var(--head-h) + 24px)}
  .contact__grid{grid-template-columns:6fr 5fr;gap:88px;align-items:start}
  .person{grid-template-columns:22rem 1fr;gap:28px 64px}
  .person--alt{grid-template-columns:1fr 22rem}
}

/* ---------- Bandeau Loi 25 : compact, fixe en bas du viewport ---------- */
.consent-bar{padding:12px var(--gut);font-size:.875rem;line-height:1.4;border-top:1px solid var(--c-line-strong)}
.consent-bar__in{max-width:var(--w);margin-inline:auto;display:flex;gap:12px 28px;align-items:center;justify-content:space-between}
.consent-bar__btns{display:flex;gap:8px;flex:none}
html:not(.js) .consent-bar__btns{display:none}
.js .consent-bar{position:fixed;z-index:300;left:0;right:0;bottom:0}
.js .consent-bar[hidden]{display:none}
.consent-bar .cb-more{display:inline}
@media (max-width:599px){
  .consent-bar__in{flex-direction:column;align-items:stretch;gap:8px}
  .consent-bar{padding-block:8px;font-size:.8125rem;line-height:1.35}
  .consent-bar .cb-more{display:none}
  .consent-bar__btns .btn{flex:1;min-height:36px;padding-block:6px}
}
/* Tant que le choix n'est pas fait, la page defile dans une zone qui s'arrete au-dessus du bandeau :
   rien ne passe dessous, jamais (image d'accueil, bouton principal, formulaire, pied de page). */
.js.has-bar body{padding-bottom:calc(var(--bar-h,0px) + 12px)}

/* ---------- Mouvement reduit ---------- */
@media (prefers-reduced-motion:reduce){
  html,body{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js .rv-init{opacity:1!important;transform:none!important}
}

/* ===== Bandeau Loi 25 : lisibilite garantie quel que soit le theme =====
   Le fond et le bouton Tout accepter viennent de variables dediees (--c-consent-*, bloc THEME), pas de la
   palette du site. La couleur du texte est CALCULEE depuis le fond : blanc ou noir selon la luminance relative
   (seuil 0,179 : contraste >= 4,58:1 des deux cotes), donc lisible meme si le client choisit un fond de bandeau
   proche de n'importe quelle couleur. Repli (anciens navigateurs) : --c-consent-ink et --c-consent-action-ink.
   Fond opaque, pas de flou : rien ne passe sous le texte. Technique reprise de la PR #42 (gabarits existants). */
.consent-bar.consent-bar{--cb-ink:var(--c-consent-ink);--cb-action-ink:var(--c-consent-action-ink);background:var(--c-consent-bg);color:var(--cb-ink);-webkit-backdrop-filter:none;backdrop-filter:none}
.consent-bar.consent-bar :is(h2,p,b,strong,span,a){color:inherit}
.consent-bar.consent-bar a{text-decoration:underline;text-underline-offset:2px;white-space:nowrap}
.consent-bar .btn[data-consent]{background:transparent;color:var(--cb-ink);border:1px solid currentColor;box-shadow:none;opacity:1}
.consent-bar .btn[data-consent="accepte"]{background:var(--c-consent-action);color:var(--cb-action-ink);border-color:var(--c-consent-action)}
.consent-bar .btn[data-consent="refus"]:hover{background:color-mix(in srgb,currentColor 14%,transparent);color:var(--cb-ink)}
.consent-bar .btn[data-consent="accepte"]:hover{background:color-mix(in srgb,var(--c-consent-action) 86%,var(--cb-action-ink));color:var(--cb-action-ink)}
.consent-bar :is(a,button):focus-visible{outline:2px solid currentColor;outline-offset:2px}

/* ---------- Emplacements de photo : le role du slot s'affiche derriere l'image, seulement si elle manque (classe is-vide, posee par main.js) ---------- */
[data-role]{isolation:isolate}
figure.person__img[data-role],figure.tile[data-role]{position:relative}
[data-role].is-vide::before{content:attr(data-role);position:absolute;inset:0;z-index:-1;display:grid;place-items:center;padding:20px;text-align:center;font-family:inherit;font-size:.75rem;font-weight:400;line-height:1.5;letter-spacing:.04em;text-transform:uppercase;color:var(--c-ink-faint,currentcolor);border:1px dashed var(--c-line-strong,currentcolor);pointer-events:none;overflow-wrap:anywhere}
[data-role-top].is-vide::before{place-items:start end;padding:88px 24px 0;text-align:right;font-size:.625rem;border:0}
[data-role].is-vide img{visibility:hidden}

/* Police serif ovale (Instrument Serif, SIL OFL) */
@font-face{font-family:"Instrument Serif";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/instrument-serif-latin.woff2") format("woff2")}
@font-face{font-family:"Instrument Serif";font-style:italic;font-weight:400;font-display:swap;src:url("fonts/instrument-serif-italic-latin.woff2") format("woff2")}
h1,h2,h3,.hero__body h1,.hero__title,.legal-hero h1,.brand{font-family:"Instrument Serif",Georgia,serif;font-weight:400;text-transform:none;letter-spacing:-.01em}
.btn,.top__btn,.top__cta{background:#E4002B;color:#FFFFFF;border:0;font-weight:700}
.btn:hover,.top__btn:hover,.top__cta:hover{background:#FAFAFA;color:#0A0A0A}
.hero__body h1{font-size:clamp(2.4rem,1.6rem + 3vw,4.5rem);line-height:1.05}
.brand{font-size:1.5rem}

/* Marque Romano, grande, a gauche, sans contour */
.brand{font-size:2.2rem;line-height:1;text-align:left;text-transform:none}
.btn,.top__btn,.top__cta{border:0!important;outline:0;box-shadow:none}
.btn:hover,.top__btn:hover,.top__cta:hover{background:#FFFFFF;color:#0A0A0A;border:0!important}
.top__cta{flex:0 0 auto;width:auto;max-width:max-content;padding:10px 24px;text-align:center}

/* Logo et menu sur la meme ligne: logo a gauche, menu a droite */
.logo{font-family:"Instrument Serif",Georgia,serif;font-weight:400;font-size:clamp(2rem,1.4rem + 2vw,3.6rem);line-height:1;letter-spacing:-.02em;text-transform:none;color:#FAFAFA;text-decoration:none;margin-right:auto}
@media (min-width:900px){
  .top{display:flex;justify-content:space-between;align-items:center;gap:28px}
  .menu{margin-left:auto}
}
.hero__body{padding-top:0}
.logo b{color:#E4002B;font-weight:inherit}
.logo,.top .logo{font-family:'Archivo',sans-serif!important;font-weight:700!important;font-size:17px!important;line-height:1.2;letter-spacing:.22em!important;text-transform:uppercase!important;white-space:nowrap}
.logo b{color:#E4002B!important;font-weight:700!important}
.form__err{display:none;margin-top:14px;padding:12px 14px;border-radius:var(--r-s);background:var(--c-bg-2);border:1px solid #ff6b6b;font-weight:600}
.form__err.is-on{display:block}

/* Bandeau Loi 25 v3 : fond sombre opaque en dur + texte clair. Lisible meme si le fond ne se peint pas (Safari iOS).
   Aucune variable CSS, aucune couleur calculee. */
.consent-bar.consent-bar{background:#1a1a1a!important;background-color:#1a1a1a!important;background-image:linear-gradient(#1a1a1a,#1a1a1a)!important;color:#f4f4f0!important;border-top:1px solid #5a5a5a!important;-webkit-transform:translateZ(0);transform:translateZ(0);padding-bottom:max(12px,env(safe-area-inset-bottom))}
.consent-bar.consent-bar :is(h2,p,b,strong,span,a){color:#f4f4f0!important}
.consent-bar.consent-bar .btn[data-consent="refus"]{background:transparent!important;color:#f4f4f0!important;border:1px solid #f4f4f0!important}
.consent-bar.consent-bar .btn[data-consent="accepte"]{background:#E4002B!important;color:#ffffff!important;border:1px solid #E4002B!important}

/* ---------- Correctif Safari iOS : menu telephone toujours au-dessus du hero ----------
   Le hero (isolation + overflow + cartes en backdrop-filter) est compose sur sa propre couche par WebKit
   et pouvait passer devant l'en-tete fixe. On donne au hero un niveau explicite bas, a l'en-tete un niveau
   haut (sous le bandeau vocal 400), et au menu sa propre couche. Pas de transform sur .top : il deviendrait
   le bloc conteneur du menu fixe. */
.hero{z-index:0}
.hero__meta>div{position:relative;z-index:0}
.top{z-index:350;isolation:isolate}
.nav__toggle:checked ~ .top .menu{z-index:340;-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
@media (min-width:1101px){
  .nav__toggle:checked ~ .top .menu,.menu{-webkit-transform:none;transform:none;z-index:auto}
}

/* ---------- Correctif Chrome mobile : menu ouvert sous/dans le hero ----------
   Sous 1101 px, .top porte un backdrop-filter. Chrome (Android/iOS) en fait le bloc conteneur des
   enfants en position fixe : le menu fixe est alors calcule dans les 64 px de l'en-tete au lieu de
   l'ecran, et s'ecrase/passe sous le hero tant que la classe html.menu-open (JS) n'est pas posee
   (retour arriere, restauration du formulaire, barre d'adresse). On coupe le filtre en CSS pur des
   que la case est cochee, et on garde le flou sur un pseudo-element (qui ne cree pas de bloc conteneur). */
@media (max-width:1100px){
  .nav__toggle:checked ~ .top,html.menu-open .top{-webkit-backdrop-filter:none!important;backdrop-filter:none!important;background:#0a0a0a!important;-webkit-transform:none!important;transform:none!important;filter:none!important;will-change:auto!important}
  .nav__toggle:checked ~ .top .menu{position:fixed!important;z-index:340!important;top:64px!important;left:0!important;right:0!important;bottom:0!important;height:calc(100vh - 64px);height:calc(100dvh - 64px)}
  html[data-theme="light"] .nav__toggle:checked ~ .top,html[data-theme="light"].menu-open .top{background:#fff!important}
}