/* =========================================================
   SEVRIA · Design system landing pages
   Charte : #004444 (teal) · #C9E0DA (mint) · #EDECE8 (sand)
            #FFFFFF · #031917 (encre) · Typo : Poppins
   ========================================================= */

:root{
  --teal:#004444;
  --teal-700:#013a3a;
  --teal-900:#031917;
  --mint:#C9E0DA;
  --mint-50:#EAF3F0;
  --sand:#EDECE8;
  --white:#fff;
  --ink:#031917;
  --ink-70:rgba(3,25,23,.72);
  --ink-55:rgba(3,25,23,.58);
  --on-teal:#EAF3F0;
  --on-teal-70:rgba(234,243,240,.74);
  --line:rgba(3,25,23,.12);
  --line-dark:rgba(201,224,218,.22);

  --r-sm:10px; --r-md:16px; --r-lg:24px; --r-xl:32px; --r-pill:999px;
  --shadow-sm:0 1px 2px rgba(3,25,23,.05), 0 6px 18px rgba(3,25,23,.05);
  --shadow-md:0 2px 6px rgba(3,25,23,.06), 0 18px 44px rgba(3,25,23,.09);
  --shadow-lg:0 30px 70px rgba(3,25,23,.14);

  --pad:clamp(20px, 5vw, 40px);
  --maxw:1180px;
  --sec-y:clamp(44px, 5.6vw, 76px);

  --logo-badge:#004444; --logo-dots:#C9E0DA; --logo-word:#004444;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;
  font-family:"Poppins",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  color:var(--ink);
  background:var(--white);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg{max-width:100%;height:auto;display:block}
a{color:inherit}

/* ---------- Typo ---------- */
h1,h2,h3,h4{margin:0;line-height:1.14;letter-spacing:-.022em;font-weight:600}
h1{font-size:clamp(2.1rem, 1.35rem + 3.2vw, 4rem);letter-spacing:-.032em}
h2{font-size:clamp(1.65rem, 1.15rem + 2.1vw, 2.85rem);letter-spacing:-.028em}
h3{font-size:clamp(1.12rem, 1rem + .5vw, 1.4rem)}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}
strong{font-weight:600}

.eyebrow{
  display:inline-flex;align-items:center;gap:.6em;
  font-size:.735rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:var(--teal);margin:0 0 20px;
}
.eyebrow::before{content:"";width:22px;height:1.5px;background:currentColor;opacity:.5}
.on-dark .eyebrow{color:var(--mint)}
.lead{font-size:clamp(1.02rem,.97rem + .35vw,1.22rem);color:var(--ink-70);max-width:62ch}
.on-dark .lead{color:var(--on-teal-70)}
.small{font-size:.86rem;line-height:1.6;color:var(--ink-55)}
.on-dark .small{color:var(--on-teal-70)}
.mono-num{font-variant-numeric:tabular-nums}

/* ---------- Layout ---------- */
.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--pad)}
.wrap--narrow{max-width:800px}
.section{padding-block:var(--sec-y);position:relative}
.section--sand{background:var(--sand)}
.section--mint{background:var(--mint)}
.section--teal{background:var(--teal);color:var(--on-teal)}
.section--teal h1,.section--teal h2,.section--teal h3{color:var(--white)}
/* La mesure de 66ch était calée sur le corps de texte : beaucoup trop étroite
   pour un H2 de 45 px, qui se retrouvait sur quatre lignes. Les accroches
   gardent leur propre limite de lecture via .lead (62ch). */
.sec-head{max-width:min(100%, 1000px);margin-bottom:clamp(24px,3.2vw,40px)}
.sec-head p{margin-top:18px}

.grid{display:grid;gap:clamp(16px,2vw,24px)}
.g-2{grid-template-columns:repeat(2,1fr)}
.g-3{grid-template-columns:repeat(3,1fr)}
.g-4{grid-template-columns:repeat(4,1fr)}
@media (max-width:900px){.g-3,.g-4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){.g-2,.g-3,.g-4{grid-template-columns:1fr}}

/* ---------- Boutons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6em;
  font:inherit;font-weight:600;font-size:1rem;line-height:1;
  padding:19px 34px;border-radius:var(--r-pill);border:1.5px solid transparent;
  text-decoration:none;cursor:pointer;text-align:center;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease, border-color .18s ease;
}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn:focus-visible{outline:3px solid var(--teal);outline-offset:3px}
.btn--primary{background:var(--teal);color:var(--white);box-shadow:var(--shadow-md)}
.btn--primary:hover{background:var(--teal-700);box-shadow:var(--shadow-lg)}
.btn--onteal{background:var(--mint);color:var(--teal-900);box-shadow:0 18px 40px rgba(0,0,0,.24)}
.btn--onteal:hover{background:var(--white)}
.btn--ghost{background:transparent;color:var(--teal);border-color:var(--line)}
.btn--ghost:hover{border-color:var(--teal);background:rgba(0,68,68,.04)}
.on-dark .btn--ghost{color:var(--on-teal);border-color:var(--line-dark)}
.on-dark .btn--ghost:hover{border-color:var(--mint);background:rgba(201,224,218,.08)}
.btn--sm{padding:13px 22px;font-size:.9rem}
.btn--block{width:100%}
.btn-row{display:flex;flex-wrap:wrap;gap:14px;align-items:center}

/* ---------- Header ---------- */
.topbar{
  position:sticky;top:0;z-index:60;
  background:rgba(255,255,255,.88);backdrop-filter:blur(14px);
  border-bottom:1px solid transparent;transition:border-color .25s ease, box-shadow .25s ease;
}
.topbar.is-stuck{border-bottom-color:var(--line);box-shadow:0 8px 28px rgba(3,25,23,.06)}
.topbar__in{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:74px}
.topbar__logo{display:block;flex:0 0 auto}
.topbar__logo img{height:34px;width:auto}
.topbar__right{display:flex;align-items:center;gap:18px}
.topbar__tel{font-size:.93rem;font-weight:500;text-decoration:none;color:var(--ink-70);white-space:nowrap}
.topbar__tel:hover{color:var(--teal)}
@media (max-width:760px){.topbar__tel{display:none}.topbar__logo img{height:30px}}

/* ---------- Hero ---------- */
.hero{position:relative;background:var(--teal);color:var(--on-teal);overflow:hidden}
.hero__bg{
  position:absolute;inset:0;pointer-events:none;
  background-image:
    radial-gradient(circle at 78% 18%, rgba(201,224,218,.16), transparent 52%),
    radial-gradient(circle at 8% 92%, rgba(201,224,218,.1), transparent 46%);
}
.hero__dots{
  position:absolute;right:-70px;top:50%;transform:translateY(-50%);
  width:min(46vw,540px);opacity:.075;color:var(--mint);pointer-events:none;
}
@media (max-width:980px){.hero__dots{right:-24%;width:88vw;opacity:.05}}
.hero__in{position:relative;padding-block:clamp(36px,4.4vw,64px) clamp(48px,6.4vw,88px)}
.hero__grid{display:grid;grid-template-columns:1.08fr .92fr;gap:clamp(30px,5vw,64px);align-items:center}
@media (max-width:980px){.hero__grid{grid-template-columns:1fr;gap:38px}}
.hero h1{color:var(--white);max-width:16ch}
.hero .lead{margin-top:22px;font-size:clamp(1.05rem,1rem + .45vw,1.28rem);color:var(--on-teal-70)}
.hero .btn-row{margin-top:34px}
.hero__note{margin-top:22px;font-size:.84rem;color:var(--on-teal-70);max-width:48ch}

.tag{
  display:inline-flex;align-items:center;gap:.55em;
  padding:9px 16px 9px 13px;border-radius:var(--r-pill);
  background:rgba(201,224,218,.13);border:1px solid var(--line-dark);
  font-size:.83rem;font-weight:500;color:var(--on-teal);
}
.tag svg{width:15px;height:15px;flex:0 0 auto;color:var(--mint)}
.tag-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.tag--light{background:var(--white);border-color:var(--line);color:var(--ink)}
.tag--light svg{color:var(--teal)}

/* Carte "réservation" du hero */
.book-card{
  background:var(--white);color:var(--ink);border-radius:var(--r-xl);
  padding:clamp(26px,3.2vw,38px);box-shadow:var(--shadow-lg);
}
.book-card h2{font-size:clamp(1.3rem,1.15rem + .6vw,1.65rem);margin-bottom:8px}
.book-card ul{list-style:none;margin:22px 0;padding:0;display:grid;gap:13px}
.book-card li{display:flex;gap:11px;align-items:flex-start;font-size:.95rem;line-height:1.5}
.book-card li svg{width:19px;height:19px;flex:0 0 auto;color:var(--teal);margin-top:2px}
.book-card .btn{margin-top:4px}
.book-card__foot{margin-top:16px;text-align:center;font-size:.8rem;color:var(--ink-55)}

/* ---------- Bandeau conformité ---------- */
.disclaimer-bar{background:var(--teal-900);color:rgba(234,243,240,.78);font-size:.8rem;padding-block:13px}
.disclaimer-bar .wrap{display:flex;gap:10px;align-items:flex-start;justify-content:center;text-align:center}
.disclaimer-bar svg{width:16px;height:16px;flex:0 0 auto;margin-top:2px;color:var(--mint)}

/* ---------- Cartes ---------- */
.card{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:clamp(24px,2.6vw,32px);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.card--hover:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:transparent}
.card h3{margin-bottom:10px}
.card p{color:var(--ink-70);font-size:.96rem}
.section--sand .card{border-color:rgba(3,25,23,.08)}
.card__ico{
  width:50px;height:50px;border-radius:15px;display:grid;place-items:center;
  background:var(--mint);color:var(--teal);margin-bottom:20px;
}
.card__ico svg{width:24px;height:24px}
.card--dark{background:rgba(201,224,218,.07);border-color:var(--line-dark);color:var(--on-teal)}
.card--dark p{color:var(--on-teal-70)}
.card--dark .card__ico{background:rgba(201,224,218,.16);color:var(--mint)}

/* ---------- Bénéfices (liste 2 col.) ---------- */
.benefit{display:flex;gap:16px;align-items:flex-start}
.benefit__ico{
  width:42px;height:42px;flex:0 0 auto;border-radius:13px;display:grid;place-items:center;
  background:var(--white);color:var(--teal);box-shadow:var(--shadow-sm);
}
.benefit__ico svg{width:20px;height:20px}
.benefit h3{font-size:1.02rem;margin-bottom:5px}
.benefit p{font-size:.92rem;color:var(--ink-70);margin:0}

