/* ============================================================
   L'ESQUIROL — Système visuel partagé (multi-pages)
   Charte portée depuis le one-page d'origine, étendue.
   Contenu TOUJOURS visible ; animations purement additives.
   ============================================================ */
:root{
  --bone:#EFE8DA;
  --bone-2:#E6DDCB;
  --ink:#1B1A16;
  --forest:#2C3A2E;
  --forest-2:#3C4D3B;
  --sage:#8C937E;
  --sage-dk:#6E755F;        /* variante plus contrastée pour le texte */
  --clay:#B65E3C;
  --clay-soft:#C7754F;
  --stone:#CDC2AC;
  --line:rgba(27,26,22,.14);
  --serif:"Fraunces", Georgia, serif;
  --sans:"Inter", system-ui, sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
  --pad:clamp(20px,5vw,72px);
  --maxw:1200px;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--bone);
  color:var(--ink);
  font-family:var(--sans);
  font-weight:400;
  line-height:1.5;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
::selection{background:var(--clay);color:var(--bone)}

/* Accessibilité : focus clavier visible + lien d'évitement */
:focus-visible{outline:3px solid var(--clay);outline-offset:3px;border-radius:3px}
.skip{position:absolute;left:-9999px;top:0;z-index:1000;background:var(--ink);color:var(--bone);
  padding:12px 18px;border-radius:0 0 8px 0;font-size:14px}
.skip:focus{left:0}

.grain{
  position:fixed;inset:0;z-index:9998;pointer-events:none;
  opacity:.05;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- Navigation ---------- */
#nav{position:fixed;top:0;left:0;width:100%;z-index:900;display:flex;align-items:center;justify-content:space-between;padding:22px var(--pad);
  transition:padding .4s var(--ease),background .4s var(--ease)}
#nav.shrink{padding:14px var(--pad);background:rgba(239,232,218,.82);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
nav .brand{font-family:var(--serif);font-size:21px;letter-spacing:-.01em;font-weight:500}
nav .brand b{color:var(--clay);font-weight:500}
nav ul{display:flex;gap:30px;list-style:none;align-items:center}
nav ul a{font-size:13px;letter-spacing:.02em;position:relative;padding:4px 0}
nav ul a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--ink);transition:width .4s var(--ease)}
nav ul a:hover::after,nav ul a.active::after{width:100%}
nav ul a.active{color:var(--clay)}
nav .navcta{border:1px solid var(--ink);border-radius:40px;padding:9px 18px;font-size:13px;transition:background .4s var(--ease),color .4s var(--ease)}
nav .navcta:hover{background:var(--ink);color:var(--bone)}
nav .navcta::after{display:none}
.menu-btn{display:none}
@media(max-width:980px){
  nav ul{display:none}
  .menu-btn{display:block;font-size:13px;letter-spacing:.1em;text-transform:uppercase;background:none;border:none;color:inherit;font-family:var(--sans);cursor:pointer}
}

/* ---------- Animations additives ---------- */
.eyebrow{font-size:12px;letter-spacing:.32em;text-transform:uppercase;color:var(--clay);font-weight:500}
@keyframes revealUp{from{opacity:0;transform:translateY(34px)}to{opacity:1;transform:none}}
.reveal.in{animation:revealUp .95s var(--ease) both}
.reveal.in.delay-1{animation-delay:.1s}
.reveal.in.delay-2{animation-delay:.2s}
.reveal.in.delay-3{animation-delay:.3s}
.reveal.in.delay-4{animation-delay:.4s}
.lines .ln{display:block;overflow:hidden}
.lines .ln i{display:block;font-style:inherit}
@keyframes lineUp{from{transform:translateY(110%)}to{transform:translateY(0)}}
.lines.in .ln i{animation:lineUp .95s var(--ease) both}
.lines.in .ln:nth-child(2) i{animation-delay:.08s}
.lines.in .ln:nth-child(3) i{animation-delay:.16s}
.lines.in .ln:nth-child(4) i{animation-delay:.24s}
@media(prefers-reduced-motion:reduce){
  .reveal.in,.lines.in .ln i{animation:none!important}
  *{scroll-behavior:auto!important}
}

/* ============================================================
   HERO (accueil)
   ============================================================ */
