/* ═══════════════════════════════════════════════════════════════════════════
   RITUAL ALCHEMY — SELF-HOSTED WEBFONTS
   ───────────────────────────────────────────────────────────────────────────
   All three brand faces now live here. Source Serif 4 and Syne came off
   fonts.googleapis.com on 8 Aug 2026: the Google <link> was a render-blocking
   stylesheet on a third-party origin, so a phone paid a DNS + TLS handshake to
   googleapis, parsed the CSS, and only THEN discovered the real font files on a
   second origin (gstatic) — all of it in front of the first paint. Self-hosted,
   they ride the connection the page already has.

   Regenerate the files with `python fetch-webfonts.py`, which documents every
   subsetting decision. Do NOT hand-download them from fonts.google.com — that
   ships the full character set at several times the size.

   ── BOTH ARE VARIABLE FONTS ────────────────────────────────────────────────
   One file each, carrying a whole weight range, declared below as a RANGE
   (`font-weight: 300 900`). Do not split them into per-weight faces: the single
   variable file beats any two static cuts, and Syne's one 33.8 KB file replaced
   four separate static weights.

   Source Serif keeps its opsz (optical size) axis, so headings still get the
   display cut and body copy the text cut. Pinning it would save ~100 KB but
   change how the big headings render — a typography decision, not a
   performance one.
   ═══════════════════════════════════════════════════════════════════════════ */

@font-face {
  font-family: 'Source Serif 4';
  src: url('SourceSerif4-Roman-latin.woff2') format('woff2');
  font-weight: 300 900;   /* variable range — the blog standfirsts sit at 300 */
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Source Serif 4';
  src: url('SourceSerif4-Italic-latin.woff2') format('woff2');
  font-weight: 300 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Syne';
  src: url('Syne-Variable-latin.woff2') format('woff2');
  font-weight: 400 800;   /* Syne has no cut below 400, and no italic */
  font-style: normal;
  font-display: swap;
}

/* ═══════════════════════════════════════════════════════════════════════════
   UNIVERS NEXT PRO (self-hosted)
   ───────────────────────────────────────────────────────────────────────────
   The brand sans, adopted 27 Jul 2026. It replaced BOTH retired Google faces
   in one move: Work Sans (buttons, nav, product UI, form fields, fine print)
   and DM Mono (the uppercase label layer — kickers, meta, ingredient callouts).
   Its figures are TABULAR by default, which is why the label layer survived
   losing DM Mono's monospacing.

   This is the only stylesheet the site does not inline, so a change here
   reaches every page at once. Do not inline these rules back into the pages.

   Shipped as eot/ttf/woff only; these woff2 files were converted from the TTFs
   with fontTools. Only the normal-width faces are installed — the Cond/Ext
   widths are unused.

   ── REGISTERED AT 400 AND 700 ONLY ─────────────────────────────────────────
   Univers has no 500 or 600 cut, so font-weight:500 and :600 resolve to Bold.
   The .btn / .nav-cta 600s therefore render heavier than Work Sans SemiBold
   did — intentional; retune by dropping those to 400, never by adding a face.

   The Thin cut is deliberately NOT registered. CSS font matching resolves a
   sub-400 request DOWNWARD first, so any element inheriting a sub-400 weight
   would land on Thin: the blog page still carries variable-font weights from
   the retired Work Sans (font-weight:340), and with Thin present that put 37
   nav links, eyebrows and inline emphasis into it. Bounded at 400, those fall
   to Regular instead. Keep it bounded.
   ═══════════════════════════════════════════════════════════════════════════ */

@font-face {
  font-family: 'Univers Next Pro';
  src: url('UniversNextPro-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Univers Next Pro';
  src: url('UniversNextPro-Italic.woff2') format('woff2');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Univers Next Pro';
  src: url('UniversNextPro-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Univers Next Pro';
  src: url('UniversNextPro-BoldItalic.woff2') format('woff2');
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}