/* =============================================================
   race-chien.fr  ::  feuille de style « BOUSSOLE »
   Un guide d'orientation, pas une encyclopedie.
   Registre visuel : instrument de mesure. Regle graduee, curseurs,
   angles droits, hairlines. Papier lin gris-vert, encre grenat.
   Typo inversee volontairement : titres en humaniste sans,
   texte courant en serif de lecture.
   Vocabulaire de classes maison, en francais.
   Fichier unique, aucune dependance externe.
   ============================================================= */

/* --- 1. Jetons ---------------------------------------------- */
:root{
  /* surfaces */
  --lin:          #ecefe8;
  --lin-creux:    #e1e5da;
  --lin-profond:  #d6dbcd;
  --papier:       #ffffff;

  /* encres */
  --encre:        #1b211d;
  --encre-douce:  #545e57;
  --encre-tenue:  #7d867e;

  /* traits */
  --trait:        #ccd2c5;
  --trait-fort:   #a9b1a0;

  /* couleur directrice : grenat */
  --grenat:       #7b2f3a;
  --grenat-fonce: #571f27;
  --grenat-clair: #a4525d;
  --grenat-voile: #f3e3e4;

  /* couleur seconde : vert-de-gris */
  --vert:         #3f6b5c;
  --vert-fonce:   #2a4a3f;
  --vert-voile:   #e2ebe5;

  /* signal reglementaire : ambre brule */
  --ambre:        #ad5218;
  --ambre-voile:  #f8e7d7;

  /* typographies */
  --titre:    "Optima","Candara","Gill Sans","Gill Sans MT","Trebuchet MS",system-ui,-apple-system,sans-serif;
  --texte:    "Charter","Bitstream Charter","Sitka Text",Cambria,"Georgia Pro",Georgia,"Times New Roman",serif;
  --technique: ui-monospace,"SF Mono","Cascadia Mono",Menlo,Consolas,"Courier New",monospace;

  /* mesures */
  --cadre:    1120px;
  --lecture:  40rem;
  --marge:    clamp(1.1rem, 4.2vw, 2.4rem);
  --souffle:  clamp(2.6rem, 6vw, 4.6rem);
  --angle:    2px;

  /* ombres : tres discretes, l'instrument ne flotte pas */
  --pose:     0 1px 0 rgba(27,33,29,.04), 0 12px 26px -22px rgba(27,33,29,.55);
  --pose-nette: 0 1px 0 rgba(27,33,29,.06), 0 22px 44px -30px rgba(27,33,29,.6);

  /* motif signature : la regle graduee */
  --graduation: repeating-linear-gradient(90deg,
                  var(--trait-fort) 0 1px, transparent 1px 11px);
  --graduation-grenat: repeating-linear-gradient(90deg,
                  var(--grenat) 0 1px, transparent 1px 11px);
}

/* --- 2. Assise ---------------------------------------------- */
*,*::before,*::after{ box-sizing:border-box }

html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  scroll-padding-top:5.5rem;
  color-scheme:light;
}