.hero{position:relative;height:100svh;min-height:640px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;background:linear-gradient(180deg,#E9E0CF 0%,#EFE8DA 60%)}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:30%;background:linear-gradient(to top,rgba(27,26,22,.55),rgba(27,26,22,.15) 55%,transparent);z-index:2;pointer-events:none}
.hero .scene{position:absolute;inset:0;z-index:0}
.hero .scene svg{position:absolute;bottom:0;left:0;width:100%;height:auto}
.hl{will-change:transform}
.hero .sun{position:absolute;top:16%;left:50%;width:min(46vh,420px);aspect-ratio:1;transform:translateX(-50%);border-radius:50%;
  background:radial-gradient(circle,#E9C9A0 0%,#E3BC8E 38%,rgba(227,188,142,0) 70%);opacity:.85}
.hero .wrap{position:relative;z-index:5;padding:0 var(--pad) clamp(40px,7vh,88px);width:100%;max-width:var(--maxw);margin:0 auto}
.hero h1{font-family:var(--serif);font-weight:300;font-size:clamp(72px,19vw,300px);line-height:.84;letter-spacing:-.035em}
.hero h1 .ap{color:var(--clay)}
.hero .sub{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px;margin-top:clamp(20px,4vh,40px);border-top:1px solid rgba(255,255,255,.3);padding-top:22px}
.hero .sub p{max-width:46ch;font-size:clamp(15px,1.5vw,18px);line-height:1.55;color:var(--bone)}
.hero .sub .loc{font-size:13px;letter-spacing:.04em;text-align:right;color:var(--stone)}
.hero .sub .loc b{display:block;font-family:var(--serif);font-size:17px;font-weight:500;letter-spacing:0;color:var(--bone)}
.scrollcue{position:absolute;left:var(--pad);bottom:26px;z-index:6;font-size:11px;letter-spacing:.3em;text-transform:uppercase;display:flex;align-items:center;gap:10px;color:var(--forest)}
.scrollcue .dot{width:24px;height:38px;border:1px solid var(--forest);border-radius:14px;position:relative}
.scrollcue .dot::after{content:"";position:absolute;top:6px;left:50%;width:3px;height:6px;background:var(--clay);border-radius:2px;transform:translateX(-50%);animation:sc 1.7s var(--ease) infinite}
@keyframes sc{0%{opacity:0;transform:translate(-50%,0)}30%{opacity:1}70%{opacity:1}100%{opacity:0;transform:translate(-50%,12px)}}

/* ---------- Marquee ---------- */
.marquee{background:var(--forest);color:var(--bone);padding:18px 0;overflow:hidden;white-space:nowrap;border-top:1px solid rgba(0,0,0,.1)}
.marquee .track{display:inline-flex;gap:0;animation:mq 34s linear infinite;will-change:transform}
.marquee:hover .track{animation-play-state:paused}
.marquee span{font-family:var(--serif);font-style:italic;font-weight:300;font-size:clamp(20px,3vw,34px);padding:0 34px;display:inline-flex;align-items:center;gap:34px}
.marquee span::after{content:"\271B";font-style:normal;font-size:.6em;color:var(--clay)}
@keyframes mq{to{transform:translateX(-50%)}}

/* ============================================================
   SECTIONS génériques
   ============================================================ */
section{position:relative}
.pad{padding:clamp(80px,12vh,160px) var(--pad)}
.wrapw{max-width:var(--maxw);margin:0 auto}
.kicker{display:flex;align-items:center;gap:14px;margin-bottom:40px}
.kicker .num{font-family:var(--serif);font-size:13px;color:var(--sage)}
.kicker .ln{flex:1;height:1px;background:var(--line)}

/* Manifeste / blocs */
.manifesto{background:var(--bone)}
.manifesto .big{font-family:var(--serif);font-weight:300;font-size:clamp(30px,5.2vw,76px);line-height:1.07;letter-spacing:-.02em;max-width:18ch}
.manifesto .big em{font-style:italic;color:var(--clay)}
.manifesto .grid2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,90px);margin-top:clamp(50px,8vh,100px);align-items:start}
.manifesto .grid2 p{font-size:clamp(15px,1.4vw,18px);line-height:1.65;color:var(--forest);max-width:46ch}
.manifesto .grid2 .stat{font-family:var(--serif);font-size:clamp(40px,7vw,92px);font-weight:300;line-height:1;color:var(--ink)}
.manifesto .grid2 .stat span{display:block;font-family:var(--sans);font-size:13px;letter-spacing:.02em;color:var(--sage-dk);margin-top:14px;max-width:24ch}
.manifesto .statrow{display:flex;gap:clamp(30px,6vw,80px);flex-wrap:wrap}
@media(max-width:780px){.manifesto .grid2{grid-template-columns:1fr}}

/* Villages / liste de liens */
.villages{background:var(--forest);color:var(--bone)}
.villages .eyebrow{color:var(--clay-soft)}
.villages .kicker .ln{background:rgba(255,255,255,.18)}
.villages h2{font-family:var(--serif);font-weight:300;font-size:clamp(34px,6vw,86px);line-height:1;letter-spacing:-.02em;max-width:14ch}
.vlist{margin-top:clamp(40px,7vh,80px);border-top:1px solid rgba(255,255,255,.16)}
.vrow{display:grid;grid-template-columns:.5fr 1.4fr 1fr auto;gap:24px;align-items:center;padding:clamp(26px,4vh,46px) 0;border-bottom:1px solid rgba(255,255,255,.16);position:relative;transition:padding-left .5s var(--ease)}
.vrow:hover{padding-left:18px}
.vrow .vidx{font-family:var(--serif);font-size:14px;color:var(--sage)}
.vrow h3{font-family:var(--serif);font-weight:300;font-size:clamp(28px,4.4vw,58px);letter-spacing:-.01em;line-height:1}
.vrow .vdept{font-size:13px;color:var(--stone);letter-spacing:.02em}
.vrow .vtags{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.vrow .vtags em{font-style:normal;font-size:11px;letter-spacing:.08em;text-transform:uppercase;border:1px solid rgba(255,255,255,.25);border-radius:30px;padding:6px 12px;color:var(--bone)}
.vrow .vtags em.lead{background:var(--clay-soft);border-color:var(--clay-soft);color:var(--bone);font-weight:500}
.vrow .arrow{font-size:22px;color:var(--clay-soft);transition:transform .5s var(--ease)}
.vrow:hover .arrow{transform:translateX(8px)}
.vrow .glow{position:absolute;inset:0;background:linear-gradient(90deg,rgba(182,94,60,.18),transparent 60%);opacity:0;transition:opacity .5s var(--ease);pointer-events:none}
.vrow:hover .glow{opacity:1}
@media(max-width:780px){.vrow{grid-template-columns:auto 1fr;row-gap:8px}.vrow .vtags{grid-column:1/-1;justify-content:flex-start}.vrow .arrow{display:none}}

/* Offres / grille de cartes */
.offres{background:var(--bone-2)}
.offres h2{font-family:var(--serif);font-weight:300;font-size:clamp(32px,5.5vw,76px);line-height:1.02;letter-spacing:-.02em;max-width:16ch;margin-bottom:18px}
.offres .lead{max-width:52ch;color:var(--forest);font-size:clamp(15px,1.4vw,18px);line-height:1.6}
.ogrid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:clamp(46px,7vh,80px);background:var(--line);border:1px solid var(--line)}
.ocard{background:var(--bone);padding:clamp(28px,3vw,44px);min-height:300px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;transition:background .5s var(--ease)}
.ocard .on{font-family:var(--serif);font-size:13px;color:var(--sage)}
.ocard .oicon{width:46px;height:46px;margin:18px 0 auto;color:var(--clay);transition:transform .6s var(--ease)}
.ocard:hover .oicon{transform:translateY(-6px) rotate(-4deg)}
.ocard h3{font-family:var(--serif);font-weight:400;font-size:clamp(22px,2.4vw,30px);letter-spacing:-.01em;margin-top:24px;transition:color .4s var(--ease)}
.ocard p{font-size:14px;line-height:1.55;color:var(--forest);margin-top:10px;max-width:34ch}
.ocard .fill{position:absolute;inset:0;background:var(--forest);transform:translateY(101%);transition:transform .6s var(--ease);z-index:0}
.ocard:hover{color:var(--bone)}
.ocard:hover .fill{transform:none}
.ocard:hover h3,.ocard:hover .on{color:var(--bone)}
.ocard:hover p{color:var(--stone)}
.ocard:hover .oicon{color:var(--clay-soft)}
.ocard>*{position:relative;z-index:1}
@media(max-width:860px){.ogrid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.ogrid{grid-template-columns:1fr}}

/* Philosophie */
.philo{background:var(--ink);color:var(--bone);overflow:hidden}
.philo .eyebrow{color:var(--clay-soft)}
.philo h2{font-family:var(--serif);font-weight:300;font-size:clamp(30px,5vw,68px);line-height:1.05;letter-spacing:-.02em;max-width:20ch;margin-bottom:clamp(40px,6vh,70px)}
.philo h2 em{font-style:italic;color:var(--clay-soft)}
.pairs{display:flex;flex-direction:column}
.pair{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;padding:clamp(16px,2.4vh,26px) 0;border-top:1px solid rgba(255,255,255,.14);font-family:var(--serif);font-weight:300;font-size:clamp(24px,4.6vw,58px);line-height:1.05;letter-spacing:-.01em;transition:opacity .5s var(--ease)}
.pair .yes{color:var(--bone)}
.pair .conn{font-family:var(--sans);font-size:clamp(12px,1.1vw,15px);letter-spacing:.06em;color:var(--sage);font-weight:400;align-self:center}
.pair .no{color:var(--sage);font-style:italic;opacity:.7}
.pairs:hover .pair{opacity:.4}
.pairs .pair:hover{opacity:1}
.pairs .pair:hover .no{color:var(--clay-soft);opacity:.9}

/* Territoire (bloc visuel) */
.terr{background:var(--bone)}
.terr-in{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(40px,6vw,90px);align-items:center}
.terr h2{font-family:var(--serif);font-weight:300;font-size:clamp(30px,4.8vw,66px);line-height:1.06;letter-spacing:-.02em;max-width:15ch}
.terr p{margin-top:26px;max-width:48ch;color:var(--forest);font-size:clamp(15px,1.4vw,18px);line-height:1.65}
.terr .marks{margin-top:34px;display:flex;flex-wrap:wrap;gap:10px}
.terr .marks em{font-style:normal;font-size:12px;letter-spacing:.06em;text-transform:uppercase;border:1px solid var(--line);border-radius:30px;padding:8px 14px;color:var(--ink)}
.terr-art{aspect-ratio:4/5;border-radius:6px;overflow:hidden;background:var(--forest);position:relative}
.terr-art svg{position:absolute;inset:0;width:100%;height:100%}
@media(max-width:820px){.terr-in{grid-template-columns:1fr}.terr-art{aspect-ratio:16/10}}

/* Agenda / événements */
.agenda{background:var(--stone)}
.agenda h2{font-family:var(--serif);font-weight:300;font-size:clamp(30px,5vw,72px);line-height:1;letter-spacing:-.02em;margin-bottom:14px}
.agenda .lead{max-width:46ch;color:var(--forest);font-size:16px;line-height:1.6}
.events{margin-top:clamp(40px,6vh,70px)}
.ev{display:grid;grid-template-columns:auto 1.6fr 1fr auto;gap:24px;align-items:center;padding:clamp(22px,3.4vh,38px) 0;border-top:1px solid rgba(27,26,22,.2);transition:padding-left .5s var(--ease)}
.ev:last-child{border-bottom:1px solid rgba(27,26,22,.2)}
.ev:hover{padding-left:14px}
.ev .date{font-family:var(--serif);font-size:clamp(15px,1.4vw,18px);min-width:90px}
.ev .date span{display:block;font-family:var(--sans);font-size:12px;color:var(--sage-dk);letter-spacing:.05em}
.ev h3{font-family:var(--serif);font-weight:400;font-size:clamp(20px,2.6vw,32px);letter-spacing:-.01em}
.ev .place{font-size:13px;color:var(--forest);letter-spacing:.02em}
.ev .ar{color:var(--clay);font-size:20px;transition:transform .5s var(--ease)}
.ev:hover .ar{transform:translate(6px,-6px)}
@media(max-width:780px){.ev{grid-template-columns:auto 1fr}.ev .place,.ev .ar{display:none}}

/* CTA */
.bigcta{background:var(--clay);color:var(--bone);text-align:center}
.bigcta .pad{padding-top:clamp(70px,11vh,130px);padding-bottom:clamp(70px,11vh,130px)}
.bigcta p.eye{color:rgba(255,255,255,.85);letter-spacing:.3em;text-transform:uppercase;font-size:12px;margin-bottom:24px}
.bigcta h2{font-family:var(--serif);font-weight:300;font-size:clamp(38px,8vw,124px);line-height:.95;letter-spacing:-.03em}
.bigcta h2 em{font-style:italic}
.btn{display:inline-flex;align-items:center;gap:12px;margin-top:42px;background:var(--bone);color:var(--ink);border-radius:40px;padding:18px 34px;font-size:15px;letter-spacing:.02em;font-weight:500;position:relative;overflow:hidden;transition:transform .4s var(--ease)}
.btn .lbl{position:relative;z-index:2;transition:color .45s var(--ease)}
.btn .swell{position:absolute;inset:0;background:var(--ink);border-radius:50%;transform:scale(0);transform-origin:center;transition:transform .55s var(--ease);z-index:1}
.btn:hover .swell{transform:scale(2.2)}
.btn:hover .lbl{color:var(--bone)}
.magnetic{will-change:transform}

/* Footer */
footer{background:var(--forest);color:var(--bone)}
.foot{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:clamp(34px,5vw,70px);padding:clamp(70px,9vh,110px) var(--pad) 40px;max-width:var(--maxw);margin:0 auto}
.foot .fbrand{font-family:var(--serif);font-weight:300;font-size:clamp(40px,7vw,92px);line-height:.9;letter-spacing:-.02em}
.foot .fbrand b{color:var(--clay-soft);font-weight:300}
.foot .fbrand p{font-family:var(--sans);font-size:14px;color:var(--stone);max-width:34ch;margin-top:24px;line-height:1.6}
.foot h4{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--sage);margin-bottom:20px}
.foot ul{list-style:none;display:flex;flex-direction:column;gap:12px}
.foot ul a,.foot address{font-size:15px;font-style:normal;line-height:1.6;color:var(--bone);opacity:.92;transition:color .3s,opacity .3s}
.foot address b{font-family:var(--serif);font-weight:500;color:var(--bone)}
.foot address a{color:var(--bone)}.foot address a:hover{color:var(--clay-soft)}
.foot .fhours{display:block;color:var(--stone);font-size:13px;margin-top:5px}
.foot ul a:hover{color:var(--clay-soft);opacity:1}
.foot .news{display:flex;border:1px solid rgba(255,255,255,.25);border-radius:40px;overflow:hidden;margin-top:8px;max-width:320px}
.foot .news input{flex:1;background:none;border:none;outline:none;color:var(--bone);padding:13px 18px;font-family:var(--sans);font-size:14px}
.foot .news input::placeholder{color:var(--stone)}
.foot .news button{background:var(--clay);border:none;color:var(--bone);padding:0 22px;font-family:var(--sans);font-size:18px;cursor:pointer}
.foot-bot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;padding:24px var(--pad);border-top:1px solid rgba(255,255,255,.16);font-size:12px;color:var(--stone);letter-spacing:.02em;max-width:var(--maxw);margin:0 auto}
.foot-bot a{color:var(--stone)}.foot-bot a:hover{color:var(--clay-soft)}
@media(max-width:820px){.foot{grid-template-columns:1fr 1fr}.foot .fbrand{grid-column:1/-1}}
@media(max-width:520px){.foot{grid-template-columns:1fr}}

