/* Local Fonts */
@font-face {
    font-family: 'IBM Plex Sans';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url('../fonts/IBMPlexSans-VariableFont_wdth,wght.ttf') format('truetype');
}

@font-face {
    font-family: 'Space Grotesk';
    font-style: normal;
    font-weight: 500 700;
    font-display: swap;
    src: url('../fonts/SpaceGrotesk-VariableFont_wght.ttf') format('truetype');
}

:root {
    --color-bg: #0a0e1a;
    --color-surface: #141928;
    --color-surface-2: #1a2130;
    --color-text: #f0f2f5;
    --color-muted: #a8b0bd;
    --color-border: rgba(255, 255, 255, 0.08);

    --color-primary: #4f8fff;
    --color-primary-700: #3b7cf5;
    --color-primary-900: #2563eb;
    --color-accent: #22c55e;
    --color-accent-warm: #f59e0b;
    --color-danger: #ef4444;

    --font-sans: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
    --font-heading: 'Space Grotesk', 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;

    --radius-sm: 12px;
    --radius-md: 16px;
    --radius-lg: 24px;

    --shadow-1: 0 1px 3px rgba(0, 0, 0, 0.12);
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.15);
    --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.25);
    --shadow-lg: 0 16px 48px rgba(0, 0, 0, 0.35);
    --shadow-glow: 0 0 32px rgba(79, 143, 255, 0.15);

    --container: 1160px;

    --space-1: 6px;
    --space-2: 10px;
    --space-3: 14px;
    --space-4: 18px;
    --space-5: 24px;
    --space-6: 32px;
    --space-7: 56px;
    --space-8: 88px;

    --line-height: 1.65;

    --transition-base: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-smooth: 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}