/* Vibe System: Hybrid Typography Foundations Controlled by the VibeSelector island [data-vibe] attribute on */ :root { /* 1. TYPOGRAPHY SYSTEM - GLOBAL TOKENS */ --font-editorial-humanist: 'Fraunces', serif; --font-ui-humanist: 'Manrope', sans-serif; --font-editorial-editorial: 'Instrument Serif', serif; --font-ui-editorial: 'Inter', sans-serif; /* 2. ACTIVE VIBE STATE (Controlled by [data-vibe]) */ --font-editorial: var(--font-editorial-humanist); --font-ui: var(--font-ui-humanist); } /* Vibe Selection Logic - High Specificity on HTML */ html[data-vibe="editorial"] { --font-editorial: var(--font-editorial-editorial); --font-ui: var(--font-ui-editorial); } html[data-vibe="humanist"] { --font-editorial: var(--font-editorial-humanist); --font-ui: var(--font-ui-humanist); } /* 3. VIBE-RESPONSIVE TYPOGRAPHY (The "No-Line" Strategy) */ h1, h2, h3, h4, h5, h6, .hero-heading, .big-heading, .audience-heading, .section-heading, .footer-heading, .sticky-heading { font-family: var(--font-editorial) !important; font-weight: 600 !important; letter-spacing: -0.015em !important; font-variant-ligatures: common-ligatures !important; } .hero-heading, .big-heading { line-height: 1.05 !important; } /* UI components use the UI font */ .nav-link, .nav-button, .primary-button, .secondary-button, .waitlist-button, .form-button { font-family: var(--font-ui) !important; font-weight: 500 !important; } .bento-card p, .hero-paragraph { font-family: var(--font-ui) !important; font-weight: 300; line-height: 1.5; } /* Hydration Layout Fixes */ #hero-section-sparkles div, #hero-section-sparkles canvas, #hero-glowy-waves div, #hero-glowy-waves canvas { height: 100% !important; width: 100% !important; }