/* mobile menu */
.mobnav{position:fixed;inset:0;z-index:950;background:var(--forest);color:var(--bone);display:flex;flex-direction:column;justify-content:center;gap:8px;padding:var(--pad);transform:translateY(-100%);visibility:hidden;pointer-events:none;transition:transform .7s var(--ease),visibility 0s linear .7s}
.mobnav.open{transform:none;visibility:visible;pointer-events:auto;transition:transform .7s var(--ease),visibility 0s}
.mobnav a{font-family:var(--serif);font-weight:300;font-size:clamp(30px,8vw,54px);letter-spacing:-.02em}
.mobnav a.active{color:var(--clay-soft)}
.mobnav .close{position:absolute;top:22px;right:var(--pad);font-size:14px;letter-spacing:.1em;text-transform:uppercase;background:none;border:none;color:inherit;font-family:var(--sans);cursor:pointer}

/* ============================================================
   PAGES INTERNES — composants ajoutés
   ============================================================ */

/* En-tête de page interne (sous la nav fixe) */
.phead{padding:clamp(120px,18vh,200px) var(--pad) clamp(40px,7vh,80px);max-width:var(--maxw);margin:0 auto}
.phead.on-dark{color:var(--bone)}
.phead h1{font-family:var(--serif);font-weight:300;font-size:clamp(40px,7.5vw,104px);line-height:.92;letter-spacing:-.03em;margin:10px 0 22px}
.phead h1 em{font-style:italic;color:var(--clay)}
.phead .lead{max-width:60ch;font-size:clamp(16px,1.6vw,21px);line-height:1.6;color:var(--forest)}
.phead.on-dark .lead{color:var(--stone)}
.bg-forest{background:var(--forest);color:var(--bone)}
.bg-ink{background:var(--ink);color:var(--bone)}
.bg-bone2{background:var(--bone-2)}

