/* ========================================================================== fonts.css - Self-hosted @font-face (GDPR/ZZPL compliant) NEVER load fonts.googleapis.com. Place WOFF2 files in ../fonts/. Subset: latin + latin-ext (must render č ć š ž đ Č Ć Š Ž Đ). Source: Bunny Fonts (bunny.net) or google-webfonts-helper (self-host WOFF2). Both fonts SIL OFL 1.1. HOW TO POPULATE (setup note - see design/README.md): 1. Download WOFF2 subsets: - Space Grotesk: weights 500, 600, 700 (latin, latin-ext) - Inter: weights 400, 500, 600 (latin, latin-ext) via https://gwfh.mranftl.com/fonts (google-webfonts-helper) or bunny.net. 2. Drop the .woff2 files into design/assets/fonts/ with the names below. 3. font-display: swap avoids invisible text; preload the two critical weights (Space Grotesk 700, Inter 400) in each HTML . NOTE: The @font-face rules below reference local WOFF2 files. Until the files are added, the stack falls back to system fonts (Segoe UI / system-ui) which ALSO render Serbian diacritics, so layout/contrast are unaffected in preview. ========================================================================== */ /* ---- Space Grotesk (headings) ---- */ @font-face { font-family: 'Space Grotesk'; font-style: normal; font-weight: 500; font-display: swap; src: url('../fonts/space-grotesk-latin-ext-500.woff2') format('woff2'), url('../fonts/space-grotesk-latin-500.woff2') format('woff2'); } @font-face { font-family: 'Space Grotesk'; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/space-grotesk-latin-ext-600.woff2') format('woff2'), url('../fonts/space-grotesk-latin-600.woff2') format('woff2'); } @font-face { font-family: 'Space Grotesk'; font-style: normal; font-weight: 700; font-display: swap; src: url('../fonts/space-grotesk-latin-ext-700.woff2') format('woff2'), url('../fonts/space-grotesk-latin-700.woff2') format('woff2'); } /* ---- Inter (body) ---- */ @font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/inter-latin-ext-400.woff2') format('woff2'), url('../fonts/inter-latin-400.woff2') format('woff2'); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: swap; src: url('../fonts/inter-latin-ext-500.woff2') format('woff2'), url('../fonts/inter-latin-500.woff2') format('woff2'); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/inter-latin-ext-600.woff2') format('woff2'), url('../fonts/inter-latin-600.woff2') format('woff2'); }