/* Hub /esperance-vie/ (category-esperance-vie.php). Chargé seulement sur is_category('esperance-vie'),
   après hub-taille.css dont il réutilise les variables et les composants (.ht-*). */

/* ── Lisibilité : étiquettes ≥ 12px, textes à lire ≥ 13px ── */
.he .ht-note { font-size: .82rem; }
.he .ht-eyebrow { font-size: .75rem; }

/* ── Nuage poids × espérance de vie ── */
.he-scatter { width: 100%; height: auto; display: block; }
.he-grid { stroke: var(--green-pale); stroke-width: 1; }
.he-ax-l { font-size: 12px; fill: var(--muted); font-family: 'Inter', sans-serif; font-weight: 600; }
.he-pt-l { font-size: 13px; fill: var(--text); font-family: 'Inter', sans-serif; font-weight: 600; paint-order: stroke; stroke: var(--white); stroke-width: 4px; stroke-linejoin: round; pointer-events: none; }
.he-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: .8rem; color: var(--muted); margin-top: 8px; }
.he-legend .ht-gdot { vertical-align: 0; }

/* ── Barres par gabarit ── */
.he-gbars { list-style: none; margin: 0; padding: 0; }
.he-gbar { display: grid; grid-template-columns: minmax(0, 14rem) minmax(0, 1fr) minmax(0, 7.5rem); align-items: center; column-gap: 14px; padding: 10px 0; border-bottom: 1px solid var(--green-pale); }
.he-gbar:last-child { border-bottom: 0; }
.he-gbar-name { font-size: .92rem; font-weight: 600; line-height: 1.3; }
.he-gbar-name small, .he-gbar-val small { display: block; font-size: .78rem; font-weight: 400; color: var(--muted); }
.he-gbar-name small { margin-left: 15px; }
.he-gbar-track { position: relative; height: 14px; border-radius: 7px; background: var(--green-pale); overflow: hidden; }
.he-gbar-track b { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 7px; }
.he-gbar-val { text-align: right; line-height: 1.2; font-variant-numeric: tabular-nums; }
.he-gbar-val strong { font-family: 'Fraunces', serif; font-size: 1.2rem; font-weight: 700; }

/* ── Palmarès : couleur des rangs ── */
.he-podium-long .ht-podium-rank { color: var(--green-mid); }
.he-podium-short .ht-podium-rank { color: var(--amber); }

/* ── Sources + hubs voisins ── */
.he-sources { max-width: 720px; margin-top: 20px; }
.he-next { margin-top: 32px; }
.he-next ul { list-style: none; margin: 0; padding: 0; max-width: 720px; border-top: 1px solid var(--border); }
.he-next li { border-bottom: 1px solid var(--border); }
.he-next a { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; padding: 8px 2px; font-weight: 600; font-size: .95rem; }
.he-next a::after { content: '\2192'; flex-shrink: 0; }
.he-next a:hover { text-decoration: none; background: var(--green-pale); }

@media (max-width: 640px) {
  .he .ht-kpi b { font-size: 1.2rem; white-space: nowrap; }
  .he .ht-kpi span { font-size: .75rem; }
  .he-gbar { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "name val" "track track"; row-gap: 6px; padding: 8px 0; }
  .he-gbar-name { grid-area: name; font-size: .88rem; }
  .he-gbar-val { grid-area: val; }
  .he-gbar-val strong { font-size: 1.1rem; }
  .he-gbar-track { grid-area: track; height: 12px; }
  .he-next { margin-top: 24px; }
}