/* Fil d'Ariane */
.crumbs{max-width:var(--maxw);margin:0 auto;padding:96px var(--pad) 0;font-size:12.5px;letter-spacing:.04em;color:var(--sage-dk)}
.crumbs.on-dark{color:var(--stone)}
.crumbs a{color:inherit;border-bottom:1px solid transparent;transition:border-color .3s}
.crumbs a:hover{border-color:currentColor}
.crumbs span{margin:0 8px;opacity:.5}

/* Bandeau de faits / chips */
.factstrip{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.factstrip em{font-style:normal;font-size:12px;letter-spacing:.06em;text-transform:uppercase;border:1px solid var(--line);border-radius:30px;padding:8px 14px;color:var(--ink)}
.on-dark .factstrip em{border-color:rgba(255,255,255,.28);color:var(--bone)}

/* Boutons utilitaires */
.btn-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}
.btn-ghost{display:inline-flex;align-items:center;gap:9px;border:1px solid currentColor;border-radius:40px;padding:13px 24px;font-size:14px;font-weight:500;letter-spacing:.01em;transition:background .35s var(--ease),color .35s var(--ease)}
.btn-solid{background:var(--clay);color:var(--bone);border-color:var(--clay)}
.btn-solid:hover{background:var(--clay-soft);border-color:var(--clay-soft)}
.btn-ghost:hover{background:var(--ink);color:var(--bone);border-color:var(--ink)}
.on-dark .btn-ghost:hover{background:var(--bone);color:var(--ink);border-color:var(--bone)}

