/* home.css — la banque de blocs home. AUCUNE couleur ni police ici :
   tout vient des tokens posés par da.py (--c-*, --f-*, --t*, --e*, --r-*...).
   Un test statique refuse toute couleur littérale dans ce fichier. */

html { overflow-x: clip; }
body { overflow-x: clip; }
.bh-790e-home {
  font-family: var(--f-texte); color: var(--c-texte); background: var(--c-fond);
  font-size: var(--t1); line-height: 1.6;
  width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw);
  position: relative; box-sizing: border-box; text-align: left;
}
.bh-790e-home *, .bh-790e-home *::before, .bh-790e-home *::after { box-sizing: border-box; }
.bh-790e-home * { min-width: 0; }
.bh-790e-home :is(a, p, span, small) { opacity: 1; }
.bh-790e-home img { max-width: 100%; display: block; }
.bh-790e-home a { color: inherit !important; }
.bh-790e-home :is(h1, h2, h3, h4, blockquote) { color: inherit; }
.bh-790e-home p { margin: 0; }
.bh-790e-home h2, .bh-790e-home h3 { margin: 0; }
.bh-790e-home .bh-790e-h2 { color: var(--c-texte) !important; }
.bh-790e-home .bh-790e-intro { color: var(--c-texte) !important; }
.bh-790e-home :is(.bh-790e-kicker, .bh-790e-num) { color: var(--c-texte) !important; }
.bh-790e-home .bh-790e-c-p { color: var(--carte-encre) !important; }
.bh-790e-home :is(.bh-790e-c-titre, .bh-790e-c-meta, .bh-790e-c-kicker, .bh-790e-c-suite):not(.bh-790e-c-voile *) { color: var(--carte-encre) !important; }
.bh-790e-marque-site {
  position: absolute; z-index: 10; inset-block-start: var(--e3); inset-inline-start: var(--e5);
  padding: var(--e2) var(--e3); background: var(--c-fond); color: var(--c-texte);
  border: var(--bordure) solid var(--c-bordure); border-radius: var(--r-bouton);
}

/* ─── sections : un écran chacune ─── */
.bh-790e-home .bh-790e-bloc {
  min-height: calc(100svh - var(--header-h)); display: flex; flex-direction: column;
  justify-content: center; padding-block: var(--e7); background: var(--c-fond) !important; color: var(--c-texte) !important;
}
.bh-790e-home .bh-790e-fond-b { background: var(--c-fond-2) !important; }
.bh-790e-home .bh-790e-fond-doux {
  background: var(--c-doux) !important;
  --c-texte: var(--c-sur-doux); --c-texte-2: var(--c-sur-doux); --c-primaire-texte: var(--c-sur-doux);
}
/* Contraste sur fond doux. Les jetons dérivés (--btn-texte, --carte-lien, --lien-couleur) sont
   résolus sur :root avec la couleur primaire : posés à même un fond doux (bouton contour ou
   souligné, lien hors carte), ils tombaient sous 4.5 (mesuré le 24/09 : 4.06 à 4.45). Sur fond
   doux ils prennent l'encre du doux ; dans une carte, qui a son propre fond, ils reprennent
   leur valeur d'origine gardée sur .bh-790e-home. */
.bh-790e-home { --btn-texte-racine: var(--btn-texte); --btn-bord-racine: var(--btn-bord); --carte-lien-racine: var(--carte-lien); }
.bh-790e-home .bh-790e-fond-doux { --carte-lien: var(--c-sur-doux); --lien-couleur: var(--c-sur-doux); --lien-fond-encre: var(--c-sur-doux); }
.bh-790e-home:is([data-bouton="contour"], [data-bouton="souligne"]) .bh-790e-fond-doux { --btn-texte: var(--c-sur-doux); }
.bh-790e-home[data-bouton="contour"] .bh-790e-fond-doux { --btn-bord: 2px solid var(--c-sur-doux); }
.bh-790e-home .bh-790e-fond-doux :is(.bh-790e-carte, .bh-790e-acc) {
  --carte-lien: var(--carte-lien-racine); --btn-texte: var(--btn-texte-racine); --btn-bord: var(--btn-bord-racine);
}
.bh-790e-int { width: min(100% - 2 * var(--e5), var(--largeur)); margin-inline: auto; }

/* ─── en-tête de section ─── */
.bh-790e-entete { margin-bottom: var(--e6); max-width: 64ch; }
[data-alignement="centre"] .bh-790e-entete { margin-inline: auto; text-align: center; }
[data-alignement="centre"] .bh-790e-d-colle .bh-790e-entete { margin-inline: 0; text-align: left; }
.bh-790e-num { display: none; }
[data-titres="numero"] .bh-790e-num {
  display: block; font-family: var(--f-titre); font-size: var(--t4); line-height: 1;
  color: var(--c-primaire-texte); margin-bottom: var(--e3);
}
.bh-790e-kicker { font-size: var(--tm); text-transform: var(--f-casse-kicker); letter-spacing: .08em; color: var(--c-primaire-texte); font-weight: 600; }
.bh-790e-h2 {
  font-family: var(--f-titre); font-weight: var(--f-graisse-titre); line-height: 1.08;
  font-size: clamp(var(--t3), 4vw, var(--t5)); color: var(--c-texte); margin-bottom: var(--e3);
  letter-spacing: -.01em;
}
[data-titres="geant"] .bh-790e-h2 { font-size: clamp(var(--t4), 6vw, var(--t6)); letter-spacing: -.025em; }
[data-titres="trait"] .bh-790e-h2 { padding-bottom: var(--e3); border-bottom: 3px solid var(--c-primaire-texte); display: inline-block; }
[data-titres="kicker"] .bh-790e-entete::before {
  content: ""; display: block; width: 3rem; height: 4px; background: var(--c-primaire); margin-bottom: var(--e4);
}
[data-alignement="centre"][data-titres="kicker"] .bh-790e-entete::before { margin-inline: auto; }
.bh-790e-intro { color: var(--c-texte-2); font-size: var(--t2); }
.bh-790e-entete-lien { margin-top: var(--e4); }

