/* =========================================================================
   shell.css — couche de l'agent « shell » (RESTRUCTURATION.md §6)
   -------------------------------------------------------------------------
   Chargee APRES theme.css (gelee), sur toutes les pages ; article.css (hors
   accueil) et home.css (accueil) viennent apres elle. On ne modifie aucune
   regle de theme.css : on la surcharge ici, a specificite egale ou superieure,
   et chaque groupe dit pourquoi.

   Sommaire
     1. Cibles non publiees : du texte simple
     2. En-tete : barre unique fixe, rubrique courante, largeurs 901-1180
     3. (supprime en 2.1.0 : plus de retractation)
     4. Volet mobile : defilable, recherche lisible
     5. Recherche de l'en-tete
     6. Pied de page et colophon
     7. Credits d'images
     8. Bande de provenance (accueil)
     9. Pages de la charpente : 404, recherche, news, archives
    10. Carrousels : defilement natif
    11. Article de news (single.html)
    12. Pages courtes : le pied de page touche le bas de l'ecran
   ========================================================================= */


/* ---------- 1. Cibles non publiees : du texte simple ----------------------
   Principe 1 du contrat : dans le contenu, une cible non publiee devient du
   TEXTE SIMPLE. theme.css (section 25b et 26) la peignait en gris, soulignee
   en pointilles, avec un curseur « default » et, dans le menu, un trait
   interrompu sous le libelle : l'aspect « chantier » que l'audit releve sur
   chaque page (IANAV-20, VISUALMOBILE-10, VISUALMOBILE-15, VISUALMOBILE-34).
   On neutralise ICI chacune de ces regles, avec son selecteur exact : couleur
   heritee du texte voisin, aucune bordure, aucune fleche, curseur normal.
   La GEOMETRIE (padding, display) empruntee au lien est gardee : la ligne
   d'un tableau ne change pas de hauteur selon qu'une fiche est publiee ou non. */
.is-pending,
.on-dark .is-pending, .hero .is-pending, .footer .is-pending, .head .is-pending,
.nav .is-pending, .head-tools .is-pending,
.ncard h3 .is-pending, .rrow h3 .is-pending,
.prov .claim .is-pending, .colophon .is-pending,
.hero .ghost.is-pending {
  color: inherit;
  border-bottom: 0;
  cursor: auto;
  text-decoration: none;
}
.tbl td:first-child .is-pending { color: inherit; }
.nav .is-pending::after { content: none; }
@media (max-width: 900px) {
  .nav .is-pending::after { content: none; }
}
/* `.more` souligne au survol par un degrade : jamais sur du texte. */
.more.is-pending,
.more.is-pending:hover { background-image: none; }
/* Bandeau en attente : ni filet vert, ni fleche verte, ni survol (VISUALMOBILE-15). */
.banner.is-pending { border-left-color: var(--rule); }
.banner.is-pending:hover { background: var(--panel); }
.banner.is-pending .go { display: none; }
/* Bouton du hero en attente : plus de contour qui promet une action. */
.hero .oc-btn.is-pending { background: none; box-shadow: none; color: inherit; }


/* ---------- 2. En-tete ----------------------------------------------------- */

/* 2a. Barre unique, 2.1.0 (23/09/2026, demande du proprietaire) : plus de
   plaque « WC », plus d'en-tete de 239px qui se retracte. Une barre de
   --head-h (72px, 64px sous 900px), fixe, identique en haut de page et pendant
   la lecture : nom du site a gauche, navigation, puis outils a droite.
   `.stuck` (pose par app.js au-dela de 140px) n'ajoute plus qu'une ombre.
   theme.css (gelee) n'est pas modifiee : ses regles de hauteur, de plaque et de
   masquage de la navigation sont surchargees ici, a specificite egale ou
   superieure. Les decalages qui en dependaient (--oc-top, --art-top,
   --art-stick, scroll-padding-top, volet mobile) suivent --head-h. */
:root { --head-h: 72px; }
@media (max-width: 900px) { :root { --head-h: 64px; } }

html { scroll-padding-top: calc(var(--head-h) + 12px); }

/* Decalage du contenu sous la barre : theme.css le calibrait sur 239px
   (--oc-top: 250px) et 76px sous 900px (104px). */
