/* ───────────────────────────────────────────────────────────────── EponEdge — design tokens Deep navy + graphite surfaces, emerald primary, electric blue / cyan accents. Single source of truth for every other stylesheet. ─────────────────────────────────────────────────────────────── */ /* Fonts are loaded via in each page's (faster than @import — avoids a render-blocking CSS→CSS request chain). */ :root { /* ─── Brand ─── */ --primary: #10B981; /* emerald */ --primary-light: #34D399; --primary-dark: #059669; --primary-a8: rgba(16, 185, 129, 0.08); --primary-a16: rgba(16, 185, 129, 0.16); --blue: #3B82F6; /* electric blue */ --blue-a12: rgba(59, 130, 246, 0.12); --cyan: #22D3EE; /* cyan highlight */ --cyan-a12: rgba(34, 211, 238, 0.12); --grad-brand: linear-gradient(100deg, #34D399 0%, #22D3EE 55%, #3B82F6 110%); /* ─── Surfaces ─── */ --bg-body: #F4F6FA; /* cool off-white */ --bg-paper: #FFFFFF; --dark-body: #050B16; /* deep navy */ --dark-paper: #0A1425; /* navy panel */ --graphite: #101A2E; /* card surface on dark */ /* ─── Text ─── */ --text-primary: #131C2E; --text-secondary: rgba(19, 28, 46, 0.62); --text-on-dark: rgba(255, 255, 255, 0.94); --text-on-dark-soft: rgba(255, 255, 255, 0.78); --text-on-dark-muted: rgba(255, 255, 255, 0.52); --text-on-dark-faint: rgba(255, 255, 255, 0.35); /* ─── Lines ─── */ --line-on-light: rgba(19, 28, 46, 0.09); --line-on-dark: rgba(255, 255, 255, 0.09); /* ─── Shape ─── */ --radius: 14px; --radius-btn: 10px; /* ─── Effects ─── */ --shadow: 0 2px 10px 0 rgba(5, 11, 22, 0.22); --shadow-card: 0 2px 14px rgba(15, 26, 46, 0.08); --shadow-cta: 0 10px 28px -8px rgba(16, 185, 129, 0.55); /* ─── Typography ─── */ --font: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif; --font-display: 'Space Grotesk', 'Inter', -apple-system, sans-serif; /* ─── Layout ─── */ --nav-height: 68px; --nav-height-mobile: 60px; --content-max: 1180px; }