:root {
    --color-primary: #102b3b;
    --color-primary-deep: #071c29;
    --color-primary-alt: #3c5d6c;
    --color-accent: #c53b2f;
    --color-accent-dark: #9d2a22;
    --color-highlight: #d9ad68;
    --color-surface: #f5f1e9;
    --color-surface-alt: #e7eceb;
    --color-white: #fff;
    --color-text: #17252d;
    --color-muted: #58666c;
    --color-border: #cbd4d3;
    --color-transparent: transparent;
    --color-header-glass: rgb(255 255 255 / 97%);
    --color-white-88: rgb(255 255 255 / 88%);
    --color-white-76: rgb(255 255 255 / 76%);
    --color-white-72: rgb(255 255 255 / 72%);
    --color-white-70: rgb(255 255 255 / 70%);
    --color-white-68: rgb(255 255 255 / 68%);
    --color-white-65: rgb(255 255 255 / 65%);
    --color-overlay-95: rgb(7 28 41 / 95%);
    --color-overlay-94: rgb(7 28 41 / 94%);
    --color-overlay-90: rgb(7 28 41 / 90%);
    --color-overlay-78: rgb(7 28 41 / 78%);
    --color-overlay-50: rgb(7 28 41 / 50%);
    --color-overlay-24: rgb(7 28 41 / 24%);
    --color-overlay-08: rgb(7 28 41 / 8%);

    --font-display: 'Source Serif 4', Georgia, serif;
    --font-heading: Manrope, Arial, sans-serif;
    --font-body: Manrope, Arial, sans-serif;

    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 1rem;
    --space-4: 1.5rem;
    --space-5: 2rem;
    --space-6: 3rem;
    --space-7: 4rem;
    --space-8: 6rem;
    --space-9: 8rem;

    --radius-sm: 0.15rem;
    --radius-md: 0.3rem;
    --radius-lg: 0.5rem;
    --shadow-sm: 0 0.4rem 1.5rem rgb(7 28 41 / 8%);
    --shadow-md: 0 1.5rem 4rem rgb(7 28 41 / 16%);
    --shadow-focus: 0 0 0 0.2rem rgb(60 93 108 / 24%);
    --container-wide: 82.5rem;
    --reading-width: 46rem;
    --transition: 220ms ease;
}