/*!
 * =============================================================================
 * GPS HEADER
 * =============================================================================
 * PURPOSE      : Alle zelf-gehoste webfonts van Sportlist op één plek:
 *                Montserrat (merkletter) en een gesubsette Material Icons.
 *                Vervangt de twee Google-Fonts-requests; sindsdien heeft de
 *                site geen enkele externe font-origin meer, dus ook geen extra
 *                DNS + TLS naar fonts.googleapis.com én fonts.gstatic.com.
 *
 * PATH         : wp-content/themes/sportlist/css/fonts.css
 *
 * DEPENDENCIES : fonts/montserrat-latin.woff2, fonts/montserrat-latin-ext.woff2,
 *                fonts/material-icons-subset.woff2 (alle in dit thema).
 *                Wordt site-wide geladen vóór tokens.css/style.css, die
 *                var(--font-sans) → 'Montserrat' zetten.
 *
 * =============================================================================
 * WAAROM ZELF-GEHOST
 * =============================================================================
 * Material Icons (2026-08-14): Google leverde de VOLLEDIGE icoon-font van
 * 128,6 KB voor de ~132 glyphs die dit project gebruikt. Subset = 8,8 KB (-93%).
 *
 * Montserrat (2026-08-15): niet om het gewicht (37 KB) maar om de LAYOUT-SHIFT.
 * Zolang de font van Google kwam, schilderde de browser de hero eerst in Arial
 * en herpositioneerde de tekst zodra Montserrat binnen was. Dat kostte 0,015
 * CLS op de homepage. Grappig genoeg werd dat pas zichtbaar toen de site sneller
 * werd: daarvóór was de eerste paint zó laat dat de font er al was. Zelfde
 * origin + preload = de font is er vóór de eerste paint, dus geen swap meer.
 *
 * =============================================================================
 * REGENEREREN VAN DE ICOON-SUBSET
 * =============================================================================
 * Nieuw icoon in gebruik genomen? Dan zit die glyph nog niet in de subset en
 * blijft het vakje leeg. Opnieuw genereren:
 *
 *   1. grep -rhoE 'material-icons[^"]*"[^>]*>[a-z0-9_]+' . | sed 's/.*>//' | sort -u
 *   2. curl -s "https://fonts.googleapis.com/icon?family=Material+Icons"   # → woff2-URL
 *   3. python3 -m fontTools.subset <bron>.woff2 --output-file=material-icons-subset.woff2 \
 *        --flavor=woff2 --glyphs="<lig-glyphs+letters>" \
 *        --layout-features+=liga,clig,dlig --no-layout-closure --no-hinting
 *
 * ⚠️ `--text="icon_names…"` LIJKT te werken maar geeft 117 KB i.p.v. 8,8 KB:
 *    alle icoonnamen bestaan uit dezelfde 26 letters, dus de ligature-closure
 *    trekt vrijwel de hele font weer naar binnen. Subset op de ligature-
 *    DOELglyphs + de letterglyphs, mét --no-layout-closure.
 *
 * =============================================================================
 * SECTIONOVERZICHT
 * =============================================================================
 *   1. MONTSERRAT (variabel, 100–900)
 *   2. MATERIAL ICONS
 *   3. ICON-BASECLASS
 *
 * @package Sportlist
 */

/* ============================================================
   1. MONTSERRAT
   Eén variabel bestand per subset dekt de hele gewichtsas, dus
   400 én 700 komen uit dezelfde download (zo levert Google 'm
   ook). De unicode-ranges zijn 1-op-1 van Google overgenomen:
   latin-ext wordt daardoor alléén opgehaald als er echt een
   teken buiten Latin-1 op de pagina staat (accenten in
   buitenlandse sportschoolnamen) — voor een normale NL-pagina
   blijft het bij de 35 KB van `latin`.
   ============================================================ */

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/montserrat-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: 'Montserrat';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/montserrat-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;
}

/* ============================================================
   2. MATERIAL ICONS
   ============================================================ */

@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/material-icons-subset.woff2') format('woff2');
  /* WHY `block` en niet `swap`: bij een ICOON-font betekent swap dat de browser
     eerst de LIGATUURTEKST toont — letterlijk het woord "filter_list" of "map" —
     en dat pas vervangt zodra de font binnen is. Dat verschoof de layout: op
     /sportscholen/ was het op 2026-08-14 de enige bron van een CLS van 0,137.
     `block` houdt de glyph onzichtbaar tot de font er is; met 8,8 KB op de eigen
     origin en een preload in de <head> is dat venster verwaarloosbaar. */
  font-display: block;
}

/* ============================================================
   3. ICON-BASECLASS
   Overgenomen uit de CSS die Google zelf serveerde, zodat de
   bestaande markup (<i class="material-icons">naam</i>) in 52
   bestanden ongewijzigd blijft werken.
   ============================================================ */

.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}