body{
  margin:0;
  background:var(--lin);
  color:var(--encre);
  font-family:var(--texte);
  font-size:1.0625rem;
  line-height:1.68;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

img,svg,video{ max-width:100%; display:block; height:auto }

a{
  color:var(--grenat);
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:.18em;
  text-decoration-color:rgba(123,47,58,.4);
}
a:hover{ color:var(--grenat-fonce); text-decoration-color:currentColor }

:focus-visible{
  outline:2px solid var(--grenat);
  outline-offset:3px;
}

hr{ border:0; height:1px; background:var(--trait); margin:var(--souffle) 0 }

/* --- 3. Hierarchie typographique ---------------------------- */
h1,h2,h3,h4{
  font-family:var(--titre);
  color:var(--encre);
  line-height:1.14;
  letter-spacing:-.008em;
  margin:0 0 .55em;
  font-weight:600;
  text-wrap:balance;
}
h1{ font-size:clamp(1.95rem, 1.35rem + 2.7vw, 3.1rem); letter-spacing:-.018em }
h2{ font-size:clamp(1.5rem, 1.15rem + 1.5vw, 2.1rem) }
h3{ font-size:clamp(1.18rem, 1.05rem + .55vw, 1.42rem) }
h4{ font-size:1.05rem; letter-spacing:0 }

p{ margin:0 0 1.15em }
p:last-child{ margin-bottom:0 }

strong{ font-weight:700; color:var(--encre) }
em{ font-style:italic }

small,.mention{
  font-size:.845rem;
  line-height:1.55;
  color:var(--encre-tenue);
}

ul,ol{ margin:0 0 1.2em; padding-left:1.15rem }
li{ margin:0 0 .45em }
li::marker{ color:var(--grenat-clair) }

blockquote{
  margin:1.6em 0;
  padding:.15rem 0 .15rem 1.15rem;
  border-left:3px solid var(--grenat);
  font-size:1.1rem;
  color:var(--encre-douce);
}

/* --- 4. Trame ----------------------------------------------- */
.cadre{
  width:100%;
  max-width:var(--cadre);
  margin-inline:auto;
  padding-inline:var(--marge);
}
.cadre--etroit{ max-width:780px }

.saut{
  position:absolute; left:-9999px; top:0;
  background:var(--encre); color:var(--lin);
  padding:.7rem 1.1rem; z-index:99;
  font-family:var(--titre);
}
.saut:focus{ left:.6rem; top:.6rem }

/* Le motif signature, utilisable partout comme separateur */
.regle{
  height:7px;
  background:var(--graduation);
  background-size:11px 7px;
  background-repeat:repeat-x;
  background-position:left bottom;
  opacity:.75;
}
.regle--grenat{ background-image:var(--graduation-grenat); opacity:.5 }
.regle--marge{ margin:var(--souffle) 0 }

/* --- 5. Enseigne (en-tete) ---------------------------------- */
.enseigne{
  position:sticky; top:0; z-index:40;
  background:var(--papier);
  border-bottom:1px solid var(--trait);
}
.enseigne::after{
  content:"";
  display:block;
  height:4px;
  background:var(--graduation);
  background-size:11px 4px;
  opacity:.5;
}
.enseigne-corps{
  display:flex;
  align-items:center;
  gap:1.1rem;
  min-height:3.9rem;
  flex-wrap:wrap;
}

.fanion{
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  text-decoration:none;
  color:var(--encre);
  flex:0 0 auto;
}
.fanion:hover{ color:var(--grenat) }
.fanion-marque{
  width:30px; height:30px;
  flex:0 0 30px;
  border:1.5px solid var(--grenat);
  border-radius:50%;
  display:grid; place-items:center;
  color:var(--grenat);
}
.fanion-marque span{
  display:block;
  width:2px; height:13px;
  background:currentColor;
  transform:rotate(34deg);
}
.fanion-mot{
  font-family:var(--titre);
  font-weight:600;
  font-size:1.06rem;
  letter-spacing:-.01em;
  line-height:1.1;
}
.fanion-mot em{
  display:block;
  font-style:normal;
  font-family:var(--technique);
  font-size:.6rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--encre-tenue);
  margin-top:.16em;
}

.sommaire{
  margin-left:auto;
  display:flex;
  gap:.15rem;
  align-items:center;
  overflow-x:auto;
  scrollbar-width:none;
  max-width:100%;
  padding-block:.35rem;
}
.sommaire::-webkit-scrollbar{ display:none }
.sommaire a{
  font-family:var(--titre);
  font-size:.925rem;
  color:var(--encre-douce);
  text-decoration:none;
  padding:.42rem .58rem;
  white-space:nowrap;
  border-bottom:2px solid transparent;
}
.sommaire a:hover{ color:var(--grenat) }
.sommaire a[aria-current="page"]{
  color:var(--grenat);
  border-bottom-color:var(--grenat);
}

/* --- 6. Fil (ariane) ---------------------------------------- */
.fil{
  font-family:var(--technique);
  font-size:.72rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--encre-tenue);
  padding-top:1.5rem;
}
.fil a{ color:var(--encre-douce); text-decoration:none }
.fil a:hover{ color:var(--grenat); text-decoration:underline }
.fil span{ margin:0 .4rem; color:var(--trait-fort) }

