/* ==========================================================================
   Valori di design — unico posto dove si scelgono i numeri.
   Scala spazi: 4 8 12 16 24 32 48 64 96 128
   Scala testo: 13 15 17 21 27 34 44 58
   Raggi: 10 20 999 | Movimento: 140ms stato, 220ms entrata | Tocco: 44px
   ========================================================================== */
:root {
  --fondo: #080a10;
  --superficie-1: #101420;
  --superficie-2: #171d2c;
  --bordo-tenue: #242c3e;
  --bordo-forte: #38425c;
  --testo: #f3f5fa;
  --testo-tenue: #a9b1c3;
  --accento: #46e0b0;
  --accento-scuro: #06231b;
  --allarme: #ff8a7a;
  --alone-accento: rgba(70, 224, 176, .18);
  --alone-bottone: 0 0 0 1px rgba(70, 224, 176, .45), 0 6px 20px rgba(70, 224, 176, .26);
  --alone-bottone-forte: 0 0 0 1px rgba(70, 224, 176, .9), 0 10px 34px rgba(70, 224, 176, .5);

  --sp-1: 4px;   --sp-2: 8px;   --sp-3: 12px;  --sp-4: 16px;  --sp-5: 24px;
  --sp-6: 32px;  --sp-7: 48px;  --sp-8: 64px;  --sp-9: 96px;  --sp-10: 128px;

  --txt-xs: 13px; --txt-s: 15px; --txt-m: 17px; --txt-l: 21px;
  --txt-xl: 27px; --txt-xxl: 34px; --txt-display: clamp(34px, 5.2vw, 58px);
  --riga-aperta: 1.05; --riga-titolo: 1.2; --riga-corpo: 1.55;
  --misura: 68ch;

  --raggio-1: 10px; --raggio-2: 20px; --raggio-tondo: 999px;

  --ombra-1: 0 1px 2px rgba(0, 0, 0, .5);
  --ombra-2: 0 18px 48px rgba(0, 0, 0, .55);
  --alone: 0 0 0 1px rgba(70, 224, 176, .35), 0 0 64px rgba(70, 224, 176, .25);

  --mov-stato: 140ms;
  --mov-entrata: 220ms;
}