*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
    --bg:        #0A0A0C;
    --bg-card:   #111115;
    --bg-card-h: #16161C;
    --red:       #C8102E;
    --red-hot:   #FF1A1A;
    --chrome:    #B8BEC7;
    --chrome-dim:#6E747D;
    --white:     #E8EAF0;
    --border:    rgba(200,16,46,0.25);
    --border-dim:rgba(184,190,199,0.08);
    --glow:      0 0 24px rgba(200,16,46,0.35);
    --glow-soft: 0 0 12px rgba(200,16,46,0.15);
    --font-d:    'Rajdhani', sans-serif;
    --font-b:    'Inter', sans-serif;
    --r:         4px;
}

html { scroll-behavior: smooth; }

body {
    background: var(--bg);
    color: var(--white);
    font-family: var(--font-b);
    font-size: 15px;
    line-height: 1.6;
    min-height: 100vh;
    overflow-x: hidden;
}

body::before {
    content: '';
    position: fixed; inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");
    pointer-events: none; z-index: 9999; opacity: .4;
}