/* Grille de contenu 2 colonnes (texte + carte d'info) */
.split{display:grid;grid-template-columns:1.3fr .9fr;gap:clamp(34px,5vw,72px);align-items:start;max-width:var(--maxw);margin:0 auto}
@media(max-width:880px){.split{grid-template-columns:1fr}}

/* Carte d'infos pratiques / horaires */
.infocard{background:var(--bone);border:1px solid var(--line);border-radius:10px;padding:clamp(24px,3vw,38px)}
.bg-forest .infocard,.bg-ink .infocard{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.18);color:var(--bone)}
.infocard h3{font-family:var(--serif);font-weight:500;font-size:22px;margin-bottom:6px}
.infocard .addr{font-style:normal;line-height:1.7;color:var(--forest);font-size:15px}
.bg-forest .infocard .addr,.bg-ink .infocard .addr{color:var(--stone)}
.infocard .addr a{color:inherit;border-bottom:1px solid var(--line)}
.hours{list-style:none;margin:18px 0 0;border-top:1px solid var(--line)}
.bg-forest .hours,.bg-ink .hours{border-color:rgba(255,255,255,.18)}
.hours li{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid var(--line);font-size:14px}
.bg-forest .hours li,.bg-ink .hours li{border-color:rgba(255,255,255,.12)}
.hours li b{font-weight:500}
.hours li span{color:var(--sage-dk)}
.bg-forest .hours li span,.bg-ink .hours li span{color:var(--stone)}