/* --- 7. Balise (surtitre) ----------------------------------- */
.balise{
  display:inline-block;
  font-family:var(--technique);
  font-size:.7rem;
  letter-spacing:.19em;
  text-transform:uppercase;
  color:var(--grenat);
  margin-bottom:.85rem;
  padding-bottom:.3rem;
  border-bottom:1px solid var(--grenat-clair);
}
.balise--vert{ color:var(--vert); border-bottom-color:var(--vert) }
.balise--ambre{ color:var(--ambre); border-bottom-color:var(--ambre) }

/* --- 8. Plan (bandeau de tete) ------------------------------ */
.plan{
  background:var(--papier);
  border-bottom:1px solid var(--trait);
  padding-block:clamp(1.9rem,5vw,3.4rem);
}
.plan-grille{
  display:grid;
  gap:clamp(1.6rem,3.5vw,2.8rem);
}
.chapeau{
  font-size:clamp(1.06rem,1rem + .45vw,1.24rem);
  line-height:1.6;
  color:var(--encre-douce);
  max-width:38rem;
}
.chapeau strong{ color:var(--encre) }

/* Cartouche : le panneau de reperes a droite du titre */
.cartouche{
  background:var(--lin-creux);
  border:1px solid var(--trait);
  border-top:3px solid var(--grenat);
  border-radius:var(--angle);
  padding:1.25rem 1.35rem;
  align-self:start;
}
.cartouche-titre{
  font-family:var(--technique);
  font-size:.7rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--encre-tenue);
  margin:0 0 .9rem;
}
.repere{
  display:flex;
  gap:.75rem;
  align-items:baseline;
  padding:.6rem 0;
  border-top:1px solid var(--trait);
}
.repere:first-of-type{ border-top:0; padding-top:0 }
.repere-cle{
  font-family:var(--technique);
  font-size:.95rem;
  font-weight:600;
  color:var(--grenat);
  flex:0 0 auto;
  min-width:3.4rem;
}
.repere-val{
  font-size:.94rem;
  line-height:1.45;
  color:var(--encre-douce);
}

@media (min-width:860px){
  .plan-grille--duo{ grid-template-columns:minmax(0,1.55fr) minmax(15rem,.85fr) }
}

/* --- 9. Chapitres ------------------------------------------- */
.chapitre{ padding-block:var(--souffle) }
.chapitre--creux{ background:var(--lin-creux); border-block:1px solid var(--trait) }
.chapitre--papier{ background:var(--papier); border-block:1px solid var(--trait) }
.chapitre-tete{ max-width:44rem; margin-bottom:clamp(1.5rem,3vw,2.3rem) }
.chapitre-tete p{ color:var(--encre-douce) }

/* --- 10. Corps de lecture ----------------------------------- */
.corps{ max-width:var(--lecture) }
.corps > h2{ margin-top:2.1em }
.corps > h2:first-child{ margin-top:0 }
.corps > h3{ margin-top:1.7em }
.corps ul,.corps ol{ padding-left:1.3rem }

.intertitre{
  font-family:var(--titre);
  font-size:1.06rem;
  font-weight:600;
  color:var(--grenat);
  margin:1.8em 0 .5em;
}

/* Sommaire interne d'une page */
.jalons{
  background:var(--papier);
  border:1px solid var(--trait);
  border-left:3px solid var(--vert);
  border-radius:var(--angle);
  padding:1.1rem 1.3rem;
  margin-bottom:2.2rem;
}
.jalons p{
  font-family:var(--technique);
  font-size:.7rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--encre-tenue);
  margin:0 0 .6rem;
}
.jalons ol{ margin:0; padding-left:1.15rem; columns:1 }
.jalons li{ margin:0 0 .3em; font-size:.96rem }
@media (min-width:700px){ .jalons ol{ columns:2; column-gap:2rem } }

/* --- 11. Series et fiches ----------------------------------- */
.serie{ display:grid; gap:1.1rem }
@media (min-width:640px){
  .serie--2{ grid-template-columns:repeat(2,1fr) }
  .serie--3{ grid-template-columns:repeat(2,1fr) }
  .serie--4{ grid-template-columns:repeat(2,1fr) }
}
@media (min-width:940px){
  .serie--3{ grid-template-columns:repeat(3,1fr) }
  .serie--4{ grid-template-columns:repeat(4,1fr) }
}

