/* Héro des fiches territoire (#280) : sous le bandeau, chiffres clés à gauche, carte Mairie / Siège à droite.
   Jetons du socle (docs/lots/210-da/SOCLE.md), aucune valeur de style en dur. */
.fc:has(> .fh) { padding-top: 0; }
.fh { margin: var(--s-4) 0 var(--s-5); }
.fh__grille { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s-4); align-items: start; }
@media (min-width: 1024px) {
    .fh__grille { grid-template-columns: minmax(0, 1fr) 24rem; grid-template-areas: "p c" "e c"; grid-template-rows: auto 1fr; }
    .fh__grille > .fh__principal { grid-area: p; } .fh__grille > .fh__carte { grid-area: c; } .fh__grille > .fh__ceevo { grid-area: e; align-self: start; }
    .fh__grille--seul { grid-template-columns: minmax(0, 1fr); grid-template-areas: "p" "e"; grid-template-rows: auto; }
}
.fh__principal { display: grid; gap: var(--s-3); min-width: 0; }
.fh__rattach { display: flex; flex-wrap: wrap; gap: var(--s-1) var(--s-3); margin: 0; font-size: var(--t-compact, .875rem); color: var(--c-text-2); }
.fh__rattach a { color: var(--c-action-hover); text-decoration: underline; text-underline-offset: 2px; }
.fh__rattach a:hover { color: var(--c-brand-hover); }
.fh__chiffres { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin: 0; padding: 0; list-style: none;
    background: var(--c-border); border: 1px solid var(--c-border); border-radius: var(--r-md); overflow: hidden; }
@media (min-width: 640px) { .fh__chiffres { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.fh__chiffres--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 640px) { .fh__chiffres--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.fh__chiffres li { background: var(--c-surface); padding: var(--s-3); border-top: 3px solid var(--c-brand); min-width: 0; }
.fh__n { display: block; font-size: var(--t-chiffre); line-height: 1.15; font-weight: 800; color: var(--c-text); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.fh__l { display: block; margin-top: var(--s-1); font-size: var(--t-compact, .875rem); color: var(--c-text-2); }
.fh__chiffres a { color: inherit; text-decoration: none; display: block; }
.fh__chiffres a:hover .fh__n { color: var(--c-action-hover); }
.fh__actions { display: flex; flex-wrap: wrap; gap: var(--s-2); margin: 0; }
.fh__actions .ui-btn, .fo__pied .ui-btn, .fo__types .ui-btn { max-width: 100%; white-space: normal; height: auto; min-height: var(--tap, 44px); text-align: left; }
.fh__ceevo { border: 1px solid var(--c-border); border-left: 4px solid var(--c-accent); border-radius: var(--r-md); background: var(--c-bg); padding: var(--s-3); display: grid; gap: var(--s-1); }
.fh__ceevo p { margin: 0; }
.fh__ceevo-titre { font-weight: 700; color: var(--c-text); }
.fh__ceevo-texte { color: var(--c-text-2); font-size: var(--t-compact, .875rem); }
.fh__ceevo-lignes { display: flex; flex-wrap: wrap; gap: var(--s-1) var(--s-3); }
.fh__ceevo-lignes a { display: inline-flex; align-items: center; gap: var(--s-1); color: var(--c-action-hover); min-height: 44px; overflow-wrap: anywhere; }
.fh__carte { background: var(--c-surface); border: 1px solid var(--c-border); border-top: 4px solid var(--c-brand); border-radius: var(--r-md); box-shadow: var(--sh-2);
    padding: var(--s-3); display: grid; gap: var(--s-2); min-width: 0; }
.fh__carte-titre { margin: 0; font-size: var(--t-h3); line-height: 1.3; font-weight: 700; color: var(--c-text); }
.fh__personne { display: flex; align-items: center; gap: var(--s-2); margin: 0; }
.fh__personne img, .fh__initiales { width: 48px; height: 48px; border-radius: var(--r-full); object-fit: cover; flex: none; }
.fh__initiales { display: inline-flex; align-items: center; justify-content: center; background: var(--c-brand-soft); color: var(--c-brand-soft-ink, var(--c-brand)); font-weight: 700; }
.fh__personne strong { display: block; color: var(--c-text); overflow-wrap: anywhere; }
.fh__personne em { display: block; font-style: normal; font-size: var(--t-compact, .875rem); color: var(--c-text-2); }
.fh__credit, .fh__source { margin: 0; font-size: var(--t-legende, .8125rem); color: var(--c-text-2); }
.fh__source a { color: inherit; text-decoration: none; }
.fh__source a:hover { text-decoration: underline; }
.fh__lignes { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-1); }
.fh__lignes li { display: flex; gap: var(--s-2); align-items: flex-start; min-width: 0; }
.fh__lignes .ui-icon { flex: none; margin-top: 3px; color: var(--c-brand); }
.fh__lignes address { font-style: normal; overflow-wrap: anywhere; }
.fh__lignes a { color: var(--c-action-hover); text-decoration: underline; text-underline-offset: 2px; overflow-wrap: anywhere; display: inline-block; padding: 4px 0; }
.fh__lignes li > span { min-width: 0; }
.fh__horaires summary { display: flex; gap: var(--s-2); align-items: center; font-weight: 600; cursor: pointer; min-height: 32px; color: var(--c-text); }
.fh__horaires summary .ui-icon { color: var(--c-brand); }
.fh__horaires dl { margin: 0; display: grid; gap: 2px; font-size: var(--t-compact, .875rem); font-variant-numeric: tabular-nums; }
.fh__horaires dl div { display: flex; justify-content: space-between; gap: var(--s-2); padding: 1px 0; }
.fh__horaires dt { color: var(--c-text-2); }
.fh__horaires dd { margin: 0; text-align: right; }
.fh__itin { margin: 0; }
.fh__itin .ui-btn { width: 100%; justify-content: center; }
/* « Voir plus » (#280) : listes longues repliées par core/js/voir-plus.js ; sans script, tout reste visible. */
.vp-cache { display: none !important; }
.vp-bouton { margin: var(--s-2) 0 0; }
.vp-bouton button { cursor: pointer; }
/* Offres de la fiche : une grille de cartes, six au plus. */
.fo__pied { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2) var(--s-3); margin: var(--s-3) 0 0; }
.fo__pied .ui-help { margin: 0; }
.fo__types { display: flex; flex-wrap: wrap; gap: var(--s-2); align-items: center; margin: var(--s-3) 0 0; }
.fo__types strong { font-size: var(--t-compact, .875rem); color: var(--c-text-2); }
@media print { .fh__carte, .fh__ceevo, .vp-bouton { display: none; } }
.fh__elu { display: grid; gap: var(--s-1); padding-top: var(--s-2); border-top: 1px solid var(--c-border); }
.fh__elu:first-of-type { border-top: 0; padding-top: 0; }
