@font-face {
  font-family: 'Fraunces';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url('fraunces-300-italic.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Fraunces';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('fraunces-300-italic.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Fraunces';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url('fraunces-300-italic.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fraunces-400-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ⚠️ SYNE È UN FONT VARIABILE, e lo era già: `syne-400-normal.woff2` è
   byte per byte identico al file che Google Fonts serve per l'asse
   400..800 (md5 559e8363…). Il nome diceva «400» e nessuno l'ha più messo
   in dubbio.

   Qui c'erano QUATTRO @font-face — 400, 500, 600, 700 — tutte con lo stesso
   `src`. Dichiarare `font-weight: 600` su un file variabile senza dare un
   INTERVALLO significa dire al browser «questa faccia è la 600», e lui la
   disegna all'istanza predefinita: 400. Risultato: ogni `font-weight: 600`
   del sito era peso normale, e la gerarchia tipografica non esisteva.

   Su mobbin.com metà del lavoro lo fa proprio il contrasto fra un Light per
   il testo e un 600 per i titoli. Noi credevamo di averlo e non l'avevamo.

   Una faccia sola con l'intervallo, e i pesi diventano veri. Costa ZERO
   byte: è lo stesso file che stavamo già scaricando quattro volte. */
@font-face {
  font-family: 'Syne';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url('syne-variabile.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Clash Display';
  src: url('clash-display-500-normal.woff2') format('woff2');
  font-weight: 500;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: 'Clash Display';
  src: url('clash-display-600-normal.woff2') format('woff2');
  font-weight: 600;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: 'Clash Display';
  src: url('clash-display-700-normal.woff2') format('woff2');
  font-weight: 700;
  font-display: swap;
  font-style: normal;
}

/* ── Il punto fermo ────────────────────────────────────
   Clash Display disegna il punto come un QUADRATO pieno. È una scelta
   del carattere, non un difetto, ma nei titoli del sito arriva a
   190px: a quella dimensione smette di leggersi come punteggiatura e
   sembra un glifo mancante — «sali tu▪», «È una scuola▪», «Titoli di
   Coda▪».

   `unicode-range` risolve la cosa dove va risolta: questa famiglia
   contiene UN SOLO carattere, U+002E, e sta prima di Clash Display
   nella cascata. Il browser prende il punto da Fraunces e tutto il
   resto da Clash. Nessuna modifica al markup, nessuna eccezione da
   ricordarsi, e nessun peso in più: il file Fraunces è già scaricato.

   Le tre dichiarazioni servono a evitare il grassetto sintetico: i
   titoli usano 500/600/700 e con un solo peso disponibile il browser
   ingrasserebbe il punto da solo.                                    */
@font-face {
  font-family: 'Punto Tondo';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fraunces-400-normal.woff2') format('woff2');
  unicode-range: U+002E;
}
@font-face {
  font-family: 'Punto Tondo';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fraunces-400-normal.woff2') format('woff2');
  unicode-range: U+002E;
}
@font-face {
  font-family: 'Punto Tondo';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('fraunces-400-normal.woff2') format('woff2');
  unicode-range: U+002E;
}

/* ── Fallback metrici ──────────────────────────────────
   Finché il woff2 non arriva (font-display: swap) il testo si disegna in un
   carattere di sistema, poi «scatta» in Syne/Clash/Fraunces: se le due
   facce hanno larghezze e altezze di riga diverse, le righe vanno a capo in
   un altro punto e la pagina si sposta (CLS 0,048 misurato il 30/9/2026).
   Queste facce fanno passare per quel carattere di sistema le MISURE del
   font vero: `size-adjust` ne scala i glifi, i tre `*-override` fissano
   l'altezza di riga. Vanno negli stack di --font-* subito DOPO il font web
   (src/css/tokens.css).

   Come sono calcolate (script usa-e-getta, non nel repo, 30/9/2026):
     · size-adjust = larghezza media di un carattere del font web /
       larghezza media dello stesso carattere nel fallback, misurate in
       Chromium con canvas.measureText su testo VERO del sito (le pagine
       home, concorso, sponsor, news), non su un alfabeto qualsiasi: le
       frequenze delle lettere contano;
     · ascent/descent/line-gap-override = metrica hhea del woff2 / unitsPerEm
       / size-adjust (le percentuali sono del font descritto, non del
       fallback: per questo la divisione).
   Se cambia un woff2 o il testo del sito in modo sostanzioso, si rifanno.

   ⚠️ `local()` esiste solo dove il carattere è installato (Windows e macOS
   sì, Android e Linux di solito no): dove manca la faccia è ignorata e vale il
   resto dello stack, come prima. Nessun danno, solo nessun vantaggio.

   ⚠️ Questo file NON è più l'output di scripts/download-fonts.mjs (da tempo
   modificato a mano: Syne a intervallo, Punto Tondo): rilanciare lo script
   cancellerebbe queste facce. */

/* Syne 400: il testo corrente. Arial regolare. */
@font-face {
  font-family: 'Syne Fallback';
  src: local('Arial'), local('ArialMT');
  font-style: normal;
  font-weight: 400;
  size-adjust: 99.03%;
  ascent-override: 93.41%;
  descent-override: 27.77%;
  line-gap-override: 0%;
}
/* Syne si allarga molto col peso: il 500 è il 7% più largo del 400, il 600 il
   15%, il 700 il 24%. Una faccia per gradino, altrimenti il testo in 500 (nella
   home ne c'è quasi un quarto) cambia larghezza al caricamento. */
@font-face {
  font-family: 'Syne Fallback';
  src: local('Arial'), local('ArialMT');
  font-style: normal;
  font-weight: 500;
  size-adjust: 106.46%;
  ascent-override: 86.88%;
  descent-override: 25.83%;
  line-gap-override: 0%;
}
@font-face {
  font-family: 'Syne Fallback';
  src: local('Arial Bold'), local('Arial-BoldMT');
  font-style: normal;
  font-weight: 600;
  size-adjust: 106.08%;
  ascent-override: 87.2%;
  descent-override: 25.92%;
  line-gap-override: 0%;
}
/* 700 e 800 insieme, misurati sul 700: l'800 resta più largo del fallback,
   ma nessun testo sopra la piega lo usa. */
@font-face {
  font-family: 'Syne Fallback';
  src: local('Arial Bold'), local('Arial-BoldMT');
  font-style: normal;
  font-weight: 700 800;
  size-adjust: 114.32%;
  ascent-override: 80.91%;
  descent-override: 24.06%;
  line-gap-override: 0%;
}

/* Clash Display 500-700 (misurato sul 600, che è il titolo del film: gli
   altri due pesi scartano di ±2%). Arial Black, come già nello stack. */
@font-face {
  font-family: 'Clash Display Fallback';
  src: local('Arial Black'), local('Arial-Black');
  font-style: normal;
  font-weight: 500 700;
  size-adjust: 87.07%;
  ascent-override: 102.22%;
  descent-override: 28.71%;
  line-gap-override: 10.34%;
}

/* Fraunces: serif, quindi Georgia e non Arial. Normale e corsivo hanno
   larghezze diverse (Fraunces italico è più stretto), due facce. */
@font-face {
  font-family: 'Fraunces Fallback';
  src: local('Georgia');
  font-style: normal;
  font-weight: 100 900;
  size-adjust: 83.63%;
  ascent-override: 116.95%;
  descent-override: 30.49%;
  line-gap-override: 0%;
}
@font-face {
  font-family: 'Fraunces Fallback';
  src: local('Georgia Italic'), local('Georgia-Italic');
  font-style: italic;
  font-weight: 100 900;
  size-adjust: 74.04%;
  ascent-override: 132.09%;
  descent-override: 34.44%;
  line-gap-override: 0%;
}