@import url("https://fonts.googleapis.com/css2?family=Crimson+Pro:ital,wght@0,400;0,500;0,600;1,400&display=swap"); /* Crimson Pro is imported here rather than linked per page, because it now backs --font-display. Every page that wants the variable gets the face with it: the timeline had the variable and not the face once already, and silently rendered in the browser's default serif. */ /* Myles Media brand typography. * * Brandon Grotesque primary. UI, body, most headings. Adobe Fonts * BodoniFLF retired as --font-display 2026-09-17. self-hosted * Crimson Pro display and review text. Google Fonts * Thistails Script Demo accent only. Short display phrases. self-hosted * * None of these are West + Main brand faces; W+M work follows the W+M * guidelines. These are Myles Media / Evolve. * * BRANDON GROTESQUE is served by Adobe Fonts, so the kit stylesheet has to be * linked in the page — it is not imported here: * * * * NO DOMAIN ALLOWLIST. An earlier note here said Adobe kits are * domain-restricted and would silently fall back on an unlisted host. That was * checked on 2026-09-16 and is not true of this kit: the project offers no * domains field, and the font files return 200 for any referrer, a matching * one, an unrelated one and none at all. Nothing needs adding before a new * host serves this page. * * What IS true: the licence rides on the Adobe subscription this kit belongs * to. If that lapses, the kit stops serving and every page falls back to Jost. * The stack below names both the Adobe family ("brandon-grotesque") and the * desktop family ("Brandon Grotesque"), so an installed local copy works even * where the kit does not. */ /* ---- BodoniFLF ------------------------------------------------------- */ @font-face { font-family: "BodoniFLF"; src: local("Bodoni FLF"), url("../fonts/BodoniFLF-Roman.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; } @font-face { font-family: "BodoniFLF"; src: local("Bodoni FLF Bold"), url("../fonts/BodoniFLF-Bold.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; } @font-face { font-family: "BodoniFLF"; src: local("Bodoni FLF Italic"), url("../fonts/BodoniFLF-Italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; } @font-face { font-family: "BodoniFLF"; src: local("Bodoni FLF Bold Italic"), url("../fonts/BodoniFLF-BoldItalic.woff2") format("woff2"); font-weight: 700; font-style: italic; font-display: swap; } /* ---- Thistails ------------------------------------------------------- */ /* NEVER SET THIS FACE IN BOLD. Only a Regular exists, so asking for bold makes the browser synthesise one, which thickens the thin connecting strokes a script depends on and wrecks the letterforms. Use the .brand-script class below, which turns font synthesis off so a stray bold cannot render even if something asks for it. Demo cut: A-Z and a-z are complete, but digits 2, 5 and 7 are absent along with most punctuation — no apostrophe, quotes, hyphen, dash, colon, question mark, parentheses or ampersand — and there are no accented characters. Safe for a letters-and-spaces display phrase. Nothing else. */ @font-face { font-family: "Thistails Script"; src: local("Thistails Script Demo"), url("../fonts/ThistailsScriptDemo.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; } @font-face { font-family: "Thistails Sans"; src: local("Thistails Sans Demo"), url("../fonts/ThistailsSansDemo.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; } /* ---- Tokens ---------------------------------------------------------- */ :root { /* Primary. Everything that is not a display moment or an accent. Jost is the fallback: a free geometric sans in the same Futura lineage, so proportions hold if the Adobe kit does not load. */ --font-brand: "brandon-grotesque", "Brandon Grotesque", "Jost", "Avenir Next", Futura, "Century Gothic", sans-serif; /* Display. Crimson Pro since 2026-09-17, at the owner's direction, replacing BodoniFLF everywhere rather than only on the client review. The reasoning was already measured on the review card and applies wherever the display face is set small: BodoniFLF is a Didone, its x-height is 58% of its cap against Crimson's 73%, and at 12px only 29% of its ink renders solid against Crimson's 42% — the rest dissolves into antialiasing. Crimson also sets about 1% narrower, so nothing has to shrink to buy the legibility. The BodoniFLF @font-face blocks above are left declared and are now unused. A face nothing references is never fetched, so they cost nothing, and they are the brand's own files rather than something to delete on a font swap. */ --font-display: "Crimson Pro", "Crimson Text", Georgia, "Times New Roman", serif; /* Accent. Short letters-only phrases on marketing creative. Never UI, never body, never anything with punctuation or a number. */ --font-script: "Thistails Script", "Sacramento", cursive; /* Utility, not a brand face: MLS numbers, timestamps, IDs. */ --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace; } /* Use this class for anything set in Thistails rather than reaching for --font-script directly. It pins the one weight that exists and disables synthesis, so neither a bold nor a faux italic can be manufactured. The same guard covers the Sacramento fallback, which is also single-weight. */ .brand-script { font-family: var(--font-script); font-weight: 400; font-style: normal; font-synthesis: none; -webkit-font-synthesis: none; }