:root { --oc-top: calc(var(--head-h) + 40px); }
@media (max-width: 900px) { :root { --oc-top: calc(var(--head-h) + 28px); } }

.head,
.head.stuck {
  height: var(--head-h);
  background: var(--oc-plate);
  box-shadow: inset 0 -2px 0 0 var(--stamp);
}
.head.stuck { box-shadow: inset 0 -2px 0 0 var(--stamp), 0 8px 24px rgba(0, 0, 0, .22); }

.head-in {
  flex-direction: row; align-items: center; gap: clamp(12px, 2.4vw, 36px);
}

.brand {
  flex: 0 0 auto;
  display: inline-flex; align-items: center; min-height: 44px;
  font-stretch: 87%; font-weight: 800; font-size: 23px; line-height: 1;
  letter-spacing: .02em; text-transform: uppercase; white-space: nowrap;
  color: #fff;
}
.brand em { font-style: normal; color: var(--stamp-lift); }
.brand:hover { color: #fff; }
.brand:focus-visible { outline-offset: 4px; }

.head .nav { flex: 1 1 auto; align-self: stretch; justify-content: flex-start; }
.head .nav ul { height: 100%; align-items: stretch; }
.head .nav a,
.head .nav .is-pending {
  display: flex; align-items: center; height: 100%;
  padding: 0 clamp(10px, 1.3vw, 20px);
  font-size: 16px; letter-spacing: .06em;
}

.head-tools { flex: 0 0 auto; margin-left: auto; }
.head-tools > a { font-size: 13px; }

@media (min-width: 901px) {
  /* La navigation reste affichee au defilement ; le bouton Menu n'existe
     qu'avec le volet (sous 900px). */
  .head.stuck .nav { display: flex; }
  .head .head-tools .nav-toggle,
  .head.stuck .head-tools .nav-toggle { display: none; }
}

/* 2c. Rubrique courante. aria-current="page" sur la page exacte (regle
   d'origine `.nav a[aria-current]`), classe `is-section` + aria-current="true"
   sur la rubrique d'une fiche (VISUALMOBILE-17) : meme trait vert. */
.nav li.is-section > a,
.nav li.is-current > a { color: #fff; box-shadow: inset 0 -3px 0 0 var(--stamp-lift); }

/* 2d. Bureau etroit, 901-1180px : la navigation ne se coupe plus.
   Mesure de l'audit (X-PERFA11Y-03) : a 901px, les huit rubriques mesuraient
   954px pour 871 disponibles, et jusqu'a 1,084 fois plus en police de repli —
   la premiere et la derniere etaient rognees sans defilement possible. En
   15px, 0,05em d'interlettrage et 8 a 13px de marge laterale, les huit tiennent
   a 901px meme en police de repli (≈ 827px). Au-dela de 1180px, rien ne change.
   Le retour a la ligne n'est qu'un filet : mieux vaut deux lignes lisibles
   qu'une rubrique hors ecran. */
@media (min-width: 901px) {
  .nav ul { flex-wrap: wrap; }
}
@media (min-width: 901px) and (max-width: 1180px) {
  .nav a,
  .nav .is-pending {
    padding-inline: clamp(8px, 1.1vw, 20px);
    font-size: 15px;
    letter-spacing: .05em;
  }
}


/* ---------- 3. En-tete retractee au bureau ---------------------------------
   Supprime en 2.1.0 : la barre ne se retracte plus, la navigation reste en
   place pendant toute la lecture (section 2a). */


/* ---------- 4. Volet mobile ------------------------------------------------ */
@media (max-width: 900px) {
  /* Defilable en paysage et a 400 % (PERFA11Y-03, WCAG 1.4.10) : a 667x375 le
     volet descendait a 719px et cinq entrees sur neuf, recherche comprise,
     etaient hors d'atteinte. Le volet s'arrete au bas de l'ecran et defile
     seul, sans entrainer la page. */
  /* Barre unique (2a) : le volet part sous la barre de --head-h, en pleine
     largeur, les entrees reprennent leur hauteur de volet. */
  .head-in { gap: 8px; }
  .brand { font-size: 19px; }
  .head-tools { justify-content: flex-end; }
  .head .nav {
    top: var(--head-h); align-self: auto; height: auto;
  }
  .head .nav ul { height: auto; }
  .head .nav a,
  .head .nav .is-pending {
    display: block; height: auto;
    padding: 15px var(--gut); font-size: 17px; letter-spacing: .08em;
  }
  .nav[data-open] {
    max-height: calc(100vh - var(--head-h));
    max-height: calc(100dvh - var(--head-h));
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  body.admin-bar .nav[data-open] {
    max-height: calc(100vh - var(--head-h) - var(--wc2030-adminbar, 46px));
    max-height: calc(100dvh - var(--head-h) - var(--wc2030-adminbar, 46px));
  }

  /* Recherche du volet : icone lisible (elle etait noire sur l'encre, 1,1:1 —
     VISUALMOBILE-11) et champ en 16px, sous lequel Safari iOS zoome la page
     au focus (X-VISUALMOBILE-03, PERFA11Y-20). */
  .nav .head-search--drawer { color: var(--on-dark); }
  .nav .head-search--drawer input { font-size: 16px; letter-spacing: .02em; padding-block: 12px; }

  /* Rubrique courante dans le volet : un filet a GAUCHE. Le trait du bureau,
     pose sous une entree pleine largeur, se lisait comme un separateur. */
  .nav a[aria-current],
  .nav li.is-section > a,
  .nav li.is-current > a { box-shadow: inset 4px 0 0 0 var(--stamp-lift); }

  /* Le volet ouvert se detache de la page (R2-09) : il s'arretait net sur le
     texte, sans ombre ni voile, et coupait le H1 juste dessous. Une ombre sous
     le volet, et un voile sur la page, sous la barre de 76px — la barre (plaque,
     bouton Menu) reste nette. Le voile est le ::after de l'en-tete : un clic
     dessus touche l'en-tete, hors du volet, et referme le menu (app.js) sans
     activer le lien qui se trouve dessous. `is-menu-open` est pose par app.js
     en meme temps que `data-open`. Pas d'animation d'entree : un voile ou un
     volet coince a mi-transition masquerait la navigation.
     Empilement : le voile (z 0) passe apres le volet dans l'ordre du document ;
     le volet prend z 1 pour rester devant. La barre d'administration (46px)
     decale l'en-tete : le voile suit (variable posee par theme.css). */
  .nav[data-open] {
    z-index: 1;
    box-shadow: 0 24px 48px rgba(0, 0, 0, .35);
  }
  .head.is-menu-open::after {
    content: "";
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 0;
    top: calc(var(--head-h) + var(--wc2030-adminbar, 0px));
    background: rgba(12, 16, 20, .45);
  }
}

/* 320px (et 1280px zoome a 400 %) : le bouton Menu mordait de 3px sur la
   plaque centree. */
@media (max-width: 360px) {
  .head-tools .nav-toggle { padding-inline: 6px; gap: 6px; }
}


/* ---------- 5. Recherche de l'en-tete -------------------------------------- */
.head-search { color: rgba(242, 244, 240, .78); }
.head-search button { color: inherit; }
.head-search button:hover { color: #fff; }
/* L'ancien `outline: 0` battait :focus-visible : aucun anneau sur le seul
   champ de recherche du site (PERFA11Y-09). */
.head-search input:focus-visible {
  outline: 3px solid var(--stamp-lift);
  outline-offset: 2px;
}
/* « Search » tient dans le champ ; plancher de 12px pour le mono. */
.head-search--tools input { width: 150px; font-size: 13px; }
/* 901-1000px, « How we verify » publie : la ligne d'outils arrivait a 5px de la
   plaque (mesure a 901px). Le champ rend 32px. */
@media (min-width: 901px) and (max-width: 1000px) {
  .head-search--tools input { width: 118px; }
}


/* ---------- 6. Pied de page et colophon ------------------------------------ */
.site-foot { display: block; }

/* Titres de colonnes : meme dessin que les anciens H2, sans polluer le plan
   du document (SEOTECH-20). */
.footer .foot-h {
  margin: 0 0 35px;
  font-stretch: 75%; font-weight: 700; font-size: 23px; line-height: 29.9px;
  text-transform: uppercase; letter-spacing: .03em;
  color: #DDD;
}
.footer a[aria-current="page"] { color: #fff; box-shadow: inset 0 -2px 0 0 var(--stamp-lift); }

/* Colophon : l'avis complet de non-affiliation, puis les liens legaux publies.
   Il vit maintenant DANS le <footer> (repere contentinfo, PERFA11Y-27). */
.colophon { padding-block: 16px; }
.colo-in { align-items: center; }
.colo-notice {
  margin: 0; max-width: 88ch;
  font-size: 13px; line-height: 20px; color: var(--muted-dark);
}
.colo-r { display: flex; flex-wrap: wrap; gap: 4px 18px; margin: 0; padding: 0; list-style: none; }
.colophon .colo-r a {
  display: inline-block; padding-block: 6px;
  font-size: 13px; white-space: nowrap;
}
@media (max-width: 640px) {
  .colo-in { justify-content: flex-start; text-align: left; }
}


/* ---------- 7. Credits d'images (accueil) ----------------------------------
   Genere depuis CREDITS.json (inc/setup.php). */
.credits :focus-visible { outline-color: var(--stamp-lift); }        /* 8,5:1 sur l'encre (X-PERFA11Y-02) */
.credits summary:focus-visible { color: #fff; }
.credits .lic { font-size: 13px; }                                    /* plancher mono */
.credits a.lic { font-family: var(--mono); letter-spacing: .06em; color: var(--on-dark-2); }
.credits .mod { color: var(--muted-dark); }
/* Liens DANS une phrase de credit : soulignement de texte, plus de boite
   inline-block dont le filet tombait entre deux lignes (exception « en ligne »
   de WCAG 2.5.8 pour la taille de cible). */
.credits ul { gap: 10px 30px; }
.credits li { line-height: 22px; }
.credits li a {
  display: inline; padding-block: 0; border-bottom: 0;
  text-decoration: underline; text-decoration-thickness: 1px;
  text-decoration-color: rgba(168, 176, 184, .45); text-underline-offset: 3px;
}
.credits li a:hover, .credits li a:focus-visible { text-decoration-color: currentColor; }
/* « \2212 » avalait l'espace qui le suivait : « −IMAGE CREDITS ». */
.credits summary::before { content: "+\00a0"; }
.credits details[open] summary::before { content: "\2212\00a0"; }


/* ---------- 8. Bande de provenance (accueil) -------------------------------
   Le titre est un <p class="claim"> : meme dessin que l'ancien H2. */
.prov .claim a { border-bottom: 1px solid currentColor; }

/* Legende : cinq VRAIS faits du registre, en lignes alignees (jauge, valeur,
   libelle, statut · source · date). La grille a cinq colonnes egales coupait
   les libelles sur deux lignes et detachait les jauges (VISUALMOBILE-31). */
.prov .prov-facts {
  display: grid;
  grid-template-columns: auto auto auto auto;
  justify-content: center;
  gap: 0 18px;
  max-width: 100%;
  margin: 16px auto 14px;
  text-align: left;
}
.prov .prov-facts li {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: auto 3.4em auto auto;
  grid-template-columns: subgrid;
  align-items: baseline;
  gap: 0 18px;
  padding-block: 7px;
  border-top: 1px solid var(--rule);
  font-family: var(--display); font-size: 15px; line-height: 22px;
  letter-spacing: 0; text-transform: none; color: var(--ink);
}
.prov .prov-facts li:last-child { border-bottom: 1px solid var(--rule); }
.prov .prov-facts .gauge { align-self: center; margin-top: 0; }
.prov-v { font-weight: 700; font-variant-numeric: tabular-nums; text-align: right; }
.prov-l { min-width: 0; }
.prov-s {
  font-family: var(--mono); font-size: 13px; letter-spacing: .08em;
  text-transform: uppercase; color: var(--muted);
}
/* Segments insecables (statut · source · verified 18 Sep 2026) : la ligne ne
   se coupe qu'entre deux segments, jamais au milieu de la date (REV1-08). */
.prov-s .prov-seg { white-space: nowrap; }
/* Le nom de la source est un LIEN vers la source du fait (EXACT2-04) : ces
   cinq lignes sont l'exemple de « chaque chiffre porte sa source ». Meme
   dessin que les sources de la bande 1930 / 100 / 2030 (home.css) :
   soulignement fin, couleur du segment, vert au survol et au focus. Le
   soulignement suffit a le distinguer du texte voisin (WCAG 1.4.1). */
.prov-s a.prov-a {
  color: inherit;
  text-decoration: underline; text-decoration-thickness: 1px;
  text-decoration-color: rgba(95, 104, 111, .55); text-underline-offset: 3px;
  transition: color var(--t-fast) var(--ease), text-decoration-color var(--t-fast) var(--ease);
}
.prov-s a.prov-a:hover,
.prov-s a.prov-a:focus-visible { color: var(--stamp); text-decoration-color: currentColor; }
.authorities .prov-k { margin: 0 10px 0 0; white-space: nowrap; }
.authorities .prov-src { margin: 0; white-space: nowrap; }
.authorities .prov-src:not(:last-child)::after {
  content: "\00a0\00a0·";
  content: "\00a0\00a0·" / "";
  margin-right: 6px;
}

@media (max-width: 640px) {
  .prov .prov-facts { grid-template-columns: auto auto minmax(0, 1fr); }
  .prov .prov-facts li { grid-template-columns: auto 2.6em minmax(0, 1fr); grid-template-columns: subgrid; }
  .prov-s { grid-column: 2 / -1; margin-top: 2px; }
  /* Les deux barres du titre suivent le texte au lieu de flotter au milieu de
     trois lignes centrees. */
  .prov .claim { padding-left: 0; }
  .prov .claim::before {
    position: static; display: inline-block; transform: none;
    vertical-align: -2px; margin-right: 10px;
  }
}


/* ---------- 9. Pages de la charpente ----------------------------------------
   404, recherche, index des news et archives (`.shell-page`). Un seul bord
   gauche : la gouttiere est portee par `.wrap`, les blocs internes n'en
   rajoutent plus (VISUALMOBILE-18). */
.shell-page .archive-head { margin: 0 0 32px; padding-top: 48px; max-width: 760px; }
@media (max-width: 900px) {
  .shell-page .archive-head { padding-top: 24px; }
}
.shell-page .empty-state { margin: 0 0 20px; color: var(--slate); }
.shell-page .news,
.shell-page .pagination { margin-inline: 0; }

/* NB : dans `.sheet`, theme.css (25j-1) remet a zero TOUT `margin-top` d'un
   enfant de bloc (specificite 0,3,0). Les espacements verticaux ci-dessous sont
   donc portes par des `padding-top`, qui ne sont pas touches. */

/* 9a. Tete : rubrique (les deux barres du geste signature), titre en casse de
   phrase plus grand que tout H2 de la page, chapo. */
/* Meme dessin que .art-kicker (article.css) : une etiquette au-dessus d'un H1 se
   lit de la meme facon sur une fiche, une 404 ou une recherche (recette R3-07). */
.shell-kicker {
  position: relative; margin: 0 0 14px; padding-left: 18px;
  font-family: var(--mono); font-weight: 600; font-size: 13px; line-height: 16px;
  letter-spacing: .08em; text-transform: uppercase; color: var(--stamp);
}
.shell-kicker::before {
  content: ""; position: absolute; left: 0; top: 2px;
  width: 9px; height: 12px;
  background:
    linear-gradient(var(--stamp), var(--stamp)) left / 3px 100% no-repeat,
    linear-gradient(var(--stamp), var(--stamp)) right / 3px 100% no-repeat;
}
.shell-title {
  margin: 0;
  font-stretch: 75%; font-weight: 800; font-size: 44px; line-height: 48px;
  letter-spacing: 0; text-transform: none; color: var(--ink);
}
.shell-lede { margin: 0; padding-top: 14px; max-width: 680px; font-size: 19px; line-height: 29px; color: var(--slate); }
@media (max-width: 900px) {
  .shell-title { font-size: 34px; line-height: 38px; }
}
@media (max-width: 640px) {
  .shell-title { font-size: 30px; line-height: 34px; }
  .shell-lede { font-size: 17px; line-height: 27px; }
}

/* 9b. Recherche dans le corps (404, resultats). */
.page-search { margin: 0 0 44px; max-width: 680px; }
.page-search-l {
  display: block; margin: 0 0 8px;
  font-family: var(--mono); font-size: 13px; letter-spacing: .08em;
  text-transform: uppercase; color: var(--muted);
}
.page-search-row { display: flex; }
.page-search input {
  flex: 1 1 auto; min-width: 0; height: 52px; margin: 0; padding: 0 16px;
  font-family: var(--display); font-size: 18px; color: var(--ink);
  background: #fff; border: 1px solid var(--muted); border-right: 0; border-radius: 0;
}
.page-search input:focus-visible { outline: 3px solid var(--stamp); outline-offset: 2px; }
.page-search-b {
  display: inline-flex; align-items: center; gap: 10px; flex: none;
  height: 52px; margin: 0; padding: 0 22px;
  background: var(--stamp); color: #fff; border: 0; border-radius: 0; cursor: pointer;
  font-family: var(--display); font-stretch: 87%; font-weight: 700; font-size: 14px;
  letter-spacing: .08em; text-transform: uppercase;
  transition: background-color var(--t-fast) var(--ease);
}
.page-search-b:hover { background: var(--ink); }
.page-search-b svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; }
@media (max-width: 480px) {
  .page-search-b span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .page-search-b { padding: 0 16px; }
}

/* 9c. « Where to start » : une carte par hub publie (wc2030/hubs). */
.hub-lead {
  margin: 0 0 14px;
  font-family: var(--mono); font-size: 13px; letter-spacing: .08em;
  text-transform: uppercase; color: var(--muted);
}
.hub-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 20px; }
/* Meme langage que les cartes d'enfants d'un hub (.art-card) : filet vert en
   haut, titre en casse de phrase (recette R3-08). */
.hub-card {
  display: flex; flex-direction: column; gap: 6px; height: 100%;
  padding: 18px 22px 20px;
  background: var(--panel); border-top: 3px solid var(--stamp); color: var(--ink);
  transition: background-color var(--t-fast) var(--ease);
}
.hub-card:hover, .hub-card:focus-visible { background: #E4E7DD; }
.hub-card-t {
  font-stretch: 75%; font-weight: 700; font-size: 24px; line-height: 1.15;
  text-transform: none; letter-spacing: 0;
}
.hub-card:hover .hub-card-t, .hub-card:focus-visible .hub-card-t { color: var(--stamp); }
.hub-card-n {
  font-family: var(--mono); font-size: 13px; letter-spacing: .08em;
  text-transform: uppercase; color: var(--muted);
}
.hub-card-x { font-size: 15px; line-height: 23px; color: var(--slate); }

/* 9d. Resultats de recherche : rubrique, titre (H2, un seul lien), extrait. */
.results { display: grid; max-width: 760px; }
.rcard { position: relative; padding: 22px 0; border-top: 1px solid var(--rule); }
.results > li:last-child .rcard { border-bottom: 1px solid var(--rule); }
.rcard-k {
  margin: 0 0 6px;
  font-family: var(--mono); font-size: 13px; letter-spacing: .08em;
  text-transform: uppercase; color: var(--stamp);
}
.rcard h2 {
  margin: 0;
  font-stretch: 87%; font-weight: 700; font-size: 22px; line-height: 28px;
  letter-spacing: 0; text-transform: none; color: var(--ink);
}
.rcard h2 a { color: inherit; transition: color var(--t-fast) var(--ease); }
.rcard h2 a::after { content: ""; position: absolute; inset: 0; }
.rcard:hover h2 a, .rcard h2 a:focus-visible { color: var(--stamp); }
.rcard .wp-block-post-excerpt { margin: 0; padding-top: 8px; }
.rcard .wp-block-post-excerpt__excerpt { margin: 0; font-size: 16px; line-height: 26px; color: var(--slate); }

/* 9e. Cartes de news : titre en H2 (le gabarit sautait du H1 au H3 —
   PERFA11Y-27), un seul lien par carte, date au format unique. */
.ncard .wp-block-post-date { display: block; margin: 0; padding-top: 14px; }
.ncard h2 {
  margin: 0; padding: 6px 0 8px;
  font-stretch: 87%; font-weight: 700; font-size: 22px; line-height: 1.2;
  letter-spacing: 0; text-transform: none; color: var(--ink);
}
.ncard h2 a { color: var(--ink); }
.ncard h2 a::after { content: ""; position: absolute; inset: 0; }
.ncard:hover h2 a, .ncard:focus-within h2 a { color: var(--stamp); }
.ncard .wp-block-post-excerpt__excerpt { margin: 0; }

.shell-page .wp-block-query-no-results .hubs { padding-top: 8px; }


/* ---------- 10. Carrousels : defilement natif --------------------------------
   Pistes `.track-vp > .track[data-track]` de l'accueil (balisage de l'agent
   « home », inchange). La piste ne bouge plus par `transform` : elle defile
   nativement, avec accroche, au doigt comme au clavier (X-VISUALMOBILE-02,
   HOME-20, PERFA11Y-05). La barre de defilement est masquee : les fleches et
   le balayage suffisent, et elle mangeait 15px sous les cartes. */
.track-vp {
  overflow-x: auto; overflow-y: hidden;
  scroll-snap-type: x mandatory;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  /* De la place pour l'anneau de focus des cartes, rogne par le cadre. */
  padding-block: 8px; margin-block: -8px;
}
.track-vp::-webkit-scrollbar { display: none; }
.track { transition: none; }
.track > * { scroll-snap-align: start; }

/* Fleche en bout de piste : aria-disabled (le bouton garde le focus). */
.arrow[aria-disabled="true"] { opacity: .3; cursor: default; }
.arrow[aria-disabled="true"]:hover { background: none; border-color: var(--rule); color: var(--ink); }
.on-dark .arrow[aria-disabled="true"]:hover,
.hero .arrow[aria-disabled="true"]:hover {
  background: none; border-color: rgba(242, 244, 240, .28); color: var(--on-dark);
}


/* ---------- 11. Article de news (templates/single.html) ---------------------
   Meme squelette que page-article, SANS rail : la colonne de lecture reste
   alignee sur l'en-tete d'article, a gauche, a sa mesure. Specificite double
   pour passer devant la grille d'article.css, chargee apres cette feuille. */
.article-grid.article-grid--solo { display: block; }
.article-grid.article-grid--solo > .article-main { max-width: 720px; }


/* ---------- 12. Pages courtes : le pied de page touche le bas de l'ecran -----
   Une page plus courte que l'ecran (news courte, archive d'un seul article)
   laissait sous le colophon une bande du fond du <body> (--page, gris vert) :
   40px a 375x900, 200px a 768x1024 (R2-07). Le conteneur de gabarit du coeur
   (.wp-site-blocks : en-tete, <main>, pied) prend au moins la hauteur de
   l'ecran et <main> absorbe la difference ; le pied reste colle en bas.
   <main> prend le fond de la feuille (--sheet) : sans lui, la bande grise
   remontait simplement AU-DESSUS du pied, sous la section `.sheet` de
   l'archive. Ailleurs ce fond est invisible : les sections de <main> le
   couvrent en entier (capture pleine page identique au pixel, avec et sans,
   sur les dix gabarits du banc — probes/main_bg_check.py).
   Sur une page longue, rien ne bouge : verifie en comparant la position des
   blocs avec et sans cette regle (probes/r2_probe.py).
   - 100dvh apres 100vh : la barre d'adresse mobile qui se replie ne rouvre
     pas de bande ; le navigateur qui ignore dvh garde 100vh.
   - barre d'administration : WordPress decale <html> de 32/46px ; sans ce
     retrait, la page d'un editeur connecte defilerait d'autant pour rien.
   - ecran seulement : a l'impression, pas de page blanche de remplissage. */
@media screen {
  .wp-site-blocks {
    display: flex; flex-direction: column;
    min-height: 100vh;
    min-height: 100dvh;
  }
  body.admin-bar .wp-site-blocks {
    min-height: calc(100vh - var(--wc2030-adminbar, 32px));
    min-height: calc(100dvh - var(--wc2030-adminbar, 32px));
  }
  .wp-site-blocks > main { flex: 1 0 auto; }
  /* Specificite nulle : le fond d'un <main> dessine ailleurs (`.article`,
     article.css) garde la main. */
  :where(.wp-site-blocks > main) { background: var(--sheet); }
}


/* ---------- 13. Plancher typographique (2.1.0) ------------------------------
   Demande du proprietaire (23/09/2026) : « polices trop petites ». Les
   etiquettes en capitales mono tombaient a 11-12px avec 0,10 a 0,14em
   d'interlettrage — lisibles a l'ecran de conception, trop petites sur un
   portable. Plancher : 13px pour les etiquettes et les sources, 12px pour les
   seules annees du rail (espace compte). L'interlettrage redescend a
   0,04-0,08em pour que la largeur ne gonfle pas. home.css et article.css ont
   ete remontes dans leur propre fichier ; ici, les regles de theme.css (gelee). */
.src { font-size: 13px; letter-spacing: .06em; }
.meta { font-size: 13px; letter-spacing: .08em; }
.head-tools a, .head-tools button,
.head-tools .nav-toggle, .head-tools .is-pending { font-size: 13px; }
.chit .lab { font-size: 13px; letter-spacing: .08em; }
.rail-year, .rail-slot[data-decade] .rail-year { font-size: 12px; }
.rail-caption { font-size: 12px; letter-spacing: .08em; }
.flag { font-size: 13px; letter-spacing: .08em; }
.band-side .place,
.band-fact,
.band-info .item { font-size: 13px; letter-spacing: .06em; }
.tbl th { font-size: 13px; letter-spacing: .06em; }
.tbl .rank { font-size: 13px; }
.rr-meta .meta, .rr-meta .src { font-size: 13px; }
.qrow { font-size: 14px; letter-spacing: .04em; }
.gal figcaption, .track figcaption { font-size: 13px; letter-spacing: .03em; }
.legend li { font-size: 13px; }
.credits summary, .credits .lic { font-size: 13px; }
.colophon a, .colophon .is-pending { font-size: 13px; letter-spacing: .06em; }
.prose figcaption, .prose .wp-element-caption { font-size: 14px; letter-spacing: 0; }
.head-search input { font-size: 13px; }


/* ---------- 14. Bandeau de consentement (Complianz) ------------------------
   Complianz pose ses couleurs et ses tailles en variables sur :root (fichier
   genere dans uploads/complianz). Redefinies ICI sur ses propres elements, elles
   l'emportent quel que soit l'ordre des feuilles. Bleu #1E73BE et textes de 12px
   remplaces par la charte (vert --stamp, encre, 14px). « Deny » a le meme poids
   visuel qu'« Accept » (contour encre plein) : refuser doit etre aussi simple
   qu'accepter. 2.1.1, 23/09/2026. */
.cmplz-cookiebanner,
#cmplz-manage-consent,
.cmplz-manage-consent-container {
  --cmplz_banner_background_color: var(--sheet);
  --cmplz_banner_border_color: var(--rule);
  --cmplz_banner_border_width: 1px 1px 1px 1px;
  --cmplz_banner_border_radius: 4px 4px 4px 4px;
  --cmplz_text_color: var(--ink);
  --cmplz_hyperlink_color: var(--stamp);
  --cmplz_title_font_size: 18px;
  --cmplz_text_font_size: 14px;
  --cmplz_link_font_size: 14px;
  --cmplz_category_body_font_size: 14px;
  --cmplz_category_header_title_font_size: 15px;
  --cmplz_category_header_active_font_size: 13px;
  --cmplz_category_header_always_active_color: var(--stamp);
  --cmplz_button_font_size: 15px;
  --cmplz_button_border_radius: 2px 2px 2px 2px;
  --cmplz_button_accept_background_color: var(--stamp);
  --cmplz_button_accept_border_color: var(--stamp);
  --cmplz_button_accept_text_color: #FFFFFF;
  --cmplz_button_deny_background_color: var(--sheet);
  --cmplz_button_deny_border_color: var(--ink);
  --cmplz_button_deny_text_color: var(--ink);
  --cmplz_button_settings_background_color: var(--sheet);
  --cmplz_button_settings_border_color: var(--rule);
  --cmplz_button_settings_text_color: var(--slate);
  --cmplz_slider_active_color: var(--stamp);
  --cmplz_slider_inactive_color: #8A9199;
  --cmplz_slider_bullet_color: #FFFFFF;
}
.cmplz-cookiebanner .cmplz-title {
  font-family: var(--display); font-stretch: 87%; font-weight: 700;
  letter-spacing: .02em; text-transform: uppercase;
}
.cmplz-cookiebanner .cmplz-btn { font-weight: 600; }
.cmplz-cookiebanner .cmplz-btn:focus-visible { outline: 3px solid var(--stamp); outline-offset: 2px; }