/* Valori di default del framework (neutri). Il child li sovrascrive nello stesso layer con i valori del brand. */
@layer tokens {
  :root {
    --color-ink: #1c1c1c;          /* testo principale */
    --color-ink-soft: #3a3a3a;     /* testo secondario */
    --color-muted-text: #666;      /* testo piccolo attenuato: contrasto ≥ 4.5:1 su --color-bg e --color-surface (WCAG 1.4.3) */
    --color-bg: #fff;
    --color-surface: #f4f4f4;      /* fondi chiari di sezioni e card */
    --color-surface-2: #fafafa;
    --color-line: #e2e2e2;         /* bordi sottili */
    --color-primary: #2d5b8a;      /* pulsanti, link, icone */
    --color-primary-dark: #17324d; /* fondi scuri (hero, header, CTA) */
    --color-on-primary: #fff;
    --color-accent: #e8b04a;       /* evidenze: hover, etichette, badge */
    --color-on-accent: #1c1c1c;
    --color-error: #b3261e;

    --font-body: system-ui, sans-serif;
    --font-heading: var(--font-body);

    --radius-s: 8px;
    --radius-m: 12px;
    --radius-l: 16px;
    --radius-xl: 24px;
    --radius-pill: 100px;

    --container-max: 1320px;
    --gutter: clamp(20px, 4.2vw, 60px);
    --section-space: clamp(64px, 7vw, 100px);
    --tracking: -0.02em;
  }
}