/* session-engineering.com — charte
   ivoire #F6F3EC · encre #191817 · conduite #0E6B4A · signal #C77D0A · fil #D9D3C6 */

:root{
  --ivoire:#F6F3EC; --encre:#191817; --conduite:#0E6B4A; --signal:#C77D0A;
  --fil:#D9D3C6; --sourd:#6B675F; --mesure:68ch;
  --display:"Gill Sans","Gill Sans MT",Calibri,"Trebuchet MS",sans-serif;
  --texte:"Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;
  --mono:ui-monospace,"SF Mono","Cascadia Mono",Consolas,monospace;
}
*{box-sizing:border-box}
body{margin:0;background:var(--ivoire);color:var(--encre);font-family:var(--texte);font-size:1.08rem;line-height:1.68}
a{color:var(--conduite);text-decoration-thickness:1px;text-underline-offset:2px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--conduite);outline-offset:2px;border-radius:2px}

header.site{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  max-width:58rem;margin:0 auto;padding:1.15rem 1.25rem .9rem;border-bottom:1px solid var(--fil)}
.marque{font-family:var(--display);font-size:1.05rem;letter-spacing:.12em;text-transform:uppercase;color:var(--encre);text-decoration:none}
.marque b{color:var(--conduite);font-weight:600}
nav.site{display:flex;gap:1.05rem;flex-wrap:wrap}
nav.site a{font-family:var(--display);font-size:.8rem;letter-spacing:.11em;text-transform:uppercase;text-decoration:none;color:var(--sourd)}
nav.site a[aria-current="page"],nav.site a:hover{color:var(--conduite)}

main{max-width:58rem;margin:0 auto;padding:0 1.25rem 4rem}
h1{font-family:var(--display);font-size:clamp(2rem,5vw,3rem);line-height:1.12;letter-spacing:.005em;margin:.2rem 0 .9rem}
h2{font-family:var(--display);font-size:1.4rem;margin:2.4rem 0 .7rem}
h3{font-family:var(--display);font-size:1.05rem;letter-spacing:.03em;margin:1.5rem 0 .4rem}
p{max-width:var(--mesure)}
.sourdine{color:var(--sourd);font-size:.95rem}

/* héros + ligne de session */
.heros{padding:2.8rem 0 1rem}
.heros .sur-titre{font-family:var(--display);font-size:.8rem;letter-spacing:.22em;text-transform:uppercase;color:var(--sourd);margin:0 0 .8rem}
.heros .these{font-size:1.16rem;max-width:var(--mesure)}
.ligne-session{display:block;width:100%;max-width:46rem;height:auto;margin:1.6rem 0 .4rem}
.ligne-legende{display:flex;gap:1.6rem;flex-wrap:wrap;font-family:var(--display);font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--sourd);margin:0 0 1.2rem}
.ligne-legende .sig{color:var(--signal)}
.ligne-legende .rep{color:var(--conduite)}
@media (prefers-reduced-motion:no-preference){
  .ls-anim .seg{stroke-dasharray:900;stroke-dashoffset:900;animation:tracer 1.1s ease-out .2s forwards}
  .ls-anim .pt{opacity:0;animation:poser .3s ease-out forwards}
  .ls-anim .pt:nth-of-type(1){animation-delay:.35s}.ls-anim .pt:nth-of-type(2){animation-delay:.5s}
  .ls-anim .pt:nth-of-type(3){animation-delay:.65s}.ls-anim .pt:nth-of-type(4){animation-delay:.95s}
  .ls-anim .pt:nth-of-type(5){animation-delay:1.1s}
  .ls-anim .sigx{opacity:0;animation:poser .3s ease-out .8s forwards}
  .ls-anim .repr{stroke-dasharray:160;stroke-dashoffset:160;animation:tracer .5s ease-out 1.25s forwards}
  .ls-anim .repf{opacity:0;animation:poser .25s ease-out 1.6s forwards}
  .ls-anim .fin{opacity:0;animation:poser .3s ease-out 1.75s forwards}
  @keyframes tracer{to{stroke-dashoffset:0}}
  @keyframes poser{to{opacity:1}}
}
.actions{display:flex;gap:.8rem;flex-wrap:wrap;margin:1.3rem 0 .4rem}
.bouton{font-family:var(--display);font-size:.86rem;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;
  padding:.7rem 1.1rem;border:2px solid var(--conduite);border-radius:3px;color:var(--conduite);background:transparent;cursor:pointer}
.bouton.plein{background:var(--conduite);color:var(--ivoire)}
.bouton:hover{background:var(--encre);border-color:var(--encre);color:var(--ivoire)}