/* ─── boutons et liens ─── */
.bh-790e-home .bh-790e-bouton {
  display: inline-flex; align-items: center; justify-content: center; gap: .5em;
  padding: .75em 1.35em; font: inherit; font-weight: 600; cursor: pointer;
  background: var(--btn-fond) !important; color: var(--btn-texte) !important; border: var(--btn-bord);
  border-radius: var(--r-bouton); box-shadow: var(--btn-ombre);
  text-decoration: var(--btn-deco); text-underline-offset: .35em; text-decoration-thickness: 2px;
  transition: transform .15s ease;
}
.bh-790e-bouton:hover { transform: translateY(-2px); }
/* Les flèches de la banque sont des tracés SVG posés par rendu.py, plus des
   glyphes de fonte injectés par CSS (le « » seul se lisait comme un caractère
   orphelin, centré sous les cartes de forme « ligne »). */
.bh-790e-fleche svg { width: 1.1em; height: 1.1em; flex: 0 0 auto; }
.bh-790e-home :is(.bh-790e-c-suite, .bh-790e-intro a) {
  color: var(--carte-lien) !important; font-weight: 600; text-decoration: var(--lien-deco);
  text-decoration-thickness: var(--lien-epaisseur); text-underline-offset: .3em; width: fit-content;
}
/* surligné : l encre du doux, en !important sinon la règle .bh-790e-c-suite (encre de lien) gagnait : 3.85 mesuré en sombre */
.bh-790e-home[data-lien="surligne"] .bh-790e-c-suite { background: var(--c-doux); color: var(--c-sur-doux) !important; padding: .1em .35em; }

/* ─── cartes ─── */
.bh-790e-home .bh-790e-carte {
  background: var(--carte-fond) !important; color: var(--carte-encre) !important; border: var(--carte-bord);
  border-radius: var(--r-carte); box-shadow: var(--o-carte); overflow: hidden;
  display: flex; flex-direction: column; min-width: 0; position: relative;
  transition: box-shadow .2s ease, transform .2s ease;
}
.bh-790e-carte:hover { box-shadow: var(--o-survol); }
.bh-790e-c-corps { padding: var(--e5); display: flex; flex-direction: column; gap: var(--e2); flex: 1; }
.bh-790e-c-titre { font-family: var(--f-titre); font-weight: var(--f-graisse-titre); font-size: var(--t2); line-height: 1.2; color: var(--carte-encre); }
.bh-790e-c-titre a { text-decoration: none; color: inherit; }
.bh-790e-c-titre a:hover { text-decoration: underline; text-underline-offset: .2em; }
/* Plafond de lignes des paragraphes de carte. Il ne sert plus à faire tenir un
   texte dans une mise en page : le budget rédactionnel est de 240 caractères
   (phrase complète) et tient en 8 lignes à 360 px. Douze lignes ne coupent donc
   jamais un texte écrit, elles protègent d'un collage pathologique. Même valeur
   que .bh-790e-pile, qui l'appliquait déjà à ses propres cartes. */
.bh-790e-c-p { color: var(--carte-encre-2); display: -webkit-box; -webkit-line-clamp: 12; -webkit-box-orient: vertical; overflow: hidden; }
.bh-790e-c-kicker { font-size: var(--tm); text-transform: var(--f-casse-kicker); letter-spacing: .06em; color: var(--carte-lien); font-weight: 600; }
.bh-790e-c-meta { font-size: var(--tm); color: var(--carte-encre-2); }
.bh-790e-c-img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }

.bh-790e-cs-texte, .bh-790e-cs-qr, .bh-790e-cs-fait, .bh-790e-cs-citation { padding: var(--e5); gap: var(--e3); }
/* Les formes de carte sont préfixées par .bh-790e-home : sans cela elles restaient à
   (0,1,0) sous `.bh-790e-home .bh-790e-carte` (0,2,0), qui impose `flex-direction:
   column` à toutes les cartes. La forme « ligne » était donc empilée et son
   icône « lire la suite » tombait seule et centrée sous le texte. À
   spécificité égale, l'ordre de source tranche : ces règles sont plus bas dans
   le fichier, elles gagnent enfin.
   `min-height: 100%` sur un item dont la hauteur de parent est inconnue
   chassait .bh-790e-c-corps hors de la carte : `align-self: stretch` étire la photo
   sans écraser le texte. */
