/* Kiné de Club : feuille de style commune. Toutes les règles suivent DESIGN.md (à la racine du dépôt). */

/* Polices auto-hébergées (téléchargées au build, licence SIL Open Font License) */
@font-face{font-family:'Archivo';font-style:normal;font-weight:400 800;font-stretch:75% 100%;font-display:swap;src:url(/fonts/archivo-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Source Serif 4';font-style:normal;font-weight:400 600;font-display:swap;src:url(/fonts/source-serif-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* 1. Variables : les seules couleurs du site */
:root{
  --encre:#161514;
  --jaune:#DDF247;
  --papier:#F4F3EE;
  --papier-clair:#FBFAF7;
  --gris:#5A5751;
  --filet:#D6D3CA;
  --ok:#1D6B45;
  --erreur:#A3261D;

  --titre:'Archivo','Arial Narrow',Arial,sans-serif;
  --texte:'Source Serif 4',Georgia,'Times New Roman',serif;

  /* Grille de 8 px */
  --e1:.5rem;--e2:1rem;--e3:1.5rem;--e4:2rem;--e5:3rem;--e6:4rem;--e7:6rem;--e8:8rem;

  --largeur:1200px;
  --marge:clamp(16px,5vw,48px);
  --lecture:36em;
  --duree:150ms;
  --ease:cubic-bezier(.65,0,.35,1);
  --ease-out:cubic-bezier(.22,1,.36,1);
  color-scheme:light;
}

/* 2. Base */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;scroll-behavior:smooth;scroll-padding-top:5.5rem}
body{background:var(--papier);color:var(--encre);font-family:var(--texte);font-size:1.125rem;line-height:1.6;font-optical-sizing:auto;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.18em}
a:hover{text-decoration-thickness:2px}
::selection{background:var(--jaune);color:var(--encre)}
:focus-visible{outline:2px solid var(--encre);outline-offset:3px}
h1,h2,h3{text-wrap:balance;font-weight:800}
p,li,dd{text-wrap:pretty}
strong{font-weight:600}
.wrap{max-width:var(--largeur);margin-inline:auto;padding-inline:var(--marge)}
.insecable{white-space:nowrap}
.cache{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.saut{position:absolute;left:-9999px;top:0;z-index:100;background:var(--encre);color:var(--papier);font-family:var(--titre);font-weight:600;font-size:1rem;padding:var(--e1) var(--e2);text-decoration:none}
.saut:focus{left:var(--e2);top:var(--e2)}

/* Icônes Lucide (SVG intégrés) */
.ico{width:1.25rem;height:1.25rem;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}

/* Surligneur : un aplat d'une seule couleur (image de fond), tracé de gauche à droite et ligne après ligne */
mark{color:inherit;background-color:transparent;background-image:linear-gradient(var(--jaune),var(--jaune));background-repeat:no-repeat;background-position:left bottom;background-size:100% .42em;padding-inline:.06em;margin-inline:-.06em;transition:background-size 700ms var(--ease) var(--d,0ms)}

/* 3. Typographie */
h1{font-family:var(--titre);font-stretch:75%;font-size:clamp(2.75rem,7vw,4.75rem);line-height:.98;letter-spacing:-.012em}
h2{font-family:var(--titre);font-stretch:75%;font-size:clamp(2rem,4.5vw,3rem);line-height:1.02;letter-spacing:-.008em;max-width:20ch}
.titre-bloc{font-family:var(--titre);font-stretch:75%;font-weight:800;font-size:1.75rem;line-height:1.05}
h3{font-family:var(--titre);font-weight:600;font-size:1.375rem;line-height:1.2}
.chapeau{font-size:1.375rem;line-height:1.5;max-width:var(--lecture)}
.texte{max-width:var(--lecture)}
.texte>*+*{margin-top:var(--e2)}
.petit,figcaption,.source{font-family:var(--titre);font-weight:500;font-size:.875rem;line-height:1.4;color:var(--gris)}
.statut{font-family:var(--titre);font-weight:600;font-size:.875rem;line-height:1.4;display:flex;flex-wrap:wrap;gap:var(--e1) var(--e3)}
.statut .attente{color:var(--gris)}

/* 4. En-tête */
.haut{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:var(--papier);border-bottom:1px solid var(--encre)}
.haut .wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--e2);min-height:4rem}
.marque{font-family:var(--titre);font-stretch:75%;font-weight:800;font-size:1.375rem;line-height:1;text-decoration:none;white-space:nowrap}
.nav{display:flex;align-items:center;gap:var(--e4);font-family:var(--titre);font-weight:500;font-size:1rem}
.nav a{text-decoration:none;padding-block:var(--e1);background-image:linear-gradient(var(--encre),var(--encre));background-repeat:no-repeat;background-position:left bottom;background-size:0% 2px;transition:background-size 250ms var(--ease)}
.nav a:hover,.nav a:focus-visible,.nav a[aria-current=page]{background-size:100% 2px}
.nav .nav-liste{font-weight:600;background-image:linear-gradient(var(--encre),var(--encre)),linear-gradient(var(--jaune),var(--jaune));background-position:left bottom,left bottom;background-size:0% 2px,100% .42em}
.nav .nav-liste:hover,.nav .nav-liste:focus-visible{background-size:100% 2px,100% .42em}
.menu{display:none;position:relative}
.menu summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:var(--e1);font-family:var(--titre);font-weight:600;font-size:1rem;min-height:48px;padding-inline:var(--e2);border:2px solid var(--encre)}
.menu summary::-webkit-details-marker{display:none}
.menu .ico-fermer{display:none}
.menu[open] .ico-fermer{display:block}
.menu[open] .ico-ouvrir{display:none}
.menu[open] summary{background:var(--encre);color:var(--papier)}
.menu-liens{position:absolute;right:0;top:calc(100% + var(--e1));min-width:16rem;display:grid;background:var(--papier);border:2px solid var(--encre)}
.menu-liens a{font-family:var(--titre);font-weight:500;font-size:1.0625rem;text-decoration:none;padding:var(--e2);border-top:1px solid var(--filet)}
.menu-liens a:first-child{border-top:0}
.menu-liens a:hover,.menu-liens a[aria-current=page]{background:var(--papier-clair);font-weight:600}
@media (max-width:899px){.nav{display:none}.menu{display:block}}

