:root{
--c-base-50:#FBFAF7;--c-base-100:#F7F6F2;--c-base-200:#EDEAE2;--c-base-300:#DFDACD;
--c-graphite-900:#14191B;--c-graphite-800:#1B2325;--c-graphite-700:#202426;--c-petrol-900:#132A2D;--c-petrol-800:#17383C;--c-petrol-700:#1E4448;--c-petrol-600:#2C5559;
--c-neutral-500:#7C8583;--c-neutral-400:#A3AAA8;--c-neutral-300:#C7CBC8;--c-neutral-200:#DDE0DD;
--c-orange-700:#B4501C;--c-orange-600:#D9662A;--c-orange-500:#E2762F;--c-orange-100:#FBE7D8;
--c-champagne-600:#A98F68;--c-champagne-400:#C9AD8C;--c-champagne-200:#EBE1D1;
--c-white:#FFFFFF;

--color-bg:var(--c-base-100);--color-surface:var(--c-white);--color-surface-sunken:var(--c-base-200);
--color-ink:var(--c-graphite-800);--color-ink-secondary:var(--c-neutral-500);--color-ink-inverse:var(--c-base-100);
--color-structural:var(--c-petrol-800);--color-structural-deep:var(--c-graphite-900);
--color-accent:var(--c-orange-600);--color-accent-hover:var(--c-orange-700);--color-accent-tint:var(--c-orange-100);
--color-champagne:var(--c-champagne-400);--color-champagne-tint:var(--c-champagne-200);
--color-border:color-mix(in srgb, var(--c-graphite-800) 12%, transparent);
--color-border-strong:color-mix(in srgb, var(--c-graphite-800) 24%, transparent);
--color-focus-ring:color-mix(in srgb, var(--c-orange-600) 45%, transparent);
}