:root{--c-cream:247 245 240;--c-sand:236 234 228;--c-forest:14 20 27;--c-moss:29 63 92;--c-sage:127 139 147;--c-gold:201 147 47;--c-accent:47 110 160;--c-accent-clair:60 131 188;--c-accent-soft:125 173 212}
  body{font-family:'Inter',sans-serif;background:#f7f5f0;overflow-x:hidden}.serif{font-family:'Jost','serif'}html{scroll-behavior:smooth}
  .mesh{position:fixed;inset:0;z-index:-2;background:radial-gradient(38% 38% at 76% 14%,#7dadd430,transparent 62%),radial-gradient(46% 46% at 82% 10%,rgba(47,110,160,.10),transparent 62%),radial-gradient(40% 40% at 8% 34%,rgba(29,63,92,.07),transparent 60%)}
  .grain{background-image:radial-gradient(rgba(31,58,50,.045) 1px,transparent 1px);background-size:15px 15px}
  /* Blog, « la grille tenue » : hauteur commune, accroche coupée à trois lignes,
     pied collé en bas. Sans ça, une note de deux minutes et un essai de quinze
     produisent deux cartes de hauteurs très différentes sur la même ligne. */
  .art-carte{min-height:236px}
  .lignes-3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:1rem}
  .filtre-blog{border:1px solid rgb(var(--c-forest)/.14);background:#fff;border-radius:999px;padding:.45rem .95rem;font-size:.875rem;color:rgb(var(--c-forest)/.72);transition:background .2s,color .2s,border-color .2s;cursor:pointer}
  .filtre-blog:hover{border-color:rgb(var(--c-accent)/.45);color:rgb(var(--c-accent))}
  .filtre-blog.on{background:rgb(var(--c-forest));border-color:rgb(var(--c-forest));color:rgb(var(--c-cream));font-weight:500}
  /* --- Repères du parcours : l'intitulé porte la nature, la valeur porte le fait.
     Filet fin au-dessus de chaque colonne plutôt qu'une pastille : une valeur longue
     se coupe alors normalement, au lieu d'étirer une bulle sur toute la largeur. --- */
  .reperes{display:grid;gap:1.75rem 2.5rem;margin:0;
    grid-template-columns:repeat(auto-fit,minmax(15rem,1fr))}
  .reperes>div{border-top:1px solid rgb(var(--c-forest)/.14);padding-top:.85rem}
  .reperes dt{font-size:.68rem;letter-spacing:.15em;text-transform:uppercase;
    font-weight:600;color:rgb(var(--c-accent));margin-bottom:.35rem}
  .reperes dd{margin:0;font-size:.95rem;line-height:1.55;color:rgb(var(--c-forest)/.82)}
  /* Version resserrée (accueil) : la colonne y est deux fois plus étroite, et trois
     repères sur deux colonnes laissent toujours le troisième seul sur sa ligne. On
     empile donc, intitulé à gauche et valeur à droite, ce qui ne peut pas s'orpheliner. */
  .reperes-menu{gap:0;grid-template-columns:1fr}
  .reperes-menu>div{display:grid;grid-template-columns:7rem 1fr;gap:.25rem .9rem;
    align-items:baseline;border-top:1px solid rgb(var(--c-forest)/.1);padding:.7rem 0}
  .reperes-menu dt{margin-bottom:0;padding-top:.15rem}
  .reperes-menu dd{font-size:.88rem;line-height:1.5}
  @media (max-width:479px){
    .reperes-menu>div{grid-template-columns:1fr;gap:.2rem}
  }
  /* --- Page d'un texte : le diptyque + la colonne de droite --- */
  .art-tete{display:grid;grid-template-columns:1fr;max-width:78rem;margin:0 auto}
  .art-tete-txt{padding:3rem 1.5rem 2rem}
  .art-tete-img{position:relative;min-height:260px;overflow:hidden}
  .art-tete-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .art-plan{max-width:78rem;margin:0 auto;padding:2rem 1.5rem 2.5rem;display:grid;
    grid-template-columns:1fr;gap:2.5rem}
  /* La mesure du texte est bornée : sans ça, sur un écran large, la ligne montait à
     une centaine de signes et l'œil perdait le début de la ligne suivante. */
  .art-corps{min-width:0;max-width:42rem}
  .art-rail{min-width:0}
  .art-rail-collant{position:sticky;top:5.5rem}
  .art-som ol{list-style:none;margin:0;padding:0;border-left:1px solid rgb(var(--c-forest)/.12)}
  .art-som-t{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600;
    color:rgb(var(--c-accent));margin:0 0 .75rem}
  .art-som a{display:block;padding:.45rem 0 .45rem .9rem;margin-left:-1px;font-size:.86rem;
    line-height:1.4;color:rgb(var(--c-forest)/.62);border-left:2px solid transparent;
    transition:color .2s,border-color .2s}
  .art-som a:hover{color:rgb(var(--c-accent))}
  .art-som a.on{color:rgb(var(--c-forest));font-weight:500;border-left-color:rgb(var(--c-accent))}
  .art-fiche{margin:0;font-size:.86rem}
  .art-fiche dt{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;
    color:rgb(var(--c-accent));margin-bottom:.2rem}
  .art-fiche dd{margin:0 0 .9rem;color:rgb(var(--c-forest)/.7)}
  .art-rail-cta{margin-top:1.75rem;padding-top:1.25rem;border-top:1px solid rgb(var(--c-forest)/.1)}
  .art-rail-cta p{font-size:.9rem;color:rgb(var(--c-forest)/.7);margin:0 0 .75rem}
  /* La jauge : un fil de 3 px sous l'en-tête collant, jamais un bandeau. */
  .art-jauge{position:fixed;top:4rem;left:0;right:0;height:3px;z-index:39;
    background:rgb(var(--c-forest)/.08)}
  .art-jauge i{display:block;height:100%;width:0;background:rgb(var(--c-accent));
    transition:width .08s linear}
  @media (min-width:1024px){
    .art-tete{grid-template-columns:1.05fr .95fr;align-items:stretch}
    .art-tete-txt{padding:3.5rem 3rem 3rem 1.5rem;display:flex;flex-direction:column;justify-content:center}
    .art-tete-img{min-height:26rem}
    .art-plan{grid-template-columns:minmax(0,1fr) 15rem;gap:3.5rem}
  }
  @media (prefers-reduced-motion:reduce){.art-jauge i{transition:none}}

  .marque{display:inline-flex;flex-direction:column;gap:4px;line-height:1}
  .marque-nom{line-height:1.05}
  .marque-sig{display:block;height:13px;overflow:hidden;font-size:.64rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:rgb(var(--c-accent))}
  .marque-def{display:block;animation:defile-sig 10.5s infinite}
  .marque-def span{display:block;height:13px;line-height:13px;white-space:nowrap}
  @keyframes defile-sig{0.00%,26.67%{transform:translateY(-0px)}33.33%,60.00%{transform:translateY(-13px)}66.67%,93.33%{transform:translateY(-26px)}100%{transform:translateY(-39px)}}
  @media (prefers-reduced-motion:reduce){
    .marque-def{animation:none}
    .marque-def span:nth-child(n+2){display:none}}

  /* Grille de sujets : la dernière ligne incomplète est CENTRÉE au lieu d'être collée à gauche.
     Astuce : on découpe en 6 colonnes (4 en tablette) et chaque carte en occupe 2, ce qui laisse
     des demi-pas pour décaler la ligne orpheline. Les sélecteurs marchent sans connaître le nombre
     de cartes : nth-child repère le début d'une ligne, nth-last-child compte ce qu'il reste. */
  .grille-3{display:grid}
  @media (min-width:640px) and (max-width:1023.98px){
    .grille-3{grid-template-columns:repeat(4,minmax(0,1fr))}
    .grille-3>*{grid-column:span 2}
    .grille-3>:nth-child(2n+1):last-child{grid-column:2/span 2}   /* 1 carte seule sur 2 colonnes */
  }
  @media (min-width:1024px){
    .grille-3{grid-template-columns:repeat(6,minmax(0,1fr))}
    .grille-3>*{grid-column:span 2}
    /* ⚠️ poser début ET étendue : un grid-column-start seul laisse la fin en auto,
       la carte se réduirait alors à une seule colonne au lieu de deux. */
    .grille-3>:nth-child(3n+1):nth-last-child(2){grid-column:2/span 2} /* 2 cartes restantes (ex. 5 sujets) */
    .grille-3>:nth-child(3n+1):last-child{grid-column:3/span 2}        /* 1 carte restante (ex. 4 sujets) */
  }
  .js .reveal{opacity:0;transform:translateY(22px)}.reveal{transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s}.reveal.vis{opacity:1;transform:none}
  .card-lift{transition:transform .4s cubic-bezier(.2,.7,.2,1),box-shadow .4s}.card-lift:hover{transform:translateY(-6px);box-shadow:0 22px 45px -20px rgba(31,58,50,.35)}
  details>summary{list-style:none}details>summary::-webkit-details-marker{display:none}details[open] .chev{transform:rotate(180deg)}
  .field{width:100%;background:#fff;border:1px solid rgba(31,58,50,.15);border-radius:14px;padding:.85rem 1rem;font-size:.95rem;color:#0e141b}
  .field:focus{outline:none;border-color:#2f6ea0;box-shadow:0 0 0 3px #2f6ea022}
  .prose p{margin-bottom:1rem;line-height:1.7;color:#0e141b;opacity:.82}.prose h2{font-family:'Jost',serif;font-size:1.5rem;font-weight:600;color:#0e141b;margin:2rem 0 .75rem}
  /* Article de fond : un texte long se lit à une mesure plus étroite et un corps plus
     grand que le reste du site. Le chapô est plus clair que le corps, la citation
     s'avance dans la marge : trois repères suffisent à casser le mur de paragraphes. */
  .text-accent-clair{color:rgb(var(--c-accent-clair))}
  .foot-cta{border-radius:22px;padding:32px 34px;display:flex;flex-wrap:wrap;gap:24px;
    align-items:center;justify-content:space-between}
  .foot-grid{display:grid;grid-template-columns:1fr;gap:28px;padding:38px 4px 0}
  @media (min-width:760px){.foot-grid{grid-template-columns:1.4fr 1fr 1fr;gap:34px}}
  .foot-lab{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
    color:rgb(var(--c-forest));margin-bottom:12px}
  .foot-bas{border-top:1px solid rgb(var(--c-forest)/.12);margin-top:32px;padding:16px 4px 26px;
    display:flex;flex-wrap:wrap;gap:10px 22px;justify-content:space-between;
    font-size:12px;color:rgb(var(--c-forest)/.5)}
  .foot-bas a:hover{color:rgb(var(--c-accent))}
  .benef-grid{display:grid;gap:22px 40px}
  @media (min-width:640px){.benef-grid{grid-template-columns:1fr 1fr}}
  .benef-item{display:flex;gap:14px;align-items:flex-start}
  .benef-ic{flex:0 0 auto;width:26px;height:26px;border-radius:9px;display:flex;align-items:center;
    justify-content:center;font-size:13px;background:rgb(var(--c-accent)/.13);color:rgb(var(--c-accent))}
  .benef-item p{font-size:15px;line-height:1.6;color:rgb(var(--c-forest)/.78);margin:0}
  .art-chapo{font-size:1.2rem;line-height:1.65;color:#0e141b;opacity:.78}
  .art-corps p{font-size:1.06rem;line-height:1.78;margin-bottom:1.25rem}
  .art-corps h2{font-size:1.4rem;margin:2.6rem 0 .9rem;letter-spacing:-.01em}
  .art-corps h2+p{margin-top:0}
  .art-cit{font-family:'Jost',serif;font-size:1.24rem;line-height:1.55;color:#0e141b;
    border-left:2px solid #2f6ea0;padding:.15rem 0 .15rem 1.3rem;margin:2rem 0 2rem}
  @media (min-width:768px){.art-cit{margin-left:-1.3rem}}
  .art-corps>p:first-of-type::first-letter{font-family:'Jost',serif;font-size:3.1rem;
    line-height:.86;float:left;padding:.1rem .55rem .1rem 0;color:#2f6ea0}
  @keyframes trust-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
  .marquee{display:flex;width:max-content;animation:trust-marquee 32s linear infinite}
  .marquee-wrap:hover .marquee{animation-play-state:paused}
  @media (prefers-reduced-motion:reduce){.marquee{animation:none;justify-content:center;width:100%;flex-wrap:wrap}}
  /* popup de réservation (thémé) */
  .bk-ov{position:fixed;inset:0;z-index:200;background:rgba(18,30,26,.55);backdrop-filter:blur(4px);display:none;align-items:center;justify-content:center;padding:16px}
  .bk-ov.open{display:flex}
  .bk-modal{position:relative;background:#fff;border-radius:20px;width:min(720px,100%);max-height:92vh;overflow:hidden;box-shadow:0 40px 90px -30px rgba(18,30,26,.55);animation:bkIn .24s cubic-bezier(.2,.7,.2,1)}
  @keyframes bkIn{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
  .bk-close{position:absolute;top:12px;right:14px;z-index:3;width:34px;height:34px;border-radius:50%;border:1px solid rgba(31,58,50,.14);background:#fff;color:rgb(var(--c-forest));font-size:20px;line-height:1;cursor:pointer}
  /* La fenêtre ne contient plus qu'un titre et des actions : elle n'a plus besoin
     de deux colonnes ni d'un calendrier. */
  .bk-modal-simple{width:min(460px,100%);padding:34px 32px 30px;overflow-y:auto}
  .bk-titre{font-family:'Jost',serif;font-weight:600;font-size:1.5rem;color:rgb(var(--c-forest));margin-bottom:10px}
  .bk-link{display:block;text-align:center;margin-top:14px;font-size:.82rem;color:rgb(var(--c-accent));text-decoration:underline}
  /* ---- Style A premium : hero (pastille clignotante, photo arche, badges flottants, ken-burns) ---- */
  .pill{display:inline-flex;align-items:center;gap:11px;background:#fff;border:1px solid rgb(var(--c-forest)/.10);border-radius:100px;padding:8px 16px;box-shadow:0 10px 26px -16px rgba(31,58,50,.5);font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgb(var(--c-forest)/.82)}
  .pill .live{width:9px;height:9px;border-radius:50%;background:rgb(var(--c-accent));position:relative;flex-shrink:0}
  .pill .live::after{content:'';position:absolute;inset:0;border-radius:50%;background:rgb(var(--c-accent));animation:pulse 1.8s ease-out infinite}
  @keyframes pulse{0%{transform:scale(1);opacity:.7}70%{transform:scale(2.6);opacity:0}100%{opacity:0}}
  .hero-arch{position:relative;border-radius:220px 220px 26px 26px;overflow:hidden;box-shadow:0 50px 90px -46px rgba(31,58,50,.5);border:1px solid rgb(var(--c-forest)/.08)}
  .hero-arch img,.hero-arch>span{width:100%;height:100%;object-fit:cover;display:block;animation:kenburns 16s ease-out both}
  @keyframes kenburns{from{transform:scale(1.13)}to{transform:scale(1)}}
  .hero-badge{position:absolute;z-index:2;background:#fff;border:1px solid rgb(var(--c-forest)/.08);border-radius:15px;padding:11px 15px;box-shadow:0 20px 44px -24px rgba(31,58,50,.6)}
  .hero-badge.b-top{top:26px;left:-16px;animation:floatY 5.5s ease-in-out infinite}
  .hero-badge.b-bot{bottom:26px;right:-14px;background:rgb(var(--c-forest));color:rgb(var(--c-cream));border-color:transparent;animation:floatY 6.5s ease-in-out infinite .6s}
  @keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
  .hero-badge .hb-stars{color:rgb(var(--c-gold));font-size:12px;letter-spacing:1px}
  .hero-badge .hb-strong{font-family:'Jost',serif;font-weight:600;font-size:14px}
  .hero-badge .hb-sub{font-size:11px;opacity:.7;letter-spacing:.05em}
  @media(max-width:1023px){.hero-badge.b-top{left:8px}.hero-badge.b-bot{right:8px}}
  .t-cocon #hero h1{font-weight:400;letter-spacing:-.022em}
  #hero h1.h1-l{font-size:clamp(1.95rem,3.4vw,2.8rem);line-height:1.12}
  #hero h1.h1-xl{font-size:clamp(1.8rem,3vw,2.45rem);line-height:1.16}
  /* entrée en cascade du hero */
  .js #hero .casc{opacity:0;transform:translateY(16px);animation:cascIn .8s cubic-bezier(.2,.7,.2,1) forwards}
  .js #hero .casc.c1{animation-delay:.05s}.js #hero .casc.c2{animation-delay:.16s}.js #hero .casc.c3{animation-delay:.27s}.js #hero .casc.c4{animation-delay:.38s}
  @keyframes cascIn{to{opacity:1;transform:none}}
  /* ---- Style B « Cinématique » : hero photo plein cadre ---- */
  .hero-cine{position:relative;min-height:clamp(560px,86vh,840px);display:flex;align-items:flex-end;overflow:hidden}
  .hero-cine-bg{position:absolute;inset:0;z-index:0}
  .hero-cine-bg img,.hero-cine-bg>span{width:100%;height:100%;object-fit:cover;object-position:60% 18%}
  .hero-cine-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(16,35,30,.95) 0%,rgba(16,35,30,.62) 32%,rgba(16,35,30,.12) 60%,transparent 74%),linear-gradient(180deg,transparent 48%,rgba(16,35,30,.6) 100%)}
  .hero-cine-in{position:relative;z-index:1;width:100%;padding:clamp(40px,7vw,88px) 0}
  .hero-cine-kick{color:rgb(var(--c-gold));font-weight:600;letter-spacing:.03em;margin-bottom:18px}
  .hero-cine h1{color:#f6f1e6;font-family:'Jost',serif;font-weight:400;font-size:clamp(2.2rem,4.4vw,3.7rem);line-height:1.05;letter-spacing:-.03em;max-width:19ch}
  .hero-cine h1.h1-l{font-size:clamp(2rem,3.6vw,2.95rem);line-height:1.09;max-width:22ch}
  .hero-cine h1.h1-xl{font-size:clamp(1.8rem,3.1vw,2.5rem);line-height:1.14;max-width:24ch}
  .hero-cine-row{display:flex;flex-direction:column;align-items:flex-start;gap:22px;margin-top:28px}
  .hero-cine-row p{color:#f1ece0;font-size:1.16rem;line-height:1.6;max-width:34ch}
  .hero-cine-micro{color:rgba(246,241,230,.72);font-size:13px}
  .btn-gold{background:rgb(var(--c-gold));color:#241f10;box-shadow:0 22px 46px -22px rgba(207,155,63,.7)}
  .btn-gold:hover{filter:brightness(1.06)}
  .btn-ghost{border:1px solid rgba(246,241,230,.4);color:#f6f1e6}
  .btn-ghost:hover{background:rgba(246,241,230,.12)}
  @media (prefers-reduced-motion:no-preference){
    .hero-cine-bg img{animation:kbz 18s ease-out both}
    @keyframes kbz{from{transform:scale(1.1)}to{transform:scale(1)}}
    .js .hero-cine .cine-rv{opacity:0;transform:translateY(24px);animation:cineUp 1s cubic-bezier(.2,.7,.2,1) forwards}
    .js .hero-cine .cine-rv.r1{animation-delay:.08s}.js .hero-cine .cine-rv.r2{animation-delay:.24s}.js .hero-cine .cine-rv.r3{animation-delay:.4s}
    @keyframes cineUp{to{opacity:1;transform:none}}
  }
  /* ---- Style C « Organique » : hero doux, formes blob, chips flottantes ---- */
  .hero-org{position:relative;padding:clamp(28px,5vw,58px) 0 clamp(44px,7vw,86px);overflow:hidden}
  .hero-org-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(30px,5vw,60px);align-items:center;position:relative;z-index:1}
  .hero-org h1{font-family:'Jost',serif;color:rgb(var(--c-forest));font-weight:500;font-size:clamp(2.4rem,4.8vw,4rem);line-height:1.04;letter-spacing:-.03em;margin:20px 0 0}
  .hero-org h1.h1-l{font-size:clamp(2.05rem,3.8vw,3.05rem);line-height:1.1}
  .hero-org h1.h1-xl{font-size:clamp(1.85rem,3.2vw,2.55rem);line-height:1.15}
  .hero-org h1 em{font-style:italic;color:rgb(var(--c-accent))}
  .hero-org .lead{margin:24px 0 32px;font-size:clamp(1.04rem,1.4vw,1.2rem);color:rgb(var(--c-forest)/.72);max-width:36ch;line-height:1.66}
  .hero-org-photo{position:relative}
  .hero-org-frame{position:relative;overflow:hidden;aspect-ratio:1/1.05;box-shadow:0 44px 80px -40px rgba(44,42,36,.45);border-radius:58% 42% 47% 53%/54% 46% 54% 46%}
  .hero-org-frame img,.hero-org-frame>span{width:100%;height:100%;object-fit:cover}
  .org-chip{position:absolute;z-index:2;background:#fffdf9;border-radius:20px;padding:13px 17px;box-shadow:0 22px 44px -22px rgba(44,42,36,.5);display:flex;align-items:center;gap:11px}
  .org-chip.a{left:-16px;top:12%}.org-chip.b{right:-14px;bottom:12%}
  .org-chip .st{color:rgb(var(--c-gold));letter-spacing:1px;font-size:13px}
  .org-chip b{font-family:'Jost',serif;font-weight:600;font-size:14.5px;color:rgb(var(--c-forest));display:block;line-height:1.1}
  .org-chip small{color:rgb(var(--c-forest)/.6);font-size:12px}
  .org-deco{position:absolute;border-radius:50%;filter:blur(3px);opacity:.55;z-index:0;pointer-events:none}
  .org-deco.d1{width:120px;height:120px;background:radial-gradient(circle at 35% 30%,#e9c39f,#d29a83);top:6%;left:-2%}
  .org-deco.d2{width:80px;height:80px;background:radial-gradient(circle at 35% 30%,#b7c9a9,#8ea183);bottom:4%;right:1%}
  .btn-sage{background:rgb(var(--c-moss));color:#fff;box-shadow:0 18px 36px -16px rgba(111,132,104,.7)}
  .btn-sage:hover{background:rgb(var(--c-forest))}
  @media (prefers-reduced-motion:no-preference){
    .hero-org-frame img{animation:kbz 16s ease-out both}
    .org-chip.a{animation:floaty 8s ease-in-out infinite}.org-chip.b{animation:floaty 9s ease-in-out infinite 1.4s}
    .org-deco{animation:floaty 12s ease-in-out infinite}.org-deco.d2{animation-delay:2s}
    @keyframes floaty{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-18px) rotate(6deg)}}
    .js .hero-org .cine-rv{opacity:0;transform:translateY(22px);animation:cineUp 1s cubic-bezier(.2,.7,.2,1) forwards}
    .js .hero-org .cine-rv.r1{animation-delay:.06s}.js .hero-org .cine-rv.r2{animation-delay:.2s}.js .hero-org .cine-rv.r3{animation-delay:.34s}
  }
  @media(max-width:900px){.hero-org-grid{grid-template-columns:1fr;gap:40px}.hero-org-photo{max-width:420px;margin:0 auto}.org-chip.a{left:2px}.org-chip.b{right:2px}}
  /* menu déroulant Accompagnements */
  .nav-dd{position:relative}
  .nav-dd::after{content:'';position:absolute;top:100%;left:-20px;right:-20px;height:16px}
  .nav-dd-panel{position:absolute;top:calc(100% + 12px);left:50%;transform:translateX(-50%) translateY(6px);width:min(560px,86vw);
    background:rgb(var(--c-cream));border:1px solid rgb(var(--c-forest)/.12);border-radius:20px;
    box-shadow:0 34px 66px -26px rgba(20,30,26,.5);padding:14px;opacity:0;visibility:hidden;transition:opacity .2s,transform .2s;z-index:60}
  .nav-dd:hover .nav-dd-panel,.nav-dd:focus-within .nav-dd-panel{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
  .nav-dd-grid{display:grid;grid-template-columns:1fr}
  /* Remplissage par colonne : le nombre de lignes est posé en style inline,
     les colonnes se créent d'elles-mêmes et se partagent la largeur. */
  .nav-dd-cols{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:2px}
  /* Panneau à deux familles : « Mes approches » et « Ce sur quoi je vous accompagne ».
     Chaque famille garde son intitulé et ses colonnes, un filet les sépare. */
  .nav-dd-groupes{display:grid;grid-auto-flow:column;grid-auto-columns:max-content;gap:18px}
  .nav-dd-groupe{min-width:0}
  .nav-dd-groupe + .nav-dd-groupe{border-left:1px solid rgb(var(--c-forest)/.1);padding-left:18px}
  .nav-dd-groupe .nav-dd-cols{grid-auto-columns:minmax(0,248px)}
  .nav-dd-titre{margin:0 0 6px;padding:2px 12px;font-size:10.5px;font-weight:700;
    letter-spacing:.13em;text-transform:uppercase;color:rgb(var(--c-forest)/.45)}
  .nav-dd-item{display:flex;gap:11px;align-items:flex-start;padding:11px 12px;border-radius:13px;transition:background .15s}
  .nav-dd-item:hover{background:rgb(var(--c-sand))}
  .nav-dd-ic{width:36px;height:36px;border-radius:11px;background:rgb(var(--c-accent)/.12);color:rgb(var(--c-accent));display:flex;align-items:center;justify-content:center;flex-shrink:0}
  .nav-dd-item b{display:block;font-family:'Jost',serif;font-weight:600;font-size:14px;color:rgb(var(--c-forest));line-height:1.2}
  .nav-dd-item small{display:block;font-size:12px;color:rgb(var(--c-forest)/.62);line-height:1.4;margin-top:3px}
  /* --- Menu mobile en accordéon ------------------------------------------------
     Cibles tactiles à 52 px : sur ce public, souvent plus de cinquante ans et parfois
     en détresse, une cible trop petite se rate et on ferme l'onglet. */
  .mob-bouton{align-items:center;justify-content:center;width:44px;height:44px;
    margin-right:-8px;border-radius:12px;background:transparent;color:inherit;cursor:pointer}
  .mob-bouton:active{background:rgb(var(--c-forest)/.06)}
  .mob-barres{display:block;width:22px;height:16px;position:relative}
  .mob-barres i{position:absolute;left:0;width:100%;height:2px;border-radius:2px;
    background:currentColor;transition:transform .22s ease,opacity .18s ease}
  .mob-barres i:nth-child(1){top:0}
  .mob-barres i:nth-child(2){top:7px}
  .mob-barres i:nth-child(3){top:14px}
  /* Le bouton devient une croix : le même objet ouvre et ferme, pas deux commandes. */
  [aria-expanded="true"] .mob-barres i:nth-child(1){transform:translateY(7px) rotate(45deg)}
  [aria-expanded="true"] .mob-barres i:nth-child(2){opacity:0}
  [aria-expanded="true"] .mob-barres i:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

  /* --- Le point de bascule du menu, MESURÉ (Playwright, 2026-08-23) -------------
     Deux défauts corrigés d'un coup, tous les sites étaient touchés.

     1) Les trois barres restaient affichées jusqu'à 1600px, à côté du menu complet.
        theme.css est chargé APRÈS tw.css, et à spécificité égale c'est la dernière
        règle qui gagne : le .mob-bouton{display:flex} d'ici battait le md:hidden
        de Tailwind, qui n'a donc jamais rien caché. La visibilité des trois éléments
        du menu est désormais décidée ICI, et nulle part ailleurs.

     2) Les libellés se coupaient en deux (« À / propos », « Prendre rendez- / vous »).
        Mesuré sur un site à 7 entrées : marque 166px + entrées 705px + bouton 158px
        + les espaces = 1061px, pour 1104px utiles au maximum (max-w-6xl moins ses
        marges). Sous ~1100px de fenêtre, ça ne rentre plus et le texte se replie.

          Le seuil est posé à 1180px et non à 1061 : il faut de la marge pour un nom long
     (« Frédérique Le Ridant » fait 60px de plus que « Manon Delaunay ») et pour une
     entrée de menu de plus. Aucune largeur d'écran courante ne tombe en dessous.

     D'où : burger sous 1180px, menu complet au-dessus, resserré jusqu'à 1400px. */
  .mob-bouton{display:none}
  .mob-panneau{display:none}
  @media (max-width:1179.98px){
    .nav-principal{display:none}
    .mob-bouton{display:flex}
    /* :not([hidden]) et pas .mob-panneau seul : sans lui, cette règle battrait
       l'attribut hidden posé par le JS et le panneau resterait ouvert en permanence. */
    .mob-panneau:not([hidden]){display:block}
  }
  /* L'espacement respire avec l'écran au lieu d'être figé à 28px : c'est ce qui laisse
     de la marge à un nom long (« Frédérique Le Ridant » prend 67px de plus que
     « Manon Delaunay ») sans reculer le point de bascule pour tout le monde. */
  @media (min-width:1180px){ .nav-principal{gap:clamp(14px,1.3vw,20px)} }
  /* Un libellé de menu ne se coupe jamais en deux : s'il manque de place, c'est la
     bascule ci-dessus qui doit s'en occuper, pas un retour à la ligne au milieu d'un mot. */
  .nav-principal > a, .nav-principal .nav-dd > a{white-space:nowrap}

  .mob-panneau{border-top:1px solid rgb(var(--c-forest)/.1);background:rgb(var(--c-cream));
    max-height:calc(100vh - 64px);overflow-y:auto;-webkit-overflow-scrolling:touch}
  .mob-liste{display:flex;flex-direction:column;padding:6px 0}
  .mob-item{display:flex;align-items:center;justify-content:space-between;gap:10px;
    min-height:52px;padding:0 20px;font-size:16px;font-weight:500;color:rgb(var(--c-forest));
    border-bottom:1px solid rgb(var(--c-forest)/.06);cursor:pointer;list-style:none}
  .mob-item::-webkit-details-marker{display:none}
  .mob-item:active{background:rgb(var(--c-sand)/.7)}
  .mob-on{color:rgb(var(--c-accent));font-weight:600}
  .mob-item-fin{font-size:14px;font-weight:400;color:rgb(var(--c-forest)/.55);border-bottom:none}
  .mob-fleche{transition:transform .22s ease;flex:0 0 auto;opacity:.5}
  .mob-acc[open] .mob-fleche{transform:rotate(180deg)}
  .mob-acc[open] .mob-item{color:rgb(var(--c-accent))}

  .mob-sous{background:rgb(var(--c-sand)/.45);border-bottom:1px solid rgb(var(--c-forest)/.06);
    padding:4px 0}
  .mob-sous-item{display:flex;align-items:center;gap:11px;min-height:48px;padding:0 20px 0 22px;
    font-size:15px;color:rgb(var(--c-forest)/.82)}
  .mob-sous-item:active{background:rgb(var(--c-sand))}
  .mob-sous-tout{font-weight:600;color:rgb(var(--c-accent));min-height:44px}
  .mob-sous-ic{display:flex;align-items:center;justify-content:center;width:26px;height:26px;
    border-radius:8px;flex:0 0 auto;background:rgb(var(--c-accent)/.12);color:rgb(var(--c-accent))}

  .mob-pied{display:flex;flex-direction:column;gap:9px;padding:16px 20px 20px;
    border-top:1px solid rgb(var(--c-forest)/.08)}
  .mob-tel,.mob-cta{display:flex;align-items:center;justify-content:center;gap:8px;
    min-height:52px;border-radius:999px;font-size:16px;font-weight:600}
  .mob-cta{background:rgb(var(--c-forest));color:rgb(var(--c-cream));width:100%;cursor:pointer}
  .mob-tel{background:#fff;color:rgb(var(--c-forest));border:1px solid rgb(var(--c-forest)/.15)}

  @media (prefers-reduced-motion:reduce){
    .mob-barres i,.mob-fleche{transition:none}
  }
  .nav-dd-cta{display:flex;flex-direction:column;justify-content:center;gap:7px;text-align:left;
    padding:16px 17px;border-radius:15px;background:rgb(var(--c-forest));color:rgb(var(--c-cream));
    transition:background .15s,transform .15s;cursor:pointer;width:100%}
  .nav-dd-cta:hover{background:rgb(var(--c-moss));transform:translateY(-1px)}
  .nav-dd-cta b{font-family:'Jost',serif;font-weight:600;font-size:15px;line-height:1.25}
  .nav-dd-cta small{font-size:12px;line-height:1.45;color:rgb(var(--c-cream)/.72)}
  .nav-dd-cta span{display:inline-flex;align-items:center;gap:6px;margin-top:3px;
    font-size:13px;font-weight:600;color:rgb(var(--c-gold))}
  .nav-dd-all{grid-column:1/-1;text-align:center;padding:12px;margin-top:5px;border-top:1px solid rgb(var(--c-forest)/.1);font-weight:600;font-size:13px;color:rgb(var(--c-accent))}
  .nav-dd-all:hover{text-decoration:underline;text-underline-offset:3px}
  /* icônes SVG */
  .ic{width:1.05em;height:1.05em;display:inline-block;vertical-align:-.15em;flex-shrink:0}
  .ic-lg{width:22px;height:22px;display:inline-block;vertical-align:middle;flex-shrink:0}
  .ic-sm{width:13px;height:13px;display:inline-block;flex-shrink:0;stroke-width:2.2}
  /* badges flottants du hero : repli propre en mobile (ne recouvrent plus le visage) */
  @media(max-width:640px){
    .hero-badge.b-top,.hero-badge.b-bot{position:static;display:inline-flex;margin:10px 8px 0 0;box-shadow:none;animation:none;left:auto;right:auto;bottom:auto;top:auto}
  }
  /* marqueurs démo (vitrine) : bandeau en tête + pastille permanente */
  .demo-bar{background:rgb(var(--c-forest));color:rgb(var(--c-cream));font-family:'Inter',sans-serif;
    font-size:13.5px;line-height:1.45;padding:11px 18px;display:flex;flex-wrap:wrap;align-items:center;
    justify-content:center;gap:6px 14px;text-align:center;position:relative;z-index:50}
  .demo-bar b{font-weight:700;letter-spacing:.02em}
  .demo-bar a{color:rgb(var(--c-gold));font-weight:600;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
  .demo-bar a:hover{color:#fff}
  .demo-ribbon{position:fixed;left:14px;bottom:14px;z-index:120;background:rgb(var(--c-forest));color:rgb(var(--c-cream));
    font-family:'Inter',sans-serif;font-size:11px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;
    padding:7px 13px;border-radius:99px;box-shadow:0 12px 28px -12px rgba(0,0,0,.5);opacity:.92;text-decoration:none}
  .demo-ribbon:hover{opacity:1;background:rgb(var(--c-moss))}

  /* Lien d'évitement : le premier élément atteignable au clavier, invisible à la souris.
     Sans lui, on retraverse tout le menu à chaque page. */
  .saut{position:absolute;left:-9999px;top:0;z-index:100;background:rgb(var(--c-forest));
    color:rgb(var(--c-cream));padding:12px 20px;border-radius:0 0 8px 0;font-weight:600}
  .saut:focus{left:0}
  /* Fenêtre de rendez-vous : deux chemins qui aboutissent vraiment (voir bookingModal). */
  .bk-action{display:block;text-align:center;padding:15px 24px;border-radius:10px;font-weight:600;
    font-size:1rem;transition:transform .25s,box-shadow .25s}
  .bk-action-1{background:rgb(var(--c-forest));color:rgb(var(--c-cream))}
  .bk-action-2{background:transparent;color:rgb(var(--c-forest));border:1.5px solid rgb(var(--c-forest)/.45)}
  .bk-action:hover{transform:translateY(-2px)}
  .bk-intro{color:rgb(var(--c-forest)/.72);line-height:1.6;margin-bottom:24px}
  .bk-pied{color:rgb(var(--c-forest)/.62);font-size:.82rem;margin-top:22px;line-height:1.55}
  /* Le repli « mouvement réduit » ne couvrait ni les révélations au défilement (jusqu'à 27 blocs
     par page), ni les transformations au survol. */
  @media (prefers-reduced-motion:reduce){
    .reveal{transition:none!important;opacity:1!important;transform:none!important}
    .bk-modal{animation:none}
    .card-lift:hover,.bk-action:hover,.nav-dd-cta:hover{transform:none}
  }

  .t-clinique .rounded-3xl,.t-clinique .rounded-2xl{border-radius:.85rem}
  .t-clinique [class~="rounded-[2.5rem]"],.t-clinique [class~="rounded-[2rem]"]{border-radius:1rem}
  .t-clinique .shadow-2xl{box-shadow:0 20px 45px -26px rgba(18,59,56,.45)}
  .t-editorial .rounded-3xl{border-radius:2rem}
  .t-editorial .rounded-2xl{border-radius:1.5rem}
  .t-editorial .card-lift:hover{box-shadow:0 26px 50px -24px rgba(44,42,36,.32)}