/* ===========================================================================
   Brand webfonts — Outfit + DM Sans
   ---------------------------------------------------------------------------
   Replaces the Open Sans faces that css/fonts.css used to inject. Two families,
   split by role:

     Outfit    headings and display text   500 600 700 800
     DM Sans   body text and UI            400 500 600 (+ 400 italic)

   Do not name these families directly in new CSS. Use the tokens in
   tokens.css instead:  var(--lg-font)  /  var(--lg-font-heading).

   PATHS are root-absolute (/fonts/…), matching the "vocabularytrainer" face in
   a.css. routing/.htaccess makes the active tree — public/ or beta/ — the
   document root, so /fonts/ resolves inside whichever tree served the page and
   this file needs no edit when it is copied between them.

   FORMAT is TrueType, because that is what Google Fonts ships in the download
   zip and no conversion tooling is installed here. woff2 would cut each face
   from ~55 KB to ~20 KB; see the note at the bottom of this file.

   font-display:swap on every face: text paints immediately in the fallback and
   re-renders when the webfont lands. The previous Open Sans setup was async +
   localStorage, so the site already accepted a flash of fallback text — this is
   the same trade made declaratively, without the cache-key problem.

   Static instances rather than the variable fonts, on purpose. Outfit's
   variable file would be smaller than its four statics (110 KB vs 221 KB), but
   DM Sans ships an optical-size axis that makes its variable file larger than
   the statics it replaces (239 KB vs 169 KB), and one family loading a variable
   font while the other loads statics is a trap for whoever edits this next.
   Browsers fetch only the faces a page actually uses, so a typical page pulls
   two files, not seven.

   LICENCE: both families are SIL OFL 1.1. Full text is kept next to the fonts
   as fonts/Outfit-OFL.txt and fonts/DMSans-OFL.txt — these must stay with the
   font files if they are ever moved.
   =========================================================================== */

/* --- Outfit — headings and display ------------------------------------- */

@font-face {
	font-family: "Outfit";
	src: url("../fonts/Outfit-Medium.ttf") format("truetype");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Outfit";
	src: url("../fonts/Outfit-SemiBold.ttf") format("truetype");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Outfit";
	src: url("../fonts/Outfit-Bold.ttf") format("truetype");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Outfit";
	src: url("../fonts/Outfit-ExtraBold.ttf") format("truetype");
	font-weight: 800;
	font-style: normal;
	font-display: swap;
}

/* --- DM Sans — body and UI ---------------------------------------------- */

@font-face {
	font-family: "DM Sans";
	src: url("../fonts/DMSans-Regular.ttf") format("truetype");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "DM Sans";
	src: url("../fonts/DMSans-Medium.ttf") format("truetype");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "DM Sans";
	src: url("../fonts/DMSans-SemiBold.ttf") format("truetype");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

/* Open Sans was served without an italic face, so every <em> on the site is
   currently a synthesised oblique. Example sentences in the reading and
   grammar exercises lean on <em> heavily, so the real italic is worth its
   61 KB. Only the 400 is here; DMSans-MediumItalic and DMSans-SemiBoldItalic
   are in fonts/DM_Sans/static/ if a bold italic is ever needed. */
@font-face {
	font-family: "DM Sans";
	src: url("../fonts/DMSans-Italic.ttf") format("truetype");
	font-weight: 400;
	font-style: italic;
	font-display: swap;
}

/* ---------------------------------------------------------------------------
   FOLLOW-UP: convert to woff2

   Each .ttf above is ~55 KB and compresses to ~20 KB as woff2 — roughly a
   third of the bytes, for a format every browser in use supports. Once
   fonttools is available:

       pip install fonttools brotli
       cd beta/fonts
       for f in Outfit-*.ttf DMSans-*.ttf; do
           fonttools ttLib.woff2 compress "$f"
       done

   then add the woff2 ahead of the ttf in each src, so old clients still work:

       src: url("../fonts/Outfit-Medium.woff2") format("woff2"),
            url("../fonts/Outfit-Medium.ttf") format("truetype");

   Subsetting to latin + latin-ext would cut them further, but check the
   Cyrillic and Greek pages first — lingua.com serves more than latin.
   --------------------------------------------------------------------------- */