.bh-790e-home .bh-790e-cs-image-gauche { flex-direction: row; }
.bh-790e-cs-image-gauche .bh-790e-c-media { flex: 0 0 38%; align-self: stretch; min-height: 0; }
.bh-790e-cs-image-gauche .bh-790e-c-media img { width: 100%; height: 100%; min-height: 9rem; object-fit: cover; }
.bh-790e-cs-superpose { min-height: 15rem; justify-content: flex-end; }
.bh-790e-cs-superpose .bh-790e-c-img { position: absolute; inset: 0; height: 100%; aspect-ratio: auto; }
.bh-790e-c-voile {
  position: relative; padding: var(--e5); display: flex; flex-direction: column; gap: var(--e2);
  background: linear-gradient(to top, var(--c-voile) 0%, color-mix(in srgb, var(--c-voile) 96%, transparent) 45%, color-mix(in srgb, var(--c-voile) 84%, transparent) 76%, color-mix(in srgb, var(--c-voile) 62%, transparent) 100%);
  color: var(--c-sur-voile); padding-top: var(--e8);
}
.bh-790e-c-voile .bh-790e-c-titre, .bh-790e-c-voile .bh-790e-c-kicker, .bh-790e-c-voile .bh-790e-c-meta { color: var(--c-sur-voile); }
.bh-790e-c-vedette .bh-790e-c-titre { font-size: var(--t4); }
.bh-790e-cs-portrait { align-items: flex-start; }
.bh-790e-c-avatar { width: 6rem; height: 6rem; border-radius: 50%; object-fit: cover; margin: var(--e5) var(--e5) 0; }
.bh-790e-c-vedette .bh-790e-c-avatar { width: 9rem; height: 9rem; }
.bh-790e-cs-numero .bh-790e-c-numero {
  font-family: var(--f-titre); font-size: var(--t5); line-height: 1; color: var(--carte-lien);
  padding: var(--e5) var(--e5) 0; font-weight: var(--f-graisse-titre);
}
.bh-790e-home .bh-790e-cs-ligne { flex-direction: row; align-items: center; justify-content: space-between; gap: var(--e4); }
.bh-790e-cs-ligne .bh-790e-c-corps { padding-block: var(--e4); }
.bh-790e-c-fleche {
  display: inline-flex; align-items: center; padding: var(--e4); text-decoration: none;
  font-size: var(--t3); color: var(--carte-lien);
}
.bh-790e-cs-pastille { background: transparent; border: 0; box-shadow: none; overflow: visible; }
.bh-790e-c-pastille {
  display: flex; align-items: baseline; justify-content: space-between; gap: var(--e3);
  padding: .7em 1.1em; border-radius: var(--r-bouton); border: var(--carte-bord);
  background: var(--carte-fond); color: var(--carte-encre); text-decoration: none; font-weight: 600;
}
.bh-790e-c-pastille small { color: var(--carte-encre-2); font-weight: 400; }
.bh-790e-c-pastille:hover { background: var(--c-primaire); color: var(--c-sur-primaire); }
.bh-790e-c-pastille:hover small { color: var(--c-sur-primaire); }
.bh-790e-c-citation { margin: 0; font-family: var(--f-titre); font-size: var(--t2); line-height: 1.45; }
.bh-790e-c-vedette .bh-790e-c-citation { font-size: var(--t4); }
.bh-790e-c-signature { display: grid; gap: .1em; font-size: var(--tm); color: var(--carte-encre-2); }
.bh-790e-c-signature strong { color: var(--carte-encre); font-size: var(--t1); }
.bh-790e-etoiles { letter-spacing: .15em; font-size: var(--t1); }
.bh-790e-etoiles-pleines { color: var(--carte-lien); }
.bh-790e-etoiles-vides { color: var(--c-bord); }
.bh-790e-c-chiffre { font-family: var(--f-titre); font-size: var(--t6); line-height: 1; color: var(--carte-lien); font-weight: var(--f-graisse-titre); overflow-wrap: anywhere; }
.bh-790e-c-label { font-weight: 600; }
.bh-790e-cs-image-seule { background: transparent; border: 0; box-shadow: none; gap: var(--e2); }
.bh-790e-cs-image-seule img { width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--r-image); }
.bh-790e-c-legende { font-size: var(--tm); color: var(--c-texte-2); }

/* ─── grilles (colonnes posées par le composeur : --cd --ct --cm) ─── */
.bh-790e-grille { display: grid; gap: var(--e5); grid-template-columns: repeat(var(--cm), minmax(0, 1fr)); }
@media (min-width: 640px) { .bh-790e-grille { grid-template-columns: repeat(var(--ct), minmax(0, 1fr)); } }
@media (min-width: 1024px) { .bh-790e-grille { grid-template-columns: repeat(var(--cd), minmax(0, 1fr)); } }
.bh-790e-g-pastille { gap: var(--e3); }

/* magazine : une vedette et une grille de deux colonnes */
.bh-790e-magazine { display: grid; gap: var(--e5); }
.bh-790e-mag-vedette .bh-790e-c-img { aspect-ratio: 4 / 3; }
@media (min-width: 1024px) {
  .bh-790e-magazine { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); align-items: stretch; }
  .bh-790e-mag-droite .bh-790e-mag-vedette { order: 2; }
  .bh-790e-mag-vedette, .bh-790e-mag-vedette .bh-790e-carte { height: 100%; }
  .bh-790e-mag-reste .bh-790e-cs-image-gauche .bh-790e-c-p { -webkit-line-clamp: 2; }
}
.bh-790e-mag-reste .bh-790e-c-titre { font-size: var(--t1); }

/* bento : rectangle toujours plein */
.bh-790e-bento { display: grid; gap: var(--e4); grid-template-columns: minmax(0, 1fr); }
.bh-790e-bento > .bh-790e-carte { min-height: 13rem; }
@media (min-width: 640px) {
  .bh-790e-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bh-790e-bento > :first-child { grid-column: span 2; }
  .bh-790e-bento-4 > :nth-child(2), .bh-790e-bento-6 > :nth-child(2) { grid-column: span 2; }
}
@media (min-width: 1024px) {
  .bh-790e-bento { grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: minmax(11rem, 1fr); }
  .bh-790e-bento-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bh-790e-bento-3 > :nth-child(1) { grid-area: 1 / 1 / 3 / 2; } .bh-790e-bento-3 > :nth-child(2) { grid-area: 1 / 2 / 2 / 3; } .bh-790e-bento-3 > :nth-child(3) { grid-area: 2 / 2 / 3 / 3; }
  .bh-790e-bento-4 > :nth-child(1) { grid-area: 1 / 1 / 3 / 3; } .bh-790e-bento-4 > :nth-child(2) { grid-area: 1 / 3 / 2 / 5; } .bh-790e-bento-4 > :nth-child(3) { grid-area: 2 / 3 / 3 / 4; } .bh-790e-bento-4 > :nth-child(4) { grid-area: 2 / 4 / 3 / 5; }
  .bh-790e-bento-5 > :nth-child(1) { grid-area: 1 / 1 / 3 / 3; } .bh-790e-bento-5 > :nth-child(2) { grid-area: 1 / 3 / 2 / 4; } .bh-790e-bento-5 > :nth-child(3) { grid-area: 1 / 4 / 2 / 5; } .bh-790e-bento-5 > :nth-child(4) { grid-area: 2 / 3 / 3 / 4; } .bh-790e-bento-5 > :nth-child(5) { grid-area: 2 / 4 / 3 / 5; }
  .bh-790e-bento-6 > :nth-child(1) { grid-area: 1 / 1 / 3 / 3; } .bh-790e-bento-6 > :nth-child(2) { grid-area: 1 / 3 / 2 / 5; } .bh-790e-bento-6 > :nth-child(3) { grid-area: 2 / 3 / 3 / 4; } .bh-790e-bento-6 > :nth-child(4) { grid-area: 2 / 4 / 3 / 5; } .bh-790e-bento-6 > :nth-child(5) { grid-area: 3 / 1 / 4 / 3; } .bh-790e-bento-6 > :nth-child(6) { grid-area: 3 / 3 / 4 / 5; }
  .bh-790e-bento-7 > :nth-child(1) { grid-area: 1 / 1 / 3 / 3; } .bh-790e-bento-7 > :nth-child(2) { grid-area: 1 / 3 / 2 / 4; } .bh-790e-bento-7 > :nth-child(3) { grid-area: 1 / 4 / 2 / 5; } .bh-790e-bento-7 > :nth-child(4) { grid-area: 2 / 3 / 3 / 5; } .bh-790e-bento-7 > :nth-child(5) { grid-area: 3 / 1 / 4 / 2; } .bh-790e-bento-7 > :nth-child(6) { grid-area: 3 / 2 / 4 / 3; } .bh-790e-bento-7 > :nth-child(7) { grid-area: 3 / 3 / 4 / 5; }
  .bh-790e-bento > .bh-790e-carte { min-height: 0; }
}
.bh-790e-mosaique > .bh-790e-carte { min-height: 10rem; }
.bh-790e-mosaique .bh-790e-c-lienimg { display: block; flex: 1; min-height: 0; }
.bh-790e-mosaique .bh-790e-cs-image-seule img { aspect-ratio: auto; height: 100%; min-height: 10rem; }

