:root {
    /* Fonts */
    --font-family: "Roboto", sans-serif;

    /* Spaces */
    --space-gap: 1.875rem;

    /* Layout */
    --header-height: 4.5rem; /* fixed-top navbar height; used for body padding + scroll offset */

    /* Animations */
    --animation-offset: 3px;
    --animation-delay-1: 0.2s;
    --animation-delay-2: 0.4s;
    --animation-delay-3: 0.6s;
    --animation-delay-4: 0.8s;

    /* Colors */
    --white: white;
    --white-rgb: 255, 255, 255;
    --black: black;
    --black-rgb: 0, 0, 0;

    --page-bg: #F7F5F0;
    --footer-bg: #1A1A1A;

    --brand-400: #FDB022;
    --brand-400-rgb: 253, 176, 34;

    --brand-alt-400: #FFD113;
    --brand-alt-400-rgb: 255, 209, 19;

    --backdrop-filter: blur(0.75rem) saturate(180%);

    /* Bootstrap: default component sizes everywhere, only the corners are squared. */
    --bs-border-radius: 0;
    --bs-border-radius-sm: 0;
    --bs-border-radius-lg: 0;
    --bs-border-radius-xl: 0;
    --bs-border-radius-xxl: 0;
}