.fiche{
  background:var(--papier);
  border:1px solid var(--trait);
  border-radius:var(--angle);
  padding:1.35rem 1.4rem;
  display:flex;
  flex-direction:column;
  gap:.55rem;
  position:relative;
}
.fiche::before{
  content:"";
  position:absolute; inset:0 0 auto 0;
  height:3px;
  background:var(--grenat);
  opacity:0;
  transition:opacity .18s ease;
}
a.fiche{ text-decoration:none; color:inherit; box-shadow:var(--pose) }
a.fiche:hover{ box-shadow:var(--pose-nette); border-color:var(--trait-fort) }
a.fiche:hover::before{ opacity:1 }
.fiche h3{ margin:0; font-size:1.14rem }
a.fiche:hover h3{ color:var(--grenat) }
.fiche p{ margin:0; font-size:.955rem; color:var(--encre-douce); line-height:1.55 }
.fiche-pied{
  margin-top:auto;
  padding-top:.7rem;
  font-family:var(--technique);
  font-size:.7rem;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--grenat);
}

/* Fiche numerotee : le chiffre coupe l'angle superieur droit */
.fiche-rang{
  background:var(--papier);
  border:1px solid var(--trait);
  border-radius:var(--angle);
  padding:1.5rem 1.4rem 1.35rem;
  position:relative;
  overflow:hidden;
}
.fiche-rang::after{
  content:"";
  position:absolute; top:0; right:0;
  border-width:0 1.9rem 1.9rem 0;
  border-style:solid;
  border-color:transparent var(--lin-creux) transparent transparent;
}
.rang{
  display:block;
  font-family:var(--technique);
  font-size:1.55rem;
  font-weight:700;
  line-height:1;
  color:var(--grenat);
  margin-bottom:.65rem;
}
.rang::after{
  content:"";
  display:block;
  width:2.1rem; height:2px;
  background:var(--grenat);
  margin-top:.5rem;
  opacity:.4;
}
.fiche-rang h3{ font-size:1.1rem; margin-bottom:.35rem }
.fiche-rang p{ margin:0; font-size:.95rem; color:var(--encre-douce) }

/* --- 12. Jauges (motif d'orientation) ----------------------- */
.jauges{
  display:grid;
  gap:.85rem;
  margin:1.5rem 0;
}
.jauge-nom{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:1rem;
  font-family:var(--technique);
  font-size:.72rem;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--encre-douce);
  margin-bottom:.3rem;
}
.jauge-nom b{ color:var(--encre); font-weight:600; letter-spacing:.04em }
.jauge-barre{
  position:relative;
  height:9px;
  background:var(--lin-profond);
  border-radius:var(--angle);
}
.jauge-barre::before{
  content:"";
  position:absolute; inset:0;
  background:var(--graduation);
  background-size:11px 9px;
  opacity:.45;
}
.jauge-curseur{
  position:absolute; top:-3px; bottom:-3px;
  width:3px;
  background:var(--grenat);
  border-radius:1px;
}

/* --- 13. Encarts -------------------------------------------- */
.encart{
  border:1px solid var(--trait);
  border-left:4px solid var(--encre-tenue);
  border-radius:var(--angle);
  background:var(--papier);
  padding:1.15rem 1.3rem;
  margin:1.9em 0;
}
.encart-titre{
  font-family:var(--titre);
  font-weight:600;
  font-size:1.02rem;
  margin:0 0 .45rem;
}
.encart p{ font-size:.97rem }
.encart p:last-child{ margin-bottom:0 }

.encart--loi{ border-left-color:var(--ambre); background:var(--ambre-voile) }
.encart--loi .encart-titre{ color:var(--ambre) }
.encart--avis{ border-left-color:var(--vert); background:var(--vert-voile) }
.encart--avis .encart-titre{ color:var(--vert-fonce) }
.encart--cle{ border-left-color:var(--grenat); background:var(--grenat-voile) }
.encart--cle .encart-titre{ color:var(--grenat-fonce) }

