/** * mea-blocks shared type layer: the self-hosted faces, and the wiring that * gets them onto the text. * * Plain CSS (not compiled by wp-scripts), printed ahead of every block * stylesheet from mea-blocks.php at `wp_head` priority 0 - the same slot and * for the same reason as foreground.css. Depends on tokens.css for * --mea-font-sans / --mea-font-mono. * * --------------------------------------------------------------------------- * 1. The faces * --------------------------------------------------------------------------- * Inter and Fira Code are self-hosted under assets/fonts/. Nothing here * reaches fonts.googleapis.com or fonts.gstatic.com at runtime: the parent * theme still loads Poppins from Google for its own (non-mea) pages, and that * is deliberately left alone. * * Weights are exactly the ones the design instantiates, no more - see * AGENTS.md for the per-weight evidence. Inter 300/400/500/600/700, * Fira Code 300/400/500. Every face carries `font-display: swap`. * * Fira Code 500 was missing until 2026-08-19 and the gap was silent: it is * what `mea/card-grid` asks for on its tile number (Fira Code Medium 36 on * node 2008:8242), and CSS weight matching answers a request for 500 with the * 400 face and no synthetic bolding, so the numbers simply rendered Regular * with nothing in the console to say so. A weight this layer does not carry is * not a fallback, it is a silent substitution - check a new weight against * `document.fonts` rather than against how it looks. * * Subsets are `latin` and `latin-ext` only. WPML runs 11 active languages on * this site and every one of them is Latin-script, so Cyrillic, Greek and * Vietnamese are excluded. The `unicode-range` split is Google's own, so the * browser pulls latin-ext only when a page actually contains a character * above U+00FF (Dutch `ij`, a Central-European name in an insight post). * * Built by tools/build-webfonts.sh from the upstream Google variable fonts, * instanced to each static weight and re-compressed - rerun that script to * rebuild or to add a weight. */ /* ---------------------------------- Inter --------------------------------- */ @font-face { font-family: "Inter"; font-style: normal; font-weight: 300; font-display: swap; src: url("../../assets/fonts/inter-latin-ext-300.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: "Inter"; font-style: normal; font-weight: 300; font-display: swap; src: url("../../assets/fonts/inter-latin-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; } @font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url("../../assets/fonts/inter-latin-ext-400.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url("../../assets/fonts/inter-latin-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; } @font-face { font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url("../../assets/fonts/inter-latin-ext-500.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url("../../assets/fonts/inter-latin-500.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; } @font-face { font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url("../../assets/fonts/inter-latin-ext-600.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url("../../assets/fonts/inter-latin-600.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; } @font-face { font-family: "Inter"; font-style: normal; font-weight: 700; font-display: swap; src: url("../../assets/fonts/inter-latin-ext-700.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: "Inter"; font-style: normal; font-weight: 700; font-display: swap; src: url("../../assets/fonts/inter-latin-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; } /* -------------------------------- Fira Code ------------------------------- */ @font-face { font-family: "Fira Code"; font-style: normal; font-weight: 300; font-display: swap; src: url("../../assets/fonts/fira-code-latin-ext-300.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: "Fira Code"; font-style: normal; font-weight: 300; font-display: swap; src: url("../../assets/fonts/fira-code-latin-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; } @font-face { font-family: "Fira Code"; font-style: normal; font-weight: 400; font-display: swap; src: url("../../assets/fonts/fira-code-latin-ext-400.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: "Fira Code"; font-style: normal; font-weight: 400; font-display: swap; src: url("../../assets/fonts/fira-code-latin-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; } @font-face { font-family: "Fira Code"; font-style: normal; font-weight: 500; font-display: swap; src: url("../../assets/fonts/fira-code-latin-ext-500.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: "Fira Code"; font-style: normal; font-weight: 500; font-display: swap; src: url("../../assets/fonts/fira-code-latin-500.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; } @font-face { font-family: "Fira Code"; font-style: normal; font-weight: 600; font-display: swap; src: url("../../assets/fonts/fira-code-latin-ext-600.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: "Fira Code"; font-style: normal; font-weight: 600; font-display: swap; src: url("../../assets/fonts/fira-code-latin-600.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; } /** * --------------------------------------------------------------------------- * 2. Getting the family onto the text * --------------------------------------------------------------------------- * The parent theme paints `body, button, p, blockquote, span, h1-h6 { * font-family: 'Poppins', sans-serif }` as bare element selectors. A bare * selector beats a family inherited from a block root, so setting * --mea-font-sans on the block root alone left every heading, paragraph and * span computing to `Poppins, sans-serif`. That is the same cascade trap * foreground.css documents for color, so it is fixed the same way and in the * same place - once, for every mea block - rather than per block. * * The specificity is deliberate and has to be exactly this: * - `[class*="wp-block-mea-"]` matches the wrapper class WordPress puts on * every mea block root and nothing the theme owns, so Poppins keeps * running everywhere else on the site. * - The element list sits behind `:where()`, so each rule scores (0,1,0): * above the theme's bare (0,0,1) selectors, level with a block's own * `.mea-*__thing` rule. This sheet is printed before every block * stylesheet, so a block rule of equal weight comes later in the cascade * and still wins - which is what keeps the Fira Code eyebrows mono. * - `inherit` rather than `var(--mea-font-sans)`, so a block that rebinds * the family on a wrapper (a mono panel, the footer legal line) has that * flow down to its children instead of being reset to sans at every node. * * Form controls do not inherit `font-family` from the UA stylesheet, so * button/input/select/textarea are listed explicitly - the theme already * forces Poppins onto `button`, and this is what takes it back. */ [class*="wp-block-mea-"] { font-family: var(--mea-font-sans); } [class*="wp-block-mea-"] :where(h1, h2, h3, h4, h5, h6, p, span, a, li, dt, dd, strong, em, b, i, small, blockquote, figcaption, label, legend, button, summary, details, time, address, cite, td, th, caption, input, select, textarea) { font-family: inherit; } /* `code`, `pre`, `kbd` and `samp` are the one group that must not follow the sans inherit above: they are monospace by role, so they resolve through the mono token instead. Same (0,1,0) weight, so a block can still override. */ [class*="wp-block-mea-"] :where(code, pre, kbd, samp) { font-family: var(--mea-font-mono); }