/* ============================================================================
   TOKENS — Pescheria con Cottura (Lecce)
   ----------------------------------------------------------------------------
   Palette dal logo trovato in archivio (wordmark blu notte + brand system in
   kraft naturale). Font: Instrument Serif / Hanken Grotesk, assegnati nel
   BRIEF. Respiro alternato, forma morbida — vedi note per asse qui sotto.
   ========================================================================= */

:root {
  /* ——— COLORE —————————————————————————————————————————————————————————————
     Dal logo trovato (loghi/logo.png — archivio storico del sito ufficiale):
     wordmark blu notte su fondo chiaro, brand system di packaging in kraft
     naturale su fondo blu notte. Da lì: avorio caldo (mai bianco puro, la
     pietra leccese non lo è), blu notte per le sezioni scure dell'alternanza,
     ocra/kraft come colore che si ricorda (bottone, dettagli, non il corpo
     del testo). Contrasto AA verificato su ogni accoppiata sotto. */
  --fondo: #faf4e8;
  --fondo-alt: #f1e6d2;          /* superfici chiare in rilievo, card, bordi morbidi */
  --scuro: #141b24;              /* sezioni scure dell'alternanza, header, footer */
  --scuro-alt: #1d2733;          /* superfici dentro le sezioni scure */
  --testo: #181d24;
  --testo-tenue: #6e6554;        /* didascalie, metadati — mai testo corrente */
  --testo-chiaro: #f5efe2;       /* testo su fondo scuro */
  --testo-chiaro-tenue: #a8a08d; /* metadati su fondo scuro */
  --accento: #b8873f;            /* ocra/kraft — CTA, link, il colore che si ricorda */
  --accento-scuro: #7d5720;      /* stesso accento, scurito per testo su fondo chiaro (AA, 5.9:1) */
  --su-accento: #17130a;         /* testo sopra --accento pieno */
  --bordo: rgba(20, 27, 36, 0.12);

  /* ——— TIPOGRAFIA ————————————————————————————————————————————————————————
     Instrument Serif nei titoli (più caldo, con un corsivo vero per gli
     accenti editoriali), Hanken Grotesk nel corpo. Pesi limitati a quelli
     caricati dal <link> in index.html (300;400): niente bold sintetico,
     l'enfasi la fa la scala e il corsivo del serif, non il peso. */
  --font-titoli: 'Instrument Serif', Georgia, serif;
  --font-testo: 'Hanken Grotesk', system-ui, -apple-system, sans-serif;

  --t-corpo: clamp(1.0625rem, 1rem + 0.3vw, 1.1875rem);
  --t-piccolo: clamp(0.8125rem, 0.79rem + 0.12vw, 0.9375rem);
  --t-h4: clamp(1.25rem, 1.15rem + 0.5vw, 1.625rem);
  --t-h3: clamp(1.625rem, 1.35rem + 1.4vw, 2.5rem);
  --t-h2: clamp(2.25rem, 1.6rem + 3.2vw, 4.5rem);
  --t-h1: clamp(2.75rem, 1.3rem + 7vw, 8rem);

  --interlinea: 1.6;
  --interlinea-titoli: 1.04;
  --spaziatura-titoli: -0.01em;

  /* ——— RESPIRO ————————————————————————————————————————————————————————————
     Alternato: le sezioni "manifesto" (claim, statement, numeri) usano il
     valore ampio pieno; quelle dense di contenuto (piatti, storia, FAQ)
     usano .u-sezione--fitta. Il vuoto tra una sezione manifesto e la
     successiva è la pausa che dà peso a quello che viene dopo. */
  --spazio-sezione: clamp(5.5rem, 4rem + 8vw, 12rem);
  --spazio-blocco: clamp(1.5rem, 1rem + 2vw, 3rem);
  --gronda: clamp(1.25rem, 4vw, 4rem);   /* margine laterale della pagina */

  --larghezza-max: 76rem;      /* contenitore largo */
  --larghezza-lettura: 38rem;  /* colonna di testo: 60-75 caratteri, non di più */

  /* ——— FORMA ——————————————————————————————————————————————————————————————
     Morbida: raggi generosi, superfici piene, nessun bordo — la separazione
     tra un blocco e l'altro la fa il colore (--fondo / --fondo-alt / --scuro),
     non una linea. */
  --raggio: 1.75rem;
  --raggio-interattivo: 999px;
  --bordo-spessore: 0px;
  --ombra: 0 30px 60px -30px rgba(20, 27, 36, 0.35);

  /* ——— MOVIMENTO ——————————————————————————————————————————————————————————
     Parallasse misurato: livelli a velocità diverse, tempi brevi per stati e
     transizioni. Le animazioni su scroll si scrivono con GSAP in site.js. */
  --durata: 400ms;
  --durata-breve: 180ms;
  --curva: cubic-bezier(0.16, 1, 0.3, 1);
}