:root{
/* --- Base neutrals: warm-tinted, never pure grey --- */
--ink-900:#0B0B0B;   /* page black — hero, dark sections */
--ink-800:#161616;   /* raised dark surface */
--ink-700:#242424;   /* dark hairline / dark card */
--ink-500:#6E6E6E;   /* secondary text on light */
--ink-400:#9A9A9A;   /* de-emphasised headline text */
--ink-300:#C9C7C4;   /* hairline on light */
--ink-200:#E4E1DD;   /* subtle divider */
--ink-100:#F0EEEB;   /* section tint */
--paper:#F7F5F2;     /* warm off-white page */
--white:#FFFFFF;

/* --- Brand red: the single accent. Used at 100% or not at all. --- */
--red-600:#B21F17;   /* deep frame red / pressed */
--red-500:#E63329;   /* primary accent */
--red-400:#F1554A;   /* hover */
--red-100:#FBE3E1;   /* faint red wash, backgrounds only */

/* --- Support hues: only ever from imagery, never UI chrome --- */
--amber-500:#F5A300;
--mist-200:#DCE5E5;

/* --- Semantic aliases --- */
--surface-page:var(--paper);
--surface-card:var(--white);
--surface-inset:var(--ink-100);
--surface-dark:var(--ink-900);
--surface-dark-card:var(--ink-800);

--text-body:var(--ink-900);
--text-muted:var(--ink-500);
--text-faded:var(--ink-400);
--text-invert:var(--white);
--text-invert-muted:rgba(255,255,255,.62);
--text-accent:var(--red-500);

--border-hairline:var(--ink-200);
--border-strong:var(--ink-300);
--border-invert:rgba(255,255,255,.14);

--accent:var(--red-500);
--accent-hover:var(--red-400);
--accent-press:var(--red-600);
--focus-ring:var(--red-500);
}