/* Direzione 1 "Squadra": token. Bianco freddo e ghiaccio, blu notte per il testo e le fasce scure, ambra sulle sole azioni. */
:root {
  /* colore */
  --fondo: #F7F9FC;
  --fondo-2: #EDF1F6;
  --fondo-3: #0B2545;
  --inchiostro: #0B2545;
  --inchiostro-tenue: #4A5A70;
  --accento: #F7A600;
  --accento-2: #E59500;
  --filo: #D9E0E9;
  --filo-forte: #0B2545;
  --x-ambra-testo: #8A5A00;

  /* derivati, solo alpha e color-mix dei colori sopra */
  --x-fondo-vetro: color-mix(in srgb, var(--fondo) 90%, transparent);
  --x-chiaro-su-scuro: color-mix(in srgb, var(--fondo) 74%, transparent);
  --x-chiaro-tenue-su-scuro: color-mix(in srgb, var(--fondo) 22%, transparent);
  --x-filo-su-scuro: color-mix(in srgb, var(--fondo) 16%, transparent);
  --x-cifra-spenta: color-mix(in srgb, var(--fondo) 18%, transparent);
  --x-accento-velo: color-mix(in srgb, var(--accento) 16%, transparent);
  --x-inchiostro-velo: color-mix(in srgb, var(--inchiostro) 6%, transparent);
  --x-inchiostro-velo-forte: color-mix(in srgb, var(--inchiostro) 12%, transparent);
  --x-blueprint: color-mix(in srgb, var(--filo) 70%, transparent);

  /* tipografia */
  --font-titolo: "Archivo", system-ui, sans-serif;
  --font-testo: "Archivo", system-ui, sans-serif;
  --font-etichetta: "Archivo", system-ui, sans-serif;
  --fs-1: clamp(2.5rem, 1.4rem + 4.6vw, 5.25rem);
  --fs-2: clamp(1.875rem, 1.3rem + 2.4vw, 3.25rem);
  --fs-3: clamp(1.375rem, 1.1rem + 1vw, 1.875rem);
  --fs-4: 1.25rem;
  --fs-5: 1.0625rem;
  --fs-6: 0.9375rem;
  --fs-7: 0.8125rem;
  --fs-8: 0.6875rem;
  --lh-stretta: 1.04;
  --lh-normale: 1.55;
  --tracking-etichetta: 0.14em;
  --misura: 36rem;
  --x-peso-titolo: 800;
  --x-larghezza-titolo: 100%;
  --x-larghezza-etichetta: 112%;
  --x-tracking-titolo: -0.022em;
  --x-tracking-stretto: 0.07em;

  /* spazio */
  --sp-1: 0.375rem;
  --sp-2: 0.75rem;
  --sp-3: 1.25rem;
  --sp-4: 2rem;
  --sp-5: 3.5rem;
  --sp-6: clamp(4.5rem, 3rem + 6vw, 8.5rem);
  --pad-x: clamp(1.25rem, 0.6rem + 3vw, 3rem);
  --max-w: 72rem;
  --x-max-w-stretta: 48rem;
  --x-tocco: 3rem;
  --x-logo-h: 2.125rem;
  --x-logo-h-piede: 2.75rem;
  --x-alt-testata: 4rem;
  --x-filetto-titolo: 3.5rem;
  --x-filetto-scheda: 2rem;
  --x-salita: 1.25rem;
  --x-anello: 3px;
  --x-raggio-zona: min(80vw, 22rem);

  /* misure di firma */
  --x-tocco-grande: 3.5rem;
  --x-tocco-medio: 2.75rem;
  --x-tocco-piccolo: 2.25rem;
  --x-logo-h-desk: 2.5rem;
  --x-max-w-garanzie: 60rem;
  --x-max-w-modulo: 62rem;
  --x-lh-titolo: 1.08;
  --x-fs-cifra: 4.5rem;
  --x-sposta: 3px;
  --x-rombo: 0.4375rem;
  --x-icona: 1.75rem;
  --x-icona-grande: 2.25rem;
  --x-miniatura: 6.75rem;
  --x-maglia: 12px;
  --x-colonna-cifra: 3.75rem;
  --x-punto: 0.5rem;
  --x-punto-grande: 0.625rem;
  --x-pillola: 999px;
  --x-cerchio: 2.5rem;
  --x-filo-sp-doppio: 2px;
  --x-alone: 5px;
  --x-pianta: 2.25rem;
  --x-pianta-grande: 2.75rem;
  --x-casella: 1.375rem;
  --x-raggio-casella: 5px;
  --x-segno-fine: 4rem;
  --x-tessera-desk: 7rem;
  --x-sfocatura: 10px;
  --x-bordo-campo: color-mix(in srgb, var(--inchiostro-tenue) 62%, var(--fondo));
  --x-spunta-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F7F9FC' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E");
  --x-freccia-svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B2545' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");

  /* tempi di firma */
  --x-dur-apertura: 1400ms;
  --x-ritardo-foto: 120ms;
  --x-ritardo-filetto: 350ms;
  --x-ritardo-garanzie: 700ms;
  --x-dur-impulso: 1600ms;
  --x-dur-binario: 1500ms;

  /* forma */
  --raggio: 10px;
  --raggio-s: 6px;
  --filetto-sp: 3px;
  --x-filo-sp: 1px;

  /* ombra, sempre dal blu notte con alpha */
  --ombra: 0 1px 2px color-mix(in srgb, var(--inchiostro) 8%, transparent), 0 18px 40px -18px color-mix(in srgb, var(--inchiostro) 28%, transparent);
  --ombra-corta: 0 1px 2px color-mix(in srgb, var(--inchiostro) 12%, transparent), 0 6px 14px -8px color-mix(in srgb, var(--inchiostro) 30%, transparent);

  /* movimento */
  --dur-1: 160ms;
  --dur-2: 520ms;
  --dur-3: 1100ms;
  --curva-uscita: cubic-bezier(0.2, 0.7, 0.1, 1);
  --curva-entrata: cubic-bezier(0.6, 0, 0.8, 0.3);
  --scaletta: 90ms;
  --x-avviso-durata: 4200ms;

  /* cromo di bozza */
  --altezza-fascia: 2rem;

  /* fotografia: colore originale, nessun filtro, nessun velo */
  --foto-filtro: none;
  --foto-velo: transparent;
}