/* ---------- Étapes ---------- */
.steps{counter-reset:s;display:grid;gap:0}
.step{
  display:grid;grid-template-columns:auto 1fr;gap:clamp(18px,2.4vw,30px);
  padding-block:clamp(24px,3vw,34px);border-top:1px solid var(--line);
}
.step:last-child{border-bottom:1px solid var(--line)}
.step__n{
  counter-increment:s;width:50px;height:50px;border-radius:50%;
  display:grid;place-items:center;background:var(--teal);color:var(--mint);
  font-weight:600;font-size:1.02rem;
}
.step__n::before{content:counter(s,decimal-leading-zero)}
.step__time{
  display:inline-block;font-size:.76rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase;
  color:var(--teal);background:var(--mint);padding:5px 12px;border-radius:var(--r-pill);margin-bottom:11px;
}
.step h3{margin-bottom:9px}
.step p{color:var(--ink-70);font-size:.97rem;margin:0}
@media (max-width:560px){.step{grid-template-columns:1fr}.step__n{width:42px;height:42px;font-size:.92rem}}

/* ---------- Pour vous / pas pour vous ---------- */
.qualify{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.4vw,26px)}
@media (max-width:820px){.qualify{grid-template-columns:1fr}}
.qbox{border-radius:var(--r-lg);padding:clamp(24px,2.8vw,34px)}
.qbox--yes{background:var(--white);border:1px solid var(--line)}
.qbox--no{background:rgba(3,25,23,.04);border:1px solid transparent}
.qbox h3{display:flex;align-items:center;gap:11px;margin-bottom:20px;font-size:1.08rem}
.qbox h3 svg{width:24px;height:24px;flex:0 0 auto}
.qbox--yes h3 svg{color:var(--teal)}
.qbox--no h3 svg{color:var(--ink-55)}
.qbox ul{list-style:none;margin:0;padding:0;display:grid;gap:13px}
.qbox li{display:flex;gap:11px;font-size:.95rem;line-height:1.55;color:var(--ink-70)}
.qbox li::before{content:"";width:6px;height:6px;border-radius:50%;flex:0 0 auto;margin-top:.62em;background:var(--teal)}
.qbox--no li::before{background:rgba(3,25,23,.28)}

/* ---------- Calculateur ---------- */
.calc{
  background:var(--white);border-radius:var(--r-xl);box-shadow:var(--shadow-md);
  display:grid;grid-template-columns:1fr 1fr;overflow:hidden;
}
@media (max-width:860px){.calc{grid-template-columns:1fr}}
.calc__in{padding:clamp(26px,3.2vw,40px)}
.calc__out{
  padding:clamp(26px,3.2vw,40px);background:var(--teal);color:var(--on-teal);
  display:flex;flex-direction:column;justify-content:center;gap:26px;
}
.field{margin-bottom:28px}
.field:last-child{margin-bottom:0}
.field__top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:12px}
.field label{font-weight:600;font-size:.95rem}
.field__val{font-weight:600;font-size:1.04rem;color:var(--teal);font-variant-numeric:tabular-nums}
input[type=range]{
  -webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:99px;
  background:var(--mint);outline:none;margin:0;cursor:pointer;
}
input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;width:26px;height:26px;border-radius:50%;
  background:var(--teal);border:4px solid var(--white);box-shadow:var(--shadow-sm);cursor:pointer;
}
input[type=range]::-moz-range-thumb{
  width:26px;height:26px;border-radius:50%;background:var(--teal);
  border:4px solid var(--white);box-shadow:var(--shadow-sm);cursor:pointer;
}
input[type=range]:focus-visible{outline:3px solid var(--teal);outline-offset:4px}
.result__label{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--on-teal-70);margin-bottom:6px}
.result__num{
  font-size:clamp(2.1rem,1.5rem + 2.4vw,3.2rem);font-weight:600;line-height:1.05;
  letter-spacing:-.03em;color:var(--white);font-variant-numeric:tabular-nums;
}
.result__sub{font-size:.88rem;color:var(--on-teal-70);margin-top:7px}
.calc__note{font-size:.78rem;color:var(--ink-55);margin-top:20px;line-height:1.55}

/* ---------- Tarif ---------- */
.price{
  background:var(--white);border-radius:var(--r-xl);box-shadow:var(--shadow-md);
  padding:clamp(28px,3.4vw,44px);display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(26px,3.4vw,48px);align-items:center;
}
@media (max-width:820px){.price{grid-template-columns:1fr}}
.price__amount{display:flex;align-items:baseline;gap:10px;margin:14px 0 6px}
.price__num{font-size:clamp(2.6rem,2rem + 2.6vw,3.6rem);font-weight:600;letter-spacing:-.035em;line-height:1;color:var(--teal)}
.price__unit{font-size:1rem;color:var(--ink-55)}
.price ul{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.price li{display:flex;gap:12px;align-items:flex-start;font-size:.95rem;line-height:1.5}
.price li svg{width:19px;height:19px;flex:0 0 auto;color:var(--teal);margin-top:2px}
.price__badge{
  display:inline-block;font-size:.74rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;
  background:var(--mint);color:var(--teal);padding:6px 13px;border-radius:var(--r-pill);
}

/* ---------- Transparence ---------- */
.honest{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.4vw,26px)}
@media (max-width:820px){.honest{grid-template-columns:1fr}}
.honest__box{border-radius:var(--r-lg);padding:clamp(24px,2.8vw,34px);border:1px solid var(--line-dark)}
.honest__box h3{font-size:1.04rem;margin-bottom:16px;display:flex;align-items:center;gap:10px}
.honest__box h3 svg{width:21px;height:21px;flex:0 0 auto;color:var(--mint)}
.honest__box ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.honest__box li{font-size:.93rem;line-height:1.55;color:var(--on-teal-70);padding-left:20px;position:relative}
.honest__box li::before{content:"";position:absolute;left:0;top:.6em;width:7px;height:7px;border-radius:50%;background:var(--mint);opacity:.7}

/* ---------- FAQ ---------- */
.faq{max-width:840px;margin-inline:auto}
.faq details{border-bottom:1px solid var(--line)}
.faq details:first-of-type{border-top:1px solid var(--line)}
.faq summary{
  list-style:none;cursor:pointer;padding:24px 46px 24px 0;position:relative;
  font-weight:600;font-size:1.03rem;line-height:1.45;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";position:absolute;right:6px;top:50%;width:13px;height:13px;
  border-right:2px solid var(--teal);border-bottom:2px solid var(--teal);
  transform:translateY(-70%) rotate(45deg);transition:transform .22s ease;
}
.faq details[open] summary::after{transform:translateY(-30%) rotate(225deg)}
.faq summary:focus-visible{outline:3px solid var(--teal);outline-offset:2px;border-radius:6px}
.faq__a{padding:0 40px 26px 0;color:var(--ink-70);font-size:.97rem}

/* ---------- Contre-indications ---------- */
.warn{
  border:1px solid var(--line);border-radius:var(--r-lg);
  background:var(--white);padding:clamp(24px,2.8vw,34px);
}
.warn ul{list-style:none;margin:0;padding:0;display:grid;gap:12px;grid-template-columns:1fr 1fr}
@media (max-width:720px){.warn ul{grid-template-columns:1fr}}
.warn li{display:flex;gap:11px;font-size:.93rem;line-height:1.55;color:var(--ink-70)}
.warn li svg{width:17px;height:17px;flex:0 0 auto;color:var(--teal);margin-top:4px}

/* ---------- CTA final ---------- */
.cta-final{text-align:center}
.cta-final .lead{margin-inline:auto;margin-top:20px}
.cta-final .btn-row{justify-content:center;margin-top:34px}
.cta-final__meta{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:30px}

/* ---------- Footer ---------- */
.footer{background:var(--teal-900);color:rgba(234,243,240,.62);padding-block:clamp(44px,5vw,64px) 30px;font-size:.88rem}
.footer a{color:rgba(234,243,240,.82);text-decoration:none}
.footer a:hover{color:var(--mint);text-decoration:underline}
.footer__top{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:clamp(24px,3vw,44px);padding-bottom:34px}
@media (max-width:760px){.footer__top{grid-template-columns:1fr}}
.footer__logo{height:30px;width:auto;color:var(--mint);margin-bottom:18px}
.footer h4{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mint);margin-bottom:16px;font-weight:600}
.footer ul{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.footer__legal{border-top:1px solid rgba(201,224,218,.14);padding-top:26px;font-size:.79rem;line-height:1.7}
.footer__legal p{margin-bottom:.7em}

/* ---------- Sticky CTA mobile ---------- */
.sticky-cta{
  position:fixed;left:0;right:0;bottom:0;z-index:70;
  background:rgba(255,255,255,.94);backdrop-filter:blur(14px);
  border-top:1px solid var(--line);padding:11px var(--pad) calc(11px + env(safe-area-inset-bottom));
  display:none;gap:12px;align-items:center;justify-content:space-between;
  transform:translateY(110%);transition:transform .3s ease;
}
.sticky-cta.is-on{transform:translateY(0)}
.sticky-cta__txt{font-size:.82rem;line-height:1.35;font-weight:500}
.sticky-cta__txt span{display:block;color:var(--ink-55);font-weight:400;font-size:.76rem}
@media (max-width:760px){.sticky-cta{display:flex}body{padding-bottom:0}}

/* ---------- Calendly ---------- */
.cal-embed{
  min-height:720px;border-radius:var(--r-xl);overflow:hidden;background:var(--white);
  box-shadow:var(--shadow-md);
}
.cal-fallback{
  padding:clamp(30px,4vw,54px);text-align:center;
}
.cal-fallback code{
  display:inline-block;background:var(--sand);padding:4px 9px;border-radius:6px;
  font-size:.85rem;color:var(--teal);
}

/* ---------- Reveal ---------- */
/* L'animation n'est appliquée que si JS est actif : sans JS (crawler Meta,
   navigateur restrictif), le contenu reste visible. */
.js .reveal{opacity:0;transform:translateY(22px);transition:opacity .6s cubic-bezier(.22,.7,.3,1),transform .6s cubic-bezier(.22,.7,.3,1)}
.js .reveal.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js .reveal{opacity:1;transform:none;transition:none}}

/* ---------- Divers ---------- */
.hr-dots{height:1px;background:var(--line);margin-block:clamp(34px,4vw,54px)}
.center{text-align:center}
.mt-l{margin-top:clamp(28px,3.4vw,44px)}
.skip{position:absolute;left:-9999px}
.skip:focus{left:var(--pad);top:10px;z-index:200;background:var(--white);color:var(--teal);padding:12px 20px;border-radius:var(--r-sm);box-shadow:var(--shadow-md)}

