/*
 * Carattere scelto dal visitatore (pulsante "Carattere" nell'header, vedi assets/js/site.js).
 * Si attiva con <html data-variante="lexend|opendyslexic">; senza attributo resta il carattere standard.
 * I font si scaricano solo quando servono (il browser carica un @font-face solo se usato).
 * Anche ?variante=lexend / ?variante=opendyslexic nell'indirizzo (utile per mandare un link).
 * Regole: British Dyslexia Association Style Guide + WCAG 1.4.12 (spaziatura del testo).
 *  - font a forme molto distinte (b/d/p/q), interlinea ≥ 1.5, spaziatura lettere/parole aumentata
 *  - niente MAIUSCOLO continuo, niente corsivo (enfasi in grassetto), allineamento a sinistra
 *  - righe più corte (≈ 60 caratteri), paragrafi ben separati, fondo crema (già presente)
 */

@font-face {
  font-family: "Lexend";
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("../fonts/lexend-latin.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: "Lexend";
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url("../fonts/lexend-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "OpenDyslexic";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/opendyslexic-regular.woff2") format("woff2");
}
@font-face {
  font-family: "OpenDyslexic";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/opendyslexic-bold.woff2") format("woff2");
}

:root[data-variante="lexend"] {
  --font: "Lexend", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --fs-body: clamp(1.125rem, 1.05rem + 0.3vw, 1.25rem);   /* 18 → 20px */
}
:root[data-variante="opendyslexic"] {
  --font: "OpenDyslexic", "Lexend", system-ui, sans-serif;
  /* OpenDyslexic è molto largo e alto: corpo leggermente più piccolo per la stessa resa */
  --fs-body: clamp(1.0625rem, 1rem + 0.25vw, 1.1875rem);
  --fs-h1: clamp(1.75rem, 1.3rem + 2.2vw, 3rem);
  --fs-h2: clamp(1.5rem, 1.2rem + 1.4vw, 2.25rem);
  --fs-h3: clamp(1.125rem, 1.05rem + 0.4vw, 1.375rem);
}

:root[data-variante] {
  --lh-body: 1.75;
  --lh-heading: 1.3;
  --measure: 60ch;
}

/* Spaziatura del testo (WCAG 1.4.12) */
[data-variante] body {
  letter-spacing: 0.04em;
  word-spacing: 0.16em;
}
[data-variante] h1,
[data-variante] h2,
[data-variante] h3 {
  letter-spacing: 0 !important;
  word-spacing: 0.08em;
}
[data-variante] p,
[data-variante] li { text-align: left; hyphens: manual; }
[data-variante] .prose p + p,
[data-variante] .prose p { margin-block: 0 1.1em; }

/* OpenDyslexic è già molto spaziato di suo: niente spaziatura extra tra lettere */
[data-variante="opendyslexic"] body { letter-spacing: 0; word-spacing: 0.1em; }
[data-variante="opendyslexic"] h1,
[data-variante="opendyslexic"] h2,
[data-variante="opendyslexic"] h3 { word-spacing: 0; }
[data-variante="opendyslexic"] .site-nav a { white-space: nowrap; font-size: 0.9375rem; }
[data-variante="opendyslexic"] .site-nav ul { column-gap: 0.25rem; }
/* OpenDyslexic allarga molto il menu: sotto i 90rem il pulsante mostra solo "Aa" */
@media (max-width: 89.99rem) {
  [data-variante="opendyslexic"] .font-ctl__label {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
  }
}

/* Niente maiuscolo continuo: più difficile da riconoscere come "forma di parola" */
[data-variante] .eyebrow,
[data-variante] .reading__type,
[data-variante] .contact-list__label,
[data-variante] .legal__toc-label,
[data-variante] [class*="label"] {
  text-transform: none !important;
  letter-spacing: 0.02em !important;
}

/* Niente corsivo: l'enfasi diventa grassetto leggero */
[data-variante] em,
[data-variante] i,
[data-variante] .contact-list--missing li,
[data-variante] [style*="italic"] {
  font-style: normal !important;
}
[data-variante] em { font-weight: 600; }

/* Link: sottolineatura più staccata dalle lettere (non "taglia" le discendenti) */
[data-variante] a { text-underline-offset: 0.25em; text-decoration-thickness: 0.08em; }