/* les trois temps */
.temps{border-left:3px solid var(--conduite);padding:0 0 .2rem 1.4rem;margin:2.2rem 0}
.temps .cran{font-family:var(--display);font-size:.76rem;letter-spacing:.18em;text-transform:uppercase;color:var(--conduite)}
.temps h2{margin-top:.25rem}

/* signaux (ambre) */
ul.signaux{list-style:none;padding:0;max-width:var(--mesure)}
ul.signaux li{position:relative;padding:.15rem 0 .7rem 1.7rem;margin:0}
ul.signaux li::before{content:"✕";position:absolute;left:0;top:.18rem;color:var(--signal);font-weight:700}
ul.signaux b{font-family:var(--display)}
ul.signaux .geste{display:block;color:var(--sourd);font-size:.96rem}
ul.travail{padding-left:1.15rem;max-width:var(--mesure)}
ul.travail li{margin:.5rem 0}

/* exergues */
blockquote.exergue{font-style:italic;font-size:1.16rem;border-left:3px solid var(--conduite);padding:.35rem 0 .35rem 1.1rem;margin:1.3rem 0;max-width:var(--mesure)}
blockquote.exergue cite{display:block;font-style:normal;font-family:var(--display);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--sourd);margin-top:.4rem}

/* protocole / check-list */
.protocole{background:var(--encre);color:#EDEAE2;border-radius:6px;padding:1.15rem 1.25rem;max-width:var(--mesure);
  font-family:var(--mono);font-size:.85rem;line-height:1.55;white-space:pre-wrap;overflow-x:auto;position:relative}
.copie{position:absolute;top:.7rem;right:.7rem;font-family:var(--display);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;
  background:var(--ivoire);color:var(--encre);border:0;border-radius:3px;padding:.4rem .6rem;cursor:pointer}
.copie:hover{background:var(--conduite);color:var(--ivoire)}
.checklist{max-width:var(--mesure)}
.checklist h3{color:var(--conduite)}
.checklist li{margin:.4rem 0}

/* chapitre offert */
.chapitre p{margin:0 0 1.05rem}
.chapitre .chap-note{border:1px solid var(--fil);border-left:3px solid var(--conduite);background:#FFFDF7;border-radius:4px;
  padding:.8rem 1rem;max-width:var(--mesure);font-size:.96rem;margin:0 0 1.6rem}

/* sommaire du livre */
.partie{margin:1.4rem 0;max-width:var(--mesure)}
.partie h3{margin:.2rem 0 .3rem}
.partie ol{margin:.2rem 0 0 1.2rem;padding:0}
.partie li{margin:.22rem 0}

/* FAQ */
.fiche{border-top:1px solid var(--fil);padding:1.05rem 0 .3rem;max-width:var(--mesure)}
.fiche h3{margin:.05rem 0 .4rem}

/* encadré d'honnêteté */
.cadre{border:1px solid var(--fil);border-left:3px solid var(--conduite);background:#FFFDF7;border-radius:4px;
  padding:.85rem 1.05rem;margin:1.3rem 0;max-width:var(--mesure);font-size:.97rem}
.cadre b{font-family:var(--display)}

footer.site{border-top:1px solid var(--fil);max-width:58rem;margin:0 auto;padding:1.4rem 1.25rem 2.4rem;
  font-size:.9rem;color:var(--sourd);display:flex;gap:1.2rem;flex-wrap:wrap;justify-content:space-between}
footer.site a{color:var(--sourd)}
footer.site a:hover{color:var(--conduite)}

@media (max-width:640px){
  .temps{padding-left:1rem}
}

/* v1.1 : double ligne, reprise, terrain, ressources */
.visuel{display:block;width:100%;max-width:46rem;height:auto;margin:1.2rem 0 .3rem}
.visuel-legende{display:flex;gap:1.8rem;flex-wrap:wrap;font-family:var(--display);font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--sourd);margin:0 0 1rem}
.visuel-legende .ok{color:var(--conduite)}
.champ{border:1px solid var(--fil);border-left:3px solid var(--signal);background:#FFFDF7;border-radius:4px;padding:.8rem 1rem;margin:1rem 0;max-width:var(--mesure);font-size:.97rem}
.champ b{font-family:var(--display)}
ul.ressources{list-style:none;padding:0;max-width:var(--mesure)}
ul.ressources li{padding:.4rem 0 .4rem 1.5rem;position:relative;border-top:1px solid var(--fil)}
ul.ressources li::before{content:"→";position:absolute;left:0;color:var(--conduite);font-family:var(--display)}