/* 5. Boutons : deux styles, pas un de plus */
.btn,.btn-2{display:inline-flex;align-items:center;justify-content:center;gap:var(--e1);font-family:var(--titre);font-weight:600;font-size:1rem;line-height:1.5;text-decoration:none;padding:var(--e2) var(--e3);border:2px solid var(--encre);cursor:pointer;transition:background-color var(--duree),color var(--duree)}
.btn{background:var(--encre);color:var(--papier)}
.btn:hover{background:var(--jaune);color:var(--encre)}
.btn-2{background:transparent;color:var(--encre)}
.btn-2:hover{background:var(--encre);color:var(--papier)}
.btn:active,.btn-2:active{transform:translateY(1px)}
.btn[disabled]{background:var(--gris);border-color:var(--gris);color:var(--papier);cursor:default}
.actions{display:flex;flex-wrap:wrap;gap:var(--e2);margin-top:var(--e4)}
.lien-fleche{display:inline-flex;align-items:center;gap:var(--e1);font-family:var(--titre);font-weight:600;font-size:1rem;text-decoration:none;border-bottom:2px solid var(--encre);padding-bottom:2px;background-image:linear-gradient(var(--jaune),var(--jaune));background-repeat:no-repeat;background-position:left bottom;background-size:0% .42em;transition:background-size 350ms var(--ease)}
.lien-fleche:hover,.lien-fleche:focus-visible{background-size:100% .42em}
.lien-fleche .ico{transition:transform 350ms var(--ease)}
.lien-fleche:hover .ico,.lien-fleche:focus-visible .ico{transform:translateX(4px)}

/* 6. Ouverture de page */
.ouverture{padding-block:var(--e6) var(--e7)}
.ouverture .wrap{display:grid;gap:var(--e5);align-items:start}
.ouverture .statut{margin-bottom:var(--e3)}
.ouverture .chapeau{margin-top:var(--e3)}
.ouverture .note{margin-top:var(--e3);max-width:var(--lecture)}
@media (min-width:900px){.ouverture .wrap{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--e6)}}

/* Fiche technique (durée, lieu, places...) */
.faits{position:relative;display:flex;flex-wrap:wrap;gap:var(--e2) var(--e4);margin-top:var(--e4);padding-top:var(--e2)}
.faits div{min-width:0}
.faits dt{font-family:var(--titre);font-weight:500;font-size:.875rem;color:var(--gris)}
.faits dd{font-family:var(--titre);font-weight:600;font-size:1.125rem;line-height:1.3;font-variant-numeric:tabular-nums}