/* split : image ou aplat d'un côté, liste de l'autre */
.bh-790e-split { display: grid; gap: var(--e6); align-items: center; }
.bh-790e-split-media { margin: 0; }
.bh-790e-split-media img { width: 100%; height: min(68svh, 40rem); object-fit: cover; border-radius: var(--r-image); }
.bh-790e-split-texte {
  background: var(--c-primaire); color: var(--c-sur-primaire); border-radius: var(--r-carte);
  min-height: 22rem; padding: var(--e7); display: flex; align-items: flex-end;
}
.bh-790e-split-grand { font-family: var(--f-titre); font-size: clamp(var(--t4), 3.4vw, var(--t6)); line-height: 1.08; font-weight: var(--f-graisse-titre); }
.bh-790e-split-liste { display: grid; gap: var(--e4); }
@media (min-width: 1024px) {
  .bh-790e-split { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .bh-790e-split-droite .bh-790e-split-media { order: 2; }
}

/* carrousel */
.bh-790e-car-piste {
  display: grid; grid-auto-flow: column; grid-auto-columns: minmax(16rem, 21rem); gap: var(--e5);
  overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: var(--e4); scrollbar-width: thin;
}
.bh-790e-car-piste > * { scroll-snap-align: start; }
.bh-790e-car-nav { display: flex; gap: var(--e3); margin-top: var(--e4); }
.bh-790e-car-nav .bh-790e-bouton {
  padding: .4em .9em; font-size: var(--t2); line-height: 1;
  color: var(--c-texte); background: var(--c-fond);
}

/* timeline */
.bh-790e-timeline { list-style: none; margin: 0; padding: 0 0 0 var(--e6); border-left: 2px solid var(--c-bord); display: grid; gap: var(--e5); }
.bh-790e-tl-pas { position: relative; }
.bh-790e-tl-pas::before {
  content: ""; position: absolute; left: calc(-1 * var(--e6) - 8px); top: 1.4rem;
  width: 14px; height: 14px; border-radius: 50%; background: var(--c-primaire); border: 3px solid var(--c-fond);
}
@media (min-width: 1024px) {
  .bh-790e-tl-alterne { border-left: 0; padding: 0; position: relative; }
  .bh-790e-tl-alterne::before { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; border-left: 2px solid var(--c-bord); }
  .bh-790e-tl-alterne .bh-790e-tl-pas { width: calc(50% - var(--e6)); }
  .bh-790e-tl-alterne .bh-790e-tl-pas:nth-child(even) { margin-left: calc(50% + var(--e6)); }
  .bh-790e-tl-alterne .bh-790e-tl-pas::before { left: auto; right: calc(-1 * var(--e6) - 8px); }
  .bh-790e-tl-alterne .bh-790e-tl-pas:nth-child(even)::before { right: auto; left: calc(-1 * var(--e6) - 8px); }
}

/* onglets */
.bh-790e-onglets-barre { display: flex; flex-wrap: wrap; gap: var(--e2); margin-bottom: var(--e5); }
.bh-790e-onglet {
  font: inherit; font-weight: 600; cursor: pointer; padding: .6em 1.1em; border-radius: var(--r-bouton);
  border: var(--carte-bord); background: var(--carte-fond); color: var(--carte-encre);
}
.bh-790e-onglet[aria-selected="true"] { background: var(--c-primaire); color: var(--c-sur-primaire); }
.bh-790e-panneau .bh-790e-carte { font-size: var(--t2); }
.bh-790e-panneau .bh-790e-cs-image-gauche .bh-790e-c-media { flex-basis: 45%; }

/* accordéon */
.bh-790e-accordeon { display: grid; gap: var(--e3); max-width: 60rem; }
[data-alignement="centre"] .bh-790e-accordeon { margin-inline: auto; }
.bh-790e-acc { background: var(--carte-fond); color: var(--carte-encre); border: var(--carte-bord); border-radius: var(--r-carte); box-shadow: var(--o-carte); }
.bh-790e-acc summary { cursor: pointer; padding: var(--e4) var(--e5); font-family: var(--f-titre); font-weight: var(--f-graisse-titre); font-size: var(--t2); }
.bh-790e-acc-corps { padding: 0 var(--e5) var(--e5); display: grid; gap: var(--e3); color: var(--carte-encre-2); }
.bh-790e-acc-corps a { color: var(--carte-lien); font-weight: 600; }

/* mur à colonnes explicites */
.bh-790e-mur { display: grid; gap: var(--e5); grid-template-columns: minmax(0, 1fr); }
.bh-790e-mur-col { display: grid; gap: var(--e5); align-content: start; }
@media (min-width: 640px) {
  .bh-790e-mur { grid-template-columns: repeat(var(--k), minmax(0, 1fr)); grid-template-rows: repeat(var(--r), auto); }
  .bh-790e-mur-col { grid-row: 1 / -1; grid-template-rows: subgrid; }
}

/* tableau */
.bh-790e-tableau-cadre { overflow-x: auto; }
.bh-790e-tableau { width: 100%; border-collapse: collapse; font-size: var(--t1); }
.bh-790e-tableau th, .bh-790e-tableau td { padding: var(--e4); text-align: left; vertical-align: top; border-bottom: 1px solid var(--c-bord); }
.bh-790e-tableau thead th { font-size: var(--tm); text-transform: var(--f-casse-kicker); letter-spacing: .06em; color: var(--c-texte-2); }
.bh-790e-tableau tbody th { font-family: var(--f-titre); font-weight: var(--f-graisse-titre); font-size: var(--t2); width: 34%; }
.bh-790e-tableau tbody th a { color: inherit; text-decoration: none; }
.bh-790e-tableau td { color: var(--c-texte-2); }

/* bandes pleine largeur */
.bh-790e-bandes { display: grid; border-top: 1px solid var(--c-bord); }
.bh-790e-bande { display: grid; gap: var(--e3); padding-block: var(--e6); border-bottom: 1px solid var(--c-bord); }
.bh-790e-bande-titre { font-family: var(--f-titre); font-size: clamp(var(--t3), 3vw, var(--t5)); line-height: 1.1; font-weight: var(--f-graisse-titre); }
.bh-790e-bande-titre a { text-decoration: none; color: inherit; }
.bh-790e-bande-titre a:hover { color: var(--c-primaire-texte); }
.bh-790e-bande-corps { display: grid; gap: var(--e2); color: var(--c-texte-2); }
.bh-790e-bande-corps .bh-790e-c-kicker { color: var(--c-primaire-texte); }
.bh-790e-bande-corps .bh-790e-c-p, .bh-790e-bande-corps .bh-790e-c-meta { color: var(--c-texte-2); }
@media (min-width: 1024px) { .bh-790e-bande { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); align-items: baseline; } }

