/* ============================================================ ARCHIVE — Brand Tokens Source: Archive Brand Guidelines 2023 (Proportion Design) Galaxy Black + Pearl White dominate · High Octane Orange accent Inter Tight (primary) · Libre Franklin (secondary) ============================================================ */ :root { /* --- Color: core --- */ --galaxy-black: #222123; --pearl-white: #EAEAEA; --octane-orange: #C7592C; /* --- Color: secondary (small doses) --- */ --heritage-blue: #97BFD3; --bone-beige: #C7BCA8; --desert-tan: #A57F60; /* --- Color: derived surfaces --- */ --black-raised: #2A292C; /* cards / panels on black */ --black-deep: #1A191B; /* footer, deepest band */ --pearl-raised: #F4F4F4; /* cards on pearl */ --line-on-black: rgba(234, 234, 234, 0.16); --line-on-pearl: rgba(34, 33, 35, 0.14); --text-on-black: var(--pearl-white); --text-on-black-soft: rgba(234, 234, 234, 0.72); --text-on-pearl: var(--galaxy-black); --text-on-pearl-soft: rgba(34, 33, 35, 0.74); /* --- Section accent system --- Each section of the site takes a secondary accent from the 2023 palette. Buttons/CTAs stay High Octane Orange everywhere (see main.css). --accent-fg darkens automatically on pearl bands for legibility. */ --accent: var(--octane-orange); --accent-fg: var(--accent); --accent-ink: color-mix(in srgb, var(--accent) 60%, var(--galaxy-black)); /* --- Type families --- */ --font-primary: 'Inter Tight', -apple-system, 'Helvetica Neue', Arial, sans-serif; --font-secondary: 'Libre Franklin', -apple-system, 'Helvetica Neue', Arial, sans-serif; /* --- Type scale (fluid) --- */ --fs-hero: clamp(2.75rem, 6.4vw, 5.5rem); /* ~44 → 88px H1 */ --fs-h2: clamp(2rem, 4.2vw, 3.5rem); /* ~32 → 56px band headlines */ --fs-h3: clamp(1.375rem, 2.2vw, 1.75rem); /* ~22 → 28px card titles */ --fs-lead: clamp(1.125rem, 1.6vw, 1.375rem); /* ~18 → 22px lead paragraphs */ --fs-body: 1.0625rem; /* 17px */ --fs-small: 0.875rem; /* 14px */ --fs-eyebrow: 0.8125rem; /* 13px uppercase labels */ /* --- Tracking (per guidelines: Inter Tight 25pt, Libre Franklin 50–90pt) --- */ --track-tight: 0.01em; --track-head: 0.02em; --track-eyebrow: 0.22em; --track-button: 0.14em; /* --- Space --- */ --space-band: clamp(4.5rem, 9vw, 8.5rem); /* vertical band padding */ --space-gutter: clamp(1.25rem, 4vw, 3rem); /* page side padding */ --content-max: 1320px; --text-max: 34em; /* --- Motion --- */ --ease-out: cubic-bezier(0.22, 1, 0.36, 1); --dur: 0.5s; } /* Section accents (set per page via ) */ html[data-accent="blue"] { --accent: var(--heritage-blue); } html[data-accent="beige"] { --accent: var(--bone-beige); } html[data-accent="tan"] { --accent: var(--desert-tan); } html[data-accent="mono"] { --accent: var(--pearl-white); }