50 lines
1.6 KiB
CSS
50 lines
1.6 KiB
CSS
/* ==========================================================================
|
||
Design tokens
|
||
--------------------------------------------------------------------------
|
||
Single source of truth for values previously hard-coded as literals across
|
||
the stylesheets (e.g. #2D738C ~98×, #101828 ~103×). New/refactored rules
|
||
should reference these instead of raw hex. Values match the existing
|
||
dominant usages, so introducing this file is visually neutral — migrating
|
||
older literals to var() can happen incrementally.
|
||
========================================================================== */
|
||
:root {
|
||
/* Brand — teal */
|
||
--teal: #2D738C;
|
||
--teal-600: #255E73; /* button hover */
|
||
--teal-800: #153C4E; /* deep accents */
|
||
|
||
/* Brand — orange (official: #FA7850, the single source of truth) */
|
||
--orange: #FA7850;
|
||
--orange-600: #E85D2A; /* darker shade — gradients & button hover */
|
||
--orange-text: #B4531A; /* AA-safe orange for text on white */
|
||
|
||
/* Brand — yellow (official) */
|
||
--yellow: #FFE16E;
|
||
|
||
/* Ink / text */
|
||
--ink: #101828;
|
||
--text: #344054;
|
||
--muted: #475467;
|
||
--muted-2: #667085; /* smallest muted text that still meets AA on white */
|
||
|
||
/* Surfaces / lines */
|
||
--bg: #F9FAFB;
|
||
--line: #EAECF0;
|
||
--line-2: #E4E7EC;
|
||
|
||
/* Radius scale */
|
||
--r-sm: 8px;
|
||
--r-md: 12px;
|
||
--r-lg: 16px;
|
||
--r-pill: 999px;
|
||
|
||
/* Type scale (available for future heading normalisation) */
|
||
--fs-h1: 60px;
|
||
--fs-h2: 36px;
|
||
--fs-h3: 22px;
|
||
--fs-body: 16px;
|
||
|
||
/* Section vertical rhythm */
|
||
--space-section: 112px;
|
||
}
|