/* zigzag */
.bh-790e-zigzag { display: grid; gap: var(--e6); }
.bh-790e-zz .bh-790e-cs-image-gauche { flex-direction: column; }
.bh-790e-zz .bh-790e-c-media { flex-basis: auto; }
.bh-790e-zz .bh-790e-c-media img { aspect-ratio: 16 / 10; height: auto; }
@media (min-width: 1024px) {
  .bh-790e-zz .bh-790e-cs-image-gauche { flex-direction: row; align-items: center; }
  .bh-790e-zz .bh-790e-c-media { flex: 0 0 52%; }
  .bh-790e-zz-inverse .bh-790e-cs-image-gauche { flex-direction: row-reverse; }
  .bh-790e-zz .bh-790e-c-titre { font-size: var(--t4); }
}

/* pile centrée */
.bh-790e-pile { display: grid; gap: var(--e5); max-width: 54rem; }
[data-alignement="centre"] .bh-790e-pile { margin-inline: auto; }
.bh-790e-pile .bh-790e-c-citation { font-size: var(--t3); -webkit-line-clamp: 12; }
.bh-790e-pile .bh-790e-cs-texte .bh-790e-c-titre { font-size: var(--t3); }

/* défilant */
.bh-790e-defilant { display: grid; gap: var(--e4); overflow: hidden; }
.bh-790e-def-rang { overflow: hidden; white-space: nowrap; }
.bh-790e-def-piste { display: inline-flex; gap: var(--e7); animation: bh-790e-defile 70s linear infinite; }
.bh-790e-def-inverse .bh-790e-def-piste { animation-direction: reverse; }
.bh-790e-def-mot { font-family: var(--f-titre); font-size: clamp(var(--t3), 4vw, var(--t6)); font-weight: var(--f-graisse-titre); text-decoration: none; color: var(--c-texte); }
.bh-790e-def-mot:nth-child(3n+2) { color: var(--c-primaire-texte); }
@keyframes bh-790e-defile { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .bh-790e-def-piste { animation: none; } }

/* rail : une vedette, un rail dessous */
.bh-790e-rail { display: grid; gap: var(--e5); }
.bh-790e-rail-vedette .bh-790e-cs-image-gauche .bh-790e-c-media { flex-basis: 50%; }
.bh-790e-rail-vedette .bh-790e-c-titre { font-size: var(--t4); }
@media (max-width: 1023px) { .bh-790e-rail-vedette .bh-790e-cs-image-gauche { flex-direction: column; } }

/* colle : intro collée à gauche */
.bh-790e-d-colle .bh-790e-int { display: grid; gap: var(--e6); }
.bh-790e-colle-liste { display: grid; gap: var(--e4); }
@media (min-width: 1024px) {
  .bh-790e-d-colle .bh-790e-int { grid-template-columns: minmax(0, .85fr) minmax(0, 1.35fr); align-items: start; }
  .bh-790e-d-colle .bh-790e-entete { position: sticky; top: calc(var(--header-h) + var(--e5)); }
}