/* Schéma « parcours » : un trait vertical, une étape par carré (DESIGN.md, section 7) */
/* Photos (DESIGN.md, section 7) : deux photos de sport en noir et blanc, format 12:5, aucun visage */
.photo{margin:0}
.cadre{overflow:hidden;background:var(--filet)}
.photo img{width:100%;aspect-ratio:12/5;object-fit:cover;background:var(--filet);transition:filter 1400ms var(--ease-out) var(--d,0ms),transform 1400ms var(--ease-out) var(--d,0ms)}
.photo figcaption{margin-top:var(--e1)}
.photo.bandeau{margin-bottom:var(--e6)}
.photo.colonne{max-width:45rem;margin-top:var(--e5)}
.photo.colonne+.programme{margin-top:var(--e5)}
.schema{position:relative;margin:0;padding-top:var(--e3);max-width:30rem}
.schema-titre{font-family:var(--titre);font-weight:600;font-size:1rem;line-height:1.3}
.parcours{list-style:none;position:relative;margin-top:var(--e4)}
.parcours::before{content:"";position:absolute;left:7px;top:.75rem;bottom:.75rem;width:2px;background:var(--encre);transform-origin:top center;transition:transform 1100ms var(--ease-out) var(--d,0ms)}
.parcours li{position:relative;padding-left:var(--e5)}
.parcours li+li{margin-top:var(--e3)}
.parcours .porte{position:relative;font-family:var(--titre);font-weight:600;font-size:.875rem;line-height:1.4;color:var(--gris);margin-bottom:var(--e1)}
.parcours .porte::before{content:"";position:absolute;left:calc(2px - var(--e5));top:calc(50% - 1px);width:12px;height:2px;background:var(--encre)}
.parcours .etape{position:relative}
.parcours .etape::before{content:"";position:absolute;z-index:1;left:calc(0px - var(--e5));top:calc(.65em - 8px);width:16px;height:16px;background:var(--papier);border:2px solid var(--encre)}
.parcours.porte-en-tete::before{top:calc(.6125rem - 1px)}
.parcours .arrivee .etape::after{content:"";position:absolute;left:calc(5px - var(--e5));top:.65em;bottom:0;width:6px;background:var(--papier)}
.parcours .arrivee .etape::before{background:var(--encre)}
.parcours .nom{font-family:var(--titre);font-weight:600;font-size:1.125rem;line-height:1.3}
.parcours .depart .nom{color:var(--gris)}
.parcours .detail{font-size:1rem;line-height:1.5;margin-top:2px}
.parcours .porte::before,.parcours .etape::before{transition:transform 300ms var(--ease-out) var(--d,0ms)}
.schema figcaption{margin-top:var(--e4);padding-top:var(--e2);border-top:1px solid var(--filet)}
.schema figcaption .source{margin-top:0}

/* 7. Sections */
.sec{position:relative;padding-block:var(--e7)}
.sec>.wrap>h2+*{margin-top:var(--e4)}
.sec>.wrap>.chapeau+*{margin-top:var(--e5)}
@media (max-width:699px){.ouverture{padding-block:var(--e5) var(--e6)}.sec{padding-block:var(--e6)}body{font-size:1.0625rem}.chapeau{font-size:1.25rem}}

/* Les deux formations */
.offres{display:grid;gap:var(--e5)}
@media (min-width:900px){.offres{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--e6)}}
.offre{position:relative;padding-top:var(--e3);display:flex;flex-direction:column;gap:var(--e2)}
.offre .faits{margin-top:var(--e1)}
.offre .lien-fleche{align-self:flex-start;margin-top:var(--e1)}

/* Études citées */
.etudes{list-style:none;max-width:44em}
.etudes li{padding-block:var(--e3);border-top:1px solid var(--filet)}
.etudes li:first-child{border-top:0;padding-top:0}
.etudes p{max-width:var(--lecture)}
.source{display:inline-flex;align-items:center;gap:var(--e1);margin-top:var(--e1);text-decoration:none;border-bottom:1px solid var(--gris)}
.source:hover{color:var(--encre);border-bottom-color:var(--encre)}
.source .ico{width:1rem;height:1rem}

/* Listes de points (méthode, objectifs, financement) */
.points{list-style:none;max-width:44em}
.points li{padding-block:var(--e3);border-top:1px solid var(--filet)}
.points li:first-child{border-top:0;padding-top:0}
.points strong{font-family:var(--titre);font-weight:600}