/* ---------- Comparatif ---------- */
.cmp-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;padding:6px 6px 10px;margin:0 -6px}
.cmp{
  width:100%;min-width:800px;border-collapse:separate;border-spacing:0 6px;
  font-size:.95rem;
}
.cmp th:first-child,.cmp td:first-child{min-width:230px}
.cmp th,.cmp td{padding:18px 20px;text-align:left;vertical-align:middle}
.cmp thead th{
  font-size:.71rem;letter-spacing:.13em;text-transform:uppercase;font-weight:600;
  color:var(--ink-55);padding-block:10px;white-space:nowrap;
}
.cmp thead th:not(:first-child){text-align:center}
.cmp tbody td:not(:first-child){text-align:center}
.cmp tbody td{background:var(--white);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cmp tbody td:first-child{
  border-left:1px solid var(--line);border-radius:var(--r-md) 0 0 var(--r-md);
  font-weight:500;color:var(--ink-70);
}
.cmp tbody td:last-child{border-right:1px solid var(--line);border-radius:0 var(--r-md) var(--r-md) 0}
.cmp tbody tr:not(.is-us):hover td{background:var(--sand)}

/* pastilles oui / non */
.cmp-ico{
  width:28px;height:28px;border-radius:50%;display:inline-grid;place-items:center;
}
.cmp-ico svg{width:15px;height:15px}
.cmp-ico--yes{background:var(--mint);color:var(--teal)}
.cmp-ico--no{background:rgba(3,25,23,.06);color:rgba(3,25,23,.3)}
.cmp .txt{font-size:.9rem;color:var(--ink-70)}

/* la ligne Sevria : elle sort du tableau */
.cmp tr.is-us td{
  background:var(--teal);color:var(--on-teal);
  border-color:var(--teal);padding-block:24px;
  position:relative;z-index:1;
}
.cmp tr.is-us td:first-child{color:var(--white);font-weight:600;font-size:1.02rem}
.cmp tr.is-us .cmp-ico--yes{background:rgba(201,224,218,.2);color:var(--mint)}
.cmp tr.is-us .txt{color:var(--on-teal);font-weight:500}
.cmp tr.is-us td:first-child::after{
  content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--mint);
  border-radius:var(--r-md) 0 0 var(--r-md);
}
.cmp__badge{
  display:inline-flex;align-items:center;gap:6px;margin-top:7px;
  font-size:.66rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;
  background:var(--mint);color:var(--teal);padding:4px 10px;border-radius:var(--r-pill);
}
.cmp__badge svg{width:11px;height:11px}
.cmp__name{display:flex;flex-direction:column;align-items:flex-start;gap:0}

.cmp-hint{
  display:none;font-size:.78rem;color:var(--ink-55);margin-top:10px;text-align:center;
}
@media (max-width:860px){.cmp-hint{display:block}}

/* ---------- Praticienne / centre ---------- */
.people{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(26px,4vw,56px);align-items:center}
@media (max-width:860px){.people{grid-template-columns:1fr}}
.portrait{
  aspect-ratio:4/5;border-radius:var(--r-xl);background:var(--mint);
  display:grid;place-items:center;text-align:center;padding:26px;
  color:var(--teal);box-shadow:var(--shadow-md);overflow:hidden;
}
.portrait img{width:100%;height:100%;object-fit:cover;border-radius:inherit}
.portrait__ph{font-size:.82rem;line-height:1.6;opacity:.85;max-width:22ch}
.portrait__ph svg{width:36px;height:36px;margin:0 auto 12px;opacity:.6}

.venue{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,22px)}
@media (max-width:760px){.venue{grid-template-columns:1fr}}
.venue__item{display:flex;gap:14px;align-items:flex-start;background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:20px 22px}
.venue__item svg{width:20px;height:20px;flex:0 0 auto;color:var(--teal);margin-top:3px}
.venue__item strong{display:block;font-size:.95rem;margin-bottom:3px}
.venue__item span{font-size:.88rem;color:var(--ink-70);line-height:1.5}

/* ---------- Timeline santé ---------- */
.tl{display:grid;gap:0}
.tl__row{
  display:grid;grid-template-columns:130px 1fr;gap:clamp(18px,2.6vw,34px);
  padding-block:22px;border-top:1px solid var(--line-dark);align-items:baseline;
}
.tl__row:last-child{border-bottom:1px solid var(--line-dark)}
.tl__when{font-weight:600;font-size:1.05rem;color:var(--mint);letter-spacing:-.02em}
.tl__what{color:var(--on-teal-70);font-size:.97rem}
.tl__what strong{color:var(--white);font-weight:500}
@media (max-width:620px){.tl__row{grid-template-columns:1fr;gap:6px}}

/* ---------- Cure ménopause ---------- */
.cure{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.2vw,24px)}
@media (max-width:900px){.cure{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.cure{grid-template-columns:1fr}}
.cure__card{background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);padding:26px 24px}
.cure__n{
  display:inline-block;font-size:.72rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--teal);background:var(--mint);padding:5px 12px;border-radius:var(--r-pill);margin-bottom:15px;
}
.cure__card h3{font-size:1.02rem;margin-bottom:8px}
.cure__card p{font-size:.92rem;color:var(--ink-70);margin:0}

/* ---------- Position (citation) ---------- */
.stance{
  border-left:3px solid var(--teal);padding-left:clamp(20px,3vw,34px);
  max-width:74ch;
}
.stance p{font-size:clamp(1.1rem,1rem + .7vw,1.5rem);line-height:1.5;letter-spacing:-.018em;color:var(--ink)}
.stance p + p{font-size:1rem;color:var(--ink-70);margin-top:18px;letter-spacing:0}

/* ---------- Bandeau réassurance paiement ---------- */
.pay-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}

/* =========================================================
   MOBILE-FIRST : bandeau de réassurance au-dessus de la ligne
   de flottaison + avis + étude de cas
   ========================================================= */

/* ---------- Bandeau réassurance hero ---------- */
.trust{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:var(--line-dark);border:1px solid var(--line-dark);
  border-radius:var(--r-md);overflow:hidden;margin-top:26px;
}
.trust__i{
  background:rgba(201,224,218,.07);padding:15px 14px;
  display:flex;flex-direction:column;align-items:center;gap:7px;text-align:center;
}
.trust__i svg{width:19px;height:19px;color:var(--mint);flex:0 0 auto}
.trust__i span{font-size:.76rem;line-height:1.35;font-weight:500;color:var(--on-teal)}
@media (max-width:760px){
  .trust{grid-template-columns:repeat(2,1fr)}
  .trust__i{padding:13px 10px}
  .trust__i span{font-size:.72rem}
}

/* ---------- Avis / note ---------- */
.rating{
  display:inline-flex;align-items:center;gap:12px;flex-wrap:wrap;
  background:rgba(201,224,218,.12);border:1px solid var(--line-dark);
  padding:10px 18px;border-radius:var(--r-pill);margin-bottom:22px;
}
.rating__stars{display:inline-flex;gap:2px;color:#F3C64B}
.rating__stars svg{width:15px;height:15px}
.rating__txt{font-size:.83rem;font-weight:500;color:var(--on-teal)}
.rating__txt b{font-weight:600}
.rating--light{background:var(--white);border-color:var(--line)}
.rating--light .rating__txt{color:var(--ink)}

/* ---------- Étude de cas ---------- */
.case{
  display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(26px,4vw,52px);
  align-items:start;
}
@media (max-width:880px){.case{grid-template-columns:1fr}}
.case__media{
  aspect-ratio:1/1;border-radius:var(--r-xl);background:var(--mint);
  display:grid;place-items:center;text-align:center;padding:26px;color:var(--teal);
  box-shadow:var(--shadow-md);overflow:hidden;position:sticky;top:96px;
}
@media (max-width:880px){.case__media{position:static;aspect-ratio:16/10}}
.case__media img{width:100%;height:100%;object-fit:cover;border-radius:inherit}
.case__id{margin-bottom:26px}
.case__id h3{font-size:clamp(1.25rem,1.1rem + .7vw,1.65rem);margin-bottom:6px}
.case__id p{color:var(--ink-55);font-size:.9rem;margin:0}
.case__q{
  font-size:clamp(1.05rem,.98rem + .5vw,1.28rem);line-height:1.55;letter-spacing:-.015em;
  border-left:3px solid var(--teal);padding-left:22px;margin-bottom:30px;
}
.case__steps{display:grid;gap:22px;margin-bottom:30px}
.case__step h4{font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);margin:0 0 7px;font-weight:600}
.case__step p{font-size:.96rem;color:var(--ink-70);margin:0}
.case__kpi{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media (max-width:560px){.case__kpi{grid-template-columns:1fr}}
.case__kpi div{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:18px 20px}
.case__kpi b{display:block;font-size:1.5rem;font-weight:600;color:var(--teal);letter-spacing:-.03em;line-height:1.1}
.case__kpi span{font-size:.82rem;color:var(--ink-55);line-height:1.4;display:block;margin-top:5px}
.case__consent{
  margin-top:26px;font-size:.8rem;color:var(--ink-55);
  border-top:1px solid var(--line);padding-top:18px;
}

/* ---------- Bandeau "À REMPLIR" (visible en dev) ---------- */
.todo{
  border:2px dashed var(--teal);border-radius:var(--r-md);
  background:rgba(201,224,218,.35);padding:18px 22px;margin-bottom:26px;
  font-size:.86rem;line-height:1.6;color:var(--teal);
}
.todo b{display:block;font-size:.74rem;letter-spacing:.15em;text-transform:uppercase;margin-bottom:6px}
.todo code{background:rgba(255,255,255,.7);padding:2px 7px;border-radius:5px;font-size:.84em}

/* ---------- Ajustements mobile ---------- */
@media (max-width:760px){
  body{font-size:16px}
  .hero__in{padding-block:34px 42px}
  .hero h1{max-width:none}
  .hero .lead{margin-top:16px}
  .hero .btn-row{margin-top:24px}
  .hero .btn-row .btn{width:100%}
  .hero__note{margin-top:18px}
  .tag-row{margin-top:22px;gap:8px}
  .book-card{margin-top:4px}
  .btn{padding:17px 26px}
  .sec-head{margin-bottom:28px}
  .cta-final .btn-row .btn{width:100%}
  .cal-embed{min-height:1020px}
}
@media (max-width:760px){
  /* le sticky-cta masque le bas de page */
  .footer{padding-bottom:86px}
}

/* ---------- Avis : ajustement mobile ---------- */
@media (max-width:760px){
  .rating{margin-bottom:18px;padding:9px 16px}
  .rating__txt{font-size:.78rem}
}

/* =========================================================
   BANDEAU D'OFFRE (compte à rebours) + POP-UP DE SORTIE
   ========================================================= */

/* ---------- Bandeau d'offre ---------- */
.urgency{
  background:var(--mint);color:var(--teal);
  font-size:.84rem;line-height:1.35;padding:11px var(--pad);
  border-bottom:1px solid rgba(0,68,68,.12);
}
.urgency[hidden]{display:none}
.urgency__in{
  display:flex;gap:8px 16px;align-items:center;justify-content:center;
  flex-wrap:wrap;text-align:center;max-width:var(--maxw);margin-inline:auto;
}
.urgency__label{font-weight:600}
.urgency__price del{opacity:.5;margin-right:6px;font-weight:400}
.urgency__price b{font-weight:600}
.urgency__cd{
  display:inline-flex;gap:7px;align-items:center;
  background:var(--teal);color:var(--mint);
  padding:5px 13px;border-radius:var(--r-pill);
  font-weight:600;font-variant-numeric:tabular-nums;font-size:.8rem;
}
.urgency__cd svg{width:14px;height:14px}
@media (max-width:760px){
  .urgency{font-size:.75rem;padding:9px var(--pad)}
  .urgency__in{gap:6px 10px}
  .urgency__cd{font-size:.72rem;padding:4px 10px}
}

/* ---------- Pop-up de sortie ---------- */
.modal{
  position:fixed;inset:0;z-index:120;padding:20px;
  display:none;place-items:center;
}
.modal.is-on{display:grid}
.modal__bg{position:absolute;inset:0;background:rgba(3,25,23,.66);backdrop-filter:blur(4px)}
.modal__box{
  position:relative;width:100%;max-width:520px;max-height:90vh;overflow-y:auto;
  background:var(--white);border-radius:var(--r-xl);
  padding:clamp(28px,4vw,44px);box-shadow:var(--shadow-lg);
  animation:modalIn .3s cubic-bezier(.22,.7,.3,1);
}
@keyframes modalIn{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.modal__box{animation:none}}
.modal__close{
  position:absolute;top:12px;right:12px;width:38px;height:38px;
  display:grid;place-items:center;border:none;background:transparent;
  color:var(--ink-55);cursor:pointer;border-radius:50%;
}
.modal__close:hover{background:var(--sand);color:var(--ink)}
.modal__close svg{width:20px;height:20px}
.modal__close:focus-visible{outline:3px solid var(--teal);outline-offset:2px}
.modal__ico{
  width:52px;height:52px;border-radius:16px;display:grid;place-items:center;
  background:var(--mint);color:var(--teal);margin-bottom:20px;
}
.modal__ico svg{width:25px;height:25px}
.modal h2{font-size:clamp(1.3rem,1.15rem + .7vw,1.7rem);margin-bottom:12px}
.modal p{color:var(--ink-70);font-size:.97rem}
.modal ul{list-style:none;margin:22px 0;padding:0;display:grid;gap:12px}
.modal li{display:flex;gap:11px;align-items:flex-start;font-size:.94rem;line-height:1.5}
.modal li svg{width:18px;height:18px;flex:0 0 auto;color:var(--teal);margin-top:3px}
.modal__no{
  display:block;width:100%;margin-top:14px;padding:10px;
  background:none;border:none;font:inherit;font-size:.87rem;
  color:var(--ink-55);cursor:pointer;text-decoration:underline;
}
.modal__no:hover{color:var(--ink)}

/* ---------- Le centre : carte GMB + informations ---------- */
.venue-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(20px,3vw,36px);align-items:stretch}
@media (max-width:900px){.venue-grid{grid-template-columns:1fr}}
.venue-grid .venue{grid-template-columns:1fr;align-content:start}
.map{
  position:relative;border-radius:var(--r-xl);overflow:hidden;
  background:var(--mint);box-shadow:var(--shadow-md);min-height:340px;
}
.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.map iframe[hidden]{display:none}
.map picture,.map picture img{position:absolute;inset:0;width:100%;height:100%;display:block}
.map picture img{object-fit:cover;object-position:50% 55%}
.map__ph{
  position:absolute;inset:0;display:grid;place-content:center;justify-items:center;
  gap:10px;text-align:center;padding:30px;color:var(--teal);
}
.map__ph svg{width:34px;height:34px;opacity:.6}
.map__ph strong{font-size:1rem}
.map__ph span{font-size:.84rem;line-height:1.55;opacity:.8;max-width:34ch}
@media (max-width:900px){.map{min-height:260px}}