/* ─── hero ─── */
.bh-790e-hero { height: calc(100svh - var(--header-h)); min-height: 0; padding-block: 0; position: relative; overflow: hidden; justify-content: flex-end; }
.bh-790e-hero-kicker { font-size: var(--tm); text-transform: var(--f-casse-kicker); letter-spacing: .1em; font-weight: 600; margin-bottom: var(--e3); }
.bh-790e-home .bh-790e-hero-h1 { font-family: var(--f-titre); font-weight: var(--f-graisse-titre); font-size: clamp(2.2rem, 5.2vw, var(--t-hero)); line-height: 1; letter-spacing: -.02em; margin: 0 0 var(--e3); }
.bh-790e-home .bh-790e-hero-accroche { font-size: var(--t2); max-width: 46ch; margin-bottom: var(--e5); }
.bh-790e-hero-actions { display: flex; flex-wrap: wrap; gap: var(--e3); }
.bh-790e-hero-titres { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--e3); }
.bh-790e-hero-titres a { display: grid; gap: .15em; text-decoration: none; color: inherit; border-top: 1px solid currentColor; padding-top: var(--e2); }
.bh-790e-hero-titres a:hover span:last-child { text-decoration: underline; }
.bh-790e-hero-date { font-size: var(--tm); opacity: .85; }
.bh-790e-hero-titres span:last-child { font-weight: 600; }

.bh-790e-hero-plein-cadre .bh-790e-hero-fond { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; max-width: none; }
.bh-790e-hero-voile {
  position: absolute; inset: 0; display: flex; align-items: flex-end; padding-block: var(--e7);
  color: var(--c-sur-voile);
  background: linear-gradient(to top, color-mix(in srgb, var(--c-voile) 94%, transparent) 0%, color-mix(in srgb, var(--c-voile) 78%, transparent) 50%, color-mix(in srgb, var(--c-voile) 10%, transparent) 85%);
}
.bh-790e-hero-bas { display: grid; gap: var(--e6); align-items: end; }
@media (min-width: 1024px) { .bh-790e-hero-bas { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); } }
@media (max-width: 1023px) { .bh-790e-hero-plein-cadre .bh-790e-hero-titres { display: none; } }

.bh-790e-hero-scinde { display: grid; grid-template-rows: auto minmax(0, 1fr); background: var(--c-fond); }
.bh-790e-hero-moitie { min-height: 0; margin: 0; }
.bh-790e-hero-gauche { display: flex; align-items: flex-end; overflow: hidden; padding: var(--e5) var(--e5) var(--e4); }
.bh-790e-hero-media { position: relative; overflow: hidden; }
.bh-790e-hero-media img { width: 100%; height: 100%; object-fit: cover; max-width: none; }
.bh-790e-hero-media figcaption { position: absolute; left: var(--e4); bottom: var(--e4); right: var(--e4); }
.bh-790e-hero-media figcaption a { display: inline-block; background: var(--c-surface); color: var(--c-texte); padding: .4em .7em; border-radius: var(--r-bouton); text-decoration: none; font-size: var(--tm); font-weight: 600; }
.bh-790e-hero-gauche .bh-790e-hero-kicker { color: var(--c-primaire-texte); }
@media (min-width: 1024px) {
  .bh-790e-hero-scinde { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); }
  .bh-790e-hero-gauche { padding: var(--e6) var(--e7) var(--e6) max(var(--e5), calc((100vw - var(--largeur)) / 2)); }
  .bh-790e-hero-gauche .bh-790e-hero-titres { margin-top: var(--e5); }
}
@media (max-width: 1023px) { .bh-790e-hero-scinde .bh-790e-hero-titres { display: none; } }

.bh-790e-hero-mosaique { background: var(--c-fond-2); }
.bh-790e-hero-grille { height: 100%; display: grid; grid-template-rows: minmax(0, 1fr) auto; gap: var(--e4); padding: var(--e4); }
.bh-790e-hero-mosaique-img { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: var(--e3); min-height: 0; order: -1; }
.bh-790e-hero-vignette { position: relative; overflow: hidden; border-radius: var(--r-image); min-height: 0; display: block; }
.bh-790e-hero-vignette img { width: 100%; height: 100%; object-fit: cover; max-width: none; }
.bh-790e-hero-vignette span {
  position: absolute; inset: auto 0 0 0; padding: var(--e3); font-weight: 600; font-size: var(--tm); color: var(--c-sur-voile);
  background: linear-gradient(to top, color-mix(in srgb, var(--c-voile) 92%, transparent) 60%, color-mix(in srgb, var(--c-voile) 0%, transparent));
}
.bh-790e-hero-grille .bh-790e-hero-texte { padding: var(--e3) var(--e3) var(--e4); }
@media (min-width: 1024px) {
  .bh-790e-hero-grille { grid-template-columns: minmax(0, .95fr) minmax(0, 1.25fr); grid-template-rows: minmax(0, 1fr); align-items: end; padding: var(--e5) max(var(--e5), calc((100vw - var(--largeur)) / 2)); gap: var(--e7); }
  .bh-790e-hero-mosaique-img { order: 2; height: 100%; }
  .bh-790e-hero-vignette span { font-size: var(--t1); }
}
@media (max-width: 639px) { .bh-790e-hero-vignette span { display: none; } }

.bh-790e-hero-bandeau { justify-content: stretch; }
.bh-790e-hero-haut { flex: 1 1 auto; min-height: 0; margin: 0; }
.bh-790e-hero-haut img { width: 100%; height: 100%; object-fit: cover; max-width: none; }
.bh-790e-hero-bande { flex: 0 0 auto; background: var(--c-primaire); color: var(--c-sur-primaire); padding-block: var(--e6); }
.bh-790e-hero-bande-int { display: grid; gap: var(--e5); align-items: end; }
@media (min-width: 1024px) { .bh-790e-hero-bande-int { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); } }
@media (max-width: 1023px) { .bh-790e-hero-bande .bh-790e-hero-titres { display: none; } }