/* Prose (articles, pages texte) */
.prose{max-width:72ch;margin:0 auto;font-size:clamp(16px,1.45vw,18px);line-height:1.75;color:var(--forest)}
.prose.wide{max-width:var(--maxw)}
.prose h2{font-family:var(--serif);font-weight:400;font-size:clamp(26px,3.4vw,40px);line-height:1.15;letter-spacing:-.01em;color:var(--ink);margin:48px 0 16px}
.prose h3{font-family:var(--serif);font-weight:500;font-size:clamp(20px,2.4vw,26px);color:var(--ink);margin:34px 0 12px}
.prose p{margin:0 0 18px}
.prose a{color:var(--clay);border-bottom:1px solid rgba(182,94,60,.4)}
.prose a:hover{border-color:var(--clay)}
.prose ul,.prose ol{margin:0 0 18px 22px}
.prose li{margin:0 0 9px}
.prose blockquote{margin:28px 0;padding:6px 0 6px 24px;border-left:3px solid var(--clay);font-family:var(--serif);font-style:italic;font-size:clamp(20px,2.6vw,28px);color:var(--ink);line-height:1.35}
.prose .lede{font-family:var(--serif);font-size:clamp(20px,2.4vw,27px);line-height:1.4;color:var(--ink);margin-bottom:30px}
.prose figure{margin:30px 0}
.prose figure img{width:100%;border-radius:8px}
.prose figcaption{font-size:13px;color:var(--sage-dk);margin-top:8px;text-align:center}

