:root{
  --sapin:#002629;
  --sauge:#719571;            /* decor : taches, bordures, survols */
  --sauge-fonce:#3F5A41;      /* vert du TEXTE sur fond clair (6,4:1) */
  --sauge-bande:#8FAE8E;      /* vert des BANDES pleines (6,58:1 avec le sapin) */
  --safran:#FBC04A;
  --creme:#F3EDD3;
  --creme-deep:#E8E0C4;
  --ink:#16201d;
  --braise:#C2612B;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:5rem}
body{
  font-family:'Outfit',system-ui,sans-serif;
  color:var(--ink);
  background:var(--creme);
  line-height:1.62;
  font-weight:300;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{font-family:'Fraunces',Georgia,serif;font-weight:500;line-height:1.1;letter-spacing:-0.018em}
img{max-width:100%;height:auto;display:block}
::selection{background:var(--safran);color:var(--sapin)}
a{color:inherit}

/* ---------- grain : la texture papier qui casse le lisse ---------- */
body::after{
  content:"";position:fixed;inset:0;z-index:999;pointer-events:none;
  opacity:.055;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- nav ---------- */
/* la barre du haut : « body > nav » et pas « nav », pour ne pas attraper
   le fil d Ariane des sous-pages, qui est lui aussi un <nav> */
body > nav{
  position:fixed;top:0;left:0;right:0;z-index:60;
  display:flex;align-items:center;justify-content:space-between;
  padding:.95rem clamp(1.1rem,4vw,3.5rem);
  background:rgba(243,237,211,.9);
  backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(0,38,41,.08);
}
.brand{
  display:flex;align-items:center;gap:.65rem;text-decoration:none;
  font-family:'Fraunces',serif;font-weight:600;font-size:1rem;
  color:var(--sapin);letter-spacing:-.01em;line-height:1.15;
}
.brand img{height:42px;width:auto;display:block;flex:none}
.brand em{color:var(--sauge-fonce);display:block;font-size:.72rem;font-weight:400;font-style:normal;letter-spacing:.04em;opacity:1}
@media (max-width:520px){.brand em{display:none}.brand{font-size:.92rem}}
.nav-links{display:flex;gap:1.5rem;align-items:center}
.nav-links a{color:var(--sapin);text-decoration:none;font-size:.88rem;opacity:.72;white-space:nowrap;transition:opacity .2s}
.nav-links a:hover{opacity:1}
.nav-cta{
  background:var(--sapin);color:var(--creme)!important;opacity:1!important;
  padding:.52rem 1.05rem;border-radius:1.6rem .4rem 1.6rem .4rem;font-weight:500;
  transition:background .2s,transform .2s;
}
.nav-cta:hover{background:#0a3d3f;transform:rotate(-.8deg)}
.nav-second{
  display:inline-flex;align-items:center;gap:.3rem;
  border:1px solid rgba(0,38,41,.28);opacity:1!important;
  padding:.5rem 1rem;border-radius:.4rem 1.6rem .4rem 1.6rem;font-weight:400;
  transition:border-color .2s,background .2s;
}
.nav-second:hover{border-color:var(--sauge);background:rgba(113,149,113,.12)}
.nav-second span{font-size:.78em;opacity:.7}
.nav-second .nav-icone{width:22px;height:24px;margin-right:.15rem;flex:none}
.nav-toggle{display:none;background:none;border:0;color:var(--sapin);cursor:pointer;padding:.3rem}

/* ---------- primitives ---------- */
.wrap{max-width:1120px;margin:0 auto;padding:0 clamp(1.2rem,5vw,2.5rem)}
.wrap-narrow{max-width:760px}
section{position:relative}
.eyebrow{
  display:inline-flex;align-items:center;gap:.6rem;
  font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;
  font-weight:500;color:var(--sauge-fonce);margin-bottom:1.1rem;
}
.eyebrow::before{content:"";width:26px;height:1px;background:currentColor;opacity:.6}
.lead{font-size:clamp(1.05rem,2vw,1.22rem);max-width:60ch;opacity:.88}

.btn-primary{
  display:inline-flex;align-items:center;gap:.55rem;
  background:var(--sapin);color:var(--creme);text-decoration:none;
  padding:.92rem 1.6rem;border-radius:1.8rem .5rem 1.8rem .5rem;
  font-weight:500;font-size:.97rem;border:0;cursor:pointer;
  font-family:inherit;transition:background .2s,transform .2s;
}
.btn-primary:hover{background:#0a3d3f;transform:translateY(-2px) rotate(-.5deg)}
.btn-ghost{
  display:inline-flex;align-items:center;gap:.5rem;
  color:var(--sapin);text-decoration:none;font-weight:400;font-size:.97rem;
  padding:.92rem .4rem;border-bottom:1.5px solid rgba(0,38,41,.28);
  transition:border-color .2s;
}
.btn-ghost:hover{border-color:var(--sapin)}
.btn-outline{
  display:inline-flex;align-items:center;gap:.55rem;
  border:1.5px solid currentColor;padding:.85rem 1.6rem;
  border-radius:.5rem 1.8rem .5rem 1.8rem;text-decoration:none;font-weight:500;font-size:.95rem;
  transition:background .2s,transform .2s;
}
.btn-outline:hover{transform:rotate(.6deg)}

.reveal{opacity:0;transform:translateY(14px);transition:opacity .35s ease,transform .35s ease}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}
}

/* déchirure de papier entre sections */
.tear{display:block;width:100%;height:38px}

/* ---------- hero ---------- */
.hero{
  padding:clamp(8rem,15vw,11rem) 0 clamp(3.5rem,7vw,5rem);
  background:var(--creme);
  position:relative;overflow:hidden;
}
.hero::before{ /* tache de peinture organique, pas un dégradé */
  content:"";position:absolute;top:-14%;right:-16%;width:min(58vw,640px);aspect-ratio:1.15;
  background:var(--sauge);opacity:.15;
  border-radius:58% 42% 39% 61% / 47% 55% 45% 53%;
  transform:rotate(-11deg);
}
.hero::after{
  content:"";position:absolute;bottom:-22%;left:-12%;width:min(40vw,420px);aspect-ratio:1;
  background:var(--safran);opacity:.13;
  border-radius:44% 56% 62% 38% / 58% 41% 59% 42%;
  transform:rotate(17deg);
}
.hero-inner{position:relative;z-index:2;max-width:930px}
.hero h1{font-size:clamp(2rem,5.4vw,3.65rem);color:var(--sapin);max-width:19ch}
.hero h1 .turn{
  display:block;margin-top:.4rem;font-style:italic;font-weight:400;
  max-width:24ch;
}
.hero h1 .ember{position:relative;white-space:nowrap}
.hero h1 .ember svg{position:absolute;left:-3%;bottom:-.3em;width:106%;height:.46em;overflow:visible}
.hero-sub{
  margin-top:1.7rem;font-size:clamp(1.05rem,2.1vw,1.26rem);
  max-width:56ch;color:var(--sapin);opacity:.85;
}
.hero-fait{font-size:clamp(1.02rem,1.6vw,1.18rem);font-weight:500;color:var(--sapin);max-width:52ch;margin:1.1rem 0 .6rem;line-height:1.5}
.maison .fait{font-weight:500;color:var(--sapin)}
.hero-actions{display:flex;flex-wrap:wrap;gap:.9rem 1.5rem;align-items:center;margin-top:2.3rem}
.badges{
  display:flex;flex-wrap:wrap;gap:.5rem .8rem;margin-top:2.9rem;
  font-size:.82rem;color:var(--sapin);opacity:.72;
}
.badges span{
  border:1px solid rgba(0,38,41,.2);padding:.34rem .82rem;
  border-radius:1.2rem .3rem 1.2rem .3rem;
}
.badges span:nth-child(2){border-radius:.3rem 1.2rem .3rem 1.2rem}

/* avant / après, volontairement décalé */
.bascule{
  display:flex;flex-wrap:wrap;gap:1.4rem;margin-top:1.6rem;
  align-items:flex-start;position:relative;z-index:2;
}
.bascule > div{
  flex:1 1 260px;padding:1.4rem 1.5rem;
  background:rgba(0,38,41,.045);
  border-left:2px solid rgba(0,38,41,.16);
  border-radius:.3rem 1.4rem .5rem 1.2rem;
}
.bascule > div:last-child{
  margin-top:2.2rem;background:var(--sapin);color:var(--creme);
  border-left-color:var(--safran);
  border-radius:1.2rem .4rem 1.4rem .3rem;
}
.bascule strong{
  display:block;font-family:'Fraunces',serif;font-size:.78rem;
  letter-spacing:.16em;text-transform:uppercase;font-weight:600;
  margin-bottom:.5rem;opacity:.6;
}
.bascule > div:last-child strong{color:var(--safran);opacity:1}
.bascule p{font-size:1.02rem;line-height:1.5}

/* ---------- terrain ---------- */
.terrain{background:var(--creme-deep);padding:clamp(4rem,9vw,6.5rem) 0}
.terrain h2{font-size:clamp(1.75rem,4vw,2.75rem);color:var(--sapin);margin:.2rem 0 1.4rem;max-width:17ch}

/* la grille cassée : colonnes de hauteurs et de rotations différentes */
/* six constats en grille : lecture ligne par ligne (01 02 03 / 04 05 06), cartes alignées */
.constats{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;margin-top:3rem}
.constat{
  background:var(--creme);padding:1.5rem 1.5rem 1.6rem;
  border:1px solid rgba(0,38,41,.09);
  position:relative;
}
.constat:nth-child(6n+1){border-radius:1.6rem .4rem 1.4rem .5rem}
.constat:nth-child(6n+2){border-radius:.4rem 1.5rem .4rem 1.7rem}
.constat:nth-child(6n+3){border-radius:1.2rem 1.2rem .35rem 1.4rem}
.constat:nth-child(6n+4){border-radius:.35rem 1.3rem 1.5rem .4rem}
.constat:nth-child(6n+5){border-radius:1.7rem .45rem .5rem 1.3rem}
.constat:nth-child(6n+6){border-radius:.5rem 1.4rem 1.2rem .4rem}
.constat-num{
  font-family:'Fraunces',serif;font-size:1.9rem;font-weight:600;
  color:var(--sauge-fonce);opacity:.8;line-height:1;display:block;margin-bottom:.55rem;
}
.constat p{font-size:1rem;color:var(--sapin);line-height:1.52}
.whisper{
  margin-top:3.2rem;font-family:'Fraunces',serif;font-weight:600;
  font-size:clamp(1.3rem,3.2vw,2rem);color:var(--sapin);
  max-width:26ch;line-height:1.22;
}
/* le chef et la phrase côte à côte, pour raccourcir le défilement */
.feu-duo{
  display:flex;align-items:center;gap:clamp(1.5rem,4vw,3.5rem);
  margin-top:clamp(2rem,4vw,3rem);
}
.feu-duo .dessin-feu{flex:none;max-width:260px;margin:0}
.feu-duo .whisper{margin-top:0;max-width:22ch}
@media (max-width:720px){
  .feu-duo{flex-direction:column;align-items:flex-start;gap:1.2rem}
  .feu-duo .dessin-feu{max-width:200px}
}

/* ---------- la question signature ---------- */
.question{background:var(--sapin);color:var(--creme);padding:clamp(4.5rem,10vw,7rem) 0;overflow:hidden}
.question::before{
  content:"";position:absolute;top:-10%;left:-8%;width:min(46vw,460px);aspect-ratio:1.2;
  background:var(--sauge);opacity:.16;
  border-radius:63% 37% 48% 52% / 41% 60% 40% 59%;
  transform:rotate(23deg);
}
.question .wrap{position:relative;z-index:2}
.question .eyebrow{color:var(--safran)}
.question h2{font-size:clamp(1.9rem,4.6vw,3.1rem);color:var(--creme);max-width:16ch;margin-bottom:1.8rem}
.question h2 em{color:var(--safran);font-style:italic}
.question-body{max-width:56ch;font-size:1.06rem;opacity:.9}
.question-body p{margin-bottom:1.05rem}
.question-body p:last-child{margin-bottom:0}
.question-body b{color:var(--safran);font-weight:500}
.pull{
  margin:2.8rem 0 1.2rem;max-width:44ch;
  padding:1.9rem 2rem;
  border:1.5px solid rgba(251,192,74,.45);
  border-radius:2rem .5rem 2.2rem .6rem;
  font-family:'Fraunces',serif;font-style:italic;font-weight:500;
  font-size:clamp(1.2rem,2.9vw,1.72rem);line-height:1.34;color:var(--safran);
}
.pull-note{font-size:.94rem;opacity:.72;max-width:48ch;line-height:1.55}

/* ---------- approche ---------- */
.approche{padding:clamp(4rem,9vw,6.5rem) 0;background:var(--creme)}
.approche h2{font-size:clamp(1.75rem,4vw,2.7rem);color:var(--sapin);max-width:18ch;margin-bottom:.9rem}
.postures{margin-top:2.8rem;display:flex;flex-direction:column;gap:2.1rem}
.posture{display:flex;gap:1.5rem;align-items:flex-start;max-width:70ch}
.posture:nth-child(2){margin-left:auto;margin-right:0;flex-direction:row-reverse}
.posture:nth-child(3){margin-left:clamp(0rem,5vw,4rem)}
.posture-mark{
  font-family:'Fraunces',serif;font-style:italic;font-size:1.02rem;
  color:var(--sauge-fonce);white-space:nowrap;padding-top:.28rem;min-width:5.5rem;
}
/* un repere plus long que « Devant, » : il respire au lieu de forcer la colonne */
.posture-mark.long{white-space:normal;min-width:7.5rem;max-width:9rem;line-height:1.28}
@media (max-width:620px){
  /* sur téléphone, le repère passe au-dessus du titre au lieu de se serrer à côté */
  .posture{flex-direction:column!important;gap:.25rem}
  .posture-mark,.posture-mark.long{min-width:0;max-width:none;white-space:normal;padding-top:0}
}
.posture h3{font-size:1.28rem;color:var(--sapin);margin-bottom:.5rem}
.posture p{font-size:1rem;color:var(--sapin);opacity:.88}
.posture strong{font-weight:500;opacity:1;color:var(--sapin)}

/* CAP, en escalier */
.cap{margin-top:3.4rem;max-width:68ch}
.cap h3{font-size:1.35rem;color:var(--sapin);margin-bottom:.4rem}
.cap-intro{font-size:.99rem;opacity:.82;margin-bottom:1.7rem;max-width:56ch}
.cap-step{padding:.2rem 0 .2rem 1.15rem;border-left:2px solid var(--sauge);margin-bottom:1.25rem}
.cap-step:nth-child(4){margin-left:1.7rem}
.cap-step:nth-child(5){margin-left:3.4rem}
.cap-step b{font-family:'Fraunces',serif;font-weight:600;color:var(--sapin);font-size:1.04rem}
.cap-step p{font-size:.98rem;opacity:.85;margin-top:.15rem}

/* protocole coup de feu */
.protocole{
  margin-top:3.6rem;background:var(--sapin);color:var(--creme);
  padding:clamp(1.8rem,4vw,2.8rem);
  border-radius:2.2rem .6rem 2.4rem .5rem;
}
.protocole .eyebrow{color:var(--safran)}
.protocole h3{color:var(--creme);font-size:clamp(1.3rem,2.8vw,1.75rem);margin-bottom:.7rem;max-width:22ch}
.protocole .intro{font-size:.99rem;opacity:.85;max-width:54ch;margin-bottom:1.9rem}
.etapes{display:flex;flex-wrap:wrap;gap:1.5rem}
.etape{flex:1 1 250px;min-width:230px}
.etape:nth-child(2){padding-top:1.1rem}
.etape:nth-child(3){padding-top:2.2rem}
.etape span{
  font-family:'Fraunces',serif;font-size:.72rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--safran);display:block;margin-bottom:.45rem;
}
.etape b{display:block;font-family:'Fraunces',serif;font-size:1.12rem;font-weight:500;margin-bottom:.4rem}
.etape p{font-size:.95rem;opacity:.86;line-height:1.55}
.protocole .chute{
  margin-top:2.1rem;padding-top:1.3rem;border-top:1px solid rgba(243,237,211,.2);
  font-family:'Fraunces',serif;font-style:italic;font-size:1.1rem;color:var(--safran);max-width:44ch;
}
.protocole .source{margin-top:.9rem;font-size:.79rem;opacity:.55;max-width:56ch;line-height:1.5}
.rapport{
  margin-top:3.2rem;max-width:56ch;
  font-family:'Fraunces',serif;font-size:clamp(1.12rem,2.4vw,1.45rem);
  line-height:1.4;color:var(--sapin);
}

/* ---------- balades ---------- */
.balades{background:var(--creme);padding:clamp(4rem,9vw,6.5rem) 0}
.balades h2{font-size:clamp(1.75rem,4vw,2.7rem);color:var(--sapin);margin-bottom:.9rem}
.cards{display:flex;flex-wrap:wrap;gap:1.7rem;margin-top:2.8rem;align-items:flex-start}
.card{
  flex:1 1 300px;background:var(--creme);padding:1.9rem 1.8rem 2rem;
  border:1px solid rgba(0,38,41,.1);
  border-radius:1.8rem .5rem 2rem .45rem;
}
.card.feature{
  background:var(--sapin);color:var(--creme);border-color:var(--sapin);
  margin-top:1.7rem;
  border-radius:.5rem 2rem .45rem 1.9rem;
}
.card-tag{
  font-size:.72rem;letter-spacing:.15em;text-transform:uppercase;
  color:var(--sauge-fonce);font-weight:500;margin-bottom:.7rem;
}
.card.feature .card-tag{color:var(--safran)}
.card h3{font-size:1.55rem;color:var(--sapin);margin-bottom:.35rem}
.card .fait{font-size:.95rem;font-weight:500;color:var(--sapin);margin-bottom:.6rem;opacity:.85}
.card.feature .fait{color:var(--creme)}
.card.feature h3{color:var(--creme)}
.promise{font-size:1rem;opacity:.85;margin-bottom:1.4rem}
.meta{
  display:flex;align-items:baseline;gap:.8rem;flex-wrap:wrap;
  padding-top:1.1rem;border-top:1px solid rgba(0,38,41,.13);
  font-size:.9rem;opacity:.8;
}
.card.feature .meta{border-top-color:rgba(243,237,211,.22)}
.price{font-family:'Fraunces',serif;font-size:1.85rem;font-weight:600;color:var(--sapin);opacity:1}
.card.feature .price{color:var(--safran)}
.serment{
  margin-top:3rem;font-family:'Fraunces',serif;font-style:italic;
  font-size:clamp(1.15rem,2.6vw,1.5rem);color:var(--sapin);max-width:34ch;
}

/* ---------- maison ---------- */
.maison{background:var(--sauge-bande);color:var(--sapin);padding:clamp(4rem,9vw,6rem) 0}
.maison .eyebrow{color:var(--sapin);opacity:1}
.maison h2{font-size:clamp(1.7rem,3.8vw,2.5rem);max-width:20ch;margin-bottom:1.3rem}
.maison p{max-width:58ch;font-size:1.04rem;margin-bottom:1rem}
.maison .punch{
  font-family:'Fraunces',serif;font-weight:600;font-size:clamp(1.2rem,2.8vw,1.6rem);
  margin:1.9rem 0 1.9rem;max-width:26ch;line-height:1.3;
}
.tripartite{
  display:flex;flex-wrap:wrap;gap:1.2rem;margin:1.9rem 0 2.2rem;
}
.tripartite div{
  flex:1 1 210px;background:rgba(243,237,211,.34);
  padding:1.1rem 1.2rem;font-size:.95rem;line-height:1.5;
  border-radius:1.3rem .35rem 1.2rem .4rem;
}
.tripartite div:nth-child(2){margin-top:1rem;border-radius:.35rem 1.3rem .4rem 1.2rem}
.tripartite div:nth-child(3){margin-top:.4rem}
.tripartite b{display:block;font-family:'Fraunces',serif;font-weight:600;margin-bottom:.25rem}

/* ---------- parcours ---------- */
.parcours{background:var(--creme);padding:clamp(4rem,9vw,6.5rem) 0}
.parcours-grid{display:grid;grid-template-columns:1.32fr .68fr;gap:clamp(2rem,5vw,4rem);align-items:start;margin-top:1.8rem}
.parcours-text{max-width:66ch}
.parcours-text p{font-size:1.06rem;color:var(--sapin);margin-bottom:1.25rem;line-height:1.6;opacity:.9}
.parcours-text .frappe{
  font-family:'Fraunces',serif;font-weight:600;font-size:clamp(1.22rem,2.7vw,1.62rem);
  line-height:1.3;opacity:1;margin:1.9rem 0 1.5rem;max-width:24ch;
}
.parcours-text .frappe.right{margin-left:auto;text-align:right}
.parcours-text .closer{
  font-family:'Fraunces',serif;font-style:italic;font-weight:500;
  font-size:clamp(1.12rem,2.4vw,1.42rem);opacity:1;margin-top:2.2rem;
}
.portrait{position:sticky;top:6rem}
.portrait img{
  width:100%;height:auto;aspect-ratio:800/1000;border-radius:46% 54% 6% 9% / 15% 14% 3% 3%;
  filter:saturate(.92) contrast(1.03);
  transform:rotate(-1.4deg);
}
.portrait figcaption{
  margin-top:1.1rem;font-family:'Fraunces',serif;font-size:1.02rem;
  color:var(--sapin);font-weight:500;padding-left:.3rem;
}
.portrait figcaption span{
  display:block;font-family:'Outfit',sans-serif;font-size:.82rem;
  font-weight:400;opacity:.82;margin-top:.1rem;
}
.reperes{margin-top:2.4rem;padding-top:1.5rem;border-top:1px solid rgba(0,38,41,.16)}
.reperes div{margin-bottom:.85rem;font-size:.95rem;color:var(--sapin);opacity:.82;line-height:1.5}
.reperes b{font-weight:500;opacity:1}

/* ---------- échos ---------- */
.echos{background:var(--sapin);color:var(--creme);padding:clamp(4rem,9vw,6rem) 0;overflow:hidden}
.echos::before{
  content:"";position:absolute;bottom:-30%;right:-10%;width:min(44vw,440px);aspect-ratio:1;
  background:var(--safran);opacity:.1;
  border-radius:39% 61% 57% 43% / 52% 44% 56% 48%;
  transform:rotate(-19deg);
}
.echos .wrap{position:relative;z-index:2}
.echos .eyebrow{color:var(--safran)}
.echos h2{color:var(--creme);font-size:clamp(1.7rem,3.8vw,2.5rem);margin-bottom:1.6rem;max-width:18ch}
.citation{
  font-family:'Fraunces',serif;font-style:italic;font-weight:500;
  font-size:clamp(1.35rem,3.4vw,2.05rem);color:var(--safran);
  line-height:1.28;max-width:22ch;margin-bottom:.7rem;
}
.citation-src{font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;opacity:.6;margin-bottom:1.7rem}
.echos-analyse{max-width:55ch;font-size:1.04rem;opacity:.88;line-height:1.6}
.echos-analyse p{margin-bottom:1rem}
.echos .btn-outline{margin-top:1.7rem;border-color:rgba(243,237,211,.45);color:var(--creme)}
.echos .btn-outline:hover{background:rgba(243,237,211,.08);border-color:var(--safran)}
.echos-signature{margin-top:1.5rem;font-size:.95rem;opacity:.85;font-style:italic;max-width:46ch;line-height:1.55}

/* la carte d'abonnement : fond creme obligatoire, le texte de l'encart Substack est foncé */
.echos-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,5vw,4rem);align-items:start}
.abonner{
  background:var(--creme);color:var(--sapin);
  padding:1.6rem 1.5rem 1.2rem;
  border-radius:2rem .5rem 2.2rem .5rem;
}
.abonner h3{font-size:1.3rem;color:var(--sapin);margin-bottom:.55rem}
.abonner > p{font-size:.96rem;opacity:.8;margin-bottom:.4rem;line-height:1.5}
.abonner-cta{
  display:inline-block;margin:1.15rem 0 .95rem;padding:.85rem 1.6rem;
  background:var(--sapin);color:var(--creme);
  border-radius:1.6rem .4rem 1.6rem .4rem;
  font-weight:600;font-size:.98rem;text-decoration:none;
  transition:transform .25s ease,background .25s ease;
}
.abonner-cta:hover{background:var(--sauge-fonce);color:var(--creme);transform:translateY(-2px)}
.abonner-lien{
  display:block;font-size:.86rem;color:var(--sapin);opacity:.6;
  text-decoration:underline;text-underline-offset:3px;
}
.abonner-lien:hover{opacity:1}
@media (max-width:860px){
  .echos-grid{grid-template-columns:1fr}
  .abonner{margin-top:.5rem}
}