.bh-790e-hero-typo { background: var(--c-fond-2); }
.bh-790e-hero-typo-int { height: 100%; display: flex; flex-direction: column; justify-content: flex-end; padding-block: var(--e7); }
.bh-790e-hero-typo .bh-790e-hero-kicker { color: var(--c-primaire-texte); }
.bh-790e-home .bh-790e-hero-geant { font-family: var(--f-titre); font-size: clamp(2.8rem, 10.5vw, 10.5rem); line-height: .92; letter-spacing: -.035em; margin: 0 0 var(--e5); color: var(--c-texte); font-weight: var(--f-graisse-titre); overflow-wrap: anywhere; }
.bh-790e-hero-typo-bas { display: grid; gap: var(--e5); align-items: end; border-top: 2px solid var(--c-texte); padding-top: var(--e5); }
.bh-790e-hero-titres-ligne { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1024px) {
  .bh-790e-hero-typo-bas { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) auto; }
  .bh-790e-hero-titres-ligne { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1023px) { .bh-790e-hero-typo .bh-790e-hero-titres { display: none; } }

/* Boutons posés sur le voile ou la bande primaire : leurs couleurs doivent battre la règle
   générale .bh-790e-home .bh-790e-bouton (en !important). Sans cela, un bouton contour gardait l encre
   primaire sur la bande primaire : 1.07 à 3.5 mesurés le 24/09 sur 8 homes hero/v5. */
.bh-790e-home .bh-790e-hero-voile .bh-790e-bouton-1 { background: var(--c-sur-voile) !important; color: var(--c-voile) !important; border: 2px solid var(--c-sur-voile); box-shadow: none; text-decoration: none; }
.bh-790e-home .bh-790e-hero-voile .bh-790e-bouton-2 { background: transparent !important; color: var(--c-sur-voile) !important; border: 2px solid var(--c-sur-voile); box-shadow: none; }
.bh-790e-home .bh-790e-hero-bande .bh-790e-bouton-1 { background: var(--c-sur-primaire) !important; color: var(--c-primaire) !important; border: 2px solid var(--c-sur-primaire); box-shadow: none; text-decoration: none; }
.bh-790e-home .bh-790e-hero-bande .bh-790e-bouton-2 { background: transparent !important; color: var(--c-sur-primaire) !important; border: 2px solid var(--c-sur-primaire); box-shadow: none; }
.bh-790e-home .bh-790e-hero-bande :is(h1, h2, p, span, small, strong, li):not(.bh-790e-bouton, .bh-790e-bouton *) { color: var(--c-sur-primaire) !important; }

@media (max-width: 639px) {
  .bh-790e-bloc { padding-block: var(--e6); }
  /* Préfixée elle aussi, sinon la règle de forme (0,2,0) la battrait et le texte
     passerait à côté de l'image sur téléphone. */
  .bh-790e-home .bh-790e-cs-image-gauche { flex-direction: column; }
  .bh-790e-cs-image-gauche .bh-790e-c-media { flex-basis: auto; }
  .bh-790e-cs-image-gauche .bh-790e-c-media img { aspect-ratio: 16 / 10; height: auto; min-height: 0; }
  .bh-790e-home .bh-790e-hero-accroche { font-size: var(--t1); }
}

/* ─── garde-fous de largeur : une grille ne s'élargit jamais sur le contenu ─── */
.bh-790e-rail, .bh-790e-split, .bh-790e-magazine, .bh-790e-zigzag, .bh-790e-bandes, .bh-790e-pile, .bh-790e-d-colle .bh-790e-int, .bh-790e-split-liste,
.bh-790e-colle-liste, .bh-790e-accordeon, .bh-790e-timeline { grid-template-columns: minmax(0, 1fr); }
.bh-790e-carte, .bh-790e-bande, .bh-790e-acc { overflow-wrap: anywhere; }
.bh-790e-cs-ligne .bh-790e-c-corps { min-width: 0; }
@media (min-width: 1024px) {
  .bh-790e-split { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .bh-790e-magazine { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); }
  .bh-790e-d-colle .bh-790e-int { grid-template-columns: minmax(0, .85fr) minmax(0, 1.35fr); }
}

/* ─── reprises du 24/09 : bloc par bloc, jamais plus loin ───────────────────
   Chaque règle est portée par l'identifiant du bloc concerné. Les mises en page
   du même type (zigzag, magazine, bento, bandes, split) servent à plusieurs
   blocs : une règle non préfixée les toucherait toutes. */

/* Une : les deux cartes du zigzag ont la hauteur de leur photo, et le texte
   occupe toute la colonne (titre en haut, « Lire l'article » en bas) au lieu de
   laisser le coin bas droit vide. Même traitement que la vedette des articles. */
.bh-790e-b-une .bh-790e-cs-image-gauche { align-items: stretch; }
.bh-790e-b-une .bh-790e-cs-image-gauche .bh-790e-c-suite { margin-top: auto; }
@media (min-width: 1024px) {
  .bh-790e-b-une .bh-790e-zz .bh-790e-c-media { flex: 0 0 52%; }
  .bh-790e-b-une .bh-790e-zz .bh-790e-c-media img { aspect-ratio: auto; height: 100%; object-fit: cover; }
}

/* le lien « Lire l article » garde sa flèche sur la même ligne */
.bh-790e-home .bh-790e-c-suite { display: inline-flex; align-items: center; gap: .4em; white-space: nowrap; width: fit-content; }


/* ─── reprises du 25/09 : hero, voile des cartes photo, chronologie, plan,
   quiz, manifeste, auteurs. Chaque regle est portee par son bloc. ─────────── */

/* Hero scinde : la colonne de texte tient dans la hauteur d ecran. Les tailles
   sont volontairement plus basses que celles du hero pleine largeur : le bloc
   porte un H1, une accroche, deux boutons et deux titres dates. */
.bh-790e-home .bh-790e-hero-scinde .bh-790e-hero-h1 { font-size: clamp(2.1rem, 4.4vw, 4.8rem); }
.bh-790e-home .bh-790e-hero-scinde .bh-790e-hero-accroche { font-size: var(--t1); line-height: 1.5; margin-bottom: var(--e4); }
.bh-790e-hero-scinde .bh-790e-hero-titres { gap: var(--e2); margin-top: var(--e4); }
.bh-790e-hero-media figcaption { z-index: 1; }