/* ---------- Deux sections de même fond qui se suivent ----------
   Elles se lisent comme une seule bande, séparées par un filet
   plutôt que par un double espacement (praticienne + centre). */
.section--sand + .section--sand,
.section--mint + .section--mint,
.section:not([class*="--"]) + .section:not([class*="--"]){padding-top:0}
.section--sand + .section--sand > .wrap,
.section--mint + .section--mint > .wrap,
.section:not([class*="--"]) + .section:not([class*="--"]) > .wrap{
  border-top:1px solid rgba(3,25,23,.09);
  padding-top:var(--sec-y);
}

/* =========================================================
   BLOC CHIFFRES (réassurance) : 3 tuiles reliées, la dernière
   accentuée. Reprend la mécanique visuelle du concurrent.
   ========================================================= */
.stats{text-align:center}
.stats__eyebrow{
  display:inline-flex;align-items:center;gap:.65em;
  font-size:.735rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:var(--teal);margin-bottom:18px;
}
.stats__dot{
  width:9px;height:9px;border-radius:50%;background:var(--teal);
  box-shadow:0 0 0 0 rgba(0,68,68,.45);animation:pulse 2s infinite;
}
@keyframes pulse{
  0%{box-shadow:0 0 0 0 rgba(0,68,68,.45)}
  70%{box-shadow:0 0 0 9px rgba(0,68,68,0)}
  100%{box-shadow:0 0 0 0 rgba(0,68,68,0)}
}
@media (prefers-reduced-motion:reduce){.stats__dot{animation:none}}
.stats h2 em{font-style:normal;color:var(--teal)}

.stats__row{
  display:flex;align-items:stretch;justify-content:center;gap:clamp(10px,1.6vw,20px);
  margin-top:clamp(28px,3.5vw,44px);flex-wrap:nowrap;
}
.stats__link{
  display:flex;align-items:center;color:var(--teal);opacity:.55;
  font-size:1.5rem;font-weight:600;flex:0 0 auto;
}
.stats__link svg{width:24px;height:24px}

.stat{
  flex:1 1 0;min-width:0;
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:clamp(20px,2.4vw,30px) clamp(14px,2vw,26px);
  display:flex;flex-direction:column;justify-content:center;gap:6px;
  box-shadow:var(--shadow-sm);
}
.stat__label{
  font-size:.7rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-55);
}
.stat__num{
  font-size:clamp(2rem,1.3rem + 2.6vw,3.3rem);font-weight:600;line-height:1.05;
  letter-spacing:-.035em;color:var(--teal);font-variant-numeric:tabular-nums;
}
.stat__num small{font-size:.5em;font-weight:600;letter-spacing:-.01em}
.stat__sub{font-size:.87rem;font-weight:500;line-height:1.35;color:var(--ink)}
.stat--hl{background:var(--teal);border-color:var(--teal);box-shadow:var(--shadow-md)}
.stat--hl .stat__label{color:rgba(234,243,240,.7)}
.stat--hl .stat__num{color:var(--white)}
.stat--hl .stat__sub{color:var(--on-teal)}

.stats__note{
  margin:clamp(24px,3vw,36px) auto 0;max-width:70ch;
  font-size:.92rem;line-height:1.65;color:var(--ink-70);
}
.stats__note strong{color:var(--ink);font-weight:600}

@media (max-width:760px){
  .stats__row{flex-direction:column;gap:8px}
  .stats__link{justify-content:center;transform:rotate(90deg);opacity:.4}
  .stat{flex:0 0 auto;padding:18px 20px}
  .stat__num{font-size:2.3rem}
}

/* =========================================================
   BANDEAU DE GARANTIES : phrase + logos + CTA
   ========================================================= */
.guarantee{text-align:center}
.guarantee__claim{
  font-size:clamp(1.05rem,.98rem + .6vw,1.42rem);line-height:1.5;letter-spacing:-.018em;
  max-width:62ch;margin:0 auto;color:var(--ink);
}
.guarantee__claim b{color:var(--teal);font-weight:600}
.guarantee__logos{
  display:flex;flex-wrap:wrap;align-items:stretch;justify-content:center;
  gap:clamp(12px,2vw,22px);margin:clamp(28px,3.4vw,42px) auto 0;max-width:900px;
}
.logo-slot{
  flex:1 1 220px;max-width:280px;
  border:1.5px dashed rgba(0,68,68,.3);border-radius:var(--r-md);
  background:var(--white);padding:22px 20px;
  display:flex;flex-direction:column;align-items:center;gap:9px;text-align:center;
}
.logo-slot svg{width:26px;height:26px;color:var(--teal);opacity:.75}
.logo-slot strong{font-size:.92rem;line-height:1.3}
.logo-slot span{font-size:.8rem;line-height:1.5;color:var(--ink-55)}
.logo-slot img{max-height:46px;width:auto;object-fit:contain}
.guarantee .btn-row{justify-content:center;margin-top:clamp(26px,3vw,38px)}
.guarantee__note{
  margin:clamp(24px,3vw,34px) auto 0;max-width:68ch;
  font-size:.86rem;line-height:1.65;color:var(--ink-55);
}
@media (max-width:620px){.logo-slot{flex:1 1 100%;max-width:none;padding:18px}}

/* Valeur textuelle (« À venir ») : plus petite qu'un chiffre, pour ne pas
   déborder de la tuile sur les petits écrans. */
.stat__num--text{font-size:clamp(1.45rem,1.15rem + 1.2vw,2.05rem)}

/* ---------- Visuel en tête de la carte de réservation ---------- */
.book-card{padding:0;overflow:hidden}
.book-card__media{
  position:relative;aspect-ratio:16/10;background:var(--mint);
  display:grid;place-content:center;justify-items:center;gap:9px;
  text-align:center;padding:26px;color:var(--teal);
}
.book-card__media img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
}
.book-card__media svg{width:30px;height:30px;opacity:.6}
.book-card__media strong{font-size:.92rem}
.book-card__media span{font-size:.79rem;line-height:1.5;opacity:.8;max-width:30ch}
.book-card__body{padding:clamp(24px,3vw,34px)}
@media (max-width:980px){.book-card__media{aspect-ratio:2/1}}
@media (max-width:560px){.book-card__media{aspect-ratio:3/2}}

/* =========================================================
   LES TROIS OFFRES : celle de la page en cours est mise en
   avant et porte un CTA ; les deux autres sont des liens.
   ========================================================= */
