/* ========================================================================== taa-fonts.css — self-hosted webfonts for the public pages -------------------------------------------------------------------------- Linked from the landing page, privacy, terms, and the generated Chart Lab pages -- the public surfaces that do NOT load cambria-shared.css. HISTORY, because this file's reason for existing has changed. It was split out while cambria-shared.css was frozen ahead of a weekly publish. That freeze is over: cambria-shared.css now carries the same @font-face blocks, the tools read TAA Serif from it, and dated reports are self-contained because publish inlines their stylesheet. This file remains for pages that want the typography WITHOUT the design system -- which is exactly what an SEO page wants. Files live in /static/fonts/. Licences ship alongside them: OFL.txt SIL OFL 1.1 OFL-DM.txt SIL OFL 1.1 (DM Sans / DM Mono) NOTICE.md attribution + what was changed ========================================================================== */ /* --- Faces -------------------------------------------------------------- */ /* Financier — Klim Type Foundry, licensed 2 Sep 2026 (web, 5,000 MUU). NOT an open licence: these two files may be served from our own domains and nowhere else. Do not copy them into an SVG, an emailed asset or a third party's page -- that is a different licence from the one we hold. Two families rather than one with an optical-size axis, which is Klim's choice and the reason the Collection is sold as a pair: Financier has no opsz axis, so Display IS the large-size cut and Text IS the small one. Display carries wght 300-900, Text 400-900. x-height is 0.426 em against TAA Serif's 0.475, so Financier sets about 10% smaller at the same font-size. The type scale below compensates rather than leaving the hero looking shrunk. */ @font-face{ font-family:'Financier Display'; src:url('/static/fonts/financier-display-vf-roman.woff2') format('woff2-variations'); font-weight:300 900; font-style:normal; font-display:swap; } @font-face{ font-family:'Financier Display'; src:url('/static/fonts/financier-display-vf-italic.woff2') format('woff2-variations'); font-weight:300 900; font-style:italic; font-display:swap; } @font-face{ font-family:'Financier Text'; src:url('/static/fonts/financier-text-vf-roman.woff2') format('woff2-variations'); font-weight:400 900; font-style:normal; font-display:swap; } @font-face{ font-family:'Financier Text'; src:url('/static/fonts/financier-text-vf-italic.woff2') format('woff2-variations'); font-weight:400 900; font-style:italic; font-display:swap; } /* TAA Serif — variable. One file serves 400 through 700; declaring the range in font-weight is what makes that work. Derived from Source Serif 4. */ @font-face{ font-family:'TAA Serif'; src:url('/static/fonts/taa-serif-roman.woff2') format('woff2-variations'); font-weight:400 700; font-style:normal; font-display:swap; } @font-face{ font-family:'TAA Serif'; src:url('/static/fonts/taa-serif-italic.woff2') format('woff2-variations'); font-weight:400; font-style:italic; font-display:swap; } /* DM Sans — variable, weight axis 300-700. The file before this one was subset with the axis clipped to 300-500, and the comment here said that was "the 300-500 the site sets". The site sets 600 and 700 in a dozen places -- the macro gauge at 52px among them -- so every bold on every page was the 500 master with Chromium's synthetic smear over it. Same DM Sans 4.004, same 224 codepoints, same vertical metrics; only the axis is wider. 55KB, was 43KB. */ @font-face{ font-family:'DM Sans'; src:url('/static/fonts/dm-sans-vf.woff2') format('woff2-variations'); font-weight:300 700; font-style:normal; font-display:swap; } @font-face{ /* THE ITALIC IS A FILE, NOT A SLANT. Until 3 Sep 26 nothing declared one, so every in sans body copy -- and there are dozens, across the EF notes, the method blurbs and the holdings captions -- was Chromium shearing the roman by an oblique transform. That is not what DM Sans's italic looks like: the real one is a cursive design with a single-storey a and different g, e and f. The capture gate caught it as `italic 400 14px "DM Sans"` with no master, which is exactly what it is. Same 4.004, same latin subset, same opsz axis, wght clamped 300-700 to match the roman. */ font-family:'DM Sans'; src:url('/static/fonts/dm-sans-vf-italic.woff2') format('woff2-variations'); font-weight:300 700; font-style:italic; font-display:swap; } /* DM Mono — static; the family has no variable build. */ @font-face{ font-family:'DM Mono'; src:url('/static/fonts/dm-mono-400.woff2') format('woff2'); font-weight:400; font-style:normal; font-display:swap; } @font-face{ font-family:'DM Mono'; src:url('/static/fonts/dm-mono-500.woff2') format('woff2'); font-weight:500; font-style:normal; font-display:swap; } /* --- Metric-matched fallbacks ------------------------------------------- font-display:swap reflows the hero on first paint unless the fallback occupies the same space. size-adjust is derived from measured x-heights: TAA Serif 0.475 em against Georgia's 0.484; DM Sans 0.526 against Arial's 0.519. ascent/descent come from each font's own typo metrics. Starting values. To tune: screenshot with the webfont blocked, again with it loaded, and diff — nudge size-adjust until they overlay. */ @font-face{ font-family:'TAA Serif Fallback'; src:local('Georgia'), local('Times New Roman'), local('Liberation Serif'), local('DejaVu Serif'), local('Nimbus Roman'); size-adjust:98.1%; ascent-override:103.6%; descent-override:33.5%; line-gap-override:0%; } @font-face{ font-family:'DM Sans Fallback'; src:local('Arial'), local('Helvetica'), local('Liberation Sans'), local('DejaVu Sans'), local('Nimbus Sans'); size-adjust:101.4%; ascent-override:99.2%; descent-override:31%; line-gap-override:0%; } /* --- Figures ------------------------------------------------------------- TAA Serif's default figures are already lining AND tabular — every digit is the same width with no feature applied, so columns align for free. These rules make that explicit and, more importantly, opt prose back OUT: tabular figures inside a sentence read gappy. */ table, td, th, .trust-num, .metric, .stat, [data-num], .hero .meta{ font-variant-numeric: tabular-nums lining-nums; } p, .desc, .about p, .hero .sub, .legal-body{ font-variant-numeric: proportional-nums; } /* --- Optical sizing ------------------------------------------------------ TAA Serif and DM Sans both carry an opsz axis, so the browser picks the optical size from the rendered size: sturdier stems and looser spacing at 12px, higher contrast and tighter fit at 56px. auto is the CSS default; this is here so a reset elsewhere can't quietly turn it off. */ html{ font-optical-sizing:auto; }