/* ══════════════════════════════════════════════════════════════ Font override — Space Grotesk (variable, sans-serif) Replaces Gambetta (--font-body) with Space Grotesk. TO ENABLE: Add this line after tokens.css in any page : TO REVERT: Remove that line. No other files are changed. RULES: - Minimum weight: 500 (never below) - Letter spacing: 0 everywhere - No font smoothing overrides (use browser defaults) ══════════════════════════════════════════════════════════════ */ @font-face { font-family: 'Space Grotesk'; src: url('Fonts/SpaceGrotesk[wght].woff2') format('woff2-variations'); font-weight: 300 700; font-style: normal; font-display: swap; } :root { --font-body: 'Space Grotesk', sans-serif; } *, *::before, *::after { letter-spacing: 0 !important; } /* All-caps text needs more breathing room */ .next-project-label, #headline { letter-spacing: 0.05em !important; } .next-project-title { letter-spacing: 0 !important; text-transform: uppercase !important; } .project-title { letter-spacing: 0 !important; text-transform: uppercase !important; } .projects-page-title, .card-title { letter-spacing: 0 !important; text-transform: uppercase !important; } body { font-weight: 500; -webkit-font-smoothing: auto; -moz-osx-font-smoothing: auto; text-rendering: auto; } .project-editorial h3, .project-teaser h3 { font-family: 'Space Grotesk', sans-serif !important; font-weight: 600 !important; text-transform: none !important; letter-spacing: 0 !important; } .project-meta h4, .section-label, .about-hits h2 { font-family: 'Space Grotesk', sans-serif !important; font-weight: 500 !important; } /* Unified link hover: blue, no underline */ a { text-decoration: none !important; } a:not(.badge-item):not(.project-card):not(.next-project):hover { color: var(--color-link) !important; text-decoration: none !important; text-decoration-color: transparent !important; } /* Project-context links use their own accent color, not blue. Badge items, project cards, next-project links, and all links inside .project-view (case study editorial, meta, credits, etc.) inherit the project's accent color on hover. */ .badge-item:hover { color: var(--badge-hover, var(--badge-accent, var(--color-text))) !important; } .project-card:hover .card-title { color: var(--card-accent, var(--color-text)) !important; } .next-project:hover .next-project-title { color: var(--next-accent, var(--color-muted)) !important; } .project-editorial a:hover, .project-meta a:hover, .project-quote cite a:hover, .project-press a:hover, .project-credits a:hover { color: var(--color-accent, var(--color-link)) !important; text-decoration-color: var(--color-accent, var(--color-link)) !important; } .nav-pill a:hover { color: var(--color-text) !important; } /* Unified arrow on all text links */ a:not(.nav-brand):not(.nav-pill a):not(.case-footer-mark):not(.case-footer-social a):not(.next-project):not(.project-card):not(.badge-item):not(.skip-to-content):not(.email-link):not(.featured-link)::after { content: "\2197\FE0E"; font-size: 0.85em; line-height: 1; margin-left: 0.15em; display: inline; } /* Remove uppercase from subtitle, eyebrow/caption, copyright, cite */ #subtitle, .section-label, .case-media figcaption, .credits-closer, .case-footer-now-playing, .case-footer-copyright, .case-press cite, .case-press .press-list, .project-toggle, .project-meta h4, .project-credits .credits-closer, .about-hits h2, #now-playing, .skip-to-content, .featured-label { text-transform: none !important; }