:root {
    /* Colors */
    --bg-color-main: #0b0b0b;
    --bg-color-alt: #141414;
    --bg-color-soft: #1c1c1c;
    --txt-main: #f5f5f5;
    --txt-muted: #b3b3b3;

    --brand-primary: #c4161c;
    --brand-secondary: #0b0b0b;
    /* Red */
    --brand-dark: #8f1014;
    --brand-highlight: #ff7a18;
    /* Orange accent */
    --stroke: #2a2a2a;

    /* Typography */
    --font-main: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

    /* Spacing scale */
    --s1: 4px;
    --s2: 8px;
    --s3: 12px;
    --s4: 16px;
    --s5: 24px;
    --s6: 32px;
    --s7: 48px;
    --s8: 64px;

    /* Radius */
    --r1: 4px;
    --r2: 8px;
    --r3: 14px;

    /* Shadows */
    --shadow-soft: 0 10px 30px rgba(0, 0, 0, .5);
    --shadow-hard: 0 0 0 1px var(--stroke);
}