/* Formateur */
.formateur{display:grid;gap:var(--e5);align-items:start}
@media (min-width:900px){.formateur{grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:var(--e6)}}
.formateur .role{font-family:var(--titre);font-weight:600;font-size:1.125rem;line-height:1.3;color:var(--encre);margin-top:var(--e3)}
.formateur .texte{margin-top:var(--e3)}
.cv{border-top:1px solid var(--encre)}
.cv div{display:grid;grid-template-columns:minmax(0,10rem) minmax(0,1fr);gap:var(--e2);padding-block:var(--e2);border-bottom:1px solid var(--filet)}
.cv dt{font-family:var(--titre);font-weight:500;font-size:.875rem;line-height:1.4;color:var(--gris)}
.cv dd{font-family:var(--titre);font-weight:600;font-size:1rem;line-height:1.4}
@media (max-width:499px){.cv div{grid-template-columns:1fr;gap:0}}

/* Programme : tableau des demi-journées et des modules */
.programme{position:relative}
.creneau{display:grid;gap:var(--e2);padding-block:var(--e4);border-bottom:1px solid var(--filet)}
@media (min-width:900px){.creneau{grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:var(--e5)}}
.creneau .quand{font-family:var(--titre);font-weight:600;font-size:1rem;line-height:1.4;font-variant-numeric:tabular-nums}
.creneau .quand span{display:block;font-weight:500;color:var(--gris)}
.creneau ul{list-style:none;margin-top:var(--e2)}
.creneau li{position:relative;padding-left:var(--e3);margin-top:var(--e1)}
.creneau li::before{content:"";position:absolute;left:0;top:.6em;width:.375em;height:.375em;background:var(--encre)}
.creneau .methode{margin-top:var(--e2)}

/* Colonnes d'infos pratiques */
.colonnes{display:grid;gap:var(--e5)}
@media (min-width:900px){.colonnes{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--e6)}}
.colonnes h3{padding-top:var(--e2);border-top:2px solid var(--encre);margin-bottom:var(--e2)}
.colonnes p+p{margin-top:var(--e2)}
.colonnes ul{list-style:none}
.colonnes ul li{position:relative;padding-left:var(--e3);margin-top:var(--e1)}
.colonnes ul li:first-child{margin-top:0}
.colonnes ul li::before{content:"";position:absolute;left:0;top:.6em;width:.375em;height:.375em;background:var(--encre)}
.renvoi{margin-top:var(--e5);display:flex;flex-wrap:wrap;align-items:center;gap:var(--e2) var(--e4)}

/* Tarif */
.tarif{display:grid;gap:var(--e5)}
@media (min-width:900px){.tarif{grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:var(--e6)}}
.montant{font-family:var(--titre);font-stretch:75%;font-weight:800;font-size:clamp(2rem,4.5vw,3rem);line-height:1;font-variant-numeric:tabular-nums}
.montant-texte{font-size:1.75rem;line-height:1.1}
.tarif .petit{margin-top:var(--e1)}

