@charset "UTF-8";
/* ============================================================
   BATISSE — feuille de style unique
   Palette issue du matériau : terre humide, gore du Forez,
   badigeon de chaux, galet de rivière, limon.
   ============================================================ */

:root{
  /* couleurs */
  --sol:#14110D;
  --galet:#2F3D48;
  --galet-clair:#5A6C79;
  --gore:#B0642B;
  --gore-fonce:#8A4A1C;
  --chaux:#F6F4EF;
  --chaux-2:#EDE9E0;
  --limon:#D9CFBE;
  --alerte:#9B2C1E;
  --vert:#4F6146;

  /* typographie */
  --display:"Fraunces",Georgia,"Times New Roman",serif;
  --texte:"Source Serif 4",Georgia,serif;
  --data:"IBM Plex Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;

  /* mesures */
  --colonne:68ch;
  --rythme:1.75rem;
  --header-h:60px;
  --rayon:3px;
}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 24px);}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;}
}
body{
  margin:0;
  background:var(--chaux);
  color:var(--sol);
  font-family:var(--texte);
  font-size:1.0625rem;
  line-height:1.68;
  font-optical-sizing:auto;
  text-rendering:optimizeLegibility;
}
img,svg{max-width:100%;height:auto;display:block;}
a{color:var(--gore-fonce);text-underline-offset:.18em;text-decoration-thickness:1px;}
a:hover{color:var(--gore);}
:focus-visible{outline:2.5px solid var(--gore);outline-offset:3px;border-radius:2px;}
hr{border:0;border-top:1px solid var(--limon);margin:2.5rem 0;}

/* ---------- en-tête ---------- */
.entete{
  position:fixed;top:0;left:0;right:0;z-index:120;
  background:rgba(246,244,239,.94);
  backdrop-filter:saturate(140%) blur(8px);
  border-bottom:1px solid var(--limon);
}
.entete-in{
  max-width:1360px;margin:0 auto;padding:0 clamp(1rem,3vw,2rem);
  height:var(--header-h);display:flex;align-items:center;gap:1.25rem;
}
.marque{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--sol);flex-shrink:0;}
.marque-sceau{width:26px;height:30px;flex:0 0 auto;}
.marque-nom{font-family:var(--display);font-weight:700;font-size:1.18rem;letter-spacing:.04em;line-height:1;}
.marque-sous{display:block;font-family:var(--data);font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;color:var(--galet-clair);margin-top:.22rem;}

.nav{margin-left:auto;display:flex;align-items:center;gap:.15rem;font-family:var(--data);font-size:.82rem;}
.nav a{
  color:var(--galet);text-decoration:none;padding:.45rem .7rem;border-radius:var(--rayon);
  letter-spacing:.01em;white-space:nowrap;transition:background .16s,color .16s;
}
.nav a:hover{background:var(--chaux-2);color:var(--sol);}
.nav a[aria-current="page"]{color:var(--gore-fonce);box-shadow:inset 0 -2px 0 var(--gore);}
.burger{display:none;margin-left:auto;background:none;border:1px solid var(--limon);border-radius:var(--rayon);
  padding:.42rem .6rem;font-family:var(--data);font-size:.78rem;color:var(--galet);cursor:pointer;}
.progression{position:absolute;left:0;bottom:-1px;height:2px;background:var(--gore);width:0;transition:width .1s linear;}

@media (max-width:940px){
  .burger{display:block;}
  .nav{
    position:fixed;top:var(--header-h);left:0;right:0;flex-direction:column;align-items:stretch;gap:0;
    background:var(--chaux);border-bottom:1px solid var(--limon);padding:.5rem clamp(1rem,4vw,2rem) 1rem;
    display:none;max-height:calc(100vh - var(--header-h));overflow:auto;
  }
  .nav.ouvert{display:flex;}
  .nav a{padding:.7rem .2rem;border-bottom:1px solid var(--chaux-2);font-size:.95rem;}
}

