/* Numero grande + didascalia (es. "2010 · Nasce il Distretto"). --primary = card piena. */
@layer components {
  .stat-card {
    display: flex; flex-direction: column; gap: 12px; padding: 24px;
    border-radius: var(--radius-l); background: var(--color-bg);
  }
  .stat-card__value { font-weight: 800; font-size: clamp(36px, 4vw, 48px); line-height: 1; letter-spacing: -0.04em; color: var(--color-primary); white-space: nowrap; }
  .stat-card__text { font-size: 15px; line-height: 1.5; color: var(--color-ink-soft); }
  .stat-card--primary { background: var(--color-primary); color: var(--color-on-primary); }
  .stat-card--primary .stat-card__value, .stat-card--primary .stat-card__text { color: inherit; }
}