:root {
    /* Colors */
    --color-bg: #f4f4f2;
    --color-text: #1a1a1a;
    --color-surface: #ffffff;
    --color-border: #e0e0e0;

    --color-accent: #cc3300;
    --color-accent-hover: #a32900;
    --color-secondary: #003366;

    --color-muted: #595959;
    --color-muted-bg: #e8e8e6;

    /* Typography */
    --font-display: 'Space Grotesk', sans-serif;
    --font-text: 'Chivo', sans-serif;

    --font-size-xs: 0.75rem;
    --font-size-sm: 0.875rem;
    --font-size-base: 1rem;
    --font-size-md: 1.125rem;
    --font-size-lg: 1.25rem;
    --font-size-xl: 1.5rem;
    --font-size-2xl: 2rem;
    --font-size-3xl: 2.5rem;
    --font-size-4xl: 3.5rem;
    --font-size-5xl: 5rem;

    --line-height-tight: 1.1;
    --line-height-base: 1.5;
    --line-height-loose: 1.75;

    /* Spacing */
    --space-xs: 0.5rem;
    --space-sm: 1rem;
    --space-md: 2rem;
    --space-lg: 4rem;
    --space-xl: 8rem;

    /* Layout */
    --max-width-content: 720px;
    --max-width-wide: 1200px;
    --max-width-full: 1440px;

    /* Borders */
    --border-thin: 1px solid var(--color-border);
    --border-thick: 4px solid var(--color-text);
}