.offers{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,22px);align-items:stretch}
@media (max-width:860px){.offers{grid-template-columns:1fr}}
.offer{
  display:flex;flex-direction:column;gap:10px;
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:clamp(22px,2.4vw,30px);text-decoration:none;color:inherit;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
a.offer:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:transparent}
.offer__ico{
  width:44px;height:44px;border-radius:13px;display:grid;place-items:center;
  background:var(--mint);color:var(--teal);margin-bottom:6px;
}
.offer__ico svg{width:21px;height:21px}
.offer h3{font-size:1.06rem}
.offer p{font-size:.9rem;color:var(--ink-70);margin:0;flex:1 1 auto}
.offer__meta{
  font-size:.77rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase;
  color:var(--teal);
}
.offer__go{
  display:flex;align-items:center;gap:8px;margin-top:6px;
  font-size:.92rem;font-weight:600;color:var(--teal);
}
.offer__go svg{width:16px;height:16px}

.offer--current{
  background:var(--teal);border-color:var(--teal);color:var(--on-teal);
  box-shadow:var(--shadow-md);
}
.offer--current h3{color:var(--white)}
.offer--current p{color:var(--on-teal-70)}
.offer--current .offer__ico{background:rgba(201,224,218,.16);color:var(--mint)}
.offer--current .offer__meta{color:var(--mint)}
.offer--current .btn{margin-top:8px}
.offer__here{
  display:inline-flex;align-items:center;gap:7px;
  font-size:.76rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:var(--mint);
}
.offer__here::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--mint)}

/* ---------- Prix dans le hero ---------- */
.hero__price{
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  margin-top:26px;padding:16px 22px;
  background:rgba(201,224,218,.11);border:1px solid var(--line-dark);
  border-radius:var(--r-md);
}
.hero__price-num{
  font-size:clamp(1.7rem,1.4rem + 1.2vw,2.2rem);font-weight:600;line-height:1;
  letter-spacing:-.03em;color:var(--mint);font-variant-numeric:tabular-nums;white-space:nowrap;
}
.hero__price-txt{font-size:.86rem;line-height:1.5;color:var(--on-teal-70);flex:1 1 200px;min-width:0}
.hero__price-txt b{color:var(--on-teal);font-weight:500}
@media (max-width:760px){
  .hero__price{margin-top:22px;padding:14px 18px;gap:13px}
  .hero__price-txt{font-size:.8rem}
}

/* ---------- Prix dans la carte de réservation ---------- */
.book-card__price{
  display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;
  margin:14px 0 4px;padding-bottom:18px;border-bottom:1px solid var(--line);
}
.book-card__price b{
  font-size:1.75rem;font-weight:600;letter-spacing:-.03em;color:var(--teal);
  font-variant-numeric:tabular-nums;line-height:1;
}
.book-card__price span{font-size:.86rem;color:var(--ink-55)}

/* ---------- Preuve sociale au-dessus de la ligne de flottaison ---------- */
.social{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px}
.social[hidden]{display:none}
.social__item{
  display:inline-flex;align-items:center;gap:9px;
  padding:9px 16px;border-radius:var(--r-pill);
  background:rgba(201,224,218,.12);border:1px solid var(--line-dark);
  font-size:.83rem;line-height:1.3;color:var(--on-teal);text-decoration:none;
  transition:background .18s ease,border-color .18s ease;
}
a.social__item:hover{background:rgba(201,224,218,.2);border-color:var(--mint)}
.social__item b{font-weight:600}
.social__stars{display:inline-flex;gap:2px;color:#F3C64B;flex:0 0 auto}
.social__stars svg{width:14px;height:14px}
.social__live{
  width:8px;height:8px;border-radius:50%;background:var(--mint);flex:0 0 auto;
  box-shadow:0 0 0 0 rgba(201,224,218,.5);animation:pulse-mint 2.2s infinite;
}
@keyframes pulse-mint{
  0%{box-shadow:0 0 0 0 rgba(201,224,218,.5)}
  70%{box-shadow:0 0 0 8px rgba(201,224,218,0)}
  100%{box-shadow:0 0 0 0 rgba(201,224,218,0)}
}
@media (prefers-reduced-motion:reduce){.social__live{animation:none}}
@media (max-width:760px){
  .social{gap:7px;margin-bottom:18px}
  .social__item{padding:7px 13px;font-size:.76rem}
}


/* =========================================================
   FORMULES : cartes tarifaires de l'offre en cours
   ========================================================= */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,22px);align-items:stretch}
.plans--2{grid-template-columns:repeat(2,1fr);max-width:760px;margin-inline:auto}
@media (max-width:940px){.plans{grid-template-columns:1fr}.plans--2{grid-template-columns:1fr}}

.plan{
  position:relative;display:flex;flex-direction:column;gap:4px;
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-xl);
  padding:clamp(24px,2.6vw,32px);overflow:hidden;
  transition:transform .22s ease, box-shadow .22s ease;
}
.plan:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.plan--featured{border:2px solid var(--teal);box-shadow:var(--shadow-md)}

.plan__ribbon{
  position:absolute;top:16px;right:-38px;width:150px;transform:rotate(45deg);
  background:var(--teal);color:var(--mint);text-align:center;padding:6px 0;
  font-size:.66rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;
}
.plan__kicker{
  font-size:.72rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;
  color:var(--teal);
}
.plan__name{font-size:clamp(1.3rem,1.15rem + .7vw,1.65rem);font-weight:600;letter-spacing:-.025em;line-height:1.15}
.plan__for{font-size:.83rem;color:var(--ink-55);margin-top:2px}
.plan__price{
  font-size:clamp(2.1rem,1.6rem + 2vw,2.9rem);font-weight:600;line-height:1.05;
  letter-spacing:-.035em;color:var(--teal);font-variant-numeric:tabular-nums;
  margin:14px 0 4px;
}
.plan__price small{font-size:.34em;font-weight:500;color:var(--ink-55);letter-spacing:0;margin-left:6px}
.plan__list{list-style:none;margin:18px 0 22px;padding:0;display:grid;gap:12px;flex:1 1 auto}
.plan__list li{display:flex;gap:11px;align-items:flex-start;font-size:.93rem;line-height:1.5}
.plan__list li svg{width:18px;height:18px;flex:0 0 auto;color:var(--teal);margin-top:3px}
.plan__list li em{font-style:normal;color:var(--ink-55)}

.plans-foot{
  display:flex;flex-wrap:wrap;gap:10px;justify-content:center;
  margin-top:clamp(26px,3vw,36px);
}

/* =========================================================
   DÉROULEMENT : barre de répartition de l'heure + fil vertical
   ========================================================= */

/* ---------- La barre : l'heure, à l'échelle ---------- */
.hour{margin-bottom:clamp(34px,4.5vw,56px)}
.hour__track{display:flex;align-items:flex-end;gap:6px}
.hour__seg{display:flex;flex-direction:column;gap:10px;min-width:0}
.hour__seg .hour__fill{
  height:12px;border-radius:99px;background:var(--mint);
  transition:transform .5s cubic-bezier(.22,.7,.3,1);transform-origin:left;
}
.hour__seg:nth-child(1) .hour__fill{background:rgba(0,68,68,.32)}
.hour__seg:nth-child(2) .hour__fill{background:var(--teal)}
.hour__seg:nth-child(3) .hour__fill{background:rgba(0,68,68,.55)}
.hour__dur{
  display:block;
  font-size:.76rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:var(--teal);white-space:nowrap;margin-bottom:3px;
}
.hour__lab{display:block;font-size:.88rem;color:var(--ink-70);line-height:1.35}
.hour__after{
  display:inline-flex;align-items:center;gap:10px;margin-top:20px;
  padding:11px 18px;border-radius:var(--r-pill);
  background:var(--mint);color:var(--teal);font-size:.85rem;font-weight:500;
}
.hour__after svg{width:17px;height:17px;flex:0 0 auto}
@media (max-width:700px){
  .hour__track{flex-direction:column;align-items:stretch;gap:16px}
  .hour__seg{flex-direction:row;align-items:center;gap:12px}
  .hour__seg .hour__fill{width:6px;height:38px;flex:0 0 auto;border-radius:99px}
  .hour__seg > div{display:flex;flex-direction:column;gap:2px;min-width:0}
  .hour__dur{font-size:.7rem}
}

/* ---------- Le fil des étapes ---------- */
.flow{position:relative;display:grid;gap:clamp(14px,1.8vw,20px)}
.flow::before{
  content:"";position:absolute;left:25px;top:26px;bottom:26px;width:2px;
  background:linear-gradient(to bottom,var(--mint),var(--teal));
  border-radius:2px;
}
.flow__item{
  position:relative;display:grid;grid-template-columns:52px 1fr;
  gap:clamp(16px,2.2vw,28px);align-items:start;
}
.flow__marker{
  width:52px;height:52px;border-radius:50%;flex:0 0 auto;position:relative;z-index:1;
  background:var(--white);border:2px solid var(--teal);color:var(--teal);
  display:grid;place-items:center;font-weight:600;font-size:.95rem;
  font-variant-numeric:tabular-nums;
}
.flow__item--after .flow__marker{background:var(--teal);border-color:var(--teal);color:var(--mint)}
.flow__item--after .flow__marker svg{width:21px;height:21px}
.flow__card{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:clamp(20px,2.2vw,28px);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.flow__card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:transparent}
.flow__head{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 14px;margin-bottom:9px}
.flow__card h3{font-size:clamp(1.05rem,1rem + .35vw,1.25rem)}
.flow__dur{
  font-size:.72rem;font-weight:600;letter-spacing:.11em;text-transform:uppercase;
  color:var(--teal);background:var(--mint);padding:5px 11px;border-radius:var(--r-pill);
  white-space:nowrap;
}
.flow__card p{color:var(--ink-70);font-size:.95rem;margin:0}
@media (max-width:620px){
  .flow::before{left:19px}
  .flow__item{grid-template-columns:40px 1fr;gap:14px}
  .flow__marker{width:40px;height:40px;font-size:.84rem}
  .flow__item--after .flow__marker svg{width:17px;height:17px}
}

/* =========================================================
   AVIS CLIENTS : note globale + carrousel de témoignages
   ========================================================= */
.tm{text-align:center}
.tm h2 em{font-style:normal;color:var(--teal)}