/* Grille de cartes simples (producteurs, rubriques, services) */
.cardgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:clamp(18px,2vw,26px);max-width:var(--maxw);margin:clamp(34px,5vh,60px) auto 0}
.card{background:var(--bone);border:1px solid var(--line);border-radius:10px;padding:clamp(22px,2.4vw,30px);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.bg-bone2 .card{background:var(--bone)}
.card:hover{transform:translateY(-5px);box-shadow:0 18px 40px -24px rgba(27,26,22,.45)}
.card .tag{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--clay);font-weight:600}
.card h3{font-family:var(--serif);font-weight:500;font-size:clamp(20px,2.2vw,25px);margin:10px 0 8px;letter-spacing:-.01em}
.card p{font-size:14.5px;line-height:1.6;color:var(--forest)}
.card .more{display:inline-block;margin-top:14px;font-size:13px;letter-spacing:.02em;color:var(--clay);border-bottom:1px solid rgba(182,94,60,.4)}
.card.is-link{cursor:pointer}

/* Cartes article (Journal) */
.postcard{display:flex;flex-direction:column;background:var(--bone);border:1px solid var(--line);border-radius:12px;overflow:hidden;transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.postcard:hover{transform:translateY(-6px);box-shadow:0 22px 48px -26px rgba(27,26,22,.5)}
.postcard .thumb{aspect-ratio:16/10;background:var(--forest);position:relative;overflow:hidden}
.postcard .thumb svg{position:absolute;inset:0;width:100%;height:100%}
.postcard .body{padding:22px 24px 26px}
.postcard .tag{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--clay);font-weight:600}
.postcard h3{font-family:var(--serif);font-weight:500;font-size:clamp(19px,2vw,24px);margin:9px 0 8px;line-height:1.2}
.postcard p{font-size:14px;line-height:1.6;color:var(--forest)}
.postcard .meta{font-size:12.5px;color:var(--sage-dk);margin-top:14px}

/* FAQ accordéon (details/summary) */
.faq{max-width:80ch;margin:clamp(30px,4vh,50px) auto 0}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:20px 0;font-family:var(--serif);font-size:clamp(18px,2vw,23px);font-weight:500;display:flex;justify-content:space-between;gap:18px;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--clay);font-size:24px;transition:transform .3s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq .ans{padding:0 0 22px;color:var(--forest);font-size:15.5px;line-height:1.7;max-width:70ch}

/* Carte de localisation (lien Maps illustré) */
.maptile{display:block;border-radius:10px;overflow:hidden;border:1px solid var(--line);background:var(--forest);aspect-ratio:16/9;position:relative}
.maptile svg{position:absolute;inset:0;width:100%;height:100%}
.maptile .pin{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;color:var(--bone);text-align:center;gap:8px}
.maptile .pin b{font-family:var(--serif);font-size:18px;font-weight:500}
.maptile .pin span{font-size:12px;letter-spacing:.14em;text-transform:uppercase;background:var(--clay);padding:7px 14px;border-radius:30px}

/* Bandeau d'avis Google */
.reviews{display:inline-flex;align-items:center;gap:14px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.2);border-radius:50px;padding:12px 22px;margin-top:26px}
.bg-bone2 .reviews,.manifesto .reviews{background:var(--bone);border-color:var(--line)}
.reviews .score{font-family:var(--serif);font-size:30px;font-weight:500;line-height:1}
.reviews .stars{color:var(--clay);letter-spacing:2px}
.reviews .txt{font-size:13px;line-height:1.4}
.reviews .txt b{font-weight:600}

