/* ============================================================
   Tricotta — TIPOGRAFIA (layer editoriale)
   ------------------------------------------------------------
   Tre ruoli, un solo posto in cui cambiarli (modularità):
     --font-display → grazie editoriale (titoli, «capo in grande»)
                      registro rivista di moda (Burda/Mani di Fata)
     --font-sans    → grotesque UI/corpo (chrome dello strumento)
     --font-mono    → dati/quote/contatori (tabellare)

   I file .woff2 vanno in ./fonts/ (vedi fonts/README.md).
   Finché non ci sono, i fallback rendono comunque:
   il display cade su una grazie di sistema → l'aria editoriale
   si vede già ora.
   ============================================================ */

/* ---- @font-face (self-host; attivi appena i file sono in ./fonts/) ---- */
@font-face {
  font-family: "Fraunces"; font-style: normal; font-weight: 300 700;
  font-display: swap; src: url("fonts/Fraunces.woff2") format("woff2");
}
@font-face {
  font-family: "Fraunces"; font-style: italic; font-weight: 300 700;
  font-display: swap; src: url("fonts/Fraunces-Italic.woff2") format("woff2");
}
@font-face {
  font-family: "Hanken Grotesk"; font-style: normal; font-weight: 300 800;
  font-display: swap; src: url("fonts/HankenGrotesk.woff2") format("woff2");
}
@font-face {
  font-family: "JetBrains Mono"; font-style: normal; font-weight: 400 600;
  font-display: swap; src: url("fonts/JetBrainsMono.woff2") format("woff2");
}

:root {
  --font-display: "Fraunces", "Newsreader", Georgia, "Times New Roman", serif;
  /* la sans copre latin+latin-ext; in coda i fallback di sistema per gli script
     costosi (JP/KO/ZH) → mai «tofu» nemmeno prima di spedire i Noto self-hosted */
  --font-sans:    "Hanken Grotesk", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto,
                  "Noto Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo,
                  "Malgun Gothic", "Microsoft YaHei", Helvetica, Arial, sans-serif;
  --font-mono:    "JetBrains Mono", ui-monospace, "SF Mono", "Cascadia Code", Consolas, monospace;

  /* alias retro-compatibili usati dai componenti */
  --sans: var(--font-sans);
  --mono: var(--font-mono);

  /* rifinitura tipografica editoriale */
  --display-tracking: -.02em;   /* i titoli display stringono un filo */
  --display-leading:  1.04;
}

/* ---- TRAPPOLA DEL DISPLAY (regola i18n) ----
   Il display «marmo/Alpi» (Fraunces) è Latin-only. Nei locale a script
   non-latino i titoli cadono sulla sans a copertura ampia → mai tofu/clipping.
   Il body usa già --font-sans. */
:lang(ja), :lang(ko), :lang(zh), :lang(hi), :lang(th),
:lang(ar), :lang(he), :lang(ru), :lang(uk), :lang(bg) {
  --font-display: var(--font-sans);
}

/* ---- Noto per-script, LAZY (da attivare quando si accende un locale non-latino) ----
   Ogni @font-face con unicode-range fa scaricare il font di uno script SOLO se la
   pagina contiene quei codepoint → l'utente IT non scarica mai i MB del JP.
   Esempio (riempire con i .woff2 in fonts/ e mettere il font in testa allo
   stack per il :lang corrispondente):
   @font-face { font-family:"Noto Sans JP"; src:url("fonts/NotoSansJP.woff2") format("woff2");
     font-display:swap; unicode-range:U+3000-30FF, U+3400-4DBF, U+4E00-9FFF, U+FF00-FFEF; } */

/* Utility opzionali per il registro editoriale.
   Applica .display ai titoli che devono «suonare» da rivista. */
.display {
  font-family: var(--font-display);
  font-weight: 500;
  letter-spacing: var(--display-tracking);
  line-height: var(--display-leading);
  font-optical-sizing: auto;
}
.display-italic { font-family: var(--font-display); font-style: italic; }
.numeric { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }