/* ============================================================================= * osborn-tokens.css — SINGLE SOURCE OF TRUTH for Osborn Watch design tokens. * * HANDLE: osborn-platform-tokens * Registered in includes/assets.php and ENQUEUED GLOBALLY on wp_enqueue_scripts * (see enqueue_global_typography) so it loads on the homepage AND every Watch * route. It survives the watch-route chrome dequeue because the handle starts * with "osborn" (see dequeue_unused_chrome_for_watch). * * Owns: @font-face (self-hosted Fontsource woff2) + the :root design tokens. * osborn-watch.css (homepage) and watch-bgea.css (Watch surfaces) CONSUME these * via var() and must NOT redefine them — that is what previously let the two * pages drift. CSS custom properties resolve independent of stylesheet order, so * this file does not need to load before its consumers. * * Self-hosted fonts (full control, zero third-party CDN at runtime): * Inter Tight = BGEA brand sans (variable, full 100–900 weight axis). * Gelasio = open, metric-compatible replacement for Georgia (serif). * ========================================================================== */ @font-face { font-family: "Inter Tight"; font-style: normal; font-weight: 100 900; font-display: optional; src: url("/wp-content/plugins/osborn-platform/assets/fonts/inter-tight-latin-wght-normal.woff2") format("woff2"); } @font-face { font-family: "Gelasio"; font-style: normal; font-weight: 400; font-display: optional; src: url("/wp-content/plugins/osborn-platform/assets/fonts/gelasio-latin-400-normal.woff2") format("woff2"); } @font-face { font-family: "Gelasio"; font-style: normal; font-weight: 700; font-display: optional; src: url("/wp-content/plugins/osborn-platform/assets/fonts/gelasio-latin-700-normal.woff2") format("woff2"); } :root { --ink: #12212a; --navy: #0d3047; --green: #1f513e; --red: #b53a2f; --red-strong: #8f2c23; --gold: #c5963b; --gold-on-navy: #e8c074; /* AAA gold (7.98:1) for eyebrow text on navy */ --paper: #f7f7f3; --white: #ffffff; --soft: #e7ece7; --line: rgba(18, 33, 42, 0.16); --line-strong: rgba(18, 33, 42, 0.32); --line-on-navy: rgba(255, 255, 255, 0.2); --on-navy-body: rgba(255, 255, 255, 0.88); --on-navy-label: rgba(255, 255, 255, 0.78); --muted: #59676f; --shadow: 0 18px 42px rgba(18, 33, 42, 0.16); --shadow-deep: 0 26px 60px rgba(13, 48, 71, 0.34); --radius: 8px; --max: 1180px; --bgea-sans: "Inter Tight", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; --bgea-serif: "Gelasio", Georgia, "Times New Roman", serif; } /* Base body typography. The Nectar parent theme's dynamic-font CSS emits * `.nectar-font-body, body { font-family: Roboto }` and prints it AFTER our * stylesheet, so an equal-specificity `body` rule loses on the homepage/player * (only the gallery escaped, via its higher-specificity document class). The * `html body` selector (0,0,2) out-specifies Nectar's `body` (0,0,1) regardless * of load order, so the brand sans applies to body text on every surface. */ html body { font-family: var(--bgea-sans); /* Normalize fallback x-height to the web font so the swap doesn't shift text. */ font-size-adjust: from-font; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; } /* Nectar's dynamic-font CSS also paints `font-family: Roboto` (bare, no * fallback) onto `:root`, every `