:root{
--koraal:#FF5A3C;
--koraal-hover:#E6392E;
--warm-rood:#E6392E;
--zacht-roze:#FFB6C1;
--warm-creme:#FFF1E3;
--wit:#FFFFFF;
--diep-navy:#0D1B2A;
--navy-90:#16273a;
--navy-60:#4a5a6b;
--navy-30:#a3adb6;

--color-bg-page:var(--warm-creme);
--color-bg-surface:var(--wit);
--color-bg-inverse:var(--diep-navy);
--color-bg-tint-roze:#FFE1E6;
--color-bg-tint-koraal:#FFE3DB;

--color-fg-primary:var(--diep-navy);
--color-fg-secondary:var(--navy-60);
--color-fg-on-koraal:var(--wit);
--color-fg-on-navy:var(--wit);
--color-fg-muted:var(--navy-30);

--color-accent:var(--koraal);
--color-accent-hover:var(--koraal-hover);
--color-accent-soft:var(--zacht-roze);

--color-border-subtle:#EBDFD0;
--color-border-strong:var(--diep-navy);
--color-focus-ring:var(--koraal);
}