.tm__score{
  display:inline-flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:center;
  margin:0 auto clamp(28px,3.4vw,40px);padding:11px 22px;
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-pill);
  text-decoration:none;color:inherit;box-shadow:var(--shadow-sm);
}
a.tm__score:hover{border-color:var(--teal)}
.tm__score b{font-size:1.15rem;font-weight:600;letter-spacing:-.02em}
.tm__score span{font-size:.87rem;color:var(--ink-55)}
.tm__brand{font-weight:600;font-size:.87rem;color:var(--ink)}
.tm__stars{display:inline-flex;gap:2px;color:#F3C64B}
.tm__stars svg{width:16px;height:16px}

.tm__wrap{position:relative}
.tm__track{
  display:flex;gap:clamp(14px,1.8vw,20px);
  overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;
  padding:4px 4px 8px;margin:0 -4px;
  scrollbar-width:none;-ms-overflow-style:none;
}
.tm__track::-webkit-scrollbar{display:none}
.tm__card{
  flex:0 0 clamp(262px,30%,340px);scroll-snap-align:start;
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:clamp(20px,2.2vw,26px);text-align:left;
  display:flex;flex-direction:column;gap:14px;
}
.tm__who{display:flex;align-items:center;gap:13px}
.tm__avatar{
  width:46px;height:46px;border-radius:50%;flex:0 0 auto;overflow:hidden;
  background:var(--mint);color:var(--teal);
  display:grid;place-items:center;font-weight:600;font-size:.92rem;letter-spacing:.02em;
}
.tm__avatar img{width:100%;height:100%;object-fit:cover}
.tm__name{font-weight:600;font-size:.98rem;line-height:1.2}
.tm__meta{display:flex;align-items:center;gap:8px;margin-top:4px}
.tm__meta .tm__stars svg{width:13px;height:13px}
.tm__when{font-size:.79rem;color:var(--ink-55)}
.tm__text{font-size:.94rem;line-height:1.6;color:var(--ink-70);margin:0}

.tm__nav{
  position:absolute;top:50%;transform:translateY(-50%);z-index:2;
  width:44px;height:44px;border-radius:50%;
  background:var(--white);border:1px solid var(--line);color:var(--teal);
  display:grid;place-items:center;cursor:pointer;box-shadow:var(--shadow-md);
  transition:background .18s ease,border-color .18s ease,opacity .18s ease;
}
.tm__nav:hover{border-color:var(--teal);background:var(--mint)}
.tm__nav:disabled{opacity:.3;cursor:default}
.tm__nav svg{width:19px;height:19px}
.tm__nav--prev{left:-14px}
.tm__nav--next{right:-14px}
.tm__nav--prev svg{transform:rotate(180deg)}
@media (max-width:760px){
  .tm__nav{display:none}
  .tm__card{flex:0 0 84%}
}

/* ---------- Paiement en plusieurs fois ---------- */
.plan__split{
  display:inline-flex;align-items:center;gap:7px;
  font-size:.82rem;font-weight:500;color:var(--teal);
  background:var(--mint);padding:6px 13px;border-radius:var(--r-pill);
  margin-bottom:2px;align-self:flex-start;
}
.plan__split svg{width:14px;height:14px;flex:0 0 auto}
.hero__price-split{
  display:inline-flex;align-items:center;gap:7px;
  margin-top:10px;padding:5px 12px;border-radius:var(--r-pill);
  background:rgba(201,224,218,.18);border:1px solid var(--line-dark);
  font-size:.78rem;font-weight:500;color:var(--mint);white-space:nowrap;
}
.hero__price-split svg{width:13px;height:13px;flex:0 0 auto}
.book-card__price .split{
  display:block;width:100%;margin-top:6px;
  font-size:.82rem;font-weight:500;color:var(--teal);
}

/* =========================================================
   AVANT / APRÈS : deux panneaux qui se font face
   ========================================================= */
.ba{
  display:grid;grid-template-columns:1fr 64px 1fr;
  max-width:1000px;margin-inline:auto;
}

/* --- en-têtes de colonne --- */
.ba__hd{
  font-size:.72rem;font-weight:600;letter-spacing:.17em;text-transform:uppercase;
  padding:0 0 14px;
}
.ba__hd--b{color:var(--ink-55)}
.ba__hd--a{color:var(--teal);padding-left:clamp(20px,2.4vw,28px)}

/* --- cellules --- */
.ba__c{
  display:flex;gap:13px;align-items:flex-start;
  padding:clamp(16px,1.9vw,21px) clamp(18px,2.2vw,26px);
  font-size:.95rem;line-height:1.5;
}
.ba__c--b{background:var(--sand);color:var(--ink-55)}
.ba__c--a{background:var(--teal);color:var(--on-teal);font-weight:500}
.ba__c--m{padding:0;display:grid;place-items:center;background:transparent}

/* pastilles de début de ligne */
.ba__ic{
  width:22px;height:22px;border-radius:50%;flex:0 0 auto;margin-top:1px;
  display:grid;place-items:center;
}
.ba__ic svg{width:12px;height:12px}
.ba__c--b .ba__ic{background:rgba(3,25,23,.09);color:var(--ink-55)}
.ba__c--a .ba__ic{background:rgba(201,224,218,.18);color:var(--mint)}

/* séparateurs internes aux panneaux */
.ba__c--b + .ba__c--m + .ba__c--a,
.ba__c--b{border-top:1px solid transparent}
.ba .ba__c--b ~ .ba__c--b{border-top:1px solid rgba(3,25,23,.07)}
.ba .ba__c--a ~ .ba__c--a{border-top:1px solid rgba(201,224,218,.14)}

/* coins arrondis : haut du premier bloc, bas du dernier */
.ba__c--b.is-first{border-radius:var(--r-lg) var(--r-lg) 0 0}
.ba__c--b.is-last{border-radius:0 0 var(--r-lg) var(--r-lg)}
.ba__c--a.is-first{border-radius:var(--r-lg) var(--r-lg) 0 0}
.ba__c--a.is-last{border-radius:0 0 var(--r-lg) var(--r-lg)}

/* flèche centrale */
.ba__go{
  width:34px;height:34px;border-radius:50%;
  background:var(--white);border:1px solid var(--line);
  display:grid;place-items:center;color:var(--teal);
  box-shadow:var(--shadow-sm);
}
.ba__go svg{width:16px;height:16px}

.ba__note{
  margin:clamp(26px,3vw,36px) auto 0;max-width:72ch;text-align:center;
  font-size:.86rem;line-height:1.65;color:var(--ink-55);
}

/* --- mobile : chaque paire devient une carte avant / après --- */
@media (max-width:820px){
  .ba{grid-template-columns:1fr;gap:0}
  .ba__hd{display:none}
  .ba__c{padding:16px 18px}
  .ba__c--b{border-radius:var(--r-lg) var(--r-lg) 0 0 !important;border-top:1px solid transparent !important}
  .ba__c--a{border-radius:0 0 var(--r-lg) var(--r-lg) !important;margin-bottom:14px;border-top:1px solid transparent !important}
  .ba__c--m{
    padding:0;background:var(--sand);
    border-left:1px solid rgba(3,25,23,.07);border-right:1px solid rgba(3,25,23,.07);
  }
  .ba__go{
    width:26px;height:26px;transform:rotate(90deg);
    box-shadow:none;border-color:rgba(3,25,23,.12);margin:2px 0;
  }
  .ba__go svg{width:13px;height:13px}
}

/* =========================================================
   QUIZ D'ÉLIGIBILITÉ
   ========================================================= */
.quiz{
  max-width:780px;margin-inline:auto;
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-xl);
  box-shadow:var(--shadow-md);overflow:hidden;
}
.quiz__pad{padding:clamp(24px,3.2vw,40px)}

/* --- progression --- */
.quiz__bar{height:4px;background:var(--sand)}
.quiz__fill{height:100%;width:0;background:var(--teal);transition:width .35s cubic-bezier(.22,.7,.3,1)}
.quiz__step{
  font-size:.73rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;
  color:var(--teal);margin-bottom:14px;
}
.quiz__title{font-size:clamp(1.15rem,1.05rem + .6vw,1.5rem);font-weight:600;letter-spacing:-.02em;line-height:1.25;margin-bottom:6px}
.quiz__hint{font-size:.87rem;color:var(--ink-55);margin-bottom:22px}

/* --- options --- */
.quiz__opts{display:grid;gap:10px}
.opt{
  display:flex;align-items:flex-start;gap:13px;width:100%;text-align:left;
  padding:16px 18px;border-radius:var(--r-md);
  border:1.5px solid var(--line);background:var(--white);
  font:inherit;font-size:.95rem;line-height:1.45;color:var(--ink);cursor:pointer;
  transition:border-color .16s ease,background .16s ease;
}
.opt:hover{border-color:var(--teal);background:rgba(201,224,218,.16)}
.opt:focus-visible{outline:3px solid var(--teal);outline-offset:2px}
.opt__box{
  width:20px;height:20px;border-radius:6px;flex:0 0 auto;margin-top:1px;
  border:1.5px solid var(--line);display:grid;place-items:center;color:transparent;
  transition:background .16s ease,border-color .16s ease,color .16s ease;
}
.opt__box svg{width:13px;height:13px}
.opt.is-on{border-color:var(--teal);background:rgba(201,224,218,.22)}
.opt.is-on .opt__box{background:var(--teal);border-color:var(--teal);color:var(--mint)}
.opt--radio .opt__box{border-radius:50%}

.quiz__nav{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:24px}
.quiz__back{
  background:none;border:none;font:inherit;font-size:.88rem;color:var(--ink-55);
  cursor:pointer;padding:8px 0;text-decoration:underline;
}
.quiz__back:hover{color:var(--ink)}
.quiz__back[hidden]{visibility:hidden;display:block}

