/*
* ═══════════════════════════════════════════════════════════════════════
* SignalArc — Self-hosted fonts
* fonts.css
*
* This file replaces the three Google Fonts tags in every page.
* All font files are served from the /fonts/ directory on your own server.
*
* BENEFITS OF SELF-HOSTING
* • No third-party DNS lookup or connection (faster first render)
* • No data sent to Google servers (GDPR compliance, privacy)
* • Works offline and in air-gapped environments
* • Fonts cannot change without your knowledge
* • One fewer render-blocking external resource
*
* HOW TO DOWNLOAD THE FONT FILES
* See the section at the bottom of this file, or run download-fonts.sh
*
* FONT DIRECTORY STRUCTURE
* /fonts/
* roboto-slab/
* roboto-slab-variable.woff2 ← variable font, all weights
* lato/
* lato-300.woff2 ← light
* lato-300-italic.woff2 ← light italic
* lato-400.woff2 ← regular
* lato-400-italic.woff2 ← regular italic
* lato-700.woff2 ← bold
* lato-700-italic.woff2 ← bold italic
* lato-900.woff2 ← black
* jetbrains-mono/
* jetbrains-mono-variable.woff2 ← variable font, all weights
* jetbrains-mono-variable-italic.woff2
*
* LICENCES (all SIL Open Font Licence 1.1)
* Roboto Slab : https://fonts.google.com/specimen/Roboto+Slab
* Lato : https://www.latofonts.com/
* JetBrains Mono: https://github.com/JetBrains/JetBrainsMono
* Include the OFL licence file alongside any redistribution.
* ═══════════════════════════════════════════════════════════════════════
*/
/* ── Roboto Slab — Variable font ────────────────────────────────────────
*
* A single variable font file covers all weights (100–900).
* font-weight range: 100 900 (the browser interpolates intermediate values)
* Used for: all headings h1–h6
* Weights used in this design: 300, 400, 500, 600, 700
*
* The unicode-range descriptor limits the font to Latin characters,
* allowing fallback fonts to handle other scripts without loading
* this file unnecessarily.
* ──────────────────────────────────────────────────────────────────── */
@font-face {
font-family: 'Roboto Slab';
font-style: normal;
font-weight: 100 900; /* variable — covers full weight range */
font-display: swap; /* show fallback immediately; swap when loaded */
src: url('../fonts/roboto-slab/roboto-slab-variable.woff2')
format('woff2-variations'); /* variable font format descriptor */
unicode-range:
U+0000-00FF, /* Basic Latin + Latin-1 Supplement */
U+0131, /* ı — dotless i */
U+0152-0153, /* Œ œ */
U+02BB-02BC, /* ʻ ʼ (modifier letters) */
U+02C6, /* ˆ */
U+02DA, /* ˚ */
U+02DC, /* ˜ */
U+0304, /* ̄ (combining macron) */
U+0308, /* ̈ (combining diaeresis) */
U+0329, /* ̩ (combining vertical line below) */
U+2000-206F, /* General Punctuation */
U+20AC, /* € */
U+2122, /* ™ */
U+2191, /* ↑ */
U+2193, /* ↓ */
U+2212, /* − (minus sign) */
U+2215, /* ∕ (division slash) */
U+FEFF, /* BOM */
U+FFFD; /* replacement character */
}
/* ── Lato — Static files per weight ────────────────────────────────────
*
* Lato does not have an official variable font release.
* Each weight and style requires a separate @font-face declaration
* pointing to a separate file.
*
* Weights used in this design:
* 300 — light body text, lead paragraphs
* 300 italic — italic within light text
* 400 — normal body text (the most-used weight)
* 400 italic — within body text
* 700 — bold / strong, buttons, labels, headings
* 700 italic — italic within bold contexts
* 900 — black — heavy UI elements if needed
*
* font-display: swap ensures text is visible immediately using the
* fallback font (Helvetica Neue / Arial) while Lato loads.
* ──────────────────────────────────────────────────────────────────── */
/* Lato 300 — Light */
@font-face {
font-family: 'Lato';
font-style: normal;
font-weight: 300;
font-display: swap;
src: url('../fonts/lato/lato-300.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;
}
/* Lato 300 Italic — Light Italic */
@font-face {
font-family: 'Lato';
font-style: italic;
font-weight: 300;
font-display: swap;
src: url('../fonts/lato/lato-300-italic.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;
}
/* Lato 400 — Regular */
@font-face {
font-family: 'Lato';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('../fonts/lato/lato-400.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;
}
/* Lato 400 Italic — Regular Italic */
@font-face {
font-family: 'Lato';
font-style: italic;
font-weight: 400;
font-display: swap;
src: url('../fonts/lato/lato-400-italic.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;
}
/* Lato 700 — Bold */
@font-face {
font-family: 'Lato';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url('../fonts/lato/lato-700.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;
}
/* Lato 700 Italic — Bold Italic */
@font-face {
font-family: 'Lato';
font-style: italic;
font-weight: 700;
font-display: swap;
src: url('../fonts/lato/lato-700-italic.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;
}
/* Lato 900 — Black */
@font-face {
font-family: 'Lato';
font-style: normal;
font-weight: 900;
font-display: swap;
src: url('../fonts/lato/lato-900.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;
}
/* ── JetBrains Mono — Variable font ────────────────────────────────────
*
* Two variable files: one for upright, one for italic.
* font-weight range: 100 800
* Used for: code blocks, inline code, .tag elements
* Weights used in this design: 400, 500
* ──────────────────────────────────────────────────────────────────── */
/* JetBrains Mono — upright (normal) */
@font-face {
font-family: 'JetBrains Mono';
font-style: normal;
font-weight: 100 800;
font-display: swap;
src: url('../fonts/jetbrains-mono/jetbrains-mono-variable.woff2')
format('woff2-variations');
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;
}
/* JetBrains Mono — italic */
@font-face {
font-family: 'JetBrains Mono';
font-style: italic;
font-weight: 100 800;
font-display: swap;
src: url('../fonts/jetbrains-mono/jetbrains-mono-variable-italic.woff2')
format('woff2-variations');
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;
}
/*
* ═══════════════════════════════════════════════════════════════════════
* HOW TO DOWNLOAD THE FONT FILES
* ═══════════════════════════════════════════════════════════════════════
*
* Run download-fonts.sh from the project root, or follow these manual
* steps. All fonts are under the SIL Open Font Licence 1.1.
*
*
* OPTION A — Run the shell script (recommended)
* ─────────────────────────────────────────────
* chmod +x download-fonts.sh
* ./download-fonts.sh
*
*
* OPTION B — Google Webfonts Helper (browser, no command line)
* ────────────────────────────────────────────────────────────
* https://gwfh.mranftl.com/fonts/
*
* 1. Roboto Slab → https://gwfh.mranftl.com/fonts/roboto-slab
* • Select subset: latin
* • Select variants: 300, regular, 500, 600, 700
* • Choose "Modern Browsers" (woff2 only)
* • Click "Download files"
* • Rename: roboto-slab-v[n]-latin-[weight].woff2
* → roboto-slab-variable.woff2 (use the 400 file as a baseline,
* or use the variable download if available)
*
* NOTE: Google Webfonts Helper serves static files; for the variable
* font version of Roboto Slab, use the GitHub release directly
* (see Option C below).
*
* 2. Lato → https://gwfh.mranftl.com/fonts/lato
* • Select subset: latin
* • Select variants: 300, 300italic, regular, italic, 700, 700italic, 900
* • Choose "Modern Browsers" (woff2 only)
* • Click "Download files"
* • Rename to match the paths in this CSS file (e.g. lato-300.woff2)
*
* 3. JetBrains Mono → https://gwfh.mranftl.com/fonts/jetbrains-mono
* (or use the GitHub release — see Option C)
*
*
* OPTION C — Download directly from GitHub releases
* ──────────────────────────────────────────────────
* This gives you the variable font versions, which are smaller and
* more flexible than static files.
*
* Roboto Slab (variable):
* https://github.com/googlefonts/robotoslab/releases
* Download: RobotoSlab[wght].woff2
* Rename to: fonts/roboto-slab/roboto-slab-variable.woff2
*
* JetBrains Mono (variable):
* https://github.com/JetBrains/JetBrainsMono/releases
* Download: JetBrainsMono[wght].woff2 (upright)
* JetBrainsMono-Italic[wght].woff2 (italic)
* Rename to:
* fonts/jetbrains-mono/jetbrains-mono-variable.woff2
* fonts/jetbrains-mono/jetbrains-mono-variable-italic.woff2
*
* Lato (static — no variable version available):
* https://www.latofonts.com/download/
* Download the complete web font package (.zip)
* Extract and find the woff2 files for each weight
* Rename and place in fonts/lato/ as per the paths above
*
*
* FILE SIZES (approximate, latin subset)
* ───────────────────────────────────────
* roboto-slab-variable.woff2 ~70 KB (replaces 5 static files)
* lato-300.woff2 ~14 KB
* lato-300-italic.woff2 ~15 KB
* lato-400.woff2 ~14 KB
* lato-400-italic.woff2 ~15 KB
* lato-700.woff2 ~14 KB
* lato-700-italic.woff2 ~15 KB
* lato-900.woff2 ~14 KB
* jetbrains-mono-variable.woff2 ~55 KB (replaces 4 static files)
* jetbrains-mono-variable-italic.woff2 ~58 KB
* ─────────────────────────────────────────────
* Total ~284 KB
*
* By comparison, Google Fonts serves ~20 separate static woff2 files
* totalling ~300 KB, but requires 2 network round-trips to a third-party
* server before any font begins loading.
*
* ═══════════════════════════════════════════════════════════════════════
*/