:root {
    --abn-primary: #0678bd;
    --abn-primary-dark: #045d93;
    --abn-primary-deep: #003f66;
    --abn-turquoise: #00a0bb;
    --abn-green: #578d7d;
    --abn-green-dark: #35685a;
    --abn-gold: #daa650;
    --abn-ink: #11181d;
    --abn-ink-soft: #4d5c65;
    --abn-surface: #fdfefa;
    --abn-surface-soft: #f4f8fa;
    --abn-surface-blue: #edf7fc;
    --abn-surface-sand: #faf6ed;
    --abn-border: #d9e4e9;
    --abn-focus: #0678bd;
    --abn-shadow-sm: 0 10px 34px rgba(0, 63, 102, 0.08);
    --abn-shadow-md: 0 26px 70px rgba(0, 63, 102, 0.16);
    --abn-shadow-dark: 0 32px 90px rgba(0, 28, 46, 0.28);
    --abn-radius-sm: 12px;
    --abn-radius-md: 22px;
    --abn-radius-lg: 36px;
    --abn-container: 1440px;
    --abn-header-height: 112px;
    --abn-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --abn-ease-in-out: cubic-bezier(0.83, 0, 0.17, 1);
    --abn-transition: 280ms var(--abn-ease-out);
}

@supports (color: oklch(50% 0.1 240)) {
    :root {
        --abn-primary: oklch(55.351% 0.13789 245.123);
        --abn-primary-dark: oklch(47.25% 0.119 245.2);
        --abn-primary-deep: oklch(35.459% 0.0881 244.368);
        --abn-turquoise: oklch(64.978% 0.11501 215.375);
        --abn-green: oklch(60.077% 0.06289 173.301);
        --abn-green-dark: oklch(48.5% 0.059 172.8);
        --abn-gold: oklch(75.711% 0.11985 77.763);
        --abn-ink: oklch(20.429% 0.01451 239.49);
        --abn-ink-soft: oklch(46.539% 0.02364 234.354);
        --abn-surface: oklch(99.25% 0.006 95);
        --abn-surface-soft: oklch(97.667% 0.00504 228.817);
        --abn-surface-blue: oklch(97.01% 0.01256 228.923);
        --abn-surface-sand: oklch(97.3% 0.021 84);
        --abn-border: oklch(91.201% 0.01366 226.572);
    }
}