/* --- résultat --- */
.quiz__result{text-align:center}
.res__ico{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;margin:0 auto 20px}
.res__ico svg{width:28px;height:28px}
.res--ok .res__ico{background:var(--mint);color:var(--teal)}
.res--maybe .res__ico{background:#FBF0D8;color:#9A7213}
.res--no .res__ico{background:rgba(3,25,23,.07);color:var(--ink-55)}
.quiz__result h3{font-size:clamp(1.25rem,1.1rem + .7vw,1.6rem);margin-bottom:12px}
.quiz__result p{color:var(--ink-70);font-size:.97rem;max-width:56ch;margin-inline:auto}
.res__points{list-style:none;margin:24px auto 0;padding:0;display:grid;gap:11px;max-width:52ch;text-align:left}
.res__points li{
  display:flex;gap:11px;align-items:flex-start;font-size:.9rem;line-height:1.5;
  color:var(--ink-70);background:var(--sand);padding:14px 16px;border-radius:var(--r-md);
}
.res__points li svg{width:17px;height:17px;flex:0 0 auto;color:var(--teal);margin-top:2px}
.quiz__result .btn-row{justify-content:center;margin-top:28px}
.quiz__restart{
  background:none;border:none;font:inherit;font-size:.86rem;color:var(--ink-55);
  cursor:pointer;text-decoration:underline;margin-top:18px;
}
.quiz__restart:hover{color:var(--ink)}

/* =========================================================
   ÉCRANS D'ORDINATEUR PEU HAUTS (portables 1280x800, 1440x900)
   On resserre le hero pour que les deux boutons de réservation
   restent au-dessus de la ligne de flottaison.
   ========================================================= */
@media (min-width:981px) and (max-height:960px){
  .hero__in{padding-block:34px 40px}
  .hero h1{font-size:clamp(2.1rem,1.1rem + 2.3vw,3.05rem)}
  .hero .lead{margin-top:16px;font-size:1.04rem}
  .hero .btn-row{margin-top:24px}
  .hero__price{margin-top:20px;padding:13px 18px}
  .hero__price-num{font-size:1.85rem}
  .hero__note{margin-top:16px}
  .trust{margin-top:20px}
  .trust__i{padding:12px 13px}
  .book-card__media{aspect-ratio:21/9}
  .book-card__body{padding:24px 26px}
  .book-card h2{font-size:1.32rem}
  .book-card ul{margin:16px 0;gap:10px}
  .book-card__price{margin:12px 0 2px;padding-bottom:14px}
  .book-card__price b{font-size:1.55rem}
  .topbar__in{min-height:64px}
}

/* Sur-titre long : sur mobile, un libellé qui dépasse la largeur disponible
   renvoyait le filet seul sur sa propre ligne. On retire le filet en dessous
   de 760 px, le sur-titre se lit très bien sans. */
.eyebrow{flex-wrap:wrap}
.eyebrow::before{align-self:center}
@media (max-width:760px){
  .eyebrow{gap:0}
  .eyebrow::before{display:none}
}

/* Sur les écrans d'ordinateur peu hauts, on resserre aussi le rythme vertical
   des sections, dans la même logique que le hero. */
@media (min-width:981px) and (max-height:960px){
  :root{--sec-y:58px}
  .sec-head{margin-bottom:30px}
}

/* =========================================================
   BLOC « POUR ALLER PLUS LOIN » + PAGES MÉTHODE
   ========================================================= */
.further{
  max-width:820px;margin-inline:auto;text-align:center;
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-xl);
  padding:clamp(30px,4vw,52px) clamp(24px,3.4vw,44px);box-shadow:var(--shadow-sm);
}
.further__pill{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--mint);color:var(--teal);
  padding:7px 16px;border-radius:var(--r-pill);
  font-size:.71rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  margin-bottom:20px;
}
.further__pill svg{width:14px;height:14px}
.further h2{font-size:clamp(1.4rem,1.15rem + 1.1vw,2.1rem);letter-spacing:-.025em}
.further h2 em{font-style:normal;color:var(--teal)}
.further p{color:var(--ink-70);font-size:1rem;max-width:58ch;margin:18px auto 0}
.further .btn{margin-top:28px}

/* --- pages méthode --- */
.mhero{background:var(--teal);color:var(--on-teal)}
.mhero__in{padding-block:clamp(38px,4.6vw,66px) clamp(42px,5vw,72px);position:relative}
/* Sans fil d'Ariane, le hero remonte au plus près du menu. */
.mhero__in:not(:has(.mhero__back)){padding-top:clamp(20px,2.2vw,32px)}
.mhero__in:not(:has(.mhero__back)) .mhero__grid{margin-top:0}
.mhero h1{color:var(--white);max-width:20ch;font-size:clamp(1.9rem,1.3rem + 2.4vw,3.1rem)}
.mhero .lead{margin-top:18px;color:var(--on-teal-70)}
.mhero__back{
  display:inline-flex;align-items:center;gap:8px;margin-bottom:20px;
  font-size:.86rem;color:var(--on-teal-70);text-decoration:none;
}
.mhero__back:hover{color:var(--mint)}
.mhero__back svg{width:15px;height:15px;transform:rotate(180deg)}

.prose{max-width:74ch;margin-inline:auto}
.prose h2{font-size:clamp(1.4rem,1.2rem + .9vw,1.95rem);margin-bottom:16px}
.prose h3{font-size:1.1rem;margin:30px 0 10px}
.prose p{color:var(--ink-70);font-size:1rem;line-height:1.72;margin-bottom:1.1em}
.prose strong{color:var(--ink)}
.prose .lead{margin-bottom:26px}
.prose ul{list-style:none;margin:0 0 1.4em;padding:0;display:grid;gap:12px}
.prose ul li{display:flex;gap:12px;font-size:.97rem;line-height:1.6;color:var(--ink-70)}
.prose ul li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--teal);flex:0 0 auto;margin-top:.62em}
.prose .callout{
  background:var(--mint);border-radius:var(--r-lg);padding:clamp(20px,2.4vw,28px);
  margin:28px 0;
}
.prose .callout p{color:var(--teal);margin-bottom:0;font-size:.97rem}
.prose .callout p + p{margin-top:.9em}
.prose .callout strong{color:var(--teal-900)}

.sources{display:grid;gap:12px;margin-top:8px}
.source{
  display:flex;gap:14px;align-items:flex-start;
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);
  padding:18px 20px;text-decoration:none;color:inherit;
  transition:border-color .18s ease,transform .18s ease;
}
a.source:hover{border-color:var(--teal);transform:translateY(-2px)}
.source svg{width:18px;height:18px;flex:0 0 auto;color:var(--teal);margin-top:3px}
.source b{display:block;font-size:.95rem;font-weight:600;margin-bottom:4px;line-height:1.35}
.source span{font-size:.88rem;color:var(--ink-70);line-height:1.5}

/* ---------- Tarif de lancement ---------- */
.plan__launch{
  display:block;font-size:.8rem;line-height:1.5;color:var(--ink-55);
  margin:-2px 0 4px;
}
.plan__launch b{color:var(--teal);font-weight:600}
.plan--featured .plan__launch{color:var(--ink-70)}
.hero__price-launch{
  display:block;margin-top:8px;font-size:.78rem;line-height:1.5;color:var(--on-teal-70);
}
.hero__price-launch b{color:var(--mint);font-weight:600}
.book-card__price .launch{
  display:block;width:100%;margin-top:4px;
  font-size:.78rem;line-height:1.45;color:var(--ink-55);
}

/* Bouton blanc sur fond teal : contraste maximal */
.btn--onteal{background:var(--white);color:var(--teal)}
.btn--onteal:hover{background:var(--mint);color:var(--teal-900)}

/* =========================================================
   POINTS CLÉS : bandeau teal de quatre repères
   ========================================================= */
.keys-band{padding-block:clamp(38px,4.6vw,62px) !important}
.keys{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.keys__i{
  display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:0 clamp(16px,2.2vw,30px);
}
.keys__i + .keys__i{border-left:1px solid var(--line-dark)}
.keys__n{
  width:54px;height:54px;border-radius:17px;flex:0 0 auto;
  background:rgba(201,224,218,.14);border:1px solid var(--line-dark);
  color:var(--mint);display:grid;place-items:center;margin-bottom:20px;
}
.keys__n svg{width:24px;height:24px}
.keys__i h3{font-size:1.02rem;line-height:1.3;margin-bottom:9px;max-width:19ch;color:var(--white)}
.keys__i p{font-size:.89rem;line-height:1.55;color:var(--on-teal-70);margin:0;max-width:27ch}
@media (max-width:900px){
  .keys{grid-template-columns:repeat(2,1fr);gap:clamp(28px,4vw,40px) 0}
  .keys__i:nth-child(odd){border-left:none}
  .keys__i:nth-child(2),.keys__i:nth-child(4){border-left:1px solid var(--line-dark)}
}
@media (max-width:560px){
  .keys{grid-template-columns:1fr;gap:24px}
  .keys__i{border-left:none !important;flex-direction:row;text-align:left;gap:16px;padding:0;align-items:flex-start}
  .keys__n{width:44px;height:44px;border-radius:14px;margin-bottom:0}
  .keys__n svg{width:20px;height:20px}
  .keys__i h3{max-width:none;margin-bottom:5px}
  .keys__i p{max-width:none}
}

/* Bouton principal du hero centré sur sa ligne, dans la colonne de gauche.
   Un peu de largeur minimale pour que le centrage se lise comme un choix. */
.hero .btn-row{justify-content:center}
@media (min-width:761px){
  .hero .btn-row .btn{min-width:270px}
}


/* Photo du cabinet : <picture> se comporte comme le conteneur média de la carte.
   Le cadrage est décalé vers le haut pour garder le mur au logo dans le champ
   quelle que soit la proportion découpée. */
picture.book-card__media{display:block;padding:0}
picture.book-card__media img{
  width:100%;height:100%;object-fit:cover;object-position:50% 38%;display:block;
}

/* Photo de l'étude de cas : <picture> tient lieu de conteneur média. */
picture.case__media{display:block;padding:0}
picture.case__media img{width:100%;height:100%;object-fit:cover;object-position:50% 45%;display:block;border-radius:inherit}

/* Portrait de la praticienne : <picture> tient lieu de conteneur média. */
.portrait:has(picture){padding:0;place-items:stretch}
.portrait picture{display:block;width:100%;height:100%}
.portrait picture img{width:100%;height:100%;object-fit:cover;object-position:50% 50%;display:block;border-radius:inherit}

/* Photo d'avis : <picture> occupe toute la pastille ronde. */
.tm__avatar picture{display:block;width:100%;height:100%}

/* =========================================================
   PAGE MÉTHODE : traitement visuel
   Hero en deux colonnes, bande de repères, briques de preuve,
   figures explicatives, cartes d'études.
   ========================================================= */
.mhero__grid{
  display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,4.4vw,58px);
  align-items:center;margin-top:clamp(22px,2.8vw,34px);
}
@media (max-width:880px){.mhero__grid{grid-template-columns:1fr;gap:34px}}
.mhero h1{max-width:18ch}
.mhero h1 em{font-style:normal;color:var(--mint)}

.mfig{
  position:relative;margin:0;border-radius:var(--r-xl);
  background:rgba(201,224,218,.08);border:1px solid var(--line-dark);
  padding:clamp(20px,2.6vw,34px);
}
.mfig__art{width:100%;height:auto;display:block}
.mfig__badge{
  position:absolute;display:inline-flex;align-items:center;gap:8px;
  background:var(--white);color:var(--ink);border-radius:var(--r-pill);
  padding:9px 15px;font-size:.78rem;font-weight:600;line-height:1.2;
  box-shadow:var(--shadow-md);white-space:nowrap;
}
.mfig__badge svg{width:15px;height:15px;color:var(--teal);flex:0 0 auto}
.mfig__badge--a{left:clamp(10px,2vw,24px);bottom:clamp(14px,2vw,26px)}
.mfig__badge--b{right:clamp(10px,2vw,24px);top:clamp(14px,2vw,26px)}
@media (max-width:520px){.mfig__badge{font-size:.71rem;padding:7px 12px;gap:6px}}