/* 8. Liste d'attente */
.sec-liste{background:var(--papier-clair)}
.formulaire{display:grid;gap:var(--e3);margin-top:var(--e5);max-width:52rem}
@media (min-width:700px){.formulaire{grid-template-columns:repeat(2,minmax(0,1fr))}}
.formulaire .large{grid-column:1/-1}
.champ{display:grid;gap:var(--e1);min-width:0;border:0}
.champ label,.champ legend{font-family:var(--titre);font-weight:500;font-size:1rem;line-height:1.3}
.champ legend{margin-bottom:var(--e1)}
.requis{color:var(--erreur)}
.champ input[type=text],.champ input[type=email],.champ input[type=tel],.champ select,.champ textarea{width:100%;min-height:48px;font-family:var(--titre);font-weight:500;font-size:1rem;color:var(--encre);background:var(--papier);border:1px solid var(--gris);border-radius:0;padding:0 var(--e2);-webkit-appearance:none;appearance:none}
.champ textarea{min-height:8rem;padding:var(--e1) var(--e2);line-height:1.5;resize:vertical;font-family:var(--texte);font-size:1.0625rem}
.champ input:focus,.champ select:focus,.champ textarea:focus{outline:2px solid var(--encre);outline-offset:0;border-color:var(--encre)}
.liste-deroulante{position:relative}
.liste-deroulante select{padding-right:var(--e5);cursor:pointer}
.liste-deroulante .ico{position:absolute;right:var(--e2);top:50%;transform:translateY(-50%);pointer-events:none}
.choix{display:flex;flex-wrap:wrap;gap:var(--e1)}
.choix label{display:flex;align-items:center;gap:var(--e1);min-height:48px;padding:var(--e1) var(--e2);border:1px solid var(--gris);background-color:var(--papier);background-image:linear-gradient(var(--jaune),var(--jaune));background-repeat:no-repeat;background-position:left center;background-size:0% 100%;cursor:pointer;font-family:var(--titre);font-weight:500;font-size:1rem;transition:background-size 300ms var(--ease),border-color var(--duree)}
.choix label:has(input:checked){border-color:var(--encre);background-size:100% 100%}
.choix label:has(input:focus-visible){outline:2px solid var(--encre);outline-offset:2px}
input[type=checkbox]{-webkit-appearance:none;appearance:none;flex:none;width:20px;height:20px;border:2px solid var(--encre);border-radius:0;background:var(--encre);box-shadow:inset 0 0 0 10px var(--papier-clair);cursor:pointer;margin:0;transition:box-shadow 200ms var(--ease)}
input[type=checkbox]:checked{box-shadow:inset 0 0 0 3px var(--papier-clair)}
.choix input[type=checkbox]:focus-visible{outline:none}
.accord{display:flex;gap:var(--e2);align-items:flex-start;font-family:var(--texte);font-size:1.0625rem;line-height:1.5;cursor:pointer}
.accord input{margin-top:calc((1.5em - 20px) / 2)}
.piege{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.message{display:none;align-items:flex-start;gap:var(--e1);font-family:var(--titre);font-weight:600;font-size:1rem;line-height:1.5;padding:var(--e2);border-left:2px solid currentColor;background:var(--papier)}
.message.ok,.message.err{display:flex}
.message.ok{color:var(--ok);animation:apparait 200ms ease-out}
.message.err{color:var(--erreur);animation:apparait 200ms ease-out}
.message::before{content:"";flex:none;width:1.25rem;height:1.5em;background:currentColor;-webkit-mask:var(--masque) no-repeat center/contain;mask:var(--masque) no-repeat center/contain}
.message.ok{--masque:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")}
.message.err{--masque:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cline x1='12' x2='12' y1='8' y2='12'/%3E%3Cline x1='12' x2='12.01' y1='16' y2='16'/%3E%3C/svg%3E")}
.message a{color:inherit}
@keyframes apparait{from{opacity:0}to{opacity:1}}
@keyframes trace{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
.message.ok::before{animation:trace 450ms var(--ease) 150ms both}
.mention{font-size:1rem;color:var(--gris);max-width:44em}

/* 9. Questions fréquentes */
.faq{position:relative;max-width:48em;border-top:2px solid var(--encre)}
.faq details{border-bottom:1px solid var(--filet)}
.faq summary{list-style:none;cursor:pointer;position:relative;display:block;font-family:var(--titre);font-weight:600;font-size:1.125rem;line-height:1.4;padding-block:var(--e3);padding-right:var(--e5)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before,.faq summary::after{content:"";position:absolute;right:2px;top:calc(var(--e3) + .7em - 1px);width:1rem;height:1.75px;background:currentColor;transition:transform 350ms var(--ease)}
.faq summary::after{transform:rotate(90deg)}
.faq details[open] summary::after{transform:rotate(180deg)}
.faq summary:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.2em}
.faq details>p{padding-bottom:var(--e3);max-width:var(--lecture)}

/* 10. Pages légales */
.doc{max-width:46em}
.doc h2{font-size:1.75rem;line-height:1.05;margin-top:var(--e6);max-width:none}
.doc h2:first-of-type{margin-top:0}
.doc p,.doc ul{margin-top:var(--e2)}
.doc ul{padding-left:var(--e3)}
.doc li+li{margin-top:var(--e1)}
.a-completer{font-family:var(--titre);font-weight:600;font-size:.95em;box-shadow:none;background:var(--jaune);padding-inline:.25em}
.maj{margin-top:var(--e6)}

/* 10 bis. Articles de la rubrique Ressources (DESIGN.md, section 10) */
.article-tete .signature{margin-top:var(--e4);max-width:var(--lecture)}
.article-corps{max-width:var(--lecture)}
.article-corps h2{font-size:1.75rem;line-height:1.05;margin-top:var(--e6);max-width:none}
.article-corps h2:first-child{margin-top:0}
.article-corps p,.article-corps ul{margin-top:var(--e2)}
.article-corps ul{list-style:none}
.article-corps li{position:relative;padding-left:var(--e3)}
.article-corps li+li{margin-top:var(--e1)}
.article-corps li::before{content:"";position:absolute;left:0;top:.6em;width:.375em;height:.375em;background:var(--encre)}
.ref{color:inherit;white-space:nowrap;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.15em;text-decoration-color:var(--gris)}
.ref:hover{text-decoration-color:currentColor}
.encart-texte{max-width:var(--lecture)}
.encart-texte p{margin-top:var(--e2)}
.encart-texte .lien-fleche{margin-top:var(--e3)}
.biblio{max-width:52em;padding-left:var(--e3);margin-top:var(--e4)}
.biblio li{font-family:var(--titre);font-weight:500;font-size:.9375rem;line-height:1.5;margin-top:var(--e2);overflow-wrap:anywhere}
.biblio .source{margin-top:0}
.sources .petit{margin-top:var(--e4);max-width:var(--lecture)}
.fil{margin-bottom:var(--e3)}
.fil a{color:var(--gris)}
.fil a:hover{color:var(--encre)}
.liste-articles{display:grid;max-width:52em}
.fiche-article{padding-block:var(--e4);border-top:1px solid var(--filet)}
.fiche-article:first-child{border-top:0;padding-top:0}
.fiche-article h2{max-width:none}
.fiche-article h2 a{text-decoration:none}
.fiche-article h2 a:hover,.fiche-article h2 a:focus-visible{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.15em}
.fiche-article p{margin-top:var(--e2);max-width:var(--lecture)}

/* 11. Pied de page */
.bas{border-top:2px solid var(--encre);padding-block:var(--e6) var(--e5)}
.bas .wrap{display:grid;gap:var(--e4)}
@media (min-width:900px){.bas .wrap{grid-template-columns:minmax(0,6fr) minmax(0,3fr) minmax(0,3fr)}}
.bas .marque{display:inline-block;font-size:1.75rem}
.bas p{font-size:1rem;margin-top:var(--e2);max-width:32em}
.bas ul{list-style:none;font-family:var(--titre);font-weight:500;font-size:1rem}
.bas li+li{margin-top:var(--e1)}
.bas h2{font-family:var(--titre);font-stretch:100%;font-weight:600;font-size:.875rem;color:var(--gris);margin-bottom:var(--e2);max-width:none}
.bas .credit{grid-column:1/-1;max-width:none;padding-top:var(--e3);border-top:1px solid var(--filet)}

/* 12. Page introuvable */
.perdu{padding-block:var(--e7);min-height:60vh}
.perdu .chapeau{margin-top:var(--e3)}

/* 13. Effets (DESIGN.md, section 6) : le trait, le surligneur et le tirage.
   Les états de départ ne sont posés que si le script a ajouté la classe .anim à <html>. */
.sec::before,.offre::before,.faits::before,.programme::before,.schema::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--encre);transform-origin:left center;transition:transform 1100ms var(--ease-out) var(--d,0ms)}
.offre::before,.programme::before,.sec-liste::before,.schema::before{height:2px}
@media screen and (prefers-reduced-motion:no-preference){
  .anim mark:not(.vu){background-size:0% .42em}
  .anim .sec:not(.vu)::before,.anim .offre:not(.vu)::before,.anim .faits:not(.vu)::before,.anim .programme:not(.vu)::before,.anim .schema:not(.vu)::before{transform:scaleX(0)}
  .anim .parcours:not(.vu)::before{transform:scaleY(0)}
  .anim .parcours li:not(.vu) .porte::before,.anim .parcours li:not(.vu) .etape::before{transform:scale(0)}
  .anim .photo:not(.vu) img{filter:brightness(1.75) contrast(.5) blur(4px);transform:scale(1.05)}
  @media (hover:hover){.cadre:hover img{transform:scale(1.025);transition-duration:900ms}}
  @supports (interpolate-size:allow-keywords){
    .faq{interpolate-size:allow-keywords}
    .faq details::details-content{block-size:0;overflow-y:clip;transition:block-size 350ms var(--ease),content-visibility 350ms allow-discrete}
    .faq details[open]::details-content{block-size:auto}
  }
  @supports (animation-timeline:scroll()){
    .haut::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--jaune);transform-origin:left center;transform:scaleX(0);animation:lecture linear both;animation-timeline:scroll(root block)}
  }
}
@keyframes lecture{to{transform:scaleX(1)}}

/* 14. Mouvement réduit à la demande */
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}.btn:active,.btn-2:active,.lien-fleche:hover .ico,.lien-fleche:focus-visible .ico{transform:none}}