/* Le hero scinde est une grille a deux colonnes. La regle de section
   `.bh-790e-home .bh-790e-bloc` (0,2,0) impose flex-direction: column : a
   specificite egale elle gagnait, le bloc s'empilait et la colonne de texte
   etait rognee par overflow. Meme specificite, plus bas dans la feuille. */
.bh-790e-home .bh-790e-hero-scinde {
  display: grid; grid-template-rows: auto minmax(0, 1fr);
  padding-block: 0; justify-content: normal;
}
@media (min-width: 1024px) {
  .bh-790e-home .bh-790e-hero-scinde {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: minmax(0, 1fr);
  }
  /* Rien du hero n'est masque ni rogne a cette largeur : la colonne de texte
     prend la hauteur de la rangee, sans plafond ni overflow. */
  .bh-790e-home .bh-790e-hero-scinde .bh-790e-hero-gauche { overflow: visible; align-items: center; }
  .bh-790e-home .bh-790e-hero-scinde .bh-790e-hero-texte { max-height: none; }
}

/* Bouton secondaire : meme pilule, en contour 2px sur l'accent, fond transparent.
   Les boutons poses sur un voile ou sur la bande primaire gardent leurs couleurs
   (regles plus specifiques, plus haut dans la feuille). */
.bh-790e-home .bh-790e-bouton-2 {
  background: transparent !important; color: var(--c-primaire-texte) !important;
  border: 2px solid var(--c-primaire) !important; box-shadow: none !important;
}

/* Le texte pose sur une photo reste clair, quel que soit le fond du bloc. */
.bh-790e-home .bh-790e-c-voile :is(.bh-790e-c-titre, .bh-790e-c-kicker, .bh-790e-c-meta, .bh-790e-c-p, .bh-790e-c-suite) { color: var(--c-sur-voile) !important; }
.bh-790e-home .bh-790e-c-voile .bh-790e-c-titre a { color: inherit !important; }

/* Chronologie : la date ouvre la ligne, en monospace comme les autres listes datees. */
.bh-790e-t-date { font-family: var(--f-mono); font-size: var(--tm); color: var(--c-texte-2); white-space: nowrap; vertical-align: top; }
.bh-790e-tableau tbody tr:hover .bh-790e-t-date { color: var(--c-primaire-texte); }

/* Plan du site : chaque titre du panneau est un lien, la puce est dessinee. */
.bh-790e-plan-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--e2); }
.bh-790e-plan-liste li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--e3); align-items: baseline; }
.bh-790e-plan-liste li::before { content: ""; width: .32em; height: .32em; border-radius: 50%; background: var(--c-primaire-texte); align-self: center; }
.bh-790e-plan-liste a { color: var(--carte-encre); text-decoration: none; border-bottom: 1px solid color-mix(in srgb, var(--carte-encre) 26%, transparent); }
.bh-790e-plan-liste a:hover { color: var(--c-primaire-texte); border-bottom-color: var(--c-primaire-texte); }

/* Auteurs : le portrait et le nom mènent a la fiche, le bloc se ferme sur /equipe. */
.bh-790e-c-lien-portrait { display: block; text-decoration: none; }
.bh-790e-c-lien-portrait img { display: block; }
.bh-790e-suite-lien { margin-top: var(--e5); }

/* Quiz : les six questions occupent la largeur sur deux colonnes. */
@media (min-width: 1024px) {
  .bh-790e-b-quiz .bh-790e-accordeon { max-width: none; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e5) var(--e6); align-items: start; }
  .bh-790e-b-quiz .bh-790e-quiz-score { grid-column: 1 / -1; }
  .bh-790e-b-quiz .bh-790e-cs-texte, .bh-790e-b-quiz .bh-790e-acc { padding-block: var(--e4); }
}

/* Manifeste : le split de la DA, photo a gauche (5 colonnes) et trois cartes
   empilees a droite (7 colonnes). Le figure reste un bloc : en flex, l image
   et la liste devenaient deux flex-items de la meme rangee et la photo
   tombait a 141 px. */
@media (min-width: 1024px) {
  .bh-790e-home .bh-790e-b-manifeste .bh-790e-split {
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: stretch;
  }
  .bh-790e-home .bh-790e-b-manifeste .bh-790e-split-media { display: block; margin: 0; }
  .bh-790e-home .bh-790e-b-manifeste .bh-790e-split-media img {
    width: 100%; height: 100%; min-height: min(52svh, 30rem); object-fit: cover;
  }
  .bh-790e-home .bh-790e-b-manifeste .bh-790e-split-liste { align-content: space-between; }
}
@media (max-width: 1023px) {
  .bh-790e-home .bh-790e-b-manifeste .bh-790e-split-media img { height: min(46svh, 22rem); }
}

/* Engagements : les trois engagements s'empilent dans la colonne de lecture,
   separes par le filet des autres listes du site (tranche Jev du 25/09 :
   lignes nues, pas de surface de carte). */
.bh-790e-b-engagements .bh-790e-pile { gap: 0; }
.bh-790e-b-engagements .bh-790e-pile > .bh-790e-carte {
  display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: var(--e4); align-items: start;
  background: transparent !important; border-radius: 0; box-shadow: none;
  padding: var(--e5) 0; border-top: 1px solid var(--c-bordure);
}
.bh-790e-b-engagements .bh-790e-pile > .bh-790e-carte:first-child { border-top: 0; padding-top: 0; }
.bh-790e-b-engagements .bh-790e-pile .bh-790e-ico { grid-row: 1 / span 2; margin-top: .3em; }

/* La carte vedette du bento ne se distingue que par sa surface de grille (donnee
   par .bh-790e-bento-7 > :nth-child(1)) et par la taille de son titre : elle ne
   porte aucune couleur de texte propre, le voile reste la seule source. */
.bh-790e-bento .bh-790e-c-vedette { color: inherit; }
.bh-790e-bento .bh-790e-c-vedette .bh-790e-c-titre { font-size: var(--t4); }