/* --- 14. Tableau d'orientation ------------------------------ */
.tableau-cadre{
  overflow-x:auto;
  margin:1.9em 0;
  border:1px solid var(--trait);
  border-radius:var(--angle);
  background:var(--papier);
}
.tableau-orientation{
  width:100%;
  border-collapse:collapse;
  font-size:.95rem;
  min-width:34rem;
}
.tableau-orientation caption{
  caption-side:top;
  text-align:left;
  padding:.9rem 1.1rem .1rem;
  font-family:var(--technique);
  font-size:.7rem;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--encre-tenue);
}
.tableau-orientation th,
.tableau-orientation td{
  padding:.72rem 1.1rem;
  text-align:left;
  border-bottom:1px solid var(--trait);
  vertical-align:top;
}
.tableau-orientation thead th{
  font-family:var(--titre);
  font-size:.86rem;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--encre-douce);
  background:var(--lin-creux);
  border-bottom:1px solid var(--trait-fort);
}
.tableau-orientation tbody tr:last-child td,
.tableau-orientation tbody tr:last-child th{ border-bottom:0 }
.tableau-orientation tbody th{ font-weight:600; font-family:var(--texte) }

/* --- 15. Vignette (illustration) ---------------------------- */
.vignette{
  margin:2.1em 0;
}
.vignette img{
  width:100%;
  border:1px solid var(--trait);
  border-radius:var(--angle);
  background:var(--lin-creux);
  box-shadow:var(--pose);
}
.vignette figcaption{
  margin-top:.65rem;
  padding-left:.85rem;
  border-left:2px solid var(--grenat-clair);
  font-size:.86rem;
  line-height:1.5;
  color:var(--encre-tenue);
}

/* --- 16. Pistes (maillage) ---------------------------------- */
.pistes{
  background:var(--lin-creux);
  border:1px solid var(--trait);
  border-radius:var(--angle);
  padding:1.3rem 1.4rem;
  margin:2.2em 0 0;
}
.pistes-titre{
  font-family:var(--technique);
  font-size:.7rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--encre-tenue);
  margin:0 0 .8rem;
}
.pistes ul{ margin:0; padding:0; list-style:none; display:grid; gap:.55rem }
@media (min-width:700px){ .pistes ul{ grid-template-columns:1fr 1fr; column-gap:2rem } }
.pistes li{ margin:0; padding-left:1rem; position:relative; font-size:.97rem }
.pistes li::before{
  content:"";
  position:absolute; left:0; top:.62em;
  width:.42rem; height:2px;
  background:var(--grenat);
}

/* --- 17. Boutons -------------------------------------------- */
.rangee-boutons{ display:flex; flex-wrap:wrap; gap:.7rem; margin-top:1.7rem }
.bouton{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  font-family:var(--titre);
  font-size:.98rem;
  font-weight:600;
  padding:.72rem 1.25rem;
  border-radius:var(--angle);
  text-decoration:none;
  border:1.5px solid var(--grenat);
  transition:background .16s ease,color .16s ease;
}
.bouton--plein{ background:var(--grenat); color:var(--papier) }
.bouton--plein:hover{ background:var(--grenat-fonce); border-color:var(--grenat-fonce); color:var(--papier) }
.bouton--ligne{ background:transparent; color:var(--grenat) }
.bouton--ligne:hover{ background:var(--grenat-voile); color:var(--grenat-fonce) }

/* --- 18. Zone de redaction (chantier) ----------------------- */
.zone-redaction{
  border:2px dashed var(--grenat-clair);
  border-radius:var(--angle);
  background:repeating-linear-gradient(135deg,
      var(--grenat-voile) 0 12px, #f8eff0 12px 24px);
  padding:1.15rem 1.3rem;
  margin:1.9em 0;
}
.zone-etiquette{
  display:inline-block;
  font-family:var(--technique);
  font-size:.66rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--papier);
  background:var(--grenat);
  padding:.2rem .55rem;
  border-radius:var(--angle);
  margin-bottom:.7rem;
}
.zone-consigne{
  margin:0;
  font-family:var(--titre);
  font-size:.97rem;
  line-height:1.55;
  color:var(--grenat-fonce);
}
.zone-consigne + .zone-consigne{ margin-top:.5rem }
.zone-consigne b{ color:var(--grenat-fonce) }
.zone-redaction ul{ margin:.6rem 0 0; padding-left:1.15rem }
.zone-redaction li{
  font-family:var(--titre);
  font-size:.94rem;
  line-height:1.5;
  color:var(--grenat-fonce);
  margin:0 0 .32em;
}
.zone-redaction li::marker{ color:var(--grenat) }

