/* Check-up Marketing · token del sistema grafico.
 * Ogni colore, font, spazio e curva della pagina passa da qui: niente valori scritti a mano altrove.
 * Accento = giallo del sito gianlucagiacalone.it (#ffc200), usato come evidenziatore, non come sfondo.
 */
:root {
  /* Sfondo quasi bianco (come il sito), con una punta di caldo verso il giallo. Mai #fff, mai #000. */
  --color-paper:       oklch(99.4% 0.003 90);
  --color-paper-2:     oklch(97.2% 0.006 90);   /* superfici: form, righe in evidenza */
  --color-paper-3:     oklch(93.8% 0.008 88);
  --color-rule-2:      oklch(89% 0.014 88);
  --color-rule:        oklch(82% 0.016 85);
  --color-muted:       oklch(50% 0.014 80);
  --color-ink-2:       oklch(35% 0.014 80);
  --color-ink:         oklch(21% 0.012 80);

  /* Accento */
  --color-accent:      oklch(84.6% 0.173 85.6);  /* #ffc200 */
  --color-accent-soft: oklch(94% 0.07 92);       /* fascia evidenziatore */
  --color-accent-deep: oklch(64% 0.15 78);       /* bordo del radar */
  --color-accent-ink:  var(--color-ink);
  /* Luci dello sfondo animato (pagina di accesso): solo sfumature del giallo */
  --color-luce-1:      oklch(87% 0.15 88 / 0.68);
  --color-luce-2:      oklch(80% 0.15 75 / 0.45);
  --color-luce-3:      oklch(93% 0.10 95 / 0.8);
  --color-focus:       oklch(45% 0.11 70);       /* ambra scura: contrasto > 3:1 sulla carta */

  /* Stato delle aree (solo testo e pallino, mai fondi pieni) */
  --color-critica:     oklch(50% 0.17 28);
  --color-migliorare:  oklch(52% 0.12 62);
  --color-forza:       oklch(48% 0.11 150);

  /* Tipografia: titoli in Inter 800 (il più vicino al font di sistema della homepage), testo in IBM Plex Sans. Ospitati in locale. */
  --font-display: "Inter", -apple-system, "Segoe UI", sans-serif;
  --font-body:    "IBM Plex Sans", "Helvetica Neue", "Segoe UI", sans-serif;

  --text-xs:      0.75rem;
  --text-sm:      0.875rem;
  --text-base:    1rem;
  --text-md:      1.125rem;
  --text-lg:      1.375rem;
  --text-xl:      1.75rem;
  --text-2xl:     2.25rem;
  --text-display: clamp(2.25rem, 3.6vw + 1rem, 4.25rem);
  --text-figure:  clamp(6rem, 13vw + 1rem, 11rem);

  --lh-tight:  1.04;
  --lh-snug:   1.2;
  --lh-normal: 1.55;

  --tracking-display: -0.022em;
  --tracking-tight:   -0.012em;
  --tracking-label:   0.08em;

  /* Spazi: scala da 4 pt */
  --space-2xs: 0.25rem;
  --space-xs:  0.5rem;
  --space-sm:  0.75rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2.5rem;
  --space-2xl: 4rem;
  --space-3xl: 6rem;

  --page-max:    72rem;
  --page-gutter: clamp(1rem, 4vw, 3rem);
  --measure:     62ch;
  --rule-hair:   1px;

  --radius-button: 12px;   /* come i bottoni del sito */
  --radius-input:  10px;
  --radius-panel:  16px;

  /* Movimento: poco e con curve proprie */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-micro: 120ms;
  --dur-short: 220ms;
  --dur-count: 600ms;
  --dur-deriva: 22s;   /* movimento lento delle luci di sfondo */
}