:root {
    /* Primary Colors */
    --uv-purple: #3D0075;
    --uv-purple-light: #5A00AB;
    --uv-purple-dark: #250046;
    --cyber-yellow: #CCFF00;
    --cyber-yellow-80: rgba(204, 255, 0, 0.8);
    --cyber-yellow-50: rgba(204, 255, 0, 0.5);
    --cyber-yellow-20: rgba(204, 255, 0, 0.2);
    --neon-pink: #FF00CC;
    --neon-pink-glow: rgba(255, 0, 204, 0.4);
    --cyber-blue: #00F0FF;
    --cyber-blue-glow: rgba(0, 240, 255, 0.4);

    /* Neutral / Utility */
    --deep-black: #050505;
    --matrix-gray: #1a1a1a;
    --glass-bg: rgba(0, 20, 60, 0.4);
    --glass-border: rgba(255, 255, 255, 0.15);

    /* Spacing & Motion */
    --spacing-xs: 0.5rem;
    --spacing-sm: 1rem;
    --spacing-md: 2rem;
    --spacing-lg: 4rem;
    --transition-fast: 0.2s cubic-bezier(0.23, 1, 0.32, 1);
}

@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&family=Space+Mono:wght@400;700&family=Space+Grotesk:wght@300;700&display=swap');

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    padding: 0;
    background-color: var(--deep-black);
    color: #ffffff;
    font-family: 'Space Grotesk', sans-serif;
    overflow-x: hidden;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3 {
    font-family: 'Archivo Black', sans-serif;
    text-transform: uppercase;
    letter-spacing: -0.05em;
    margin: 0;
}

.mono {
    font-family: 'Space Mono', monospace;
}