/* Utilitaires */
.section-title{font-family:var(--serif);font-weight:300;font-size:clamp(28px,4.4vw,58px);line-height:1.05;letter-spacing:-.02em;max-width:20ch}
.muted{color:var(--sage-dk)}
.center{text-align:center}
.mt-s{margin-top:18px}.mt-m{margin-top:34px}.mt-l{margin-top:60px}
.note{font-size:13px;color:var(--sage-dk);background:rgba(140,147,126,.12);border:1px dashed var(--sage);border-radius:8px;padding:12px 16px;margin-top:18px}

/* ============================================================
   CARTE / MENU (page boissons) — pensée mobile / scan QR
   ============================================================ */
.menubar{position:sticky;top:0;z-index:900;background:rgba(239,232,218,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:13px var(--pad)}
.menubar .brand{font-family:var(--serif);font-size:20px;font-weight:500;letter-spacing:-.01em}
.menubar .brand b{color:var(--clay)}
.menubar .back{font-size:12.5px;color:var(--forest);border-bottom:1px solid var(--line);padding-bottom:1px}
.menubar .back:hover{color:var(--clay);border-color:var(--clay)}
.menuhead{max-width:840px;margin:0 auto;padding:clamp(96px,15vh,140px) var(--pad) 6px;text-align:center}
.menuhead .eyebrow{justify-content:center;display:block}
.menuhead h1{font-family:var(--serif);font-weight:300;font-size:clamp(40px,9vw,72px);letter-spacing:-.02em;line-height:1;margin-top:10px}
.menuhead p{color:var(--sage-dk);font-size:13.5px;margin-top:14px;max-width:48ch;margin-left:auto;margin-right:auto;line-height:1.5}
.chips{position:sticky;top:53px;z-index:850;display:flex;gap:8px;overflow-x:auto;padding:12px var(--pad);background:var(--bone);border-bottom:1px solid var(--line);-webkit-overflow-scrolling:touch;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chips a{flex:0 0 auto;font-size:12px;letter-spacing:.05em;text-transform:uppercase;border:1px solid var(--line);border-radius:30px;padding:8px 14px;color:var(--forest);background:var(--bone);white-space:nowrap;transition:background .3s,color .3s}
.chips a:hover{background:var(--forest);color:var(--bone);border-color:var(--forest)}
.menu{max-width:840px;margin:0 auto;padding:0 var(--pad) 40px}
.msec{padding:clamp(32px,5vh,54px) 0 6px;scroll-margin-top:108px}
.msec>.h{display:flex;align-items:baseline;gap:14px;border-bottom:2px solid var(--ink);padding-bottom:10px;margin-bottom:6px}
.msec>.h h2{font-family:var(--serif);font-weight:400;font-size:clamp(25px,5vw,38px);letter-spacing:-.01em;color:var(--ink)}
.msec>.h .hint{margin-left:auto;font-size:11.5px;color:var(--sage-dk);letter-spacing:.04em;white-space:nowrap}
.mgroup{margin-top:22px}
.mgroup .gl{font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--clay);font-weight:600;margin-bottom:3px}
.mgroup .gd{font-size:12.5px;color:var(--sage-dk);margin:0 0 8px;line-height:1.5}
.mitem{display:flex;align-items:baseline;gap:8px;padding:7px 0}
.mitem .nm{font-size:15.5px;color:var(--ink);line-height:1.35}
.mitem .nm small{display:block;color:var(--sage-dk);font-size:12.5px;margin-top:1px;line-height:1.4}
.mitem .dots{flex:1;border-bottom:1px dotted rgba(27,26,22,.3);align-self:flex-end;transform:translateY(-5px);min-width:16px}
.mitem .pr{font-family:var(--serif);font-size:15.5px;color:var(--clay);white-space:nowrap;font-variant-numeric:tabular-nums}
.mitem .pr em{font-style:normal;color:var(--sage-dk);font-size:13px}
.mnote{font-size:12.5px;color:var(--sage-dk);margin-top:10px;line-height:1.5}
.menu .legal{margin:34px 0 0;padding:14px 16px;border:1px solid var(--line);border-radius:8px;font-size:12px;color:var(--sage-dk);text-align:center;line-height:1.5}
.mfoot{max-width:840px;margin:0 auto;padding:30px var(--pad) 60px;text-align:center;font-size:13px;color:var(--sage-dk)}
.mfoot a{color:var(--clay);border-bottom:1px solid rgba(182,94,60,.4)}
.mfoot .lieux{margin-top:10px;font-size:12.5px;line-height:1.6}