/* ---------- réserver ---------- */
.reserver{background:var(--creme-deep);padding:clamp(4rem,9vw,6.5rem) 0}
.reserver h2{font-size:clamp(1.75rem,4vw,2.6rem);color:var(--sapin);max-width:19ch;margin-bottom:1rem}
.reserver .lead{margin-bottom:2.6rem}
.form-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2rem,5vw,3.5rem);align-items:start}
form{
  background:var(--creme);padding:clamp(1.6rem,3.5vw,2.3rem);
  border:1px solid rgba(0,38,41,.1);
  border-radius:2rem .5rem 2.2rem .55rem;
}
fieldset.field{border:0;margin-bottom:1.15rem;padding:0;min-width:0}
fieldset.field legend{
  display:block;font-size:.83rem;letter-spacing:.05em;font-weight:500;
  color:var(--sapin);margin-bottom:.38rem;padding:0;
}
.field{margin-bottom:1.15rem}
.field label{
  display:block;font-size:.83rem;letter-spacing:.05em;font-weight:500;
  color:var(--sapin);margin-bottom:.38rem;
}
.field input,.field select,.field textarea{
  width:100%;font-family:inherit;font-size:.97rem;font-weight:300;color:var(--ink);
  background:rgba(0,38,41,.035);border:1px solid rgba(0,38,41,.16);
  padding:.72rem .85rem;border-radius:.65rem .25rem .65rem .25rem;
  transition:border-color .2s,background .2s;
}
.field textarea{min-height:110px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--sauge);background:var(--creme);
}
.field-row{display:flex;gap:1rem;flex-wrap:wrap}
.field-row .field{flex:1 1 180px}
.dispos{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.15rem}
.dispos label{
  display:inline-flex;align-items:center;gap:.42rem;font-size:.88rem;font-weight:300;
  border:1px solid rgba(0,38,41,.2);padding:.42rem .8rem;
  border-radius:1.2rem .3rem 1.2rem .3rem;cursor:pointer;margin:0;
  transition:background .2s,border-color .2s;
}
.dispos label:hover{border-color:var(--sauge);background:rgba(113,149,113,.1)}
.dispos input{width:auto}
.hp{position:absolute;left:-9999px;opacity:0;height:0;width:0}
.form-note{font-size:.82rem;opacity:.68;margin-top:1rem;line-height:1.5}
.form-status{margin-top:1rem;font-size:.95rem;font-weight:400;display:none}
.form-status.ok{display:block;color:#2c6b3f}
.form-status.ko{display:block;color:var(--braise)}
.aside-contact{padding-top:.5rem}
.aside-contact h3{font-size:1.15rem;color:var(--sapin);margin-bottom:.7rem}
.aside-contact p{font-size:.97rem;opacity:.85;margin-bottom:1.1rem;max-width:36ch}
.aside-contact a{color:var(--sapin);font-weight:400}
.aside-contact .direct{
  margin-top:1.6rem;padding-top:1.4rem;border-top:1px solid rgba(0,38,41,.16);
  font-size:.96rem;line-height:1.9;
}

/* ---------- footer ---------- */
footer{background:var(--sapin);color:var(--creme);padding:3rem 0 2.2rem;text-align:left}
footer .cols{display:flex;flex-wrap:wrap;gap:2rem;justify-content:space-between;align-items:flex-start}
footer .fbrand{font-family:'Fraunces',serif;font-size:1.15rem;font-weight:600}
footer .ftag{font-family:'Fraunces',serif;font-style:italic;color:var(--safran);font-size:.95rem;margin-top:.3rem}
footer .fcol{font-size:.92rem;opacity:.82;line-height:1.85}
footer a{color:var(--creme);text-decoration:none;border-bottom:1px solid rgba(243,237,211,.3)}
footer a:hover{border-color:var(--safran)}
footer .fine{
  margin-top:2.4rem;padding-top:1.3rem;border-top:1px solid rgba(243,237,211,.16);
  font-size:.78rem;opacity:.68;
}


/* ---------- la différence : volontairement déséquilibré ---------- */
.difference{background:var(--creme);padding:clamp(4rem,9vw,6.5rem) 0}
.difference h2{font-size:clamp(1.75rem,4vw,2.7rem);color:var(--sapin);max-width:17ch;margin-bottom:1rem}
.duel{margin-top:2.8rem;display:flex;flex-direction:column;gap:1.4rem;align-items:flex-start}
.duel-a{
  max-width:46ch;background:rgba(0,38,41,.05);
  border:1px dashed rgba(0,38,41,.22);
  padding:1.4rem 1.6rem;border-radius:.4rem 1.4rem .35rem 1.3rem;
}
.duel-b{
  max-width:62ch;margin-left:auto;background:var(--sapin);color:var(--creme);
  padding:clamp(1.6rem,3.5vw,2.3rem);border-radius:2.2rem .55rem 2.4rem .5rem;
}
.duel h3,.duel h2{font-size:1.14rem;margin-bottom:.7rem;color:var(--sapin)}
.duel-b h3,.duel-b h2{color:var(--safran);font-size:1.32rem}
.duel p{font-size:.98rem;line-height:1.55;margin-bottom:.55rem;opacity:.85}
.duel-b p{font-size:1.03rem;opacity:.9}
.duel p:last-child{margin-bottom:0}
.duel .verdict{
  margin-top:1rem;padding-top:.9rem;border-top:1px solid rgba(0,38,41,.15);
  font-family:'Fraunces',serif;font-style:italic;opacity:1;
}
.duel-b .verdict{border-top-color:rgba(243,237,211,.22);color:var(--safran);font-size:1.1rem}
.duel-bridge{
  margin-top:2.4rem;font-size:1.08rem;color:var(--sapin);max-width:44ch;opacity:.9;
}
.duel-bridge b{font-weight:500}

/* ---------- la pensée du jour ---------- */
.pensee{background:var(--sauge-bande);color:var(--sapin);padding:clamp(2.8rem,6vw,4rem) 0}
.pensee .eyebrow{color:var(--sapin);opacity:1}
.pensee blockquote{
  font-family:'Fraunces',serif;font-style:italic;font-weight:500;
  font-size:clamp(1.25rem,3vw,1.85rem);line-height:1.35;max-width:30ch;
}
.pensee .sig{margin-top:1.1rem;font-size:.85rem;letter-spacing:.1em;text-transform:uppercase;opacity:.9}
.pensee .sig a{color:inherit;text-decoration:underline;text-underline-offset:.2em}
.pensee .sig a:hover{color:var(--safran)}

@media (max-width:720px){
  .duel-b{margin-left:0}
}


/* ---------- les illustrations ---------- */

/* Le bandeau d'accueil : la couleur de la marque, la marque a droite du titre */
.hero.illustre{
  background:var(--sauge-bande);
  padding:clamp(7.5rem,14vw,10rem) 0 clamp(3rem,6vw,4.5rem);
}
.hero.illustre::before{
  display:block;content:"";position:absolute;top:-24%;left:-16%;
  width:min(72vw,820px);aspect-ratio:1.2;
  background:#5c8160;opacity:.30;
  border-radius:58% 42% 39% 61% / 47% 55% 45% 53%;
  transform:rotate(-11deg);
  filter:blur(70px);
}
.hero.illustre::after{
  display:block;content:"";position:absolute;bottom:-28%;right:-12%;
  width:min(48vw,540px);aspect-ratio:1;
  background:var(--safran);opacity:.13;
  border-radius:44% 56% 62% 38% / 58% 41% 59% 42%;
  transform:rotate(17deg);
  filter:blur(50px);
}
.hero.illustre .wrap{
  position:relative;z-index:2;
  display:grid;grid-template-columns:1.22fr .78fr;
  gap:clamp(1.5rem,4vw,3.5rem);align-items:center;
}
.hero.illustre .bascule{grid-column:1 / -1}
.hero.illustre .eyebrow{color:var(--sapin);opacity:1}
.hero.illustre .hero-sub{opacity:1;color:var(--sapin)}
.hero.illustre .badges{opacity:1;color:var(--sapin);font-weight:400}
.hero.illustre .badges span{
  border-color:rgba(0,38,41,.32);
  background:rgba(243,237,211,.24);
}
.hero.illustre .btn-ghost{border-color:rgba(0,38,41,.45);color:var(--sapin)}
.hero.illustre .btn-ghost:hover{border-color:var(--sapin);background:rgba(243,237,211,.3)}
.hero.illustre .bascule > div:first-child{
  background:rgba(243,237,211,.5);
  border-left-color:rgba(0,38,41,.32);
}
.hero.illustre .bascule > div:first-child strong{opacity:.75}
.marque-hero{
  width:100%;max-width:388px;margin-left:auto;display:block;
  height:auto;aspect-ratio:776/782;
  filter:drop-shadow(0 20px 38px rgba(0,38,41,.2));
}
@media (max-width:860px){
  .hero.illustre .wrap{display:block}
  .marque-hero{max-width:250px;margin:2.4rem auto 0}
}

/* Le cuisinier et sa flamme, en clef de voute du terrain */
.dessin-feu{
  display:block;width:100%;max-width:300px;
  height:auto;aspect-ratio:1;
  margin:clamp(1.8rem,4vw,2.8rem) auto 0;
  opacity:.95;
}

/* La bande de l'approche, entre les postures et la methode : assets/dessin-approche.jpg */
.dessin-bande{
  margin:3.2rem 0 0;width:100%;height:auto;aspect-ratio:1400/781;
  border-radius:1.6rem .4rem 1.8rem .4rem;
}

/* Le seuil, bande large qui ferme le parcours : assets/dessin-seuil.jpg, recadree */
.dessin-seuil{
  display:block;width:100%;
  height:clamp(230px,42vh,440px);
  object-fit:cover;object-position:center;
  margin-top:clamp(2.5rem,6vw,4rem);
  border-radius:2.2rem .5rem 2.4rem .5rem;
}

/* ---------- responsive ---------- */
@media (max-width:960px){
  .constats{grid-template-columns:repeat(2,1fr)}
  .parcours-grid{grid-template-columns:1fr}
  .portrait{position:static;order:-1;max-width:340px;margin:0 auto 1.8rem}
  .form-grid{grid-template-columns:1fr}
  .posture:nth-child(2){flex-direction:row;text-align:left;margin-left:0}
  .posture:nth-child(3){margin-left:0}
}
/* la barre passe au menu deroulant des que les liens serrent la marque */
@media (max-width:940px){
  .nav-links{
    position:fixed;inset:0 0 auto;top:0;padding:5.5rem 2rem 2.5rem;
    background:var(--creme);flex-direction:column;align-items:flex-start;gap:1.4rem;
    transform:translateY(-104%);transition:transform .35s ease;
    box-shadow:0 12px 30px rgba(0,38,41,.12);
  }
  .nav-links.open{transform:none}
  .nav-links a{font-size:1.12rem;opacity:.9}
  .nav-second,.nav-cta{font-size:1.02rem;padding:.7rem 1.3rem}
  .nav-toggle{display:block}
}

@media (max-width:720px){
  .constats{grid-template-columns:1fr}
  .card.feature{margin-top:0}
  .etape:nth-child(2),.etape:nth-child(3){padding-top:0}
  .cap-step:nth-child(4),.cap-step:nth-child(5){margin-left:0}
  .bascule > div:last-child{margin-top:0}
  .parcours-text .frappe.right{margin-left:0;text-align:left}
}
/* ============================================================
   EN SOMMEIL — LA PAGE D'ACCUEIL MULTI-COACH
   Ces regles ne servent a rien dans le site publie aujourd'hui.
   Elles habillent garde/accueil-maison-janvier.html, la page
   « maison » preparee pour janvier-fevrier 2027. On les garde
   ici pour que la bascule ne soit qu'un deplacement de fichier.
   Elles pesent trois kilo-octets et ne ralentissent rien.
   ============================================================ */

.mission{background:var(--creme-deep);padding:clamp(4rem,9vw,6.5rem) 0}
.mission h2{font-size:clamp(1.7rem,4vw,2.6rem);color:var(--sapin);max-width:20ch;margin:1rem 0 1.8rem}
.mission p{font-size:1.06rem;color:var(--sapin);opacity:.9;line-height:1.65;margin-bottom:1.25rem;max-width:62ch}
.mission .frappe{
  font-family:'Fraunces',serif;font-weight:600;opacity:1;
  font-size:clamp(1.24rem,2.8vw,1.68rem);line-height:1.3;
  margin:2rem 0 1.9rem;max-width:22ch;
}
.mission-image{
  display:block;width:100%;margin-top:clamp(2.2rem,5vw,3.4rem);
  border-radius:2.2rem .5rem 2.4rem .5rem;
}

.chemin{background:var(--sapin);color:var(--creme);padding:clamp(4rem,9vw,6.5rem) 0;position:relative;overflow:hidden}
.chemin::before{
  content:"";position:absolute;top:-18%;right:-14%;width:min(46vw,470px);aspect-ratio:1;
  background:var(--sauge);opacity:.16;
  border-radius:57% 43% 38% 62% / 49% 53% 47% 51%;
  transform:rotate(-13deg);
}
.chemin .wrap{position:relative;z-index:2}
.chemin .eyebrow{color:var(--safran)}
.chemin h2{font-size:clamp(1.7rem,4vw,2.6rem);color:var(--creme);max-width:18ch;margin:1rem 0 1.8rem}
.chemin p{font-size:1.06rem;line-height:1.65;margin-bottom:1.25rem;max-width:62ch;opacity:.88}
.chemin .closer{
  font-family:'Fraunces',serif;font-style:italic;font-weight:500;opacity:1;
  font-size:clamp(1.1rem,2.4vw,1.4rem);margin-top:2.4rem;color:var(--safran);
}

.coachs{background:var(--creme);padding:clamp(4rem,9vw,6.5rem) 0}
.coachs h2{font-size:clamp(1.7rem,4vw,2.5rem);color:var(--sapin);max-width:22ch;margin:1rem 0 1.1rem}
.coach-grid{
  display:grid;grid-template-columns:1fr;
  gap:clamp(1.6rem,3.5vw,2.4rem);margin-top:clamp(2.2rem,5vw,3.2rem);
  align-items:start;
}
@media (min-width:620px){.coach-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:980px){.coach-grid{grid-template-columns:repeat(3,1fr)}}
.coach-carte{
  display:block;text-decoration:none;color:inherit;
  background:var(--creme-deep);
  border-radius:2.2rem .5rem 2.4rem .5rem;
  overflow:hidden;
  transition:transform .3s ease,box-shadow .3s ease;
}
a.coach-carte:hover{transform:translateY(-4px) rotate(-.35deg);box-shadow:0 20px 40px rgba(0,38,41,.14)}
.coach-carte img{width:100%;display:block;aspect-ratio:4/4.5;object-fit:cover;object-position:center 16%}
.coach-txt{padding:1.5rem 1.6rem 1.7rem}
.coach-txt h3{font-size:1.42rem;color:var(--sapin);margin-bottom:.2rem}
.coach-role{
  display:block;font-size:.79rem;letter-spacing:.11em;text-transform:uppercase;
  color:var(--sauge-fonce);font-weight:500;margin-bottom:.9rem;
}
.coach-txt p{font-size:.99rem;color:var(--sapin);opacity:.85;line-height:1.55;margin-bottom:1.1rem}
.coach-lien{
  display:inline-block;font-weight:500;font-size:.95rem;color:var(--sapin);
  text-decoration:none;border-bottom:2px solid var(--safran);padding-bottom:2px;
}
a.coach-lien:hover{color:var(--sauge)}
.coach-ouverte{
  background:transparent;
  border:1px dashed rgba(0,38,41,.28);
  border-radius:.5rem 2.2rem .5rem 2.4rem;
}
.coach-ouverte .coach-txt{padding-top:1.9rem}
.coach-ouverte h3{opacity:.8}

/* ---------- les questions, juste avant le formulaire ---------- */
.questions{background:var(--creme-deep);padding:clamp(3.5rem,8vw,5.5rem) 0}
.questions h2{font-size:clamp(1.6rem,3.6vw,2.35rem);color:var(--sapin);max-width:20ch;margin:1rem 0 0}
.qa-grid{
  display:grid;grid-template-columns:1fr;
  gap:clamp(1.5rem,3vw,2.2rem) clamp(2rem,5vw,3.6rem);
  margin-top:clamp(2rem,4vw,2.8rem);
}
@media (min-width:780px){.qa-grid{grid-template-columns:1fr 1fr}}
.qa h3,.qa h2{
  font-size:1.09rem;color:var(--sapin);line-height:1.35;
  margin-bottom:.5rem;max-width:34ch;
}
.qa h3::before,.qa h2::before{
  content:"";display:block;width:22px;height:2px;
  background:var(--safran);margin-bottom:.7rem;
}
.qa p{font-size:.99rem;color:var(--sapin);opacity:.84;line-height:1.6;max-width:52ch}
.fine .maj{display:inline-block;margin-top:.5rem;opacity:.9}
.fine .maj a{color:inherit;text-decoration:underline;text-underline-offset:3px}


/* ============================================================
   SITE A CINQ PAGES (31 aout 2026)
   .fil        le fil d Ariane des sous-pages
   .premiere   la premiere section d une sous-page, qui degage la nav fixe
   .bande-cta  le rappel « quinze minutes » en bas des pages sans formulaire
   ============================================================ */
.nav-links a.actif{opacity:1;font-weight:500;position:relative}
.nav-links a.actif::after{
  content:"";position:absolute;left:0;right:0;bottom:-.35rem;height:2px;
  background:var(--safran);border-radius:2px;
}
.fil{
  display:block;position:static;background:none;border:0;backdrop-filter:none;
  max-width:1180px;margin:0 auto;padding:6.4rem 1.5rem 0;
  font-size:.8rem;letter-spacing:.04em;color:var(--sapin);
}
.fil a{color:var(--sapin);text-decoration:underline;text-underline-offset:3px}
.fil span[aria-hidden]{margin:0 .35rem;opacity:.55}
.fil + section.premiere{padding-top:clamp(1.6rem,3.5vw,2.4rem)}
section.premiere{padding-top:clamp(7rem,13vw,9rem)}
section.premiere h1{
  font-family:'Fraunces',serif;font-weight:600;line-height:1.14;
  font-size:clamp(1.85rem,4.4vw,3rem);color:var(--sapin);
  max-width:22ch;margin-bottom:1.1rem;
}
section.premiere.maison h1,section.premiere.question h1{color:inherit}
.bande-cta{
  background:var(--creme-deep);padding:clamp(3rem,7vw,4.5rem) 0;text-align:center;
}
.bande-cta h2{font-size:clamp(1.45rem,3.2vw,2.1rem);color:var(--sapin);margin-bottom:.7rem}
.bande-cta p{font-size:1.04rem;color:var(--sapin);opacity:.88;max-width:46ch;margin:0 auto 1.7rem}
.bande-cta .btn-primary{display:inline-block}
@media (max-width:600px){ .fil{padding-top:5.8rem} }

/* Titres reels du bloc tripartite : meme rendu que l'ancien <b> */
.tripartite h2{display:block;font-family:'Fraunces',serif;font-weight:600;font-size:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;max-width:none;margin:0 0 .25rem}

/* ============================================================
   LE SENTIER — le fil de la Balade (6 septembre 2026)
   Le rail pointillé dans la marge gauche (>= 1300px), qui descend avec la
   page (data-sens="montee" sur <body> pour l'inverser),
   et l'icône d'arrêt devant chaque section (tous écrans).
   Le comportement vit dans assets/sentier.js, les icônes dans
   assets/arrets.svg (boussole, puzzle, envol).
   ============================================================ */

/* l'icône d'arrêt, devant l'eyebrow ou au-dessus du titre */
.arret-ico{width:1em;height:1em;display:block;color:var(--sapin);overflow:visible}
/* l'arrêt des Échos : le logo d'Erald (assets/erald-icone.webp) en masque, couleur du texte */
.arret-ico-erald{
  width:1em;height:1.09em;background:currentColor;
  -webkit-mask:url(/assets/erald-icone.webp) center/contain no-repeat;
  mask:url(/assets/erald-icone.webp) center/contain no-repeat;
}
.eyebrow.avec-arret::before{display:none}              /* l'icône remplace le petit trait */
.eyebrow .arret-marque{display:inline-flex;font-size:1.35rem;line-height:1;margin-right:.1rem}
.arret-marque.seule{display:block;font-size:1.45rem;margin-bottom:1.1rem;position:relative;width:1em}
.echos .arret-ico,.question .arret-ico,.chemin .arret-ico,.pensee .arret-ico{color:currentColor}
.echos .eyebrow .arret-ico{color:var(--creme)}

/* sous 1300px : un court pointillé au-dessus de chaque arrêt, le fil en pointillé */
@media (max-width:1299px){
  .eyebrow.avec-arret,.arret-marque.seule{position:relative}
  .eyebrow.avec-arret::after,.arret-marque.seule::after{
    content:"";position:absolute;left:calc(.675em - 1px);bottom:calc(100% + .35rem);
    height:2.2rem;width:0;border-left:2px dashed currentColor;opacity:.42;
  }
  .arret-marque.seule::after{left:calc(.5em - 1px)}
}

/* le rail */
.sentier{
  position:fixed;z-index:55;
  top:6.5rem;bottom:2.5rem;
  left:calc((100vw - 1120px) / 2 - 92px);
  width:56px;
}
.sentier[hidden]{display:none}
.sentier-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
/* trois traits superposés : un halo crème (pour rester lisible sur les bandes
   sombres), le fil à venir en sapin léger, le fil parcouru en safran */
.sentier-halo,.sentier-trace,.sentier-parcouru{
  stroke-linecap:round;stroke-dasharray:6 9;
  animation:sentier-derive 1.6s linear infinite;
}
.sentier-halo{stroke:var(--creme);stroke-width:7;opacity:.55}
.sentier-trace{stroke:var(--sapin);stroke-width:2.2;opacity:.34}
.sentier-parcouru{stroke:var(--safran);stroke-width:3}
/* les pointillés dérivent vers l'arrivée : l'offset décroît, le motif avance le long du tracé */
@keyframes sentier-derive{from{stroke-dashoffset:15}to{stroke-dashoffset:0}}
.sentier-arrets{list-style:none;margin:0;padding:0}
.sentier .arret{
  position:absolute;transform:translate(-50%,-50%);
  width:36px;height:36px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--creme);color:var(--sapin);
  border:2px solid rgba(0,38,41,.28);
  text-decoration:none;
  transition:transform .25s ease,background .25s ease,border-color .25s ease,box-shadow .25s ease;
}
.sentier .arret .arret-ico{width:23px;height:23px;color:inherit}
.sentier .arret.passe{background:var(--sauge-bande);border-color:var(--sauge-fonce)}
.sentier .arret.courant{
  background:var(--sapin);color:var(--creme);border-color:var(--sapin);
  transform:translate(-50%,-50%) scale(1.18);
  box-shadow:0 0 0 3px var(--creme),0 8px 20px rgba(0,38,41,.22);   /* l'anneau crème le garde visible sur les bandes sombres */
}
.sentier .arret:hover,.sentier .arret:focus-visible{transform:translate(-50%,-50%) scale(1.22);border-color:var(--sapin);outline:none}
.sentier .arret .arret-ico-erald{width:20px;height:22px}
.sentier .arret[data-type="envol"]{width:42px;height:42px}
.sentier .arret[data-type="envol"] .arret-ico{width:28px;height:28px}
.sentier .arret-nom{
  position:absolute;left:calc(100% + .7rem);top:50%;transform:translateY(-50%) translateX(-4px);
  white-space:nowrap;font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;font-weight:500;
  color:var(--sapin);background:var(--creme);padding:.28rem .6rem;
  border-radius:.9rem .25rem .9rem .25rem;border:1px solid rgba(0,38,41,.14);
  opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease;
}
.sentier .arret:hover .arret-nom,.sentier .arret:focus-visible .arret-nom,.sentier .arret.courant .arret-nom{opacity:1;transform:translateY(-50%)}
.sentier .arret.courant .arret-nom{opacity:.92}
@media (prefers-reduced-motion:reduce){
  .sentier-halo,.sentier-trace,.sentier-parcouru{animation:none}
  .sentier .arret,.sentier .arret-nom{transition:none}
}

