/* ============================================================
   tokens.css — variabili globali
   Palette estratta dai loghi BLM Project + AI Academy Piamarta
   Archetipo: apple-motion · Typography: Fraunces + Geist
   ============================================================ */

:root {
  /* --- Colore --- */
  --c-ink:        #14233D;   /* testo principale su chiaro */
  --c-navy:       #1C3A5E;   /* navy primario (loghi) */
  --c-navy-deep:  #0E1F38;   /* sezioni scure full-bleed */
  --c-navy-2:     #173052;   /* navy intermedio */
  --c-sky:        #4F9FD6;   /* azzurro AI Academy (accento) */
  --c-sky-bright: #82C2EC;   /* azzurro chiaro per highlight su scuro */
  --c-sky-soft:   #DCEBF7;   /* velatura azzurra su chiaro */

  --c-bg:         #F4F6FA;   /* fondo chiaro freddo */
  --c-bg-warm:    #FBFAF7;   /* fondo chiaro caldo (alternanza) */
  --c-paper:      #FFFFFF;   /* card / superfici */
  --c-muted:      #5B6B82;   /* testo secondario */
  --c-muted-dim:  #8A98AC;   /* testo terziario */
  --c-line:       rgba(20, 35, 61, 0.12);
  --c-line-soft:  rgba(20, 35, 61, 0.07);
  --c-line-dark:  rgba(255, 255, 255, 0.14);

  /* --- Tipografia --- */
  --ff-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --ff-body:    'Geist', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --ff-mono:    'Geist Mono', 'SFMono-Regular', ui-monospace, Menlo, monospace;

  --fs-hero:    clamp(54px, 8.5vw, 132px);
  --fs-display: clamp(40px, 6vw, 92px);
  --fs-h1:      clamp(36px, 4.6vw, 72px);
  --fs-h2:      clamp(28px, 3.4vw, 52px);
  --fs-h3:      clamp(22px, 2.2vw, 32px);
  --fs-h4:      clamp(18px, 1.5vw, 23px);
  --fs-lead:    clamp(19px, 1.55vw, 26px);
  --fs-body:    clamp(16px, 1.15vw, 18px);
  --fs-small:   14px;
  --fs-caption: 13px;
  --fs-micro:   11px;

  --lh-display: 1.02;
  --lh-heading: 1.1;
  --lh-body:    1.62;
  --lh-lead:    1.42;

  --ls-hero:    -0.035em;
  --ls-display: -0.022em;
  --ls-body:    -0.004em;
  --ls-caption:  0.14em;

  /* --- Spazio --- */
  --pad-block: clamp(72px, 11vh, 168px);
  --pad-inline: clamp(22px, 5vw, 120px);
  --gap: clamp(20px, 2.4vw, 36px);
  --radius: 18px;
  --radius-sm: 12px;
  --radius-lg: 28px;

  /* --- Movimento --- */
  --ease-smooth: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);

  /* --- Larghezze --- */
  --measure: 64ch;
  --maxw-content: 1320px;
}