/* Valeur a completer, en ligne dans un tableau ou un cartouche */
.a-remplir{
  display:inline-block;
  font-family:var(--technique);
  font-size:.78em;
  letter-spacing:.05em;
  color:var(--grenat-fonce);
  background:var(--grenat-voile);
  border-bottom:1px dashed var(--grenat-clair);
  padding:.04em .38em;
  border-radius:1px;
}

/* --- 19. Socle (pied de page) ------------------------------- */
.socle{
  background:var(--encre);
  color:#c8cec9;
  margin-top:var(--souffle);
  font-size:.94rem;
}
.socle::before{
  content:"";
  display:block;
  height:5px;
  background:repeating-linear-gradient(90deg,
      var(--grenat) 0 1px, transparent 1px 11px);
  background-size:11px 5px;
  opacity:.85;
}
.socle-grille{
  display:grid;
  gap:1.9rem;
  padding-block:clamp(2.2rem,5vw,3.4rem);
}
@media (min-width:660px){ .socle-grille{ grid-template-columns:repeat(2,1fr) } }
@media (min-width:1000px){ .socle-grille{ grid-template-columns:repeat(4,1fr) } }

.socle h2{
  font-family:var(--technique);
  font-size:.7rem;
  letter-spacing:.17em;
  text-transform:uppercase;
  color:#8b958d;
  margin:0 0 .85rem;
  font-weight:400;
}
.socle ul{ list-style:none; margin:0; padding:0 }
.socle li{ margin:0 0 .5em }
.socle a{ color:#dde2dd; text-decoration:none }
.socle a:hover{ color:var(--papier); text-decoration:underline }

.socle-bas{
  border-top:1px solid #2e352f;
  padding-block:1.4rem 2.2rem;
  display:flex;
  flex-wrap:wrap;
  gap:.9rem 1.8rem;
  align-items:baseline;
  justify-content:space-between;
}
.socle-bas p{ margin:0; font-size:.85rem; color:#8b958d; max-width:46rem }
.socle-bas a{ color:#a9b2aa; text-decoration:underline }

/* --- 20. Divers --------------------------------------------- */
.duo-texte{ display:grid; gap:clamp(1.6rem,3vw,2.6rem) }
@media (min-width:860px){ .duo-texte{ grid-template-columns:1fr 1fr } }

.liste-nue{ list-style:none; margin:0; padding:0 }

.tres-gros{
  font-family:var(--titre);
  font-size:clamp(2.4rem,7vw,3.6rem);
  line-height:1;
  font-weight:600;
  color:var(--grenat);
  display:block;
}

/* --- 21. Rythme des blocs sortis de la colonne de lecture ---
   Les series de fiches et leur titre n'ont pas de marge propre :
   on la restitue la ou ils jouxtent la colonne de lecture, sinon
   le H2 suivant vient se coller au bas de la derniere fiche.     */
.corps + .chapitre-tete{ margin-top:clamp(2.4rem,4.5vw,3.4rem) }
.serie + .corps > *:first-child{ margin-top:clamp(2.4rem,4.5vw,3.4rem) }
.serie + .corps > h2:first-child{ margin-top:clamp(2.6rem,5vw,3.8rem) }
.tableau-cadre + .corps > h2:first-child,
.vignette + .corps > h2:first-child{ margin-top:clamp(2.2rem,4vw,3rem) }

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto }
  *{ transition:none !important }
}

@media print{
  .enseigne,.socle,.pistes,.zone-redaction{ display:none }
  body{ background:#fff; font-size:11pt }
}