/* ---------- structure ---------- */
main{padding-top:var(--header-h);}
.bande{padding:clamp(3rem,7vw,5.5rem) clamp(1rem,3vw,2rem);}
.bande--fonce{background:var(--galet);color:var(--chaux);}
.bande--fonce h2,.bande--fonce h3{color:#fff;}
.bande--terre{background:var(--chaux-2);}
.contenu{max-width:1360px;margin:0 auto;}
.mesure{max-width:var(--colonne);}

/* ---------- typographie ---------- */
h1,h2,h3,h4{font-family:var(--display);font-weight:700;line-height:1.12;letter-spacing:-.012em;margin:0 0 .6rem;}
h1{font-size:clamp(2.1rem,5.2vw,3.5rem);font-variation-settings:"SOFT" 0,"WONK" 1;}
h2{font-size:clamp(1.55rem,3.2vw,2.15rem);margin-top:0;}
h3{font-size:clamp(1.16rem,2.1vw,1.4rem);}
h4{font-family:var(--data);font-weight:600;font-size:1rem;letter-spacing:.01em;}
p{margin:0 0 var(--rythme);}
.chapeau{font-size:clamp(1.1rem,2vw,1.3rem);line-height:1.55;color:#3A342C;}
.oeil{
  font-family:var(--data);font-size:.68rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;
  color:var(--gore-fonce);margin:0 0 .8rem;display:flex;align-items:center;gap:.6rem;
}
.oeil::after{content:"";height:1px;background:var(--limon);flex:1;}
.bande--fonce .oeil{color:#E0A96D;}
.bande--fonce .oeil::after{background:rgba(255,255,255,.22);}

ul,ol{margin:0 0 var(--rythme);padding-left:1.15rem;}
li{margin-bottom:.5rem;}
li::marker{color:var(--gore);}
strong{font-weight:600;}
abbr[title]{text-decoration:underline dotted;cursor:help;}
code,kbd{font-family:ui-monospace,"SFMono-Regular",Menlo,monospace;font-size:.88em;background:var(--chaux-2);padding:.08em .35em;border-radius:2px;}

/* ---------- page de chapitre : 3 colonnes ---------- */
.chapitre{
  max-width:1360px;margin:0 auto;padding:0 clamp(1rem,3vw,2rem) 5rem;
  display:grid;gap:clamp(1.5rem,3vw,3rem);
  grid-template-columns:minmax(190px,230px) minmax(0,1fr) minmax(180px,240px);
}
@media (max-width:1180px){.chapitre{grid-template-columns:minmax(180px,215px) minmax(0,1fr);}}
@media (max-width:900px){.chapitre{grid-template-columns:1fr;}}

.sommaire{position:sticky;top:calc(var(--header-h) + 1.6rem);align-self:start;max-height:calc(100vh - var(--header-h) - 3rem);overflow:auto;padding-right:.4rem;}
.sommaire-titre{font-family:var(--data);font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:var(--galet-clair);margin-bottom:.8rem;}
.sommaire ol{list-style:none;margin:0;padding:0;border-left:1px solid var(--limon);}
.sommaire li{margin:0;}
.sommaire a{
  display:block;padding:.4rem .8rem;margin-left:-1px;border-left:2px solid transparent;
  font-family:var(--data);font-size:.8rem;line-height:1.35;color:var(--galet);text-decoration:none;
}
.sommaire a:hover{color:var(--sol);background:var(--chaux-2);}
.sommaire a.actif{border-left-color:var(--gore);color:var(--gore-fonce);font-weight:600;}
.sommaire .n2{padding-left:1.5rem;font-size:.75rem;}
@media (max-width:900px){
  .sommaire{position:static;max-height:none;margin:1.5rem 0;border:1px solid var(--limon);border-radius:var(--rayon);padding:1rem;background:#fff;}
}

.corps{min-width:0;}
.corps section{scroll-margin-top:calc(var(--header-h) + 20px);margin-bottom:clamp(2.5rem,5vw,4rem);}
.corps > section > h2{
  padding-top:1.1rem;border-top:2px solid var(--sol);
}
.corps p,.corps ul,.corps ol{max-width:var(--colonne);}

.marge{align-self:start;font-family:var(--data);font-size:.78rem;line-height:1.5;color:var(--galet);}
.marge .note{border-top:1px solid var(--limon);padding-top:.7rem;margin-bottom:1.8rem;}
.marge .note b{display:block;font-size:.63rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gore-fonce);margin-bottom:.35rem;}
@media (max-width:1180px){.marge{display:none;}}

/* ---------- signature : coupe de mur stratifiée ---------- */
.coupe{width:100%;max-width:340px;}
.coupe .lit{transition:fill .2s;}
.coupe a:hover .lit,.coupe a:focus .lit{fill:var(--gore);}
.coupe text{font-family:var(--data);font-size:9px;fill:var(--galet-clair);letter-spacing:.06em;}
.coupe .cote{stroke:var(--galet-clair);stroke-width:.6;}

/* ---------- cartouches et fiches ---------- */
.fiche{
  background:#fff;border:1px solid var(--limon);border-radius:var(--rayon);
  padding:1.35rem 1.5rem;margin:0 0 1.2rem;
}
.fiche h3{margin-top:0;}
.fiche > :last-child{margin-bottom:0;}
.fiche--alerte{border-left:4px solid var(--alerte);background:#FDF6F4;}
.fiche--regle{border-left:4px solid var(--gore);background:#FCF7F1;}
.fiche--bon{border-left:4px solid var(--vert);background:#F5F8F2;}
.fiche--science{border-left:4px solid var(--galet);background:#F4F6F8;}
.fiche-etiquette{
  font-family:var(--data);font-size:.62rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  color:var(--galet-clair);display:block;margin-bottom:.5rem;
}
.fiche--alerte .fiche-etiquette{color:var(--alerte);}
.fiche--regle .fiche-etiquette{color:var(--gore-fonce);}
.fiche--bon .fiche-etiquette{color:var(--vert);}

.grille{display:grid;gap:1.1rem;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));margin-bottom:var(--rythme);}
.grille--2{grid-template-columns:repeat(auto-fit,minmax(290px,1fr));}
.grille .fiche{margin:0;}

/* ---------- tableaux techniques ---------- */
.tableau-enveloppe{overflow-x:auto;margin:0 0 var(--rythme);border:1px solid var(--limon);border-radius:var(--rayon);background:#fff;}
table{width:100%;border-collapse:collapse;font-family:var(--data);font-size:.84rem;}
caption{
  caption-side:top;text-align:left;font-family:var(--data);font-size:.68rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--galet-clair);padding:.9rem 1rem .3rem;
}
th,td{padding:.6rem .85rem;text-align:left;border-bottom:1px solid var(--chaux-2);vertical-align:top;}
thead th{background:var(--galet);color:#fff;font-weight:600;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;border-bottom:0;}
tbody tr:last-child td{border-bottom:0;}
tbody tr:nth-child(even){background:#FBFAF7;}
td.num{font-variant-numeric:tabular-nums;white-space:nowrap;}

/* ---------- chiffres clés ---------- */
.chiffres{display:grid;gap:1px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));background:var(--limon);border:1px solid var(--limon);border-radius:var(--rayon);overflow:hidden;margin-bottom:var(--rythme);}
.chiffre{background:var(--chaux);padding:1.1rem 1rem;}
.chiffre b{display:block;font-family:var(--display);font-size:1.85rem;line-height:1;color:var(--gore-fonce);}
.chiffre span{display:block;font-family:var(--data);font-size:.72rem;line-height:1.35;color:var(--galet);margin-top:.4rem;}
.bande--fonce .chiffre{background:#3A4A56;}
.bande--fonce .chiffre b{color:#E8B27A;}
.bande--fonce .chiffre span{color:#C8D2D9;}

/* ---------- étapes numérotées (séquence réelle) ---------- */
.sequence{list-style:none;padding:0;counter-reset:etape;}
.sequence li{
  counter-increment:etape;position:relative;padding-left:3.2rem;margin-bottom:1.3rem;
  max-width:var(--colonne);
}
.sequence li::before{
  content:"LIT " counter(etape,decimal-leading-zero);
  position:absolute;left:0;top:.15rem;font-family:var(--data);font-size:.6rem;font-weight:600;
  letter-spacing:.1em;color:var(--gore-fonce);background:var(--chaux-2);padding:.25rem .3rem;border-radius:2px;
}
.sequence h4{margin-bottom:.25rem;}

/* ---------- citations / renvois ---------- */
.renvoi{font-family:var(--data);font-size:.74rem;color:var(--galet-clair);vertical-align:super;text-decoration:none;padding:0 .1em;}
.renvoi:hover{color:var(--gore);}
blockquote{
  margin:0 0 var(--rythme);padding:.2rem 0 .2rem 1.3rem;border-left:3px solid var(--limon);
  font-style:italic;color:#3A342C;max-width:var(--colonne);
}
blockquote cite{display:block;font-family:var(--data);font-style:normal;font-size:.76rem;color:var(--galet-clair);margin-top:.5rem;}

/* ---------- recherche / filtres ---------- */
.outil{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin-bottom:1.8rem;font-family:var(--data);}
.champ{
  flex:1 1 240px;padding:.6rem .8rem;border:1px solid var(--limon);border-radius:var(--rayon);
  font-family:var(--data);font-size:.9rem;background:#fff;color:var(--sol);
}
.puce{
  border:1px solid var(--limon);background:#fff;border-radius:100px;padding:.4rem .85rem;
  font-family:var(--data);font-size:.76rem;color:var(--galet);cursor:pointer;transition:.15s;
}
.puce:hover{border-color:var(--galet-clair);}
.puce[aria-pressed="true"]{background:var(--galet);border-color:var(--galet);color:#fff;}
.vide{display:none;font-family:var(--data);font-size:.9rem;color:var(--galet-clair);padding:1rem 0;}

/* ---------- boutons ---------- */
.bouton{
  display:inline-block;font-family:var(--data);font-size:.84rem;font-weight:500;letter-spacing:.02em;
  padding:.72rem 1.35rem;border-radius:var(--rayon);text-decoration:none;border:1px solid var(--sol);
  background:var(--sol);color:var(--chaux);transition:.16s;
}
.bouton:hover{background:var(--gore-fonce);border-color:var(--gore-fonce);color:#fff;}
.bouton--creux{background:transparent;color:var(--sol);}
.bouton--creux:hover{background:var(--sol);color:var(--chaux);}
.bande--fonce .bouton{background:var(--chaux);border-color:var(--chaux);color:var(--sol);}
.bande--fonce .bouton--creux{background:transparent;color:var(--chaux);}
.actions{display:flex;flex-wrap:wrap;gap:.7rem;}

/* ---------- pied de page ---------- */
.pied{background:var(--sol);color:#C9C2B6;padding:3rem clamp(1rem,3vw,2rem) 2rem;font-family:var(--data);font-size:.84rem;}
.pied-in{max-width:1360px;margin:0 auto;display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));}
.pied h4{color:#fff;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;margin-bottom:.9rem;}
.pied a{color:#C9C2B6;text-decoration:none;display:block;padding:.22rem 0;}
.pied a:hover{color:var(--gore);}
.pied-bas{max-width:1360px;margin:2.5rem auto 0;padding-top:1.2rem;border-top:1px solid #2E2921;font-size:.76rem;color:#8A8377;}

/* ---------- fil d'ariane et titraille de chapitre ---------- */
.entree{padding:clamp(2.5rem,6vw,4.5rem) 0 clamp(1.8rem,4vw,3rem);border-bottom:1px solid var(--limon);margin-bottom:clamp(2rem,4vw,3.5rem);}
.entree-in{max-width:1360px;margin:0 auto;padding:0 clamp(1rem,3vw,2rem);}
.fil{font-family:var(--data);font-size:.72rem;color:var(--galet-clair);margin-bottom:1rem;}
.fil a{color:var(--galet-clair);text-decoration:none;}
.fil a:hover{color:var(--gore);}

.js .revele{opacity:0;transform:translateY(14px);transition:opacity .55s ease,transform .55s ease;}
.js .revele.vu{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){.js .revele{opacity:1;transform:none;}}

.saut{position:absolute;left:-9999px;}
.saut:focus{left:1rem;top:.5rem;z-index:200;background:var(--sol);color:#fff;padding:.6rem 1rem;border-radius:var(--rayon);font-family:var(--data);font-size:.85rem;}

@media print{
  .entete,.sommaire,.pied,.outil,.actions{display:none !important;}
  body{background:#fff;font-size:11pt;}
  main{padding-top:0;}
  .chapitre{display:block;}
  a{color:#000;text-decoration:none;}
  .fiche{break-inside:avoid;}
}