:root {
    --font-sans: 'Inter', ui-sans-serif, system-ui, sans-serif;

    --color-primary: #03286a;
    --color-primary-hover: #021f53;
    --color-primary-light: #e7eef8;
    --color-primary-muted: #6b8fc4;

    --color-midnight: #010b1e;
    --color-navy: #02163a;
    --color-navy-soft: #0a2d5c;

    --color-gold: #c2a037;
    --color-emerald: #039855;
    --color-emerald-wash: #ecfdf3;
    --color-amber: #dc6803;
    --color-amber-wash: #fffaeb;

    --color-bg: #f7f8fa;
    --color-surface: #ffffff;
    --color-surface-elevated: #ffffff;
    --color-text: #111827;
    --color-text-muted: #526277;
    --color-text-subtle: #667085;
    --color-text-inverse: #f2f4f7;
    --color-border: #e4e7ec;
    --color-border-strong: #d0d5dd;

    --gradient-hero: linear-gradient(135deg, #010b1e 0%, #02163a 45%, #03286a 100%);
    --gradient-accent: linear-gradient(135deg, rgba(3, 40, 106, 0.15) 0%, rgba(194, 160, 55, 0.08) 100%);

    /* Progression / “Pacer” motif — controlled advancement along the client lifecycle */
    --progress-track: rgb(2 22 58 / 0.1);
    --progress-path: linear-gradient(
        90deg,
        rgb(194 160 55 / 0.35) 0%,
        rgb(3 40 106 / 0.55) 48%,
        rgb(194 160 55 / 0.65) 100%
    );
    --progress-path-soft: linear-gradient(
        90deg,
        rgb(194 160 55 / 0.18) 0%,
        rgb(3 40 106 / 0.28) 50%,
        rgb(194 160 55 / 0.22) 100%
    );
    --progress-path-on-dark: linear-gradient(
        90deg,
        rgb(194 160 55 / 0.55) 0%,
        rgb(255 255 255 / 0.22) 45%,
        rgb(194 160 55 / 0.45) 100%
    );
    --progress-node: var(--color-gold);
    --progress-node-ring: rgb(194 160 55 / 0.2);
    --progress-node-active: var(--color-primary);
    --progress-motion: 700ms cubic-bezier(0.22, 1, 0.36, 1);

    --radius-sm: 6px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 16px;

    --shadow-sm: 0 1px 2px rgb(2 22 58 / 0.05);
    --shadow-md: 0 8px 24px rgb(2 22 58 / 0.08);
    --shadow-lg: 0 16px 40px rgb(2 22 58 / 0.12);
    --shadow-xl: 0 24px 56px rgb(2 22 58 / 0.16);

    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.25rem;
    --space-6: 1.5rem;
    --space-8: 2rem;
    --space-10: 2.5rem;
    --space-12: 3rem;
    --space-16: 4rem;
    --space-20: 5rem;
    --space-24: 6rem;

    --text-xs: 0.875rem;
    --text-sm: 0.9375rem;
    --text-base: 1rem;
    --text-md: 1.0625rem;
    --text-lg: 1.125rem;
    --text-xl: 1.25rem;
    --text-2xl: clamp(1.75rem, 3vw, 2.25rem);
    --text-3xl: clamp(2.25rem, 5vw, 3.25rem);

    --header-height: 4.5rem; /* 72px — aligned with spacious marketing headers */
    --container-max: 75rem;
    --content-max: 42rem;
    --doc-sidebar-width: 16rem;

    --transition-fast: 150ms ease;
    --transition-base: 250ms ease;
    --transition-slow: 400ms ease;
}

@media (prefers-reduced-motion: reduce) {
    :root {
        --transition-fast: 0ms;
        --transition-base: 0ms;
        --transition-slow: 0ms;
        --progress-motion: 0ms;
    }
}