/* Bande de repères chiffrés */
.mstrip{background:var(--teal-900);color:var(--on-teal);padding-block:clamp(26px,3.2vw,40px)}
.mstrip__row{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(14px,2vw,26px);text-align:center}
.mstrip__i b{
  display:block;font-size:clamp(1.4rem,1.05rem + 1.35vw,2.2rem);font-weight:600;
  letter-spacing:-.03em;line-height:1.1;color:var(--mint);font-variant-numeric:tabular-nums;
}
.mstrip__i span{display:block;margin-top:7px;font-size:.8rem;line-height:1.4;color:var(--on-teal-70)}
@media (max-width:880px){
  .mstrip__row{grid-template-columns:repeat(2,1fr);gap:26px 16px}
  .mstrip__i:last-child{grid-column:1 / -1}
}

/* Les deux briques + jauge de niveau de preuve */
.bricks{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.4vw,26px)}
@media (max-width:880px){.bricks{grid-template-columns:1fr}}
.brick{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:clamp(24px,2.8vw,34px);display:flex;flex-direction:column;
}
.brick__ico{
  width:46px;height:46px;border-radius:14px;background:var(--mint);color:var(--teal);
  display:grid;place-items:center;margin-bottom:18px;
}
.brick__ico svg{width:23px;height:23px}
.brick h3{font-size:1.12rem;margin-bottom:10px}
.brick p{color:var(--ink-70);font-size:.95rem}
.brick__gauge{margin-top:auto;padding-top:22px;border-top:1px solid var(--line)}
.gauge__top{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:10px}
.gauge__label{font-size:.7rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-55)}
.gauge__val{font-size:.84rem;font-weight:600;color:var(--teal)}
.gauge__dots{display:flex;gap:6px}
.gauge__dots i{flex:1 1 0;height:7px;border-radius:99px;background:rgba(3,25,23,.1)}
.gauge__dots i.is-on{background:var(--teal)}
.brick--hypo .brick__ico{background:rgba(3,25,23,.06);color:var(--ink-55)}
.brick--hypo .gauge__val,.brick--hypo .gauge__dots i.is-on{color:var(--ink-55);background:var(--ink-55)}
.brick--hypo .gauge__val{background:none}

/* Figure encadrée */
.figpanel{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:clamp(20px,2.6vw,32px);margin:0;
}
.figpanel svg{width:100%;height:auto;display:block}
.figpanel figcaption{margin-top:16px;font-size:.86rem;line-height:1.6;color:var(--ink-55)}
.figpanel figcaption strong{color:var(--ink);font-weight:600}

/* Zones traitées : figure de l'oreille + cartes numérotées */
.earblock{display:grid;grid-template-columns:.82fr 1.18fr;gap:clamp(24px,3.6vw,48px);align-items:center}
@media (max-width:880px){.earblock{grid-template-columns:1fr}}
.zones{display:grid;gap:12px;margin:0;padding:0;list-style:none}
.zone{
  display:grid;grid-template-columns:34px 1fr;gap:14px;align-items:start;
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);
  padding:17px 20px;
}
.section--sand .zone{border-color:rgba(3,25,23,.08)}
.zone em{
  font-style:normal;width:34px;height:34px;border-radius:50%;
  background:var(--mint);color:var(--teal);display:grid;place-items:center;
  font-weight:600;font-size:.85rem;
}
.zone b{display:block;font-size:.98rem;margin-bottom:4px}
.zone span{font-size:.9rem;color:var(--ink-70);line-height:1.5;display:block}

/* Cartes d'études */
.studies{display:grid;gap:14px}
.study{
  display:block;background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:clamp(20px,2.2vw,28px);text-decoration:none;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.study:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:transparent}
.study:focus-visible{outline:3px solid var(--teal);outline-offset:3px}
.study__top{display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px;margin-bottom:12px}
.study__verdict{
  display:inline-flex;align-items:center;gap:7px;border-radius:var(--r-pill);
  padding:6px 12px;font-size:.71rem;font-weight:600;letter-spacing:.07em;text-transform:uppercase;
}
.study__verdict svg{width:13px;height:13px}
.study__verdict--pour{background:var(--mint);color:var(--teal)}
.study__verdict--contre{background:rgba(3,25,23,.07);color:var(--ink-55)}
.study__verdict--meca{background:rgba(0,68,68,.09);color:var(--teal)}
.study__src{font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-55);font-weight:600}
.study b{display:block;font-size:1rem;line-height:1.4;margin-bottom:8px}
.study p{font-size:.92rem;color:var(--ink-70);margin:0}
.study__more{display:inline-flex;align-items:center;gap:7px;margin-top:14px;font-size:.84rem;font-weight:600;color:var(--teal)}
.study__more svg{width:15px;height:15px}

/* =========================================================
   PAGE MÉTHODE (suite) : comment ça fonctionne, déroulement
   illustré, résultats chiffrés, bénéfices au quotidien.
   ========================================================= */

/* Comment ça fonctionne : 4 cartes + schéma légendé */
.hiw{display:grid;grid-template-columns:1.06fr .94fr;gap:clamp(24px,3.4vw,48px);align-items:center}
@media (max-width:980px){.hiw{grid-template-columns:1fr}}
.hiw__cards{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,1.8vw,18px)}
@media (max-width:520px){.hiw__cards{grid-template-columns:1fr}}
.hiw__card{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:clamp(18px,2.2vw,26px);text-align:center;
}
.section--sand .hiw__card{border-color:rgba(3,25,23,.08)}
.hiw__card .card__ico{margin:0 auto 14px;border-radius:50%;width:54px;height:54px}
.hiw__card h3{font-size:.98rem;margin-bottom:8px;line-height:1.3}
.hiw__card p{font-size:.87rem;color:var(--ink-70);margin:0;line-height:1.55}

/* Déroulement illustré : 4 cartes photo reliées */
.steps4{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,2vw,22px)}
@media (max-width:980px){.steps4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.steps4{grid-template-columns:1fr}}
.step4{
  position:relative;background:var(--white);border:1px solid var(--line);
  border-radius:var(--r-lg);padding:14px 14px 22px;
}
.section--sand .step4{border-color:rgba(3,25,23,.08)}
.step4__n{
  position:absolute;top:24px;left:24px;z-index:2;
  width:30px;height:30px;border-radius:50%;background:var(--teal);color:var(--mint);
  display:grid;place-items:center;font-size:.82rem;font-weight:600;
  box-shadow:0 2px 10px rgba(3,25,23,.25);
}
.step4 h3{font-size:1rem;margin:16px 4px 7px}
.step4 p{font-size:.88rem;color:var(--ink-70);margin:0 4px;line-height:1.55}
@media (min-width:981px){
  .step4:not(:last-child)::after{
    content:"";position:absolute;top:26%;right:calc(-1 * clamp(14px,2vw,22px) / 2 - 4px);
    width:9px;height:9px;border-top:2px solid rgba(3,25,23,.26);border-right:2px solid rgba(3,25,23,.26);
    transform:rotate(45deg);
  }
}

/* Emplacement photo */
.shot{
  position:relative;aspect-ratio:4/3;border-radius:var(--r-md);overflow:hidden;
  background:var(--mint-50);display:grid;place-items:center;
}
.shot img{width:100%;height:100%;object-fit:cover}
.shot__ph{text-align:center;font-size:.71rem;line-height:1.55;color:var(--teal);opacity:.8;padding:12px}
.shot__ph svg{width:26px;height:26px;margin:0 auto 8px;opacity:.55}
.shot__ph code{background:rgba(255,255,255,.7);padding:2px 6px;border-radius:5px;font-size:.96em}

/* Résultats chiffrés : anneaux de progression */
.results{
  background:var(--teal);color:var(--on-teal);border-radius:var(--r-xl);
  padding:clamp(28px,3.6vw,48px);
  display:grid;grid-template-columns:1fr auto;gap:clamp(26px,3.4vw,48px);align-items:center;
}
@media (max-width:980px){.results{grid-template-columns:1fr}}
.results h2{color:var(--white)}
.results p{color:var(--on-teal-70);margin:16px 0 0;max-width:46ch}
.donuts{display:flex;gap:clamp(14px,2.2vw,28px);flex-wrap:wrap;justify-content:center}
.donut{width:124px;text-align:center}
.donut__ring{position:relative;width:96px;height:96px;margin-inline:auto}
.donut__ring svg{width:96px;height:96px;transform:rotate(-90deg)}
.donut__track{fill:none;stroke:rgba(201,224,218,.2);stroke-width:9}
.donut__val{
  fill:none;stroke:var(--mint);stroke-width:9;stroke-linecap:round;
  stroke-dasharray:calc(var(--p) * 2.639) 264;
}
.donut__num{
  position:absolute;inset:0;
  display:flex;align-items:baseline;justify-content:center;gap:1px;
  font-size:1.5rem;font-weight:600;color:var(--white);letter-spacing:-.03em;
  line-height:96px;
}
.donut__num small{font-size:.58em;font-weight:600;line-height:1}
.donut__lab{margin-top:11px;font-size:.78rem;line-height:1.45;color:var(--on-teal-70)}

/* Bénéfices au quotidien */
.daily{display:grid;grid-template-columns:1.3fr .7fr;gap:clamp(22px,3vw,42px);align-items:center}
@media (max-width:980px){.daily{grid-template-columns:1fr}}
.daily__row{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(10px,1.6vw,18px);text-align:center}
@media (max-width:620px){.daily__row{grid-template-columns:repeat(2,1fr);gap:20px 12px}}
.daily__i .card__ico{margin:0 auto;border-radius:50%;width:52px;height:52px}
.daily__i span{display:block;margin-top:11px;font-size:.82rem;line-height:1.45;color:var(--ink-70)}
.quotecard{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:clamp(22px,2.6vw,32px);
}
.section--sand .quotecard{border-color:rgba(3,25,23,.08)}
.quotecard__mark{display:block;font-size:2.6rem;line-height:.55;color:var(--mint);font-weight:600}
.quotecard p{font-size:1rem;line-height:1.62;font-style:italic;color:var(--ink);margin:16px 0 0}
.quotecard cite{display:block;margin-top:16px;font-style:normal;font-size:.85rem;color:var(--ink-55)}

/* Hero méthode en photo : l'image occupe toute la carte. */
.mfig--photo{padding:0;overflow:hidden;background:rgba(201,224,218,.08)}
.mfig--photo picture{display:block;width:100%;aspect-ratio:1/1}
.mfig--photo img{width:100%;height:100%;object-fit:cover;display:block;border-radius:inherit}
.shot picture{display:block;width:100%;height:100%}