:root {
    --bg-primary: #050505; --bg-secondary: #0a0a0a; --bg-glass: rgba(255, 255, 255, 0.03); --bg-glass-hover: rgba(255, 255, 255, 0.06);
    --text-primary: #ffffff; --text-secondary: #a1a1aa; --text-muted: #71717a;
    --accent-blue: #0070f3; --accent-purple: #7928ca;
    --border-light: rgba(255, 255, 255, 0.08);
    --font-sans: 'Inter', sans-serif;
    --transition-smooth: all 0.3s ease;
    --spacing-xl: 8rem;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: var(--font-sans); background: var(--bg-primary); color: var(--text-primary); line-height: 1.6; overflow-x: hidden; }
h1, h2, h3, h4 { font-weight: 700; line-height: 1.2; letter-spacing: -0.02em; }
.container { max-width: 1200px; margin: 0 auto; padding: 0 5%; }
.section { padding: var(--spacing-xl) 0; }
.text-center { text-align: center; } .text-gray { color: var(--text-secondary); }
.gradient-text { background: linear-gradient(90deg, var(--accent-blue), var(--accent-purple)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.grid { display: grid; gap: 2rem; } .grid-2 { grid-template-columns: repeat(2, 1fr); } .grid-3 { grid-template-columns: repeat(3, 1fr); } .grid-4 { grid-template-columns: repeat(4, 1fr); }
.flex-between { display: flex; justify-content: space-between; align-items: center; }
.mb-2 { margin-bottom: 1rem; } .mb-4 { margin-bottom: 2rem; }
.mt-4 { margin-top: 2rem; }