@charset "utf-8";
/* Atelier du Reportage — atelier / papier: crème, terre cuite, olive, titres slab */
:root{
  --papier:#f7f4ec;
  --papier-clair:#fffdf7;
  --papier-tiede:#f0eade;
  --encre:#221d18;
  --encre-doux:#54493e;
  --terre:#a94a26;
  --terre-vif:#c05c33;
  --terre-pale:#f2dfd5;
  --olive:#4f6030;
  --olive-pale:#e3e7d4;
  --trait:#d9cfba;
  --trait-fort:#b9ad93;
  --rayon:3px;
  --sans:system-ui,"Segoe UI",Candara,Optima,"Gill Sans Nova","Trebuchet MS",Verdana,sans-serif;
  --slab:Rockwell,"Rockwell Nova","Roboto Slab","Bookman Old Style","Bitstream Vera Serif",Georgia,serif;
  --mono:"IBM Plex Mono",Consolas,"DejaVu Sans Mono","Courier New",monospace;
  --ligne:32px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--papier);color:var(--encre);
  font:400 17px/1.62 var(--sans);
  background-image:linear-gradient(90deg,rgba(169,74,38,.10) 0 1px,transparent 1px 100%);
  background-size:100% 100%;
}
body.modal-open{overflow:hidden}
h1,h2,h3,h4{font-family:var(--slab);font-weight:600;line-height:1.18;letter-spacing:-.005em;margin:0 0 .55em}
h1{font-size:clamp(1.95rem,4.4vw,3rem)}
h2{font-size:clamp(1.4rem,2.5vw,1.9rem)}
h3{font-size:1.12rem}
p{margin:0 0 1.05em}
a{color:var(--terre);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{color:var(--encre)}
img,svg{max-width:100%;height:auto}
strong{font-weight:700}
small{font-size:.83rem}
code{font-family:var(--mono);font-size:.92em;background:var(--papier-tiede);padding:.1em .35em;border:1px solid var(--trait)}
:focus-visible{outline:3px solid var(--olive);outline-offset:2px}
.cadre{width:min(1140px,calc(100% - 2.5rem));margin-inline:auto}
.cadre.etroit{width:min(760px,calc(100% - 2.5rem))}
.lien-evitement{position:absolute;left:-9999px;top:0;background:var(--encre);color:var(--papier-clair);padding:.7rem 1.1rem;z-index:60}
.lien-evitement:focus{left:.6rem;top:.6rem}

/* ---------- bandeau d'avis ---------- */
.bandeau-avis{background:var(--encre);color:#f3ece2;font-size:.86rem;line-height:1.5;padding:.7rem 1.25rem;text-align:center}
.bandeau-avis strong{color:#f0c3a9}

/* ---------- en-tête ---------- */
.entete{background:var(--papier-clair);border-bottom:2px solid var(--trait);position:sticky;top:0;z-index:40}
.barre-nav{display:flex;align-items:center;gap:1rem;padding:.85rem 0;flex-wrap:wrap}
.marque{display:flex;align-items:center;gap:.65rem;text-decoration:none;color:var(--encre);font-family:var(--slab);font-size:1.14rem;margin-right:auto}
.marque-sceau{display:grid;place-items:center;width:40px;height:40px;background:var(--terre);color:#fff;font-family:var(--slab);font-size:.95rem;letter-spacing:.04em;border-radius:2px;box-shadow:3px 3px 0 var(--olive)}
.marque-texte small{display:block;font-family:var(--sans);font-size:.7rem;letter-spacing:.09em;text-transform:uppercase;color:var(--encre-doux);font-weight:600}
.bascule-nav{display:none;font:600 .9rem var(--sans);background:var(--papier-tiede);border:1.5px solid var(--trait-fort);color:var(--encre);padding:.5rem .9rem;cursor:pointer;border-radius:2px}
.nav-principale{display:flex;gap:1.1rem;flex-wrap:wrap}
.nav-principale a{font:600 .93rem var(--sans);text-decoration:none;color:var(--encre-doux);padding:.3rem 0;border-bottom:2px solid transparent}
.nav-principale a:hover,.nav-principale a[aria-current=page]{color:var(--terre);border-bottom-color:var(--terre)}
@media (max-width:860px){
  .bascule-nav{display:block}
  .nav-principale{display:none;width:100%;flex-direction:column;gap:0;border-top:1px solid var(--trait);margin-top:.6rem}
  .nav-principale.ouverte{display:flex}
  .nav-principale a{padding:.7rem 0;border-bottom:1px solid var(--trait)}
}

/* ---------- héros ---------- */
.heros{padding:3.2rem 0 2.6rem;border-bottom:2px solid var(--trait);background:
  linear-gradient(180deg,var(--papier-clair),var(--papier))}
.heros-grille{display:grid;grid-template-columns:1.05fr .95fr;gap:2.6rem;align-items:start}
.heros-copie .chapo{font-size:1.12rem;color:var(--encre-doux)}
.chapo-kicker{font:700 .74rem/1.3 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--olive);margin:0 0 .8rem}
.heros h1 em{font-style:normal;color:var(--terre);text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:5px}
.bouton{display:inline-block;font:700 .95rem var(--sans);background:var(--terre);color:#fff;border:0;padding:.8rem 1.4rem;text-decoration:none;cursor:pointer;border-radius:2px;box-shadow:4px 4px 0 var(--encre)}
.bouton:hover{background:var(--encre);color:#fff}
.bouton.secondaire{background:var(--papier-tiede);color:var(--encre);box-shadow:4px 4px 0 var(--trait-fort)}
.bouton-texte{font:600 .88rem var(--sans);background:none;border:0;border-bottom:1.5px dashed var(--terre);color:var(--terre);cursor:pointer;padding:0 0 2px}
.note-gratuite{margin-top:1.6rem;background:var(--olive-pale);border-left:5px solid var(--olive);padding:.9rem 1.1rem;font-size:.93rem}
.heros-carnet{background:var(--papier-clair);border:1.5px solid var(--trait);border-left:6px solid var(--terre);padding:1.1rem;box-shadow:8px 8px 0 var(--papier-tiede)}
.heros-carnet figcaption{font-size:.84rem;color:var(--encre-doux);margin-top:.6rem;border-top:1px dashed var(--trait);padding-top:.6rem}
.fiche-chiffres{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem;margin-top:1rem}
.fiche-chiffres div{background:var(--papier-tiede);padding:.6rem;border-top:3px solid var(--olive)}
.fiche-chiffres b{display:block;font-family:var(--slab);font-size:1.25rem;color:var(--terre)}
.fiche-chiffres span{font-size:.76rem;text-transform:uppercase;letter-spacing:.07em;color:var(--encre-doux)}
@media (max-width:900px){.heros-grille{grid-template-columns:1fr}}

/* ---------- sections ---------- */
.section{padding:2.9rem 0}
.section.teinte{background:var(--papier-tiede);border-block:1px solid var(--trait)}
.section.olive{background:var(--olive-pale);border-block:1px solid var(--trait)}
.tete-section{display:flex;justify-content:space-between;align-items:end;gap:1.2rem;flex-wrap:wrap;margin-bottom:1.6rem}
.intro-section{max-width:64ch;color:var(--encre-doux)}
.tete-page{padding:2.7rem 0 2.1rem;border-bottom:2px solid var(--trait);background:var(--papier-clair)}
.tete-page .chapo{font-size:1.08rem;color:var(--encre-doux)}

/* ---------- grilles de cartes ---------- */
.grille-fiches{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.1rem}
.fiche{background:var(--papier-clair);border:1.5px solid var(--trait);border-top:4px solid var(--terre);padding:1.15rem;text-decoration:none;color:inherit;display:block}
.fiche:hover{border-top-color:var(--olive);box-shadow:5px 5px 0 var(--papier-tiede)}
.fiche h3{margin-bottom:.4rem}
.fiche p{margin:0;font-size:.94rem;color:var(--encre-doux)}
.fiche .compteur{font:700 .74rem var(--sans);letter-spacing:.14em;color:var(--olive);display:block;margin-bottom:.5rem}
.grille-matieres{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:.9rem}
.grille-matieres a{display:block;background:var(--papier-clair);border:1.5px solid var(--trait);padding:.95rem 1rem;text-decoration:none;color:inherit;
  background-image:repeating-linear-gradient(180deg,transparent 0 27px,var(--trait) 27px 28px)}
.grille-matieres a:hover{border-color:var(--terre)}
.grille-matieres b{display:block;font-family:var(--slab);font-size:1.03rem;color:var(--encre)}
.grille-matieres span{font-size:.86rem;color:var(--encre-doux)}
.paire{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:start}
.trio{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1.2rem}
@media (max-width:820px){.paire{grid-template-columns:1fr}}
.etiquettes{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem;padding:0;list-style:none}
.etiquettes li{font:600 .8rem var(--sans);background:var(--papier-clair);border:1px solid var(--trait-fort);padding:.35rem .7rem}

/* ---------- prose ---------- */
.prose{font-size:1.02rem}
.prose h2{margin-top:0}
.prose h3{margin-top:1.6rem}
.prose ul,.prose ol{padding-left:1.3rem}
.prose li{margin-bottom:.5rem}
.chapo{font-size:1.1rem;line-height:1.55}
.note-cadre{background:var(--terre-pale);border-left:5px solid var(--terre);padding:.8rem 1rem;font-size:.93rem;margin:1.2rem 0 0}

/* ---------- leçons numérotées ---------- */
.tete-lecon{padding:2.7rem 0 2.2rem;background:var(--papier-clair);border-bottom:2px solid var(--trait)}
.disposition-lecon{display:grid;grid-template-columns:250px 1fr;gap:2.4rem;padding:2.4rem 0}
.rail-lecture{position:sticky;top:5.4rem;align-self:start;background:var(--papier-clair);border:1.5px solid var(--trait);padding:1rem;font-size:.9rem}
.rail-lecture strong{display:block;font-family:var(--slab);margin-bottom:.6rem;border-bottom:2px solid var(--terre);padding-bottom:.35rem}
.rail-lecture ol{margin:0;padding-left:1.2rem}
.rail-lecture li{margin-bottom:.4rem}
.rail-lecture a{text-decoration:none;color:var(--encre-doux)}
.rail-lecture a:hover{color:var(--terre);text-decoration:underline}
@media (max-width:900px){.disposition-lecon{grid-template-columns:1fr}.rail-lecture{position:static}}
.bloc-lecon{position:relative;padding:1.4rem 0 1.1rem 0;border-top:1px solid var(--trait)}
.bloc-lecon:first-of-type{border-top:0}
.lecon-num{display:inline-grid;place-items:center;width:34px;height:34px;background:var(--olive);color:#fff;font:700 .85rem var(--slab);border-radius:2px;margin-bottom:.7rem}
.cahier{background:
  repeating-linear-gradient(180deg,transparent 0 calc(var(--ligne) - 1px),rgba(185,173,147,.35) calc(var(--ligne) - 1px) var(--ligne));
  background-attachment:local;padding-left:1.4rem;border-left:2px solid var(--terre-pale)}

/* ---------- tableaux ---------- */
.cadre-tableau{overflow-x:auto;margin:1.4rem 0;border:1.5px solid var(--trait);background:var(--papier-clair)}
table{border-collapse:collapse;width:100%;font-size:.93rem}
caption{caption-side:top;text-align:left;font:700 .85rem var(--sans);letter-spacing:.03em;padding:.7rem .9rem;background:var(--papier-tiede);border-bottom:1.5px solid var(--trait);color:var(--encre)}
th,td{padding:.6rem .9rem;border-bottom:1px solid var(--trait);text-align:left;vertical-align:top}
thead th{background:var(--olive-pale);font-size:.82rem;text-transform:uppercase;letter-spacing:.06em}
tbody th{font-weight:700;color:var(--encre);width:26%}
tbody tr:last-child th,tbody tr:last-child td{border-bottom:0}

/* ---------- listes de contrôle, encadrés, frises ---------- */
.liste-controle{background:var(--papier-clair);border:1.5px solid var(--trait);border-left:6px solid var(--olive);padding:1.1rem 1.2rem;margin:1.5rem 0}
.liste-controle h3{margin-top:0;font-size:1.03rem}
.liste-controle ul{list-style:none;padding:0;margin:0}
.liste-controle li{position:relative;padding-left:1.7rem;margin-bottom:.5rem;font-size:.96rem}
.liste-controle li::before{content:"";position:absolute;left:0;top:.35em;width:11px;height:11px;border:2px solid var(--terre);background:var(--papier)}
.encadre{background:var(--papier-tiede);border:1.5px dashed var(--trait-fort);padding:1.05rem 1.2rem;margin:1.5rem 0}
.encadre h3{margin-top:0}
.encadre.attention{background:var(--terre-pale);border-style:solid;border-color:var(--terre)}
.encadre.calme{background:var(--olive-pale);border-style:solid;border-color:var(--olive)}
.encadre ul,.encadre ol{margin:.6rem 0 0;padding-left:1.25rem}
.encadre li{margin-bottom:.5rem;font-size:.96rem}
.encadre ol>li>strong{font-family:var(--slab)}
.encadre ol+p{margin:.9rem 0 0;font-size:.93rem}
.encadre-formule{background:var(--encre);color:#f2ece2;padding:1.1rem 1.2rem;margin:1.5rem 0;border-left:6px solid var(--terre-vif)}
.encadre-formule strong{display:block;font-family:var(--slab);margin-bottom:.6rem;color:#f0c3a9}
.encadre-formule code{display:block;background:rgba(255,255,255,.08);border:0;color:#fdf6ee;padding:.45rem .6rem;margin-bottom:.4rem}
.encadre-formule p{margin:.6rem 0 0;font-size:.9rem;color:#ddd2c4}
.frise{margin:1.6rem 0}
.frise ol{list-style:none;padding:0;margin:0;border-left:2px solid var(--terre-pale)}
.frise li{position:relative;padding:0 0 1rem 1.5rem}
.frise li p{margin:.2rem 0 0;font-size:.94rem;color:var(--encre-doux)}
.etape-num{position:absolute;left:-15px;top:0;width:28px;height:28px;display:grid;place-items:center;background:var(--terre);color:#fff;font:700 .74rem var(--mono);border-radius:50%}

/* ---------- questions ---------- */
details{background:var(--papier-clair);border:1.5px solid var(--trait);padding:.85rem 1rem;margin-bottom:.7rem}
details[open]{border-color:var(--terre)}
summary{font:700 1rem var(--slab);cursor:pointer}
summary::marker{color:var(--terre)}
details p{margin:.7rem 0 0;font-size:.96rem;color:var(--encre-doux)}
.groupe-questions{margin-bottom:2.2rem}
.groupe-questions h2{border-bottom:2px solid var(--terre);padding-bottom:.4rem}

/* ---------- glossaire ---------- */
.glossaire{margin:1.6rem 0}
.glossaire div{border-bottom:1px solid var(--trait);padding:.85rem 0}
.glossaire dt{font:700 1.02rem var(--slab);color:var(--encre)}
.glossaire dd{margin:.35rem 0 0;font-size:.96rem;color:var(--encre-doux)}
.glossaire dd em{font-style:normal;color:var(--olive);font-weight:600}

/* ---------- outil interactif ---------- */
.outil{background:var(--papier-clair);border:2px solid var(--encre);padding:1.3rem;margin:1.6rem 0;box-shadow:8px 8px 0 var(--papier-tiede)}
.outil-champs{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;margin-bottom:1rem}
.outil-champs label{font:600 .87rem var(--sans);display:block;color:var(--encre-doux)}
.outil-champs input{width:100%;margin-top:.35rem;font:400 1rem var(--mono);padding:.55rem .6rem;border:1.5px solid var(--trait-fort);background:var(--papier);color:var(--encre)}
.outil-resultats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.8rem;margin:1rem 0}
.outil-resultats p{margin:0;background:var(--papier-tiede);border-top:3px solid var(--terre);padding:.7rem}
.outil-resultats span{display:block;font-size:.78rem;text-transform:uppercase;letter-spacing:.07em;color:var(--encre-doux)}
.outil-resultats strong{font-family:var(--slab);font-size:1.28rem;color:var(--encre)}
.outil-erreur{background:var(--terre-pale);border-left:5px solid var(--terre);padding:.6rem .8rem;font-size:.9rem;margin:0 0 1rem}
.outil-formule code{display:block;margin-bottom:.3rem}
.outil-note{font-size:.87rem;color:var(--encre-doux)}

/* ---------- formulaire de contact ---------- */
.formulaire-contact fieldset{border:0;margin:0;padding:0;min-width:0}
.formulaire-legende{font:700 .76rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--olive);padding:0;margin-bottom:.9rem}
.outil-champs.pleine{grid-template-columns:1fr}
.outil-champs select,.outil-champs textarea{width:100%;margin-top:.35rem;font:400 1rem var(--sans);padding:.55rem .6rem;border:1.5px solid var(--trait-fort);background:var(--papier);color:var(--encre)}
.outil-champs textarea{line-height:1.55;resize:vertical;min-height:9rem}
.outil-champs select:hover,.outil-champs textarea:hover{border-color:var(--terre)}
.champ-accord{display:grid;grid-template-columns:auto 1fr;gap:.7rem;align-items:start;background:var(--papier-tiede);border-left:5px solid var(--olive);padding:.8rem .95rem;margin:0 0 1.1rem;font:400 .93rem var(--sans);color:var(--encre)}
.champ-accord input[type=checkbox]{width:18px;height:18px;margin:.25rem 0 0;accent-color:var(--terre)}
.formulaire-avis{background:var(--terre-pale);border-left:5px solid var(--terre);padding:.75rem .95rem;font-size:.9rem;margin:0 0 1.2rem}

/* ---------- fil de lecture suivante ---------- */
.fil-suite{margin:2.2rem 0 0;padding-top:1.1rem;border-top:2px solid var(--terre);display:flex;flex-wrap:wrap;gap:1rem;align-items:center}
.fil-suite span{font:700 .76rem var(--sans);letter-spacing:.13em;text-transform:uppercase;color:var(--olive)}
.fil-suite a{font-weight:600;text-decoration:none;border-bottom:1.5px solid var(--terre-pale)}
.fil-suite a:hover{border-bottom-color:var(--terre)}

/* ---------- sommaire ---------- */
.groupe-sommaire{margin-bottom:2rem}
.groupe-sommaire h2{border-bottom:2px solid var(--trait);padding-bottom:.35rem}
.groupe-sommaire ul{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:.4rem}
.groupe-sommaire li{padding:.3rem 0 .3rem .9rem;border-left:3px solid var(--terre-pale)}
.groupe-sommaire li a{text-decoration:none;font-weight:600}
.groupe-sommaire li span{display:block;font-size:.84rem;color:var(--encre-doux);font-weight:400}

/* ---------- contact ---------- */
.fiche-operateur{background:var(--papier-clair);border:1.5px solid var(--trait);border-top:5px solid var(--olive);padding:1.2rem;margin:1.5rem 0}
.fiche-operateur dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:.4rem 1rem;font-size:.96rem}
.fiche-operateur dt{font-weight:700}
.fiche-operateur dd{margin:0}

/* ---------- pied ---------- */
.pied{background:var(--encre);color:#e5dbcd;margin-top:3rem;padding:2.6rem 0 1.6rem;font-size:.94rem}
.pied a{color:#f0c3a9;text-decoration:none}
.pied a:hover{color:#fff;text-decoration:underline}
.pied h2{font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;font-family:var(--sans);color:#bfae99;margin-bottom:.7rem}
.pied-grille{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:1.8rem}
.pied-grille ul{list-style:none;padding:0;margin:0}
.pied-grille li{margin-bottom:.42rem}
.pied-marque .marque-sceau{box-shadow:3px 3px 0 #6d7f47;margin-bottom:.7rem}
.pied-adresse{font-size:.85rem;color:#b6a795}
@media (max-width:900px){.pied-grille{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.pied-grille{grid-template-columns:1fr}}
.encadre-limites{margin-top:2rem;background:rgba(255,255,255,.05);border-left:5px solid var(--terre-vif);padding:1rem 1.2rem;font-size:.87rem;line-height:1.6;color:#dcd0c0}
.encadre-limites strong{color:#f0c3a9}
.pied-bas{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;align-items:center;margin-top:1.4rem;padding-top:1rem;border-top:1px solid rgba(255,255,255,.16);font-size:.84rem;color:#b6a795}
.pied-bas .bouton-texte{color:#f0c3a9;border-bottom-color:#f0c3a9}

/* ---------- modale et cookies ---------- */
.modale-accueil{position:fixed;inset:0;z-index:70;display:grid;place-items:center;padding:1.2rem;background:rgba(34,29,24,.55);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.modale-accueil[hidden]{display:none}
.modale-feuille{background:var(--papier-clair);border:2px solid var(--encre);max-width:640px;max-height:88vh;overflow-y:auto;padding:1.6rem;box-shadow:10px 10px 0 rgba(79,96,48,.55)}
.modale-feuille h2{margin-bottom:.7rem}
.modale-feuille p{font-size:.96rem}
.bandeau-cookies{position:fixed;bottom:0;left:0;right:0;z-index:65;background:var(--papier-clair);border-top:3px solid var(--terre);padding:1rem 1.2rem;box-shadow:0 -8px 24px -18px rgba(34,29,24,.9)}
.bandeau-cookies[hidden]{display:none}
.cookies-corps{width:min(1140px,100%);margin-inline:auto;display:flex;gap:1.4rem;align-items:center;justify-content:space-between;flex-wrap:wrap}
.cookies-corps p{margin:.35rem 0 0;font-size:.87rem;color:var(--encre-doux);max-width:70ch}
.cookies-boutons{display:flex;gap:.7rem;align-items:center;flex-wrap:wrap}

/* ---------- utilitaires ---------- */
.visuel-diagramme{background:var(--papier-clair);border:1.5px solid var(--trait);padding:1rem}
.mention-fine{font-size:.85rem;color:var(--encre-doux)}
.grille-roles{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem;margin:1.4rem 0}
.grille-roles article{background:var(--papier-clair);border:1.5px solid var(--trait);border-left:5px solid var(--terre);padding:1rem}
.grille-roles h3{margin-top:0;font-size:1rem}
.grille-roles p{margin:0;font-size:.93rem;color:var(--encre-doux)}

@media print{
  .entete,.bandeau-cookies,.modale-accueil,.rail-lecture,.lien-evitement{display:none!important}
  body{background:#fff}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}