/* funeral_services — token del verticale.
   Palette PRESA DAI PIXEL del marchio del primo cliente e dal sito che il cliente ha posto come
   riferimento. Ogni coppia testo/fondo è MISURATA sulla superficie reale su cui viene usata, col
   margine di 4,6 (a 4,50 esatto axe boccia per arrotondamento).

   ⚠⚠ L'ORO NON PORTA TESTO. `--oro` misura 2,08 su crema, 2,49 su bianco e 1,57 sulla tessera tan:
   è superficie e fregio, mai inchiostro. Per il testo esistono due token distinti — `--oro-ink` per i
   fondi chiari e `--oro-su-scuro` per la banda bruna. È la stessa disciplina dell'ottone di
   security_institute. Il sito di riferimento del cliente sbaglia proprio qui (le etichette dei
   recapiti stanno a 1,57): l'AA vince sulla fedeltà. */

:root {
  /* --- ruoli semantici del genoma (nomi CHIUSI, condivisi da tutti i verticali) --- */
  --brand-dark: #3a332a;   /* bruno profondo: piè */
  --brand: #4d4437;        /* bruno caldo: banda scura, titoli */
  --brand-mid: #6c6255;
  --sage: #ddcbaf;         /* tan: tessere dei recapiti */
  --sage-light: #f0eadb;   /* crema: testata e bande alterne */
  --sage-tint: #f8f7f2;    /* avorio: fondo pagina */
  --accent-ink: #766547;   /* oro-inchiostro su chiaro: 5,26 su avorio · 4,70 su crema */
  --accent: #c5a876;       /* oro: SOLO superficie e fregi */
  --accent-dark: #9e865e;
  --paper: #ffffff;
  --surface: #f0eadb;
  --ink: #332e26;          /* 12,55 su avorio · 11,22 su crema */
  --ink-muted: #5f5648;    /* 6,72 su avorio · 6,01 su crema */
  --line: rgba(77, 68, 55, .18);
  --on-dark: #ffffff;      /* 9,56 sul bruno · 12,45 sul piè */
  --on-dark-muted: #d6cec1;/* 6,12 sul bruno · 7,98 sul piè */
  --focus: #766547;

  /* --- alias di lettura: nel dominio funebre i nomi contano più delle sigle --- */
  --avorio: var(--sage-tint);
  --crema: var(--sage-light);
  --tan: var(--sage);
  --bruno: var(--brand);
  --bruno-scuro: var(--brand-dark);
  --oro: var(--accent);
  --oro-ink: var(--accent-ink);
  --oro-su-scuro: #d9c295;  /* 5,51 sul bruno · 7,17 sul piè */

  /* --- tipografia: due famiglie OFL self-hosted (zero-live: mai un font remoto) ---
     Cormorant Garamond porta i display e NIENTE altro: a misura di corpo i suoi tratti sono troppo
     sottili. Il testo è Alegreya Sans, umanista e caldo, parente di progetto dei garaldi. */
  --font-display: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --font-body: "Alegreya Sans", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* La scala tipografica: i nomi `--text-*` sono quelli che l'emitter legge per derivare i fontSizes
     di theme.json (tokensOf lancia se ne manca uno). Gli alias `--t-*` sono la forma breve usata dal
     CSS del verticale: una sorgente sola, due nomi. ⚠ Dentro clamp() il `+` ESIGE gli spazi — senza,
     la dichiarazione è invalida e sparisce senza lasciare traccia nel sorgente. */
  --text-sm: .9375rem;
  --text-base: 1.0625rem;
  --text-md: 1.1875rem;
  --text-lg: 1.375rem;
  --text-xl: clamp(1.75rem, 1.2rem + 1.9vw, 2.55rem);
  --text-2xl: clamp(2.1rem, 1.3rem + 3vw, 3.4rem);
  --text-3xl: clamp(2.6rem, 1.4rem + 4.6vw, 4.6rem);

  --t-xs: .8125rem;
  --t-sm: var(--text-sm);
  --t-base: var(--text-base);
  --t-lg: var(--text-md);
  --t-xl: var(--text-xl);
  --t-2xl: var(--text-2xl);
  --t-3xl: var(--text-3xl);

  --lh-body: 1.65;
  --lh-heading: 1.12;
  /* ⚠ Questi cinque token non li consuma il CSS del verticale: li pretendono le TOPOLOGIE condivise,
     che possono usare solo i token comuni a TUTTI i verticali. Un verticale nuovo che non li dichiara
     restringe l'insieme comune e fa cadere il gate `topology` per l'intera flotta. */
  --lh-snug: 1.16;
  --lh-tight: 1.08;
  --tracking-label: 0.12em;
  --bg: var(--paper);

  /* --- misure --- */
  --container: 74rem;
  --gutter: clamp(1.25rem, 4vw, 3rem);
  --section-y: clamp(3.5rem, 7vw, 6.5rem);
  --space-1: .35rem;
  --space-2: .7rem;
  --space-3: 1.1rem;
  --space-4: 1.6rem;
  --space-5: 2.4rem;
  --space-6: 3.4rem;
  --space-7: 4.4rem;
  --space-8: 5.6rem;
  --space-9: 7rem;
  --space-10: 8.8rem;

  /* Raggio ZERO: in questo registro un angolo arrotondato suona allegro. */
  --radius: 0px;
  --radius-lg: 0px;   /* preteso dalle topologie condivise */
  --ease: cubic-bezier(.2, .7, .3, 1);

  /* --- token INERTI: il valore qui e' ESATTAMENTE quello che era cablato nel CSS condiviso, quindi
     nessun sito gia' consegnato cambia di un pixel. Esistono perche' un preset di progetto possa
     ridipingere anche le superfici che un ruolo di palette non raggiunge: sfumature, veli e aloni.
     ⚠ I tre `*-rgb` sono terne NUDE (non `rgb()`): servono dentro `rgb(var(--x) / alpha)`, che e'
     l'unico modo di far seguire l'alfa a un colore che arriva da un token. --- */
  --oro-rgb: 197 168 118;            /* = #c5a876, l'oro: aloni e fregi sfumati */
  --oro-su-scuro-rgb: 217 194 149;   /* = #d9c295, bordi tenui sulle bande scure */
  --bruno-rgb: 77 68 55;             /* = #4d4437, ombra della testata e filetti */
  --velo-rgb: 28 24 19;              /* veli sulle fotografie: strato esterno */
  --velo-core-rgb: 24 20 16;         /*              "         strato centrale */
  --velo-deep-rgb: 22 18 14;         /*              "         strato profondo */
  --hero-grad-top: #5a4f3f;          /* capo della discesa dell'hero senza foto */
  --banda-grad-top: #574c3d;         /* capo della discesa della banda scura di sezione */
  --avorio-hi: #fdfcf9;              /* fermi chiari della lastra avorio */
  --avorio-lo: #f2ece0;
  --tan-hover: #e6d7bf;              /* tessera dei recapiti, stato hover */
  --hero-eyebrow: #E4E9F5;           /* occhiello e sommario dell'hero: restano CHIARI sul fondo scuro */
  --hero-lead-ink: #f2ede4;

  /* --- movimento: i valori sono quelli di oggi, cosi' i fratelli si rivelano identici. Un progetto
     puo' renderli piu' o meno sentiti senza toccare il verticale. `--reveal-shift` e' l'unico che
     SPOSTA: resta verticale per scelta, una rivelazione orizzontale fa sbordare la pagina. --- */
  /* --- fregi e filetti. `--fregio` e' il colore di ogni segno DECORATIVO (rametti, losanghe, filetti,
     sottolineature, bordo del bottone fantasma). Vale l'oro, che si legge sia sull'avorio sia sulle
     bande scure. ⚠ Ma sulla banda `--crema` no, SE quella banda diventa essa stessa oro: un fregio
     d'oro sull'oro sparisce. `--fregio-crema` esiste per quel caso e vale l'oro per default, quindi
     per chi non lo cambia non muta un pixel. --- */
  /* --- trama di banda. `--trama` e' un'IMMAGINE di fondo per le bande `--crema`, e vale `none`:
     chi non la dichiara non scarica nulla e non cambia di un pixel. `--trama-attach` a `fixed` fa
     restare il fondo fermo nel viewport mentre la banda ci scorre sopra — e' la "parallasse" del
     riferimento, che non e' JavaScript ma `background-attachment`.
     ⚠ Una trama PIU' SCURA del fondo abbasserebbe il contrasto del testo che ci sta sopra: va tenuta
     piu' chiara della banda, e comunque va rimisurata sul pixel dopo averla accesa. --- */
  --trama: none;
  --trama-attach: scroll;

  --fregio: var(--oro);
  --fregio-crema: var(--oro);

  --reveal-shift: 20px;
  --reveal-dur: .7s;
  --reveal-stagger: 70ms;
}