:root{
--color-blue:#4589CB;
--color-cream:#F2EFDF;
--color-charcoal:#262723;
--color-white:#FFFFFF;
--color-olive:#6D8200;
--color-mustard:#BDAF38;
--color-soft-gold:#DED176;
--color-orange:#FF992F;
--color-red-orange:#FF3A0A;
--color-chartreuse:#B7AA4A;
--color-cheeky:#DB9F81;
--color-dandelion:#DACD78;
--color-grass-fed:#677600;
--color-peachy:#ECCB9B;
--color-sand:#BBB08A;
--color-sea-mist:#A4B0AF;
--color-sunkissed:#EF9B49;
--color-tomato:#FF4A00;
--surface-page:var(--color-cream);
--surface-card:var(--color-white);
--surface-inverse:var(--color-charcoal);
--surface-hero:var(--color-blue);
--text-primary:var(--color-charcoal);
--text-inverse:var(--color-cream);
--text-on-blue:var(--color-white);
--text-muted:color-mix(in oklch, var(--color-charcoal) 65%, transparent);
--border-default:color-mix(in oklch, var(--color-charcoal) 15%, transparent);
--border-strong:var(--color-charcoal);
--focus-ring:var(--color-blue);
--link:var(--color-blue);
--link-hover:color-mix(in oklch, var(--color-blue) 80%, black);
}