:root {
        --color-bg-primary:     #0a0f1a;
    --color-bg-secondary:   #111827;
    --color-bg-tertiary:    #1a2332;
    --color-bg-card:        rgba(17, 24, 39, 0.7);

        --color-accent:         #00b4d8;
    --color-accent-light:   #48cae4;
    --color-accent-dark:    #0077b6;
    --color-accent-glow:    rgba(0, 180, 216, 0.3);

        --color-text-primary:   #f1f5f9;
    --color-text-secondary: #94a3b8;
    --color-text-muted:     #64748b;
    --color-text-accent:    var(--color-accent-light);

        --color-border:         rgba(148, 163, 184, 0.12);
    --color-border-hover:   rgba(0, 180, 216, 0.3);
    --color-glass:          rgba(10, 15, 26, 0.75);
    --color-glass-strong:   rgba(10, 15, 26, 0.92);

        --gradient-accent:      linear-gradient(135deg, var(--color-accent-dark), var(--color-accent));
    --gradient-hero:        linear-gradient(180deg, transparent 0%, var(--color-bg-primary) 100%);

        --font-primary:         'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-heading:         'Outfit', var(--font-primary);

    --fs-xs:   0.75rem;        --fs-sm:   0.875rem;       --fs-base: 1rem;           --fs-md:   1.125rem;       --fs-lg:   1.25rem;        --fs-xl:   1.5rem;         --fs-2xl:  2rem;           --fs-3xl:  2.5rem;         --fs-4xl:  3.5rem;     
    --fw-normal:   400;
    --fw-medium:   500;
    --fw-semibold: 600;
    --fw-bold:     700;

        --space-xs:   0.25rem;
    --space-sm:   0.5rem;
    --space-md:   1rem;
    --space-lg:   1.5rem;
    --space-xl:   2rem;
    --space-2xl:  3rem;
    --space-3xl:  4rem;
    --space-4xl:  6rem;

        --container-max:    1280px;
    --container-padding: var(--space-xl);
    --header-height:    80px;

        --radius-sm:  4px;
    --radius-md:  8px;
    --radius-lg:  12px;
    --radius-xl:  16px;
    --radius-full: 9999px;

        --transition-fast:   0.15s ease;
    --transition-base:   0.3s ease;
    --transition-slow:   0.5s ease;
    --transition-spring: 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);

        --shadow-sm:    0 1px 3px rgba(0, 0, 0, 0.3);
    --shadow-md:    0 4px 12px rgba(0, 0, 0, 0.4);
    --shadow-lg:    0 8px 30px rgba(0, 0, 0, 0.5);
    --shadow-glow:  0 0 20px var(--color-accent-glow);

        --z-header:   1000;
    --z-overlay:  900;
    --z-dropdown: 800;
}