:root {
  --f-titre: var(--font-secondary), 'Signika', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --f-texte: var(--font-primary), 'Heebo', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --f-graisse-titre: 700;
  --f-casse-kicker: none;
  --tm: 0.833rem;
  --t1: 1.0rem;
  --t2: 1.2rem;
  --t3: 1.44rem;
  --t4: 1.728rem;
  --t5: 2.074rem;
  --t6: 2.488rem;
  --t7: 2.986rem;
  --t-hero: clamp(2.07rem, 6vw, 3.58rem);
  --e1: 0.3rem;
  --e2: 0.6rem;
  --e3: 0.9rem;
  --e4: 1.2rem;
  --e5: 1.8rem;
  --e6: 2.4rem;
  --e7: 3.6rem;
  --e8: 4.8rem;
  --r-carte: 8px;
  --r-bouton: 4px;
  --r-image: 4px;
  --largeur: 1100px;
  --ico-trait: 1.5;
  --header-h: 72px;
  --c-fond: #ffffff;
  --c-fond-2: #f6f6f6;
  --c-surface: #ffffff;
  --c-texte: #444444;
  --c-texte-2: #717171;
  --c-primaire: #121212;
  --c-sur-primaire: #ffffff;
  --c-secondaire: #eaeaea;
  --c-sur-secondaire: #121212;
  --c-primaire-texte: #170bcb;
  --c-secondaire-texte: #170bcb;
  --c-doux: #e8e6fb;
  --c-sur-doux: #151429;
  --c-bord: #eaeaea;
  --c-voile: #040404;
  --c-sur-voile: #ffffff;
  --c-ombre: #110f24;
  --o-carte: none;
  --o-survol: 0 10px 30px -18px rgba(18,18,18,.35);
  --carte-fond: #f6f6f6;
  --carte-encre: #040404;
  --carte-encre-2: #444444;
  --carte-lien: #040404;
  --carte-bord: 0 solid transparent;
  --btn-fond: #121212;
  --btn-texte: #ffffff;
  --btn-bord: 1px solid #121212;
  --btn-ombre: none;
  --btn-deco: none;
  --lien-couleur: #170bcb;
  --lien-deco: underline;
  --lien-epaisseur: 1px;
  --lien-fond: transparent;
  --lien-fond-encre: #170bcb;
}
html.usine-sombre-desactive {
  --c-fond: #141418;
  --c-fond-2: #24221c;
  --c-surface: #24242b;
  --c-texte: #e8e8ee;
  --c-texte-2: #b7b6c3;
  --c-primaire: #5247f5;
  --c-sur-primaire: #f6f5f9;
  --c-secondaire: #cfb463;
  --c-sur-secondaire: #292414;
  --c-primaire-texte: #847cf8;
  --c-secondaire-texte: #deca91;
  --c-doux: #4a3e1c;
  --c-sur-doux: #f6f5f9;
  --c-bord: #42424d;
  --c-voile: #0c0c18;
  --c-sur-voile: #ffffff;
  --c-ombre: #030307;
  --o-carte: 0 1px 2px color-mix(in srgb, #030307 8%, transparent), 0 8px 24px color-mix(in srgb, #030307 8%, transparent);
  --o-survol: 0 18px 40px -12px color-mix(in srgb, #030307 28%, transparent);
  --carte-fond: #4a3e1c;
  --carte-encre: #f6f5f9;
  --carte-encre-2: #f6f5f9;
  --carte-lien: #f6f5f9;
  --carte-bord: 0 solid transparent;
  --btn-fond: #cfb463;
  --btn-texte: #292414;
  --btn-bord: 2px solid #e8e8ee;
  --btn-ombre: 4px 4px 0 #e8e8ee;
  --btn-deco: none;
  --lien-couleur: #847cf8;
  --lien-deco: underline;
  --lien-epaisseur: 1px;
  --lien-fond: transparent;
  --lien-fond-encre: #847cf8;
}

body { font-family: var(--f-texte); }
h1, h2, h3, h4 { font-family: var(--f-titre); }
/* DA du thème (Astroplate) : light forcé, accent outremer unique */
:root { color-scheme: light; --c-accent: #170bcb; --c-accent-doux: #e8e6fb; }
h1, h2, h3, h4, h5, h6 { font-family: var(--f-titre); }
:root { --c-titre: #040404; --c-carte: #ffffff; }

/* ===== Composants communs (header, bandeau, footer, cartes, pages) : classes du thème + tokens ===== */
.bh-accent { color: var(--c-accent); }
.header.bh-header { padding: 0; border-bottom: 1px solid var(--c-bord); }
.bh-navbar { padding-top: .85rem; padding-bottom: .85rem; flex-wrap: nowrap; gap: 1rem; }
.bh-groupe { display: flex; align-items: center; gap: 2rem; flex-wrap: wrap; min-width: 0; flex: 1 1 auto; }
.bh-logo-img { height: 48px; width: auto; display: block; }
.bh-menu { gap: .25rem; }
.bh-menu .nav-link { white-space: nowrap; }
.bh-actions { gap: 1.25rem; margin-left: 2rem; flex: none; }
.bh-recherche { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; }
.bh-bouton-lettre, .btn { display: inline-flex; align-items: center; gap: .45rem; justify-content: center; }
@media (max-width: 1023px) {
  .bh-logo-img { height: 34px; }
  .bh-navbar { flex-wrap: wrap; }
  .bh-groupe { gap: 1rem; justify-content: space-between; }
  .bh-burger { min-width: 44px; min-height: 44px; justify-content: center; }
  .bh-actions { margin-left: 0; gap: .5rem; }
  .bh-menu .nav-link { min-height: 44px; display: flex; align-items: center; justify-content: center; }
}
@media (max-width: 480px) { .bh-bouton-lettre { display: none; } }
.bh-bandeau[data-bandeau] { position: relative; top: auto; left: 0; width: 100%; display: flex; align-items: center; justify-content: flex-start; gap: 1rem; margin: 0; padding: .35rem 1rem; background: var(--c-voile); color: var(--c-sur-voile); font-size: .875rem; font-weight: 500; }
.bh-bandeau[hidden] { display: none; }
.bh-bandeau-label { display: inline-flex; align-items: center; gap: .4rem; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; font-size: .75rem; flex: none; }
.bh-bandeau-defile { flex: 1 1 auto; min-width: 0; }
.bh-bandeau .kv-piste a { color: inherit; text-decoration: none; white-space: nowrap; display: inline-flex; align-items: center; min-height: 32px; }
.bh-bandeau .kv-piste a:hover, .bh-bandeau .kv-piste a:focus-visible { text-decoration: underline; }
.bh-bandeau [data-fermer] { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; flex: none; color: inherit; }
.bh-titres-header { display: none; }
@media (min-width: 1024px) {
  .bh-titres-header { display: flex; align-items: center; gap: 1.5rem; padding-top: .5rem; padding-bottom: .5rem; border-top: 1px solid var(--c-bord); font-size: .85rem; }
  .bh-titres-label { flex: none; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; font-size: .72rem; color: var(--c-accent); }
  .bh-titres-header ul { display: flex; gap: 2rem; overflow: hidden; min-width: 0; margin: 0; padding: 0; list-style: none; }
  .bh-titres-header li { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 22rem; }
  .bh-titres-header li[hidden] { display: none; }
  .bh-titres-header a { color: var(--c-titre); text-decoration: none; }
  .bh-titres-header a:hover { color: var(--c-accent); }
}
.bh-footer a { color: var(--c-texte); text-decoration: none; }
.bh-footer a:hover { color: var(--c-accent); }
.bh-footer .bh-logo-img { height: 44px; }
.bh-footer-titre { font-family: var(--f-texte); font-size: .8rem; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; margin-bottom: 1rem; color: var(--c-titre); }
.bh-footer ul li { margin: .45rem 0; }
.bh-footer-icone { display: inline-flex; align-items: center; gap: .5rem; }
.bh-footer-legal { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; }
.bh-footer-legal ul { display: flex; flex-wrap: wrap; gap: 1.5rem; margin: 0; }
.bh-footer-legal a { color: inherit; }
.bh-blogcard { height: 100%; }
.bh-blogcard-lien { display: block; color: inherit; text-decoration: none; }
.bh-blogcard-lien:hover .bh-blogcard-titre { color: var(--c-accent); }
.bh-blogcard-rubrique { display: block; font-family: var(--f-texte); font-size: .78rem; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--c-accent); margin-bottom: .5rem; }
.bh-blogcard-meta { display: flex; flex-wrap: wrap; gap: .35rem 1rem; color: var(--c-texte-2); font-size: .875rem; }
.bh-blogcard-meta span { display: inline-flex; align-items: center; gap: .35rem; }
.bh-grille-cartes, .bh-grille-auteurs, .bh-grille-rubriques, .bh-methode, .bh-plan { display: grid; gap: 2.5rem 2rem; grid-template-columns: minmax(0, 1fr); list-style: none; padding: 0; }
@media (min-width: 1024px) {
  .bh-grille-cartes, .bh-grille-auteurs, .bh-methode, .bh-plan { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .bh-grille-rubriques { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .bh-grille-rubriques > li { grid-column: span 2; }
  .bh-grille-rubriques > li:nth-child(-n+2) { grid-column: span 3; }
}
.bh-grille-rubriques > li > a { display: block; padding: 1.25rem; color: inherit; text-decoration: none; }
.bh-grille-rubriques > li > a:hover .h4 { color: var(--c-accent); }
.bh-intro { font-size: 1.15rem; margin-bottom: 2.5rem; }
.bh-equipe { display: grid; gap: 1.5rem; list-style: none; padding: 0; }
.bh-equipe > li { display: flex; flex-direction: column; gap: 1.5rem; align-items: flex-start; }
@media (min-width: 768px) { .bh-equipe > li { flex-direction: row; } .bh-equipe > li img { flex: none; width: 160px; height: 160px; } }
.bh-equipe-role { color: var(--c-accent); font-weight: 600; margin-bottom: .75rem; }
.bh-methode > li svg { color: var(--c-accent); margin-bottom: 1rem; }
.bh-mini-equipe { display: flex; flex-wrap: wrap; gap: 2rem; list-style: none; padding: 0; }
.bh-mini-equipe a { display: flex; flex-direction: column; align-items: center; gap: .6rem; color: var(--c-titre); font-weight: 600; text-decoration: none; }
.bh-redac-intro { display: grid; gap: 2.5rem; align-items: center; }
@media (min-width: 1024px) { .bh-redac-intro { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.bh-cta { text-align: center; }
.bh-cta p { margin: .75rem auto 1.25rem; }
.bh-cta .btn { margin: .35rem; }
.bh-puces { display: inline-grid; gap: .6rem; text-align: left; list-style: none; padding: 0; margin: 1rem 0; }
.bh-puces li { display: flex; gap: .6rem; align-items: center; }
.bh-puces svg { color: var(--c-accent); flex: none; }
.bh-form-lettre, .bh-recherche-form { display: flex; flex-wrap: wrap; gap: .75rem; justify-content: center; margin: 1.5rem 0 .5rem; }
.bh-recherche-form { justify-content: flex-start; }
.bh-form-lettre input[type="email"], .bh-recherche-form input, .bh-contact-form input, .bh-contact-form textarea { flex: 1 1 16rem; max-width: 30rem; min-height: 44px; border: 1px solid var(--c-bord); border-radius: 4px; padding: .6rem 1rem; background: var(--c-carte); color: var(--c-titre); width: 100%; }
.bh-pot, .bh-7c2e-pot { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.bh-form-retour { flex-basis: 100%; font-weight: 600; margin: 0; color: var(--c-titre); }
.bh-form-retour:empty { display: none; }
.bh-recherche-etat { color: var(--c-texte-2); margin: 1rem 0 2rem; }
.bh-recherche-liste { list-style: none; padding: 0; display: grid; gap: 0; }
.bh-recherche-liste li[hidden] { display: none; }
.bh-recherche-liste a { display: grid; gap: .35rem; padding: 1.25rem 0; border-bottom: 1px solid var(--c-bord); color: inherit; text-decoration: none; }
.bh-recherche-liste a:hover .h5 { color: var(--c-accent); }
.bh-plan ul { list-style: none; padding: 0; }
.bh-plan li { margin: .4rem 0; }
.bh-contact { margin-top: 2.5rem; }
.bh-contact h2 { display: flex; align-items: center; gap: .6rem; }
.bh-contact-form { display: grid; gap: 1.25rem; grid-template-columns: minmax(0, 1fr); margin-top: 1.5rem; }
@media (min-width: 768px) { .bh-contact-form { grid-template-columns: repeat(2, minmax(0, 1fr)); } .bh-contact-form .bh-plein { grid-column: 1 / -1; } }
.bh-contact-form label { display: block; font-weight: 600; margin-bottom: .35rem; color: var(--c-titre); }
.bh-contact-form input, .bh-contact-form textarea { max-width: none; }
/* Contact : coordonnées en encart à gauche (4), formulaire à droite (8) */
.bh-contact-grille { align-items: start; }
.bh-contact-grille .bh-contact { margin-top: 0; }
.bh-contact-infos ul { list-style: none; padding: 0; margin: 1.25rem 0 0; display: grid; gap: 1.25rem; }
.bh-contact-infos li { display: flex; gap: .85rem; align-items: flex-start; }
.bh-contact-infos li > svg { flex: none; margin-top: .15rem; color: var(--c-titre); }
.bh-contact-infos li > span { flex: 1 1 auto; min-width: 0; }
@media (max-width: 1023px) { .bh-contact-infos li { flex-direction: column; align-items: stretch; gap: .4rem; } .bh-contact-infos li > span { width: 100%; } }
@media (max-width: 639px) { .bh-contact-infos { padding-inline: 1.25rem; } }
.bh-contact-infos li strong { display: block; color: var(--c-titre); font-weight: 600; }
.bh-contact-mail { white-space: nowrap; word-break: keep-all; overflow-wrap: normal; color: var(--c-titre); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 400px) { .bh-contact-mail { font-size: .9rem; } }
/* Article : centré, sans colonne latérale ; sommaire, auteur et « à lire » passent sous l’article */
.bh-article-conteneur { max-width: 1100px; }
.bh-article-rubrique { display: inline-block; font-size: .8rem; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; color: var(--c-accent) !important; text-decoration: none !important; margin-bottom: .75rem; }
.bh-article-chapo { font-size: 1.2rem; color: var(--c-texte); }
.bh-article-meta { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; list-style: none !important; padding: 0 !important; margin: 0 0 1.75rem !important; color: var(--c-texte-2); }
.bh-article-meta li { display: inline-flex; align-items: center; gap: .4rem; margin: 0 !important; padding: 0 !important; }
.bh-article-meta li::before { content: none !important; }
.bh-article-meta a { display: inline-flex; align-items: center; gap: .4rem; }
/* Intertitres : pas de puce, le filet du thème suffit */
html body .bh-article .ka-corps h2::before { content: none !important; display: none !important; }
/* Compteurs d’audience invérifiables retirés ; pastille de temps de lecture sans barre orpheline */
html body .bh-article .ka-stats { display: none !important; }
html body .bh-article .ka-restant.ka-restant-cote::before { display: none; }
/* Pages à propos et mentions : contenu centré à la largeur de la prose */
.bh-page-large { max-width: 50rem; margin-inline: auto; }
.bh-page-large :is(p, li), .bh-apropos-cta p { max-width: min(62ch, 36em); }
.bh-apropos-une { max-width: 50rem; margin: 0 auto 2.5rem; }
.bh-apropos-une img { width: 100%; height: auto; aspect-ratio: 16 / 7; object-fit: cover; }
.bh-apropos-equipe { max-width: 50rem; margin: 3rem auto 0; }
.bh-apropos-auteurs { display: grid; gap: 1rem; list-style: none; padding: 0; margin: 1.25rem 0 0; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 768px) { .bh-apropos-auteurs { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.bh-apropos-auteurs li:last-child:nth-child(odd) { grid-column: 1 / -1; }
@media (min-width: 768px) { .bh-apropos-auteurs li:last-child:nth-child(odd) { grid-column: auto; } }
.bh-apropos-auteurs a { display: flex; flex-direction: column; align-items: center; gap: .4rem; text-align: center; padding: 1rem .5rem; color: var(--c-titre); text-decoration: none; }
.bh-apropos-auteurs img { width: 88px; height: 88px; object-fit: cover; }
.bh-apropos-auteurs span { font-size: .85rem; color: var(--c-texte-2); }
.bh-apropos-cta { max-width: 50rem; margin: 3rem auto 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; }
.bh-apropos-cta h2 { margin: 0; }
/* Avant-footer : encart bg-light du call-to-action du thème, titre Signika 700 */
html body .uf-block[data-avant-footer] { background: #f6f6f6; border: 0; border-radius: .75rem; }
html body .uf-block[data-avant-footer] :is(h2, h3) { font-family: var(--f-titre, "Signika", sans-serif); font-weight: 700; color: #040404; letter-spacing: 0; }
html body .uf-block[data-avant-footer] p { color: #444444; }
html body .uf-block[data-avant-footer] .af-button { background: #121212; color: #fff !important; border-radius: 4px; }
/* Header : 32 px entre le menu et les actions en bureau */
@media (min-width: 1024px) { html body .bh-navbar .bh-actions { margin-left: 2rem !important; gap: 2rem; } }
@media (min-width: 1024px) and (max-width: 1279px) { html body .bh-menu .nav-link { padding-left: .6rem; padding-right: .6rem; } }
.bh-article-tete nav ol, .content nav[aria-label] ol { list-style: none !important; padding: 0 !important; margin: 0 !important; display: flex; flex-wrap: wrap; gap: .25rem; }
.bh-article-tete nav li, .content nav[aria-label] li { margin: 0 !important; padding: 0 !important; }
.bh-article-tete nav li::before, .bh-article-tete nav li::after, .bh-article-tete nav li::marker { content: none !important; }
@media (max-width: 1023px) { .bh-navbar.container { padding-left: 1rem; padding-right: 1rem; } }
.bh-grille-rubriques img, .bh-redac-intro img { width: 100%; height: auto; }
[data-usine-page="interne"] .container { max-width: 1200px; }
/* Light forcé : même si une classe ou une préférence « sombre » s’applique, les tokens restent ceux du thème clair */
html, html.dark, html[data-theme="dark"] { color-scheme: light; --color-darkmode-primary: #121212 !important; --color-darkmode-body: #ffffff !important; --color-darkmode-border: #eaeaea !important; --color-darkmode-light: #f6f6f6 !important; --color-darkmode-dark: #040404 !important; --color-darkmode-text: #444444 !important; --color-darkmode-text-dark: #040404 !important; --color-darkmode-text-light: #717171 !important; }
html.dark body, html[data-theme="dark"] body { background: #ffffff; color: #444444; }
/* Boutons du thème : mêmes couleurs quel que soit le mode (light forcé) */
.btn-primary { background: #121212; border-color: #121212; color: #ffffff; }
.btn-primary:hover { background: #040404; color: #ffffff; }
.btn-outline-primary { background: transparent; border-color: #040404; color: #040404; }
.btn-outline-primary:hover { background: #040404; color: #ffffff; }


/* À propos et mentions légales (30/09) : une seule colonne centrée, image et prose à la même largeur,
   bornée pour rester sous 75 caractères par ligne (socle:pages-internes-mesure). */
[data-usine-page="interne"] .bh-page-large, [data-usine-page="interne"] .bh-apropos-une { width: 100%; max-width: 62ch; margin-inline: auto; }
[data-usine-page="interne"] .bh-page-large :is(p, li, h2, h3, ul, ol, table) { max-width: 100%; }
/* Avant-footer : même conteneur centré que les blocs de la home (1100 px, marges fluides en mobile) */
html body .uf-block[data-avant-footer] { box-sizing: border-box; width: calc(100% - 2 * clamp(1rem, 4vw, 2rem)) !important; max-width: 1100px !important; margin-left: auto !important; margin-right: auto !important; }

html body .ks-inline-related[data-sidebar-inline] { margin: 2.5rem 0 0; }

/* usine:correctifs-home début */
/* Correctifs des blocs de home, recopiés sur chaque site à chaque build
   (astro_site.rafraichit_correctifs_home). bh-contact- devient le préfixe du site. */

/* Un .acc employé comme carte (quiz : pas de <summary>) garde la marge intérieure d'une carte :
   le texte et les boutons touchaient le bord (journal-auto-moto, bloc 13, Cedia 26/09). */
.bh-contact-acc:not(details) { padding-inline: var(--e5); }
.bh-contact-acc:not(details) > .bh-contact-acc-corps { padding-inline: 0; }

/* FAQ : une seule flèche, sur la ligne de la question (le marqueur natif doublait le chevron). */
.bh-contact-acc > summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: var(--e3); }
.bh-contact-acc > summary::-webkit-details-marker { display: none; }
.bh-contact-acc > summary svg { flex: none; transition: transform .2s; }
.bh-contact-acc[open] > summary svg { transform: rotate(180deg); }
.bh-contact-acc > summary:not(:has(svg))::after { content: "+"; flex: none; font-weight: 400; }
.bh-contact-acc[open] > summary:not(:has(svg))::after { content: "\2212"; }

/* FAQ centrée : la liste restait calée à gauche sur 60rem, un tiers du bloc vide à droite
   (journal-auto-moto, bloc 17, Cedia 26/09). */
.bh-contact-b-faq .bh-contact-entete { margin-inline: auto; text-align: center; }
.bh-contact-b-faq .bh-contact-accordeon { margin-inline: auto; }
/* Même FAQ dans une home « centrée » : le collage deux colonnes (.d-colle) gardait le titre dans
   la colonne de gauche et la règle [data-alignement=centre] .d-colle .entete le recalait à gauche,
   plus spécifique que la ligne ci-dessus (469 px à gauche, 791 px de vide à droite : revue-assurance.com,
   home:faq-centree, 26/09). La FAQ repasse en une colonne, en-tête centré. */
[data-alignement="centre"] .bh-contact-b-faq.bh-contact-d-colle > .bh-contact-int { display: block; }
[data-alignement="centre"] .bh-contact-b-faq.bh-contact-d-colle > .bh-contact-int > .bh-contact-entete {
  margin-inline: auto; text-align: center; position: static;
}

/* Lien « Voir la rubrique » posé À CÔTÉ du corps de carte (builder) : le corps porte la marge
   intérieure, pas la carte ; le lien restait collé au bord (revue-auto-moto 26/09, home:cartes-marge-interne). */
.bh-contact-carte:has(> .bh-contact-c-corps) > .bh-contact-c-suite { margin: 0 var(--e5) var(--e5); }

/* Parcours / frise : une vignette à côté du texte, jamais une photo pleine largeur par étape
   (journal-entreprise, bloc parcours : trois photos de 1298 x 812 px à la suite, Cedia 26/09). */
.bh-contact-timeline .bh-contact-c-media img, .bh-contact-b-parcours .bh-contact-c-media img { width: 100%; height: auto; aspect-ratio: 4 / 3; max-height: 320px; object-fit: cover; }
@media (min-width: 900px) {
  .bh-contact-timeline .bh-contact-carte:has(> .bh-contact-c-media) { display: grid; grid-template-columns: minmax(0, 280px) minmax(0, 1fr); gap: var(--e5); align-items: start; }
  .bh-contact-timeline .bh-contact-carte:has(> .bh-contact-c-media) > .bh-contact-c-media { margin: 0; }
}

/* Vrai ou faux : une affirmation à la fois (kit_vivant), cinq habillages (Cedia 26/09). */
.bh-contact-quiz { max-width: 46rem; margin-inline: auto; display: grid; gap: var(--e4); }
.bh-contact-quiz-q { padding: var(--e5); }
.bh-contact-quiz-affirmation { font-family: var(--f-titre, inherit); font-size: var(--t3, 1.35rem); font-weight: 700; line-height: 1.25; margin: 0; }
.bh-contact-quiz-verdict { font-weight: 800; margin: var(--e3) 0 .25rem; }
.bh-contact-quiz-expl { margin-top: var(--e3); }
.bh-contact-quiz-score:empty { display: none; }
.bh-contact-quiz-bandes .bh-contact-quiz-q { border-left: 6px solid var(--c-primaire, currentColor); border-radius: 0; box-shadow: none; }
.bh-contact-quiz-plein .bh-contact-quiz-q { background: var(--c-primaire); color: var(--c-sur-primaire, var(--c-fond)); text-align: center; }
.bh-contact-quiz-plein .kv-choix { justify-content: center; }
.bh-contact-quiz-plein .kv-bouton { color: inherit; border-color: currentColor; }
.bh-contact-quiz-split { max-width: none; }
@media (min-width: 900px) {
  .bh-contact-quiz-split .bh-contact-quiz-q { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); column-gap: var(--e6); align-items: start; }
  .bh-contact-quiz-split .bh-contact-quiz-q > * { grid-column: 2; }
  .bh-contact-quiz-split .bh-contact-quiz-q > .bh-contact-quiz-affirmation { grid-column: 1; grid-row: 1 / span 3; font-size: var(--t4, 1.6rem); }
}
.bh-contact-quiz-compact { max-width: 38rem; }
.bh-contact-quiz-compact .bh-contact-quiz-affirmation { font-size: var(--t2, 1.1rem); }

/* Pastilles de sujets : une vraie pastille cliquable, en nuage centré, jamais une barre grise plate
   (Cedia 26/09, journal-entreprise). */
.bh-contact-b-sujets .bh-contact-mur { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--e3); }
.bh-contact-b-sujets .bh-contact-mur-col { display: contents; }
.bh-contact-b-sujets .bh-contact-carte.bh-contact-cs-pastille { background: transparent; border: 0; box-shadow: none; padding: 0; width: auto; }
.bh-contact-c-pastille {
  display: inline-flex; align-items: center; gap: .5em; min-height: 44px; padding: .55em 1.2em;
  border-radius: 999px; border: 1.5px solid var(--c-primaire); background: var(--carte-fond);
  color: var(--c-primaire-texte, var(--carte-encre)); text-decoration: none; font-weight: 600; cursor: pointer;
  transition: background .2s, color .2s, transform .15s;
}
.bh-contact-c-pastille::after { content: "\2192"; font-weight: 400; }
.bh-contact-c-pastille:hover, .bh-contact-c-pastille:focus-visible { background: var(--c-primaire); color: var(--c-sur-primaire); transform: translateY(-1px); }

/* Hero : les boutons ne touchent jamais le texte voisin (Cedia 26/09, journal-entreprise : collés au 3e titre). */
.bh-contact-hero-actions { margin-top: var(--e5); }

/* Cartes de chiffres lisibles (Cedia 27/09, revue-assurance.com : libellé en 12 px ; gestion-finance-entreprise :
   « 7 184 dirigeants suivis » en 13 px). Chiffre ≥ 28 px en bureau, ≥ 24 px en mobile ; libellé ≥ 14 px.
   Contrôle socle:stats-lisibles (verif_socle). */
.bh-contact-c-chiffre { font-size: max(28px, var(--t6, 2rem)); }
.bh-contact-c-label { font-size: max(14px, 1em) !important; }  /* !important : un .home .c-label de builder le ramenait à 12 px */
@media (max-width: 767px) { .bh-contact-c-chiffre { font-size: max(24px, var(--t6, 1.75rem)); } }

/* Hero centré : l'image passe DERRIÈRE le texte, pleine largeur et pleine hauteur, jamais en bande sous le texte
   (Cedia 27/09, revue-assurance.com : « texte centré suivi d'une bande photo »). Voile sombre pour le contraste,
   texte clair. Contrôle socle:hero-plein-media (média à côté ou derrière le texte, bas du hero ≥ 90 % de la fenêtre). */
.bh-contact-hero.bh-contact-hero-centre { position: relative; isolation: isolate; grid-template-rows: minmax(0, 1fr) !important; }
.bh-contact-hero.bh-contact-hero-centre > .bh-contact-hero-bas { position: absolute !important; inset: 0; margin: 0 !important; z-index: -1; }
.bh-contact-hero.bh-contact-hero-centre > .bh-contact-hero-bas img { width: 100% !important; height: 100% !important; max-height: none !important;
  object-fit: cover; border-radius: 0 !important; }
.bh-contact-hero.bh-contact-hero-centre > .bh-contact-hero-bas::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(8, 12, 24, .66), rgba(8, 12, 24, .52)); }
.bh-contact-home .bh-contact-hero-centre :is(.bh-contact-hero-kicker, .bh-contact-hero-h1, .bh-contact-hero-accroche) { color: #fff !important; }
.bh-contact-home .bh-contact-hero-centre .bh-contact-bouton-2 { color: #fff !important; border-color: #fff !important; background: transparent !important; }

/* Hero bandeau : même règle que le hero centré, l'image couvre TOUT le hero et le texte est posé dessus, centré
   verticalement (Cedia 27/09 : photo en bande au-dessus d'un aplat de couleur = « pas d'image dans le hero »). */
.bh-contact-hero.bh-contact-hero-bandeau { position: relative; isolation: isolate; justify-content: center !important; }
.bh-contact-hero.bh-contact-hero-bandeau > .bh-contact-hero-haut { position: absolute !important; inset: 0; margin: 0 !important; z-index: -1;
  height: auto !important; }
.bh-contact-hero.bh-contact-hero-bandeau > .bh-contact-hero-haut img { width: 100% !important; height: 100% !important; max-height: none !important;
  object-fit: cover; border-radius: 0 !important; }
.bh-contact-hero.bh-contact-hero-bandeau > .bh-contact-hero-haut::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(8, 12, 24, .50), rgba(8, 12, 24, .72)); }
.bh-contact-hero.bh-contact-hero-bandeau > .bh-contact-hero-bande { background: transparent !important; margin-block: auto; }
.bh-contact-home .bh-contact-hero-bandeau .bh-contact-hero-bande :is(p, h1, li, span, time, a:not(.bh-contact-bouton)) { color: #fff !important; }
.bh-contact-home .bh-contact-hero-bandeau .bh-contact-bouton-2 { color: #fff !important; border-color: #fff !important; background: transparent !important; }

/* Bloc logos en disposition « collée » : le titre restait seul à gauche au-dessus d'une rangée de logos centrée,
   entre deux blocs aux titres centrés (Cedia 27/09, actu-pme.com bloc 02). Un bloc de logos centre son titre.
   Contrôle socle:titres-blocs-centres. */
.bh-contact-b-logos.bh-contact-d-colle > .bh-contact-int { display: flex !important; flex-direction: column; align-items: center; }
.bh-contact-b-logos.bh-contact-d-colle .bh-contact-entete { position: static !important; text-align: center; max-width: 48rem; margin-inline: auto; }
.bh-contact-b-logos.bh-contact-d-colle .bh-contact-entete > * { text-align: center !important; margin-inline: auto; }

/* Mode sombre (27/09, Intermediate-Astro) : un thème qui colore p et li en dur (p, li { color: #4e4b66 }) laissait ce gris
   sur les fonds sombres des blocs ; en sombre, le texte suit la couleur du bloc. */
:is(html.dark, [data-theme="dark"]) .bh-contact-home :is(p, li) { color: inherit; }

/* Mosaique, carte « image seule » : l'image doit COUVRIR sa carte. Le garde-fou du socle
   (« img d'un bloc hors hero : 480 px au plus ») plafonnait l'image de la vedette (2 lignes x 2
   colonnes, 907 px) alors que le kit étire déjà le lien (`flex: 1 1 0%`) et demande `height: 100%`
   à l'image : la légende tombait 405 px sous l'image, vide mesuré DANS la carte
   (decorateur-maison.com 28/09, portier home:mosaique, trou_dans_carte 405 à 1440). */
.bh-contact-mosaique .bh-contact-cs-image-seule img { max-height: none !important; }

/* ─── Plancher de lecture des cartes sur un site DÉJÀ CONSTRUIT (garde du parc 30/09/2026,
   journal-auto-moto.com) ───
   `page_cassee.colonne_etroite` refuse tout texte de 60 caractères et plus dans une boîte de moins
   de 300 px. Deux remèdes du gabarit — la gouttière `.bh-contact-int` ramenée à --e4 et le
   `padding-inline: var(--e4)` des corps de carte — avaient été portés dans `blocs_home/home.css`,
   mais `home.css` est FIGÉ à l'habillage : « home.css ne se recopie pas » (astro_site.py). À 390 px,
   un site construit avant ces deux remèdes sert donc `100% - 2 × --e5` puis `padding: --e5` :
   une carte de 332 px ne laissait que 275 px de texte — mesuré sur la home, /posts/, /a-propos/,
   /temoignages/, /equipe/, /tags/ et /auteurs/ (18 pages, 111 fautes). Cette feuille, elle, est
   réinjectée dans le da.css de chaque site À CHAQUE build (`astro_site.rafraichit_correctifs_home`) :
   c'est le seul chemin par lequel un remède de home.css atteint un site déjà construit. da.css est
   chargé AVANT home.css, d'où le préfixe `.bh-contact-home` (0,2,0) qui l'emporte sur la règle figée
   (0,1,0) quel que soit l'ordre des feuilles. Les deux règles sont idempotentes pour les sites qui
   portent déjà le remède. Figé par `tests/test_colonne_etroite_site_construit.py`. */
.bh-contact-home .bh-contact-int { width: min(100% - 2 * var(--e4), var(--largeur)); }
/* `-c-voile` porte la marge intérieure des cartes « superposées » (/tags/, /auteurs/) : sans elle,
   la carte reste à 294 px de texte après l'élargissement du conteneur. */
.bh-contact-home .bh-contact-c-corps,
.bh-contact-home .bh-contact-cs-texte, .bh-contact-home .bh-contact-cs-qr, .bh-contact-home .bh-contact-cs-fait,
.bh-contact-home .bh-contact-cs-citation, .bh-contact-home .bh-contact-c-voile { padding-inline: var(--e4); }

/* ─── Plancher de lecture, suite : carte à marge doublée, frise, accordéon (garde du parc
   30/09/2026, journal-entreprise.com) ───
   Le remède ci-dessus pose `padding-inline: var(--e4)` sur TOUS les `.bh-contact-c-corps`. Sur une carte
   qui porte DÉJÀ sa propre marge intérieure — `.cs-repere` (tuiles « en quelques chiffres ») et
   `.cs-jalon` (jalons de frise) — elle se paie donc deux fois : à 1440 px, quatre colonnes font une
   carte de 326 px, moins 2 × --e5 (la carte) moins 2 × --e4 (le corps) : 230 px de texte. La carte
   garde l'horizontale de --e4 (la verticale --e5 ne bouge pas) et son corps ne la reprend pas.
   La frise garde son rail au-dessus de 640 px ; en dessous, le retrait de 2,25 rem ajouté à la marge
   de la carte ramenait le jalon à 252 px de texte. Le rail est masqué ET le retrait retiré — masquer
   le rail en gardant le retrait ne répare rien (même geste que la frise de `kit_vivant`,
   guide-voiture-moto.com 29/09/2026). À 390 px, une carte de 352 px laisse alors 313 px de texte.
   L'accordéon paie la sienne deux fois lui aussi (carte --e5 + résumé --e5) : 292 px pour une
   question de 62 caractères. Ramenée à --e4 sous 640 px.
   La règle de frise passe par `.bh-contact-bloc` : la copie figée préfixe DÉJÀ ses règles de frise par
   `.bh-contact-home` et son `[data-frise]` compte comme une classe, soit (0,3,0) — autant que la règle
   du gabarit. `da.css` étant chargé AVANT `home.css`, l'ordre du document ne peut pas trancher :
   sans la classe de plus, le remède ne s'applique pas sur un site déjà construit.
   Figé par `tests/test_colonne_etroite_frise_carte_20260930.py`. */
.bh-contact-home .bh-contact-cs-jalon, .bh-contact-home .bh-contact-cs-repere { padding-inline: var(--e4); }
.bh-contact-home .bh-contact-cs-jalon > .bh-contact-c-corps,
.bh-contact-home .bh-contact-cs-repere > .bh-contact-c-corps { padding-inline: 0; }
/* Une carte `cs-texte` qui enveloppe un `c-corps` paie DEUX fois la marge intérieure : la carte
   (--e5/--e4) ET le corps (--e4 posé plus haut sur TOUS les `.c-corps`). Le gabarit le sait
   (`home.css` : `.cs-texte > .c-corps { padding: 0 }`), mais `da.css` est chargé APRÈS `home.css`
   sur ces pages : la règle du gabarit (0,2,0) perd contre `.home .c-corps` (0,2,0) qui la suit.
   À 1440 px, trois colonnes de 361 px ne laissaient que 285 px de texte (seuil 300 px) sur
   `/projet`, `/realisations` et `/contact` — pages internes écrites à la main qui portent la
   classe ; à 390 px, la carte de 351 px laissait 281 px. Une classe de plus (0,3,0) pour l'emporter
   quel que soit l'ordre des feuilles, comme pour `.cs-jalon`/`.cs-repere`. Garde du parc
   02/10/2026, decorateur-maison.com. Figé par
   `tests/test_colonne_etroite_cs_texte_corps_20261002.py`. */
.bh-contact-home .bh-contact-cs-texte > .bh-contact-c-corps { padding-inline: 0; }
@media (max-width: 639px) {
  .bh-contact-home .bh-contact-bloc .bh-contact-timeline[data-frise] { padding-left: 0; }
  .bh-contact-home .bh-contact-bloc .bh-contact-timeline[data-frise]::before,
  .bh-contact-home .bh-contact-bloc .bh-contact-timeline[data-frise]::after,
  .bh-contact-home .bh-contact-bloc .bh-contact-timeline[data-frise] > .bh-contact-tl-pas::before { content: none; }
  .bh-contact-home .bh-contact-acc > summary { padding: var(--e4); }
  .bh-contact-home .bh-contact-acc-corps { padding: 0 var(--e4) var(--e4); }
}

/* ─── Plancher de lecture des carrousels (garde du parc 30/09/2026, la-gazette-assurance.com) ───
   Le carrousel posait `grid-auto-columns: minmax(16rem, 21rem)` : une carte de 288 px (18rem dès
   qu'un site figeait sa piste), moins 2 x --e5 et 2 px de bord, laissait 243 px de texte — rouge
   `page_cassee:colonne_etroite` à chaque largeur, pour tous les témoignages. Le plancher passe à
   22rem : 352 px de carte, 307 px de texte.
   Le gabarit (`home.css`) porte le même plancher pour les sites neufs ; la copie figée d'un site
   (`home.css` chargé APRÈS `da.css`) garde le dernier mot, d'où `.bh-contact-bloc` (0,3,0) ici pour
   l'emporter sur une règle figée à deux classes, comme pour la frise.
   Figé par `tests/test_colonne_etroite_carrousel_20260930.py`. */
.bh-contact-home .bh-contact-bloc .bh-contact-car-piste { grid-auto-columns: minmax(22rem, 24rem); }

/* ─── Plancher de lecture : widget, résultat de calculateur, carte d'étape (garde du parc
   30/09/2026, maison-bien-etre.com) ───
   Trois familles de cartes du kit échappaient encore aux deux remèdes ci-dessus, parce qu'elles
   portent LEUR marge intérieure sur un élément que `.bh-contact-c-corps` ne couvre pas :
   `.widget` (encadré d'une thématique, `padding: var(--e5)`), `.resultat` (sortie d'un
   calculateur, `padding: var(--e4) var(--e5)`) et la carte d'étape de `.b-etapes`, qui ajoute
   `padding-left: 1rem` plus 3 px de bord sous 900 px. À 390 px, une carte de 332 px laissait
   273 px de texte pour un paragraphe de plus de 60 caractères — mesuré sur la home
   (`p.bh-0c76-c-p`, `p.bh-0c76-widget-note`). L'horizontale passe à --e4 ; la carte d'étape perd
   son retrait sous 640 px, comme la frise.
   Les deux premiers sélecteurs portent `.bh-contact-home` (0,2,0) contre la règle figée (0,1,0) ; le
   troisième porte en plus `.bh-contact-carte`, car la copie figée écrit
   `.bh-contact-home .bh-contact-b-etapes [data-etape]` — soit (0,3,0), autant que deux classes plus un
   attribut : sans la classe de plus, l'ordre du document donne le dernier mot à `home.css`.

   ─── La TROISIÈME carte du même widget calculateur manquait (garde du parc 02/10/2026,
   actu-pme.com) ───
   Les deux remèdes ci-dessus couvrent `.widget` et `.resultat`, mais pas la carte du FORMULAIRE
   lui-même : `.calcul` (le `<form data-calcul>`, `padding: var(--e5)` dans les feuilles figées).
   Sur actu-pme.com à 390 px, la carte (338,8 px, bord 1 px) laisse 298,4 px au paragraphe meta de
   132 caractères (`p.bh-5e1c-c-meta`) — rouge `page_cassee:colonne_etroite` (seuil 300 px). Le
   même bloc est posé sur six sites du parc ; sa sortie `.calcul-sortie` (65/67 caractères) ne
   passait que de 0,4 px (300,4) et serait tombée au premier rendu différent. Les deux passent
   leur horizontale à --e4 : 311-313 px de texte.
   Le bloc `calcul` n'est plus dans `catalogue.BLOCS` (classe héritée, comme `.widget`/`.resultat`)
   : le remède ne peut atteindre les sites construits que par `correctifs.css`, réinjecté à chaque
   build. `.bh-contact-home` (0,2,0) l'emporte sur les copies figées (0,1,0) et sur `retouche.css`.
   Figé par `tests/test_colonne_etroite_calcul_20261002.py`, en plus du test du 30/09. */
.bh-contact-home .bh-contact-widget { padding-inline: var(--e4); }
.bh-contact-home .bh-contact-resultat { padding-inline: var(--e4); }
.bh-contact-home .bh-contact-calcul, .bh-contact-home .bh-contact-calcul-sortie { padding-inline: var(--e4); }
@media (max-width: 639px) {
  .bh-contact-home .bh-contact-b-etapes [data-etape].bh-contact-carte { padding-left: 0; }
}

/* ─── Plancher de lecture : LA FAMILLE DE CARTES, PAS SEULEMENT SES CAS PARTICULIERS (garde du
   parc 30/09/2026, mes-travaux-maison.com) ───
   Le remède du matin (`blocs_home/home.css` : `.c-corps` et `.cs-texte`/`cs-qr`/`cs-fait`/
   `cs-citation` passent leur marge HORIZONTALE de --e5 à --e4, et `.bh-contact-int` sa gouttière de
   page de `2 * --e5` à `2 * --e4`) n'a été recopié ici que pour les cartes qui l'avaient déjà
   réclamé — `.cs-jalon`, `.cs-repere`, `.widget`, `.resultat`, `.b-etapes`. Les quatre styles
   généraux sont restés à --e5, et `home.css` ne se recopie pas : sur un site DÉJÀ CONSTRUIT le
   défaut d'origine subsiste intact. Dix-sept sites du parc portent encore la copie figée sans le
   remède, et il ne se voit que sur une carte `.cs-texte` : à 390 px, `.bh-contact-int` à `2 * --e5`
   (1,8 rem sur six sites) plus --e5 de marge de carte donnent 292 px de paragraphe, 8 sous le
   seuil de `page_cassee:colonne_etroite` (mesuré sur `p.bh-096f-c-p.hm-chiffre-detail`, 77
   caractères). La règle ci-dessous est la copie EXACTE de celle du gabarit, avec la classe de
   `.bh-contact-home` pour l'emportent sur la copie figée (0,2,0 contre 0,1,0), qui est chargée après
   `da.css`.
   Figé par `tests/test_colonne_etroite_famille_cartes_20260930.py`. */
.bh-contact-home .bh-contact-c-corps,
.bh-contact-home .bh-contact-cs-texte, .bh-contact-home .bh-contact-cs-qr,
.bh-contact-home .bh-contact-cs-fait, .bh-contact-home .bh-contact-cs-citation { padding-inline: var(--e4); }

/* La gouttière de page du gabarit, elle aussi absente des copies figées. Sur les six sites dont
   --e4 vaut 1,2 rem et --e5 1,8 rem, la carte seule laisse encore 292 px à 390 px (rouge) :
   `bh-contact-int` ramené à `2 * --e4` donne 311 px. Sur les sites à --e4 1 rem (dont
   mes-travaux-maison.com), 308 px sans elle, 324 px avec. Mobile seulement : au-dessus, c'est
   `--largeur` qui plafonne le conteneur et rien ne bouge. */
@media (max-width: 639px) {
  .bh-contact-home .bh-contact-int { width: min(100% - 2 * var(--e4), var(--largeur)); }
}

/* ─── Plancher de lecture du vrai/faux « idées reçues » (garde du parc 30/09/2026,
   mes-travaux-maison.com) ───
   `.cs-idee .ir-faux` / `.ir-vrai` est une grille à DEUX pistes (icône 2,25rem + texte) avec
   `padding: var(--e5)` et aucune règle de repli : sous 640 px la carte fait la largeur de la
   page, et le texte tombe à 246-265 px selon le thème — sous les 300 px de
   `page_cassee:colonne_etroite` par construction, quelle que soit la phrase. Aucune réduction de
   marge ne suffit (à 358 px de carte, --e4 laisse 276 px) : l'icône passe AU-DESSUS du texte.
   Mesuré sur `p.bh-096f-c-p` du bloc manifeste (131 caractères, 260 px).
   Seize sites du parc portent la même règle figée sans repli ; le gabarit (`home.css`) porte le
   même repli pour les sites neufs, et cette copie a UNE classe de plus (0,3,0 contre 0,2,0) pour
   l'emporter sur une copie figée, `da.css` étant chargé AVANT `home.css`.
   Figé par `tests/test_colonne_etroite_cs_idee_20260930.py`. */
@media (max-width: 639px) {
  .bh-contact-home .bh-contact-cs-idee .bh-contact-ir-faux,
  .bh-contact-home .bh-contact-cs-idee .bh-contact-ir-vrai {
    grid-template-columns: minmax(0, 1fr); padding: var(--e4);
  }
}

/* Colonne titres + boutons du hero bandeau : sans règle, les éléments s empilaient sans espacement (01/10, test_prefixe_css). */
.bh-contact-hero-cote { display: grid; gap: var(--e4); align-content: end; }
/* usine:correctifs-home fin */