/* ============================================================ tokens.css — design variables ONLY (see build brief §2) Never write raw hex or font-family names anywhere else; always reference these variables. ============================================================ */ /* Poppins — headings (bold) + subheadings (regular). Imported here so it loads on every page without editing each . */ @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap'); :root{ /* colour */ --ink: #0B0C10; /* primary dark background */ --bone: #F3EFE6; /* primary light background */ --cobalt: #2A46FF; /* tech accent — line work, tags, wireframe fills only */ --title-blue:#164d7c; /* the blue used in the hero title word */ --ember: #D8361F; /* craft accent — thread, grain, pigment, heat */ --steel: #54586A; /* secondary text, dividers, inactive states */ --graphite: #17181C; /* elevated surfaces on Ink */ /* type */ --font-display: 'Poppins', sans-serif; /* headings — bold weight */ --font-sub: 'Poppins', sans-serif; /* subheadings / deks — regular weight */ --font-editorial:'Fraunces', serif; /* narrative copy, pull quotes */ --font-body: 'Manrope', sans-serif; /* UI copy, long-form paragraphs */ --font-mono: 'Space Mono', monospace; /* metadata: year/medium/tools, nav, tags */ /* runtime */ --split: 50%; /* driven by the split-slider component */ }