@font-face{font-family:'Lilita One';src:url(/fonts/lilita-one-latin-400-normal.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Patrick Hand SC';src:url(/fonts/patrick-hand-sc-latin-400-normal.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Atkinson Hyperlegible';src:url(/fonts/atkinson-hyperlegible-latin-400-normal.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Atkinson Hyperlegible';src:url(/fonts/atkinson-hyperlegible-latin-700-normal.woff2) format('woff2');font-weight:700;font-display:swap}

:root{
  --encre:#1A1A1A; --papier:#FFFFFF; --ivoire:#FFFCF3; --jaune:#F7C948; --creme:#FFF7C2;
  --ciel:#8EC5E8; --rouge:#D6403A; --nuit:#2E3A6E; --vert:#5BA56B; --gris:#4A4A4A;
  --trame:#E7E2D4; --trame-fonce:#D3CCB9;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--papier);color:var(--encre);font-family:'Atkinson Hyperlegible',system-ui,sans-serif;font-size:18px;line-height:1.5}
h1,h2,h3{font-family:'Lilita One',sans-serif;font-weight:400;line-height:1.05;margin:0}
p{margin:0}
a{color:inherit}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--encre);outline-offset:3px;box-shadow:0 0 0 7px var(--jaune)}
img{max-width:100%}
.wrap{max-width:1320px;margin:0 auto;padding-inline:40px}
.cap{font-family:'Patrick Hand SC',cursive;line-height:1.15}
.pan{border:3px solid var(--encre);background:var(--papier);box-shadow:5px 5px 0 var(--encre)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 22px;background:var(--rouge);color:#fff;border:3px solid var(--encre);box-shadow:4px 4px 0 var(--encre);font-weight:700;text-decoration:none;font-size:17px;line-height:1.15;text-align:center;font-family:inherit;cursor:pointer}
.btn.alt{background:#fff;color:var(--encre)}
.btn.y{background:var(--jaune);color:var(--encre)}
.bub{background:#fff;border:2.5px solid var(--encre);border-radius:20px;padding:10px 16px;font-family:'Patrick Hand SC',cursive;line-height:1.15;position:relative;color:var(--encre)}
.st{display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 6px;border:2px solid var(--encre);border-radius:999px;font-size:14px;font-weight:700;line-height:1.2}
.st svg{flex:none}
.small{font-size:15px}
.visuellement-cache{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- en-tête ---------- */
.site-tete{border-bottom:3px solid var(--encre);background:#fff;position:relative;z-index:2}
.site-tete .barre{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:16px}
.logo{display:flex;align-items:center;gap:8px;text-decoration:none}
.logo svg{width:39px!important;height:41px!important;margin:-6px 0}
.logo-mot{font-family:'Lilita One';font-size:26px;color:var(--rouge);-webkit-text-stroke:1.2px var(--encre);paint-order:stroke fill}
.nav-principale{display:flex;gap:28px;font-weight:700;font-size:16px}
.nav-principale a{text-decoration:none;white-space:nowrap}
.aide-desk{white-space:nowrap}
@media screen and (max-width:1240px){.nav-principale{gap:16px;font-size:15px}.site-tete .barre{gap:16px}.aide-desk{font-size:14px;padding:0 12px}}
.nav-principale a[aria-current]{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:3px}
.aide-desk{min-height:44px;font-size:15px;padding:0 16px}
.nav-mobile{display:none;gap:10px;align-items:center}
.nav-mobile a{font-weight:700;font-size:14px}
.menu{width:42px;height:42px;display:flex;align-items:center;justify-content:center;background:var(--jaune);border:3px solid var(--encre);box-shadow:3px 3px 0 var(--encre);padding:0}

/* ---------- pied de page ---------- */
.site-pied{background:var(--nuit);color:#fff;border-top:3px solid var(--encre)}
.site-pied .barre{padding-block:30px;display:flex;justify-content:space-between;gap:20px 30px;flex-wrap:wrap;font-size:15px}
.site-pied nav{display:flex;gap:10px 24px;flex-wrap:wrap;font-weight:700}
.site-pied nav a{text-decoration:none}
.site-pied .un-pourcent{font-family:'Patrick Hand SC';font-size:18px;color:var(--jaune)}
.site-pied .credits{width:100%;font-size:13.5px;opacity:.85}

/* ---------- composant photo : la case d'album ---------- */
.album{margin:0;position:relative}
.album-cadre{background:var(--ivoire);border:3px solid var(--encre);padding:10px;box-shadow:6px 6px 0 rgba(26,26,26,.22)}
.album-cadre picture,.album-cadre img{display:block;width:100%;height:auto}
.album-cadre img{outline:1.5px solid var(--encre);outline-offset:0}
.album-legende{position:relative;display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:4px 18px;margin-top:-15px;padding-left:16px}
.cartouche{font-family:'Patrick Hand SC',cursive;font-size:19px;line-height:1.15;background:#fff;border:2.5px solid var(--encre);padding:5px 12px;max-width:26em}
.credit{font-size:13.5px;color:var(--gris);margin-top:20px;margin-left:auto}

/* ---------- accueil : bandeau ---------- */
.hero{position:relative;overflow:hidden;border-bottom:3px solid var(--encre);background:var(--ciel)}
.hero-grille{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 490px;gap:44px;padding-block:42px 54px}
.hero-texte{display:flex;flex-direction:column;gap:16px}
.hero h1{font-size:62px;max-width:12em}
.hero .promesse{font-size:21px;max-width:28em}
.hero-bulle{align-self:flex-end;margin-top:auto;margin-right:96px;width:250px;font-size:20px}
.hero-bulle::after{content:"";position:absolute;right:-17px;bottom:22px;width:24px;height:24px;background:#fff;border:2.5px solid var(--encre);border-left:0;border-bottom:0;transform:rotate(45deg) skew(12deg,12deg)}
.hero-photo{position:relative;justify-self:end;width:470px;margin-top:2px}
.aller-situations,.promesse-suite-mobile{display:none}
.album-hero{transform:rotate(-2deg)}
.hero-biscotte{position:absolute;left:-112px;bottom:-74px;z-index:1}
.hero-biscotte svg{width:164px!important;height:172px!important}

/* ---------- accueil : situations ---------- */
.situations{padding-block:40px 30px}
.situations h2{font-size:40px;margin-bottom:22px}
.tuiles{display:grid;grid-template-columns:repeat(4,1fr);gap:22px 24px;list-style:none;margin:0;padding:0}
.tuile{position:relative;display:flex;flex-direction:column;gap:6px;padding:16px 18px 18px;min-height:150px;text-decoration:none;height:100%}
.tuile b{font-family:'Lilita One';font-weight:400;font-size:27px;line-height:1.05;max-width:9em}
.tuile .cap{font-size:19px;max-width:11em}
.tuile .tuile-b{position:absolute;right:-14px;bottom:-12px}
.situations .apres{display:flex;gap:30px;margin-top:30px;font-size:16px;flex-wrap:wrap}

/* ---------- accueil : exemple de chapitre et méthode (repris de la v3) ---------- */
.exemple{padding-block:60px}
.exemple .grille{display:grid;grid-template-columns:420px 1fr;gap:40px;align-items:start}
.exemple .col{display:flex;flex-direction:column;gap:16px}
.exemple h2,.methode h2{font-size:42px}
.synthese{padding:18px 20px;display:flex;flex-direction:column;gap:10px;background:var(--creme)}
.synthese h3{font-size:22px}
.synthese ul{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:6px;font-size:16px}
.histoire{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding-top:36px;margin:0;list-style:none;padding-left:0}
.histoire figure{margin:0;position:relative;height:250px;overflow:hidden}
.histoire .fig-b{position:absolute;left:50%;bottom:-8px;transform:translateX(-50%)}
.histoire figcaption{position:absolute;left:12px;right:12px;top:12px;font-size:18px}
.methode{background:var(--creme);border-block:3px solid var(--encre)}
.methode .grille{padding-block:60px;display:grid;grid-template-columns:400px 1fr;gap:50px}
.methode .col{display:flex;flex-direction:column;gap:14px}
.statuts{padding:26px 28px;display:grid;grid-template-columns:repeat(3,1fr);gap:22px 26px;margin:0}
.statuts div{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.statuts dd{margin:0;font-size:15px}

/* ---------- chapitre ---------- */
.bande{position:relative;overflow:hidden;border-bottom:3px solid var(--encre)}
.bande-grille{position:relative;display:grid;grid-template-columns:1fr 280px;gap:30px;align-items:end;padding-block:26px 34px}
.bande-texte{display:flex;flex-direction:column;gap:12px}
.fil{font-size:15px;font-weight:700}
.fil a{text-decoration:none}
.fil span[aria-hidden]{margin-inline:8px}
.bande h1{font-size:60px}
.bande .cap{font-size:21px}
.bande .intro{font-size:20px;max-width:32em}
.bande .modes{display:flex;gap:14px;flex-wrap:wrap;margin-top:6px}
.bande-b{position:relative;height:150px}
.bande-b > div{position:absolute;right:20px;bottom:-74px}
.rouge{background:var(--rouge);color:#fff}
.rouge .cap{color:#fff}
.chap-corps{padding-block:48px 20px;display:grid;grid-template-columns:400px 1fr;gap:44px;align-items:start}
.chap-corps .synthese{position:sticky;top:20px}
.chap-corps .synthese h2{font-size:28px}
.chap-corps .synthese ul{font-size:17px;gap:10px}
.planches h2{font-size:28px;margin-bottom:16px}
.cases{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;list-style:none;margin:0;padding:0}
.case{margin:0;box-shadow:5px 5px 0 var(--encre)}
.case svg{display:block;width:100%;height:auto}
.rencontre{padding-block:44px 30px;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:44px;align-items:start}
.fiche{padding:22px 24px;display:flex;flex-direction:column;gap:14px}
.fiche h2{font-size:30px}
.fiche h3{font-size:20px}
.fiche ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px;font-size:16px}
.fiche li{display:flex;gap:10px;align-items:flex-start}
.case-a-cocher{width:22px;height:22px;border:2.5px solid var(--encre);background:#fff;flex:none;margin-top:1px}
.fiche .note{font-size:15px;padding:8px 12px;border:2px dashed var(--encre)}
.fiche .actions{display:flex;gap:12px;flex-wrap:wrap}
.fin{padding-block:30px 70px;display:grid;grid-template-columns:1fr 400px;gap:44px;align-items:start}
.a-propos{border:2px dashed var(--encre);padding:18px 22px;display:flex;flex-direction:column;gap:8px;font-size:16px}
.a-propos h2{font-size:24px}
.a-propos .liens{display:flex;gap:6px 22px;flex-wrap:wrap;font-weight:700}
.a-propos .credit-photo{font-size:14px;color:var(--gris)}
.a-completer{background:#F1EEE4;color:#5A5A5A;padding:0 5px;border-radius:3px;font-style:normal}
.suivant{padding:20px 22px;display:flex;flex-direction:column;gap:10px;background:var(--ciel)}
.suivant b{font-family:'Lilita One';font-weight:400;font-size:28px;line-height:1.05}

/* ---------- guide ---------- */
.nuit{background:var(--nuit);color:#fff}
.nuit .cap{color:var(--jaune)}
.guide-bande .bande-grille{padding-block:26px 120px;grid-template-columns:1fr 260px}
.guide-bande h1{font-size:52px;max-width:15em}
.guide-bande .sous-titre{display:block;font-size:.62em;margin-top:8px;color:var(--jaune)}
.guide-bande .bande-b > div{bottom:-150px}
.chapeau{max-width:34em;font-size:19px}
.meta{font-size:15px;display:flex;gap:6px 18px;flex-wrap:wrap}
.etoiles{position:absolute;inset:0;width:100%;height:100%}
.ouverture{max-width:1000px;margin:-96px auto 0;position:relative;z-index:1;padding-inline:40px}
.guide-corps{padding-block:44px 20px;display:grid;grid-template-columns:250px minmax(0,700px);gap:60px;justify-content:center;align-items:start}
.sommaire{position:sticky;top:20px;font-size:15.5px}
.sommaire nav{margin-top:10px}
.sommaire ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:7px;border-left:3px solid var(--encre);padding-left:14px}
.sommaire a{text-decoration:none}
.sommaire a:hover{text-decoration:underline}
.article{display:flex;flex-direction:column;gap:30px}
.article section{display:flex;flex-direction:column;gap:14px;scroll-margin-top:20px}
.article h2{font-size:31px}
.article p{max-width:38em}
.ref{font-size:.7em;line-height:0;margin-left:2px}
.ref a{text-decoration:none;font-weight:700;padding:0 2px}
.ref-sep{font-size:.7em;line-height:0;font-weight:700}
.reponse-rapide{padding:20px 24px;background:var(--creme)}
.reponse-rapide h2{font-size:26px}
.prochaine{padding:20px 24px;background:var(--jaune);display:grid!important;grid-template-columns:92px 1fr;gap:18px;align-items:start}
.prochaine h2{font-size:26px;margin-bottom:10px}
.prochaine > div:last-child{display:flex;flex-direction:column;gap:10px}
.journal{border:3px solid var(--encre);background:var(--ivoire);padding:16px 18px;display:flex;flex-direction:column;gap:12px}
.journal-tete{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.journal-tete h3{font-size:21px}
.journal-tete .btn{min-height:44px;font-size:15px;padding:0 14px}
.journal table{border-collapse:collapse;width:100%;font-size:14.5px;background:#fff}
.journal th{text-align:left;font-weight:700;padding:6px 8px;border:2px solid var(--encre);background:var(--creme);vertical-align:bottom}
.journal td{border:2px solid var(--encre);padding:0}
.sources ol{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:6px;font-size:16px}
.sources li{scroll-margin-top:20px}
.sources li:target{background:var(--creme)}
/* ---------- menu mobile ---------- */
.menu-panneau{border-top:3px solid var(--encre);background:#fff}
.menu-panneau ul{list-style:none;margin:0;padding:6px 0 14px}
.menu-panneau a{display:block;padding:12px 0;font-weight:700;font-size:18px;text-decoration:none;border-bottom:1.5px dashed #BDB6A3}
.menu-panneau a[aria-current]{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:3px}
.menu[aria-expanded=true]{background:#fff}
@media screen and (min-width:1081px){.menu-panneau{display:none!important}}

/* ---------- fiche de visite ---------- */
.contexte{border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.contexte legend{font-family:'Lilita One';font-size:20px;margin-bottom:6px;padding:0}
.choix{display:flex;gap:10px;align-items:center;font-size:16px;cursor:pointer}
.choix input,.coche input{width:22px;height:22px;margin:0;accent-color:var(--encre);flex:none}
.coche{display:flex;gap:10px;align-items:flex-start;cursor:pointer}
.coche input{margin-top:1px}
.fiche textarea,.journal textarea{width:100%;font:inherit;font-size:15.5px;line-height:1.4;border:2.5px solid var(--encre);padding:8px 10px;background:#fff;resize:vertical}
.fiche textarea:focus-visible,.journal textarea:focus-visible{outline:3px solid var(--encre);outline-offset:2px;background:#FFFBE6}
.discret{font-size:14px;color:var(--gris)}
.valeur{display:none}
.fiche-ctx{display:flex;flex-direction:column;gap:10px}
.fiche-ctx[hidden]{display:none}
.contexte-imprime{display:none}

/* ---------- journal dans son module ---------- */
.outil{border:3px solid var(--encre);background:var(--ivoire)}
.outil > summary{cursor:pointer;padding:14px 18px;font-family:'Lilita One';font-size:21px;list-style:none;display:flex;justify-content:space-between;gap:12px;align-items:center}
.outil > summary::-webkit-details-marker{display:none}
.outil > summary::after{content:"+";font-size:28px;line-height:1}
.outil[open] > summary::after{content:"−"}
.outil > .journal{border:0;border-top:2.5px dashed var(--encre)}
.journal td{padding:0;vertical-align:top}
.journal textarea{border:0;min-height:58px;resize:none;overflow:hidden}
.lire-rr{align-self:flex-start;min-height:46px;font-size:16px;padding:0 16px}
.sommaire > summary{font-family:'Lilita One';font-size:20px;cursor:pointer;list-style:none}
.sommaire > summary::-webkit-details-marker{display:none}
.sommaire > summary{display:flex;justify-content:space-between;align-items:center;gap:12px}
.sommaire > summary::after{content:"+";font-size:24px;line-height:1}
.sommaire[open] > summary::after{content:"−"}

/* ---------- impression ---------- */
@media print{
  @page{size:A4;margin:12mm}
  body{font-size:11pt;background:#fff}
  .site-tete .nav-principale,.site-tete .aide-desk,.nav-mobile,.menu-panneau,.site-pied nav,.modes,.lire-rr,.sommaire,.actions,.journal-tete .btn,.aller-situations{display:none!important}
  .hero-grille,.chap-corps,.rencontre,.fin,.guide-corps,.bande-grille{display:block!important}
  .ouverture{margin:12pt 0 0!important;padding:0!important;max-width:none}
  .bande{background:#fff!important;color:var(--encre)!important}
  .bande .etoiles,.bande svg[aria-hidden=true]{display:none}
  .bande .cap,.guide-bande .sous-titre{color:var(--encre)!important}
  .pan{box-shadow:none}
  textarea{display:none!important}
  .valeur{display:block;white-space:pre-wrap;overflow-wrap:anywhere;min-height:2.6em;padding:3pt 4pt;font-size:10.5pt;line-height:1.35}
  .journal table{table-layout:fixed;width:100%;border-collapse:collapse}
  .journal thead{display:table-header-group}
  .journal tr{break-inside:avoid;page-break-inside:avoid}
  .journal th,.journal td{border:1pt solid #1A1A1A;font-size:10pt;padding:0;vertical-align:top}
  .journal th{padding:4pt 5pt;background:#FFF7C2}
  .journal th:nth-child(1){width:22%}.journal th:nth-child(2){width:30%}.journal th:nth-child(3){width:24%}.journal th:nth-child(4){width:24%}
  .outil{border:0;background:#fff}
  .outil > summary{display:none}
  .fiche-ctx[hidden]{display:none!important}
  .contexte{display:none}
  .contexte-imprime{display:block;font-weight:700}
  .fiche .valeur{border:1pt solid #1A1A1A;min-height:5em}
  body.imprimer-journal .site-tete,body.imprimer-journal .site-pied,body.imprimer-journal .bande,body.imprimer-journal .ouverture,
  body.imprimer-journal .article > :not(:has(#journal)),body.imprimer-journal section:has(#journal) > :not(.outil){display:none!important}
  body.imprimer-journal .guide-corps{padding:0}
  body.imprimer-journal .journal{border:0;padding:0;background:#fff}
  body.imprimer-fiche .site-tete,body.imprimer-fiche .site-pied,body.imprimer-fiche .bande,body.imprimer-fiche .chap-corps,
  body.imprimer-fiche .fin,body.imprimer-fiche .rencontre > :not(#fiche){display:none!important}
  body.imprimer-fiche .rencontre{padding:0}
  body.imprimer-fiche #fiche{border:0;box-shadow:none;padding:0}
}

/* ---------- tablette ---------- */
@media screen and (max-width:1100px){
  .hero-grille{grid-template-columns:minmax(0,1fr) 340px;gap:30px}
  .hero-photo{width:320px}
  .hero-bulle{margin-right:70px;width:220px;font-size:18px}
  .hero h1{font-size:46px}
  .guide-bande .bande-b{height:auto;align-self:start;margin-top:26px}
  .guide-bande .bande-b > div{position:static}
  .guide-bande .bande-grille{padding-block:26px 120px}
  .tuiles{grid-template-columns:repeat(2,1fr)}
  .exemple .grille,.methode .grille{grid-template-columns:1fr}
  .chap-corps,.rencontre,.fin{grid-template-columns:1fr}
  .chap-corps .synthese{position:static}
  .guide-corps{grid-template-columns:1fr;gap:30px}
  .sommaire{position:static}
}
@media screen and (max-width:1080px){
  .nav-principale,.aide-desk{display:none}
  .nav-mobile{display:flex}
}

/* ---------- mobile ---------- */
@media screen and (max-width:700px){
  body{font-size:16px}
  .wrap{padding-inline:16px}
  .site-tete .barre{padding-block:10px}
  .logo-mot{font-size:22px}
  .logo svg{width:33px!important;height:35px!important}
  .hero-grille{grid-template-columns:1fr;gap:14px;padding-block:16px 30px}
  .hero-texte{gap:10px}
  .hero h1{font-size:28px}
  .hero .promesse{font-size:17px}
  .promesse-suite,.hero-bulle{display:none}
  .aller-situations{display:inline-flex;align-self:flex-start;min-height:46px;font-size:16px;padding:0 16px}
  .hero-photo{width:auto;justify-self:stretch;margin:4px 6px 0 2px}
  .album-hero{transform:rotate(-1.2deg)}
  .album-hero .album-cadre{padding:6px;border-width:2.5px;box-shadow:4px 4px 0 rgba(26,26,26,.22)}
  .album-hero .album-cadre img{outline-width:1px}
  .hero-biscotte{left:-10px;bottom:-46px}
  .hero-biscotte svg{width:88px!important;height:92px!important}
  .situations{padding-block:14px 26px}
  .situations h2{font-size:22px;margin-bottom:10px}
  .tuiles{grid-template-columns:1fr;gap:8px}
  .tuile{min-height:0;padding:7px 12px 8px;gap:0;box-shadow:3px 3px 0 var(--encre);border-width:2.5px}
  .tuile b{font-size:19px;line-height:1.1;max-width:none}
  .tuile .cap{font-size:15px;max-width:none}
  .tuile .tuile-b{display:none}
  .situations .apres{gap:8px;font-size:15px;margin-top:16px}
  .exemple{padding-block:36px}
  .exemple h2,.methode h2{font-size:28px}
  .histoire{grid-template-columns:1fr;padding-top:6px}
  .histoire figure{height:210px}
  .methode .grille{padding-block:36px;gap:22px}
  .statuts{grid-template-columns:1fr;padding:18px}
  .bande-grille{grid-template-columns:1fr 92px;gap:10px;padding-block:14px 18px}
  .bande h1,.guide-bande h1{font-size:30px}
  .bande .cap{font-size:17px}
  .bande .intro{font-size:15.5px}
  .bande .modes .btn{min-height:44px;font-size:15px;padding:0 12px}
  .bande-b{height:80px}
  .bande-b > div{right:-6px;bottom:-40px}
  .bande-b svg{width:96px!important;height:100px!important}
  .fil{font-size:13.5px}
  .chap-corps{padding-block:26px 6px;gap:26px}
  .chap-corps .synthese h2,.planches h2{font-size:23px}
  .chap-corps .synthese ul{font-size:15.5px}
  .cases{grid-template-columns:1fr;gap:16px}
  .rencontre{padding-block:26px 10px;gap:30px}
  .album-cadre{padding:6px;border-width:2.5px}
  .cartouche{font-size:16.5px;padding:4px 10px}
  .credit{font-size:12.5px;margin-top:6px;margin-left:0;width:100%}
  .album-legende{padding-left:10px;margin-top:-12px}
  .fiche{padding:16px}
  .fiche h2{font-size:24px}
  .fin{padding-block:20px 40px;gap:24px}
  .guide-bande .bande-grille{padding-block:14px 70px;grid-template-columns:1fr 96px}
  .guide-bande .etoiles g{display:none}
  .ouverture{margin-top:-56px;padding-inline:16px}
  .guide-corps{padding-block:26px 10px}
  .article h2{font-size:24px}
  .chapeau{font-size:16px}
  .reponse-rapide,.prochaine{padding:16px}
  .prochaine{grid-template-columns:60px 1fr;gap:12px}
  .prochaine-b svg{width:60px!important;height:63px!important}
  .journal{padding:12px}
  .journal thead{display:none}
  .journal table,.journal tbody,.journal tr,.journal td{display:block;width:100%}
  .journal tr{border:2px solid var(--encre);margin-bottom:10px;background:#fff}
  .journal td{border:0;border-bottom:1.5px dashed #BDB6A3;padding:6px 8px 0}
  .journal td:last-child{border-bottom:0}
  .journal td::before{content:attr(data-champ);display:block;font-weight:700;font-size:13px}
  .journal textarea{min-height:44px;padding:4px 0 8px}
  .site-pied .barre{padding-block:24px;font-size:14px}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
/* ---------- club et marques ---------- */
.club-bande{background:var(--ciel)}
.marques-bande{background:var(--creme)}
.club-grille{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:52px;align-items:center;padding-block:40px 46px}
.club-grille .texte{display:flex;flex-direction:column;gap:16px}
.club-grille h1{font-size:52px;max-width:14em}
.club-grille h1 .h1-nom{display:block;font-family:'Patrick Hand SC',cursive;font-size:24px;margin-bottom:10px}
.club-grille .intro{font-size:20px;max-width:32em}
.club-grille .actions{display:flex;flex-direction:column;gap:8px;align-items:flex-start;margin-top:4px}
.mention{font-size:15px}
.benefice{font-family:'Patrick Hand SC',cursive;font-size:23px;line-height:1.2;background:#fff;border:2.5px solid var(--encre);padding:8px 14px;align-self:flex-start;max-width:24em}
.club-case{margin:0;box-shadow:6px 6px 0 var(--encre)}
.club-case svg{display:block;width:100%;height:auto}
.texte-large{max-width:44em;font-size:19px;padding-top:44px}
.trois{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;padding-block:32px 10px}
.trois .pan{padding:22px 24px;display:flex;flex-direction:column;gap:12px}
.trois h2{font-size:26px}
.trois p{font-size:16.5px}
.rejoindre{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:48px;align-items:start;padding-block:52px 72px}
.rejoindre > div{display:flex;flex-direction:column;gap:14px}
.rejoindre h2{font-size:34px}
.rejoindre h2 + p{font-size:17px}
.faq{display:flex;flex-direction:column;gap:10px;margin-top:6px}
.faq details{border:2.5px solid var(--encre);background:#fff}
.faq summary{cursor:pointer;padding:12px 16px;font-weight:700;list-style:none;display:flex;justify-content:space-between;gap:12px;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:24px;line-height:1;flex:none}
.faq details[open] summary::after{content:"−"}
.faq details p{padding:0 16px 14px;font-size:16px}
.candidature{padding:24px 26px;display:flex;flex-direction:column;gap:18px;scroll-margin-top:20px}
.candidature h2{font-size:30px}
.champ{display:flex;flex-direction:column;gap:6px}
.champ label,.groupe legend{font-weight:700;font-size:15.5px}
.facultatif{font-weight:400;color:var(--gris)}
.aide{font-size:14px;color:var(--gris)}
.champ input,.champ select,.champ textarea{font:inherit;font-size:16px;border:2.5px solid var(--encre);background:#fff;min-height:46px;padding:8px 10px;width:100%;border-radius:0}
.champ textarea{min-height:92px;resize:vertical}
.champ input:focus-visible,.champ select:focus-visible,.champ textarea:focus-visible{outline:3px solid var(--encre);outline-offset:2px;background:#FFFBE6}
.champs-2{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:end}
.groupe{border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.groupe legend{margin-bottom:4px;padding:0}
.options{display:grid;grid-template-columns:1fr 1fr;gap:8px 16px}
.consentements{border-top:2px dashed var(--encre);padding-top:16px;display:flex;flex-direction:column;gap:10px}
.blocs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;padding-block:40px 10px}
.blocs .pan{padding:22px 24px;display:flex;flex-direction:column;gap:12px}
.blocs h2{font-size:28px}
.blocs .large{grid-column:1 / -1}
.appel{padding-block:30px 72px;display:flex;flex-direction:column;gap:12px;align-items:flex-start}
@media screen and (max-width:1100px){
  .club-grille{grid-template-columns:minmax(0,1fr) 300px;gap:32px}
  .club-grille h1{font-size:42px}
  .trois{grid-template-columns:1fr}
  .rejoindre{grid-template-columns:1fr}
}
@media screen and (max-width:700px){
  .club-grille{grid-template-columns:1fr;padding-block:18px 28px;gap:20px}
  .club-grille h1{font-size:30px}
  .club-grille h1 .h1-nom{font-size:19px;margin-bottom:6px}
  .club-grille .intro{font-size:16.5px}
  .club-case{max-width:300px;box-shadow:4px 4px 0 var(--encre)}
  .texte-large{font-size:16.5px;padding-top:28px}
  .trois{padding-block:22px 0;gap:18px}
  .trois .pan,.blocs .pan{padding:16px}
  .trois h2,.blocs h2{font-size:22px}
  .rejoindre{padding-block:34px 44px;gap:30px}
  .rejoindre h2{font-size:26px}
  .candidature{padding:18px 16px}
  .candidature h2{font-size:24px}
  .champs-2,.options,.blocs{grid-template-columns:1fr}
  .blocs{padding-block:26px 0;gap:18px}
}

/* ---------- intégration : marques d'aperçu et contenu Markdown ---------- */
.apercu{background:#111827;color:#fff;font-size:14px;padding:8px 16px;text-align:center}
.apercu b{color:#F7C948}
.marque-apercu{display:inline-block;font-size:12px;font-weight:700;background:#1A1A1A;color:#F7C948;padding:2px 8px;border-radius:3px;align-self:flex-start}
[data-raccord]{outline:2px dashed #D6403A;outline-offset:2px}
.prose{max-width:44em;display:flex;flex-direction:column;gap:14px}
.prose h2{font-size:30px;margin-top:14px}
.prose ul,.prose ol{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:6px}
.article ul,.article ol{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:6px;max-width:38em}
.article h3{font-size:22px}
.article blockquote{margin:0;padding:10px 16px;border-left:4px solid var(--encre);background:var(--ivoire)}
.article table{border-collapse:collapse;width:100%;font-size:15px}
.article th,.article td{border:1.5px solid var(--encre);padding:6px 8px;text-align:left;vertical-align:top}
/* lot 11 : tableaux du texte (papiers du jour J) : colonnes sur grand écran, fiches empilées sur mobile */
.tableau-texte{max-width:46em;margin:6px 0}
.tableau-texte th{background:var(--ivoire)}
@media (max-width:640px){
  .tableau-texte table,.tableau-texte tbody,.tableau-texte tr,.tableau-texte td{display:block;width:100%}
  .tableau-texte thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%)}
  .tableau-texte tr{border:1.5px solid var(--encre);margin-bottom:10px;background:#fff}
  .tableau-texte td{border:0;border-top:1px solid rgba(0,0,0,.12);padding:6px 10px}
  .tableau-texte td:first-child{border-top:0;background:var(--ivoire)}
  .tableau-texte td+td::before{content:attr(data-colonne);display:block;font-weight:700;font-size:13px}
}
.page-simple{padding-block:36px 60px}

/* ---------- lot 3 : guides reliés aux étapes, liste d'achat, fiche nuancée ---------- */
.masque{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;padding:0}
.guide-bande.fond-nuit{background:var(--nuit);color:#fff}
.guide-bande.fond-rouge{background:var(--rouge);color:#fff}
.guide-bande.fond-vert{background:var(--vert);color:var(--encre)}
.guide-bande.fond-ciel{background:var(--ciel);color:var(--encre)}
.guide-bande.fond-jaune{background:var(--jaune);color:var(--encre)}
.guide-bande.fond-lilas{background:#C9B3E6;color:var(--encre)}
.guide-bande.fond-peche{background:#F2C9A0;color:var(--encre)}
.guide-bande.fond-blanc{background:#fff;color:var(--encre)}
.guide-bande.clair .sous-titre{color:var(--encre)}
.guide-bande.clair .btn.y{background:#fff}
.guide-bande.fonce .a-completer{background:rgba(255,255,255,.16);color:#fff}
.guide-bande .fil a{color:inherit}
.sources > p{font-size:16px;max-width:38em}
.meme-etape,.guides-etape{padding:18px 22px;background:var(--ivoire);display:flex;flex-direction:column;gap:10px}
.meme-etape h2,.guides-etape h2{font-size:26px}
.meme-etape ul,.guides-etape ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px}
.etapes-guide li{display:flex;flex-direction:column;gap:2px}
.etapes-guide a{font-weight:700;font-size:18px}
.autres-guides{border-top:2px dashed #BDB6A3;padding-top:10px!important}
.autres-guides a{font-weight:700}
.guides-etape li{display:flex;flex-direction:column;gap:2px}
.guides-etape a{font-size:18px}
.tuile .tuile-guides{font-size:14px;font-weight:700;margin-top:6px;align-self:flex-start;border:2px solid currentColor;padding:1px 8px;border-radius:999px}
.guides-accueil{padding-block:10px 46px;display:flex;flex-direction:column;gap:12px}
.guides-accueil h2{font-size:40px}
.guides-intro{font-size:18px;max-width:36em}
.cartes-guides{list-style:none;margin:6px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.carte-guide{display:flex;flex-direction:column;height:100%;text-decoration:none;color:var(--encre);background:#fff;overflow:hidden}
.carte-guide:hover b,.carte-guide:focus-visible b{text-decoration:underline}
.carte-bandeau{position:relative;display:flex;align-items:flex-end;min-height:84px;padding:10px 92px 10px 14px;border-bottom:3px solid var(--encre)}
.carte-bandeau .cap{font-size:17px;line-height:1.1}
.carte-b{position:absolute;right:8px;bottom:-6px}
.carte-texte{display:flex;flex-direction:column;gap:6px;padding:12px 14px 16px}
.carte-texte b{font-family:'Lilita One';font-weight:400;font-size:23px;line-height:1.08}
.carte-texte .small{font-size:15px}
.liste .besoin{display:block;padding:8px;font-weight:700}
.liste .statut-choix{border:0;margin:0;padding:6px 8px;display:flex;flex-direction:column;gap:5px}
.liste .statut-choix .choix{font-size:14px;gap:7px;line-height:1.2}
.liste .statut-choix .choix input{width:18px;height:18px}
.liste th:nth-child(1){width:13%}.liste th:nth-child(2){width:31%}.liste th:nth-child(3){width:30%}.liste th:nth-child(4){width:26%}
.ligne-fiche{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:4px 14px}
.ligne-fiche .coche{flex:1 1 16em}
.nuance{display:inline-flex;align-items:center;gap:6px;font-size:14px;color:var(--gris);cursor:pointer;white-space:nowrap}
.nuance input{width:18px;height:18px;margin:0;accent-color:var(--encre)}
@media screen and (max-width:1100px){
  .cartes-guides{grid-template-columns:1fr 1fr}
}
@media screen and (max-width:700px){
  .guides-accueil{padding-block:4px 30px}
  .guides-accueil h2{font-size:26px}
  .guides-intro{font-size:15.5px}
  .cartes-guides{grid-template-columns:1fr;gap:12px}
  .carte-bandeau{min-height:58px;padding-right:70px}
  .carte-b svg{width:54px!important;height:57px!important}
  .carte-texte b{font-size:20px}
  .tuile .tuile-guides{font-size:12.5px;margin-top:3px}
  .meme-etape,.guides-etape{padding:16px}
  .meme-etape h2,.guides-etape h2{font-size:22px}
  .liste .statut-choix{padding:4px 0 8px}
  .ligne-fiche{gap:2px 14px}
  .ligne-fiche .nuance{margin-left:32px}
}
@media print{
  .meme-etape,.guides-etape{display:none!important}
  .journal.liste th:nth-child(1){width:14%}.journal.liste th:nth-child(2){width:34%}.journal.liste th:nth-child(3){width:24%}.journal.liste th:nth-child(4){width:28%}
  .liste .statut-choix{padding:3pt 4pt;gap:2pt}
  .liste .statut-choix .choix{font-size:9pt;gap:4pt}
  .liste .statut-choix .choix input{width:10pt;height:10pt}
  .liste .besoin{padding:3pt 4pt;font-size:10pt}
  body.imprimer-liste .site-tete,body.imprimer-liste .site-pied,body.imprimer-liste .bande,body.imprimer-liste .ouverture,
  body.imprimer-liste .article > :not(:has(#liste)),body.imprimer-liste section:has(#liste) > :not(.outil),
  body.imprimer-liste .outil > summary,body.imprimer-liste .liste .discret{display:none!important}
  body.imprimer-liste .guide-corps{padding:0}
  body.imprimer-liste .outil{border:0;background:#fff}
  body.imprimer-liste .liste{border:0;padding:0;background:#fff}
  .nuance{font-size:9pt}
  .nuance input{width:10pt;height:10pt}
}
.etat h2{margin-top:26px}
.table-defile{overflow-x:auto;max-width:100%}
.etat table{border-collapse:collapse;width:100%;font-size:15px;background:#fff;margin-top:10px}
.etat th,.etat td{border:2px solid var(--encre);padding:6px 8px;vertical-align:top;text-align:left}
.etat th{background:var(--creme)}
.etat code{font-size:13px;overflow-wrap:anywhere}
.apercu a{color:inherit;font-weight:700;margin-left:6px}
.guide-bande .sous-titre::first-letter{text-transform:uppercase}
@media print{
  /* Guide imprimé en entier : le texte d'abord, sans la grande photo ni Biscotte décoratif. */
  .guide-bande .bande-b,.ouverture{display:none!important}
  .guide-bande .bande-grille{padding:0 0 8pt!important}
  .article section.pan,.a-propos{break-inside:avoid}
  .article h2{break-after:avoid;break-inside:avoid}
}

/* ---------- lot 4 : chapitres rédigés, synthèses, fiches et tableaux imprimables ---------- */
.bande.fond-chap-blanc{background:#fff}
.bande.fond-chap-jaune{background:var(--jaune)}
.bande.fond-chap-ciel{background:var(--ciel)}
.bande.fond-chap-nuit{background:var(--nuit);color:#fff}
.bande.fond-chap-nuit .cap{color:var(--jaune)}
.bande.fond-chap-nuit .fil a{color:#fff}
.bande.fond-chap-vert{background:var(--vert)}
.bande.fond-chap-lilas{background:#C9B3E6}
.bande.fond-chap-peche{background:#F2C9A0}
.cases.une{grid-template-columns:minmax(0,520px)}
.chap-texte{padding-block:12px 10px;display:flex;justify-content:center}
.chap-texte .article{width:100%;max-width:720px}
.chap-texte .article > p:first-child{font-size:19px}
.rencontre.seul{grid-template-columns:minmax(0,760px);justify-content:center}
.fin-col{display:flex;flex-direction:column;gap:24px}
.lignes-fiche li.ligne-fiche{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 16px;align-items:start;padding-bottom:8px;border-bottom:1.5px dashed #D3CCB9}
.lignes-fiche li.ligne-fiche:last-child{border-bottom:0}
.lignes-fiche .intitule{font-size:16px;line-height:1.35}
.etats{display:flex;gap:6px 14px;flex-wrap:wrap;justify-content:flex-end}
.etats .etat{display:inline-flex;align-items:center;gap:6px;font-size:14px;color:var(--gris);cursor:pointer;white-space:nowrap}
.etats .etat input{width:19px;height:19px;margin:0;accent-color:var(--encre)}
.tableau-chap{width:100%}
.tableau[data-colonnes="2"] th:nth-child(1){width:38%}
.tableau[data-colonnes="3"] th{width:33.3%}
.tableau .besoin{display:block;padding:8px;font-weight:700}
@media screen and (max-width:700px){
  .lignes-fiche li.ligne-fiche{grid-template-columns:1fr}
  .etats{justify-content:flex-start}
  .chap-texte .article > p:first-child{font-size:16.5px}
}
@media print{
  body.imprimer-fiche .chap-texte{display:none!important}
  .lignes-fiche li.ligne-fiche{grid-template-columns:minmax(0,1fr) auto;break-inside:avoid;padding-bottom:3pt}
  .lignes-fiche .intitule{font-size:10.5pt}
  .etats .etat{font-size:9pt;gap:3pt}
  .etats .etat input{width:10pt;height:10pt}
  body.imprimer-bloc .site-tete,body.imprimer-bloc .site-pied,body.imprimer-bloc .apercu,body.imprimer-bloc .marque-apercu{display:none!important}
  body.imprimer-bloc main :not(:has(.a-imprimer)):not(.a-imprimer):not(.a-imprimer *){display:none!important}
  body.imprimer-bloc .wrap,body.imprimer-bloc .rencontre{padding:0!important;display:block!important}
  body.imprimer-bloc .a-imprimer{border:0!important;background:#fff!important}
  body.imprimer-bloc .a-imprimer > summary,body.imprimer-bloc .a-imprimer .discret,body.imprimer-bloc .a-imprimer .journal-tete .btn{display:none!important}
  body.imprimer-bloc .a-imprimer .journal{border:0;padding:0;background:#fff}
  .tableau .besoin{padding:3pt 4pt;font-size:10pt}
  .chap-texte .article > p:first-child{font-size:11pt}
}
@media print{
  .journal.tableau[data-colonnes="3"] th{width:33.3%!important}
  .journal.tableau[data-colonnes="2"] th:nth-child(1){width:38%!important}
  .journal.tableau[data-colonnes="2"] th:nth-child(2){width:62%!important}
}
.resume-etats{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px 14px;margin:10px 0 0}
.resume-etats li{border:2px solid var(--encre);padding:4px 10px;background:#fff}
.etat-pastille{display:inline-block;font-weight:700;font-size:13.5px;padding:2px 8px;border:2px solid currentColor;white-space:nowrap}
.etat-pastille.ok{color:#2E7D46}.etat-pastille.relire{color:#1F4E8C}.etat-pastille.editeur{color:#B3261E}.etat-pastille.fonction{color:#7A4E00}.etat-pastille.rediger{color:#555}

/* ---------- lot 5 : fiches (pièces attendues, notes séparées), règles et exemple des tableaux, schémas ---------- */
.fiche ul.lignes-info{display:block;list-style:disc;padding-left:1.3em;margin:0}
.fiche ul.lignes-info li{display:list-item;margin:4px 0;font-size:16px;line-height:1.35}
.rubriques{display:grid;gap:12px}
.rubrique label{display:block;margin-bottom:4px;font-size:16px}
.rubrique .aide{color:var(--gris);font-size:14px;font-weight:400}
.regles{margin:4px 0 10px;padding-left:1.3em;font-size:15.5px;line-height:1.4}
.regles li{margin:2px 0}
.exemple-rempli{margin-top:14px;border:2px dashed var(--encre);padding:8px 12px;background:#FFFDF4}
.exemple-rempli > summary{cursor:pointer;font-weight:700}
.exemple-rempli table{margin-top:8px}
.exemple-rempli th[scope="row"]{text-align:left;font-weight:700}
figure.schema{margin:14px 0 18px;padding:0}
figure.schema > svg{display:block;width:100%;max-width:440px;height:auto;border:3px solid var(--encre);background:#fff}
figure.schema figcaption{font-size:14.5px;color:var(--gris);margin-top:6px;max-width:600px}
@media print{
  .exemple-rempli{display:none!important}
  .rubrique{break-inside:avoid}
  .rubrique label{font-size:10.5pt;margin-bottom:2pt}
  .rubrique .aide{font-size:9pt}
  .fiche .rubrique .valeur{min-height:3.2em}
  .fiche ul.lignes-info li{font-size:10.5pt;margin:1pt 0}
  .regles{font-size:10pt;margin:2pt 0 6pt}
  figure.schema{break-inside:avoid}
  figure.schema > svg{max-width:120mm}
}
.etats-fiche{list-style:none;margin:0;padding:26px 28px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 26px;background:#fff}
.etats-fiche li{display:flex;flex-direction:column;gap:6px}
.etats-fiche b{align-self:flex-start;border:2.5px solid var(--encre);padding:3px 10px;font-size:15px;background:var(--creme)}
.etats-fiche span{font-size:15px;line-height:1.4}
@media screen and (max-width:700px){.etats-fiche{grid-template-columns:1fr;padding:18px}}
