/* assets/css/tokens.css */

:root {
    /* Colors - Broadcast Control Room Brutalism */
    --color-obsidian: #0D0E10;
    --color-signal-red: #E62A10;
    --color-signal-red-hover: #C51D08;
    --color-off-white: #F4F4F2;
    --color-slate-grey: #2A2D34;
    --color-light-grey: #E5E5E5;

    /* Typography */
    --font-display: 'Oswald', sans-serif;
    --font-body: 'Chivo', sans-serif;

    /* Spacing Base: 8px */
    --space-1: 0.5rem;   /* 8px */
    --space-2: 1rem;     /* 16px */
    --space-3: 1.5rem;   /* 24px */
    --space-4: 2rem;     /* 32px */
    --space-6: 3rem;     /* 48px */
    --space-8: 4rem;     /* 64px */
    --space-12: 6rem;    /* 96px */
    --space-16: 8rem;    /* 128px */

    /* Layout */
    --container-max: 1280px;
    --container-pad: var(--space-4);

    /* Borders & UI */
    --border-thin: 1px solid var(--color-slate-grey);
    --border-thick: 3px solid var(--color-obsidian);
    --border-red: 3px solid var(--color-signal-red);
}

@media (max-width: 768px) {
    :root {
        --container-pad: var(--space-2);
        --space-12: 4rem;
        --space-16: 6rem;
    }
}