/* --- DESIGN TOKENS --- */
:root {
    /* Brand Colors */
    --color-brand-primary: #00FFEE; /* Electric Cyan */
    --color-brand-secondary: #A051FF; /* Digital Violet */
    --color-brand-accent: #FF0055; /* Cyber Red */

    /* Surface Colors */
    --color-surface-deep: #06070B; /* Deep Void */
    --color-surface-elevated: #12141F; /* Card Background */
    --color-surface-glass: rgba(18, 20, 31, 0.75); /* Glass Effect */

    /* Text Colors */
    --color-text-main: #F4F6F9;
    --color-text-muted: #7A8499;
    --color-text-invert: #06070B;

    /* Spacing */
    --spacing-xs: 8px;
    --spacing-sm: 16px;
    --spacing-md: 24px;
    --spacing-lg: 32px;
    --spacing-xl: 64px;
    --spacing-xxl: 128px;

    /* Layout */
    --container-width: 1280px;
    --header-height: 80px;

    /* Borders & Radius */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 16px;
    --radius-pill: 9999px;
    --border-light: 1px solid rgba(255, 255, 255, 0.08);
    --border-glow: 1px solid rgba(0, 255, 238, 0.3);

    /* Effects */
    --shadow-glow: 0 0 20px rgba(0, 255, 238, 0.2);
    --shadow-card: 0 10px 30px rgba(0, 0, 0, 0.3);
    --backdrop-blur: blur(16px);
    --transition-fast: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-smooth: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