/* ============================================================
   DEUX PORTES POUR L'APPEL (6 septembre 2026)
   À gauche : laisser ses coordonnées (formulaire, champ libre
   « meilleur moment » avec raccourcis). À droite : réserver
   soi-même un créneau de 15 minutes dans l'agenda (Cal.com).
   ============================================================ */
.porte-titre{font-size:1.15rem;color:var(--sapin);margin-bottom:1.2rem}
.chips{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:.55rem}
.chip{
  font-family:inherit;font-size:.82rem;font-weight:300;color:var(--sapin);
  background:transparent;border:1px solid rgba(0,38,41,.22);cursor:pointer;
  padding:.36rem .75rem;border-radius:1.2rem .3rem 1.2rem .3rem;
  transition:background .2s,border-color .2s;
}
.chip:hover,.chip:focus-visible{border-color:var(--sauge);background:rgba(113,149,113,.12);outline:none}
.porte-agenda{
  background:var(--sapin);color:var(--creme);
  padding:clamp(1.4rem,3vw,1.9rem);margin-bottom:2rem;
  border-radius:.5rem 2rem .55rem 2.2rem;
}
.porte-agenda h3{color:var(--creme);font-size:1.15rem;margin-bottom:.6rem}
.porte-agenda p{color:var(--creme);opacity:.86;font-size:.95rem;margin-bottom:1.1rem;max-width:34ch}
.btn-agenda{
  display:inline-block;background:var(--safran);color:var(--sapin);font-weight:500;
  padding:.8rem 1.25rem;border-radius:2rem .4rem 2rem .4rem;text-decoration:none;
  font-size:.95rem;transition:transform .2s,box-shadow .2s;
}
.btn-agenda:hover{transform:translateY(-1px);box-shadow:0 8px 18px rgba(0,0,0,.18)}
.avis-absence{
  border:1px solid var(--braise);color:var(--sapin);background:rgba(194,97,43,.08);
  padding:.9rem 1.1rem;border-radius:.4rem 1.2rem .4rem 1.2rem;margin:0 0 1.6rem;
  font-size:.95rem;max-width:60ch;
}
.avis-absence[hidden]{display:none}
/* sur un écran étroit, la porte de l'agenda passe AVANT le formulaire :
   celui qui veut régler ça en trente secondes la voit en premier */
@media (max-width:960px){
  .aside-contact{display:contents}
  .aside-contact .porte-agenda{order:-1;margin-bottom:0}
  .aside-contact h3,.aside-contact p,.aside-contact .direct{order:1}
  .aside-contact .direct{margin-top:.2rem}
}

/* 3 octobre 2026 : phrase qui dit ce que sont les Échos, au-dessus de la citation */
.echos .echos-sens{font-size:1.02rem;color:var(--sapin);opacity:.9;max-width:52ch;margin:.6rem 0 1.2rem;line-height:1.55}