/* ==========================================================================
   fonts.css — SELF-HOSTED webfonts, replacing the three Google Fonts tags
   that App.razor used to emit:

     <link rel="preconnect" href="https://fonts.googleapis.com" />
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
     <link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800
                 &family=Space+Grotesk:wght@500;600;700&display=swap" rel="stylesheet" />

   Plan 03 s3.4 says self-host; s4 puts the app on a single strict origin. A static
   site must not hand every visitor's IP to a third party on first paint, and a CSP
   with a tight font-src/style-src cannot allowlist fonts.gstatic.com without
   weakening itself.

   theme.css asks for exactly two families:
     body     -> "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif
     headings -> "Space Grotesk", sans-serif

   Load this file BEFORE theme.css.

   --------------------------------------------------------------------------
   VENDORED 2026-08-13 — both families ship from ../fonts/, like Bootstrap Icons.

   Source: google-webfonts-helper (gwfh.mranftl.com), SIL OFL 1.1:
     Plus Jakarta Sans v12  400 500 600 700 800   ~22–23 KB per weight
     Space Grotesk     v22  500 600 700           ~26 KB per weight

   ONE file per weight, subsets latin + latin-ext + VIETNAMESE merged. The
   vietnamese subset is NOT optional — every heading on this site is Vietnamese
   and a latin-only face drops the diacritics to a fallback font mid-word.
   Merged rather than per-subset unicode-range files on purpose: a Vietnamese
   page pulls BOTH subsets anyway (the base letters live in latin), so splitting
   would double the request count for the primary audience to save bytes only
   for visitors who never see Vietnamese text — which this site does not have.

   local() stays FIRST in every src list: a visitor with the family installed
   pays zero bytes, and the vendored url() is the guarantee behind it.

   index.html preloads the two above-the-fold faces (Jakarta 400 + Grotesk 700);
   the other six load on demand during the multi-second WASM boot, which hides
   their latency completely. If a weight is ever added here, add it to
   theme.css's stack — NOT a <link> — and check the file lands in ../fonts/.
   ========================================================================== */

/* ---------- Plus Jakarta Sans (body) ---------- */

@font-face {
    font-family: "Plus Jakarta Sans";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local("Plus Jakarta Sans Regular"), local("PlusJakartaSans-Regular"),
         url("../fonts/plus-jakarta-sans-400.woff2") format("woff2");
}

@font-face {
    font-family: "Plus Jakarta Sans";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: local("Plus Jakarta Sans Medium"), local("PlusJakartaSans-Medium"),
         url("../fonts/plus-jakarta-sans-500.woff2") format("woff2");
}

@font-face {
    font-family: "Plus Jakarta Sans";
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: local("Plus Jakarta Sans SemiBold"), local("PlusJakartaSans-SemiBold"),
         url("../fonts/plus-jakarta-sans-600.woff2") format("woff2");
}

@font-face {
    font-family: "Plus Jakarta Sans";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: local("Plus Jakarta Sans Bold"), local("PlusJakartaSans-Bold"),
         url("../fonts/plus-jakarta-sans-700.woff2") format("woff2");
}

@font-face {
    font-family: "Plus Jakarta Sans";
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: local("Plus Jakarta Sans ExtraBold"), local("PlusJakartaSans-ExtraBold"),
         url("../fonts/plus-jakarta-sans-800.woff2") format("woff2");
}

/* ---------- Space Grotesk (headings, brand wordmark, pills) ---------- */

@font-face {
    font-family: "Space Grotesk";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: local("Space Grotesk Medium"), local("SpaceGrotesk-Medium"),
         url("../fonts/space-grotesk-500.woff2") format("woff2");
}

@font-face {
    font-family: "Space Grotesk";
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: local("Space Grotesk SemiBold"), local("SpaceGrotesk-SemiBold"),
         url("../fonts/space-grotesk-600.woff2") format("woff2");
}

@font-face {
    font-family: "Space Grotesk";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: local("Space Grotesk Bold"), local("SpaceGrotesk-Bold"),
         url("../fonts/space-grotesk-700.woff2") format("woff2");
}