/* static/css/fonts.css
   ---------------------------------------------------------------------------
   The product's two typefaces, self-hosted.

   Loaded FIRST in base.html, before app.css, so the browser starts fetching the
   font files while it is still parsing the rest of the stylesheets rather than
   after. It defines nothing but @font-face rules and the two custom properties
   that name them: no selector in this file styles anything.

   ---- Self-hosted, like everything else ----

   Both families are on Google Fonts, and both are NOT loaded from it. A
   <link> to fonts.googleapis.com is a CDN request on every page load, which
   this project does not do, and it is the one CDN request that also leaks
   which pages a signed-in regulator visits to a third party. The .woff2 files
   sit in static/vendor/fonts/ and are served by us.

   Licence: both are SIL Open Font License 1.1, which permits redistribution
   like this. The full texts are vendored beside the fonts (OFL-Fraunces.txt,
   OFL-HankenGrotesk.txt) because the OFL requires the licence to travel with
   the font, and a link to it would not.

   ---- Why latin-ext is not optional ----

   This product is bilingual, and Maltese needs Ġ ġ Ħ ħ Ċ ċ Ż ż: every one of
   which lives in Latin Extended-A (U+0100-017F), NOT in the `latin` subset.
   Shipping only `latin` would render a Maltese page with system-font fallback
   glyphs scattered mid-word: the exact ransom-note effect that makes a
   translated interface look broken. Both families therefore ship both subsets.

   The unicode-range on each face is what keeps that cheap: an English session
   never downloads the latin-ext files at all, because no character on the page
   falls in their range.

   ---- Variable fonts ----

   One file per subset covers the whole weight range, so there is no separate
   request for bold. font-weight on each face is a RANGE, which is what tells
   the browser it may interpolate rather than synthesise a fake bold.
   --------------------------------------------------------------------------- */

/* ---- Hanken Grotesk: body ------------------------------------------------
   Weight axis 300-800, which covers every weight the app uses (the interface
   leans on 650/700/750/800 heavily). */
@font-face {
  font-family: "Hanken Grotesk";
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url("../vendor/fonts/hanken-grotesk-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: "Hanken Grotesk";
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url("../vendor/fonts/hanken-grotesk-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;
}

/* ---- Fraunces: headings --------------------------------------------------
   Weight axis 400-800. It also carries an OPTICAL SIZE axis (opsz 9-144), which
   is why headings do not need per-size tuning: the browser applies it from the
   rendered font-size automatically under the default `font-optical-sizing:
   auto`, so a 40px page title gets the high-contrast display cut and a 14px
   card heading gets the sturdier text cut, from one file. */
@font-face {
  font-family: "Fraunces";
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("../vendor/fonts/fraunces-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: "Fraunces";
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("../vendor/fonts/fraunces-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;
}

/* ---- The two names the rest of the app uses ------------------------------
   Everything else refers to these, never to a family name directly, so
   changing a typeface is one edit here rather than a grep across ten
   stylesheets. The fallbacks matter: font-display:swap means the stack's next
   entry is what a reader sees for the first few hundred milliseconds, and on a
   cold cache it is also what they see if the font request fails. */
:root {
  --font-body: "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-head: "Fraunces", Georgia, serif;
}