/* ============================================
   PRS SPARTAN - BASE STYLES
   Variables, Reset, Helpers
   ============================================ */

/* ============================================
   CSS VARIABLES — SPARTAN LOGO PALETTE
============================================ */
:root {
    /* Spartan Logo Colors */
    --navy:        #090D16;
    --navy-mid:    #0F172A;
    --blue-vivid:  #2563EB;
    --crimson:     #FF2A00;
    --crimson-alt: #D90429;
    --gold:        #FFB703;
    --amber:       #F59E0B;
    --gold-bright: #FDE047;

    /* Surface & text */
    --bg:          #F8FAFC;
    --surface:     #FFFFFF;
    --surface2:    #F1F5F9;
    --border:      #E2E8F0;
    --text:        #0F172A;
    --muted:       #64748B;
    --subtle:      #94A3B8;

    /* Gradients */
    --grad-flame:  linear-gradient(135deg, #FF2A00 0%, #F59E0B 50%, #FFB703 100%);
    --grad-spartan:linear-gradient(135deg, #090D16 0%, #0F172A 50%, #1E3A8A 100%);
    --grad-gold:   linear-gradient(135deg, #FFB703 0%, #F59E0B 100%);

    /* Typography */
    --font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-heading: 'Outfit', 'Inter', sans-serif;

    /* Spacing / Radii */
    --pill:  9999px;
    --r-xl:  24px;
    --r:     16px;
    --r-sm:  10px;

    /* Transitions */
    --ease: 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    --ease-fast: 0.18s ease;

    /* Shadows */
    --shadow-sm: 0 2px 8px rgba(15,23,42,0.04);
    --shadow:    0 8px 24px rgba(15,23,42,0.07), 0 2px 6px rgba(15,23,42,0.04);
    --shadow-lg: 0 20px 48px rgba(15,23,42,0.12), 0 8px 16px rgba(15,23,42,0.06);
    --glow-gold: 0 0 28px rgba(255,183,3,0.28);
    --glow-red:  0 0 28px rgba(255,42,0,0.28);
}

/* ============================================
   GLOBAL RESET & BASE
============================================ */
*, *::before, *::after { 
    box-sizing: border-box; 
    margin: 0; 
    padding: 0; 
}

html {
    scroll-behavior: smooth;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    background: #FFFFFF;
    color: var(--text);
    font-family: var(--font);
    overflow-x: hidden;
    line-height: 1.65;
    padding-top: var(--header-height, 80px);
}

/* Mobile body padding */
@media (max-width: 640px) {
    body { padding-top: var(--header-height-sm, 65px); }
}

@media (max-width: 420px) {
    body { padding-top: var(--header-height-xs, 60px); }
}

::selection { 
    background: var(--crimson); 
    color: #fff; 
}

::-webkit-scrollbar { 
    width: 6px; 
}

::-webkit-scrollbar-track { 
    background: var(--surface2); 
}

::-webkit-scrollbar-thumb { 
    background: var(--crimson); 
    border-radius: var(--pill); 
}

img { 
    display: block; 
    max-width: 100%; 
}

a { 
    text-decoration: none; 
}

/* ============================================
   CONTAINER
============================================ */
.container {
    width: min(1280px, 92%);
    margin-inline: auto;
}

/* ============================================
   HELPERS
============================================ */
.text-center { text-align: center; }
.mx-auto { margin-inline: auto; }
.mb-2 { margin-bottom: .5rem; }
.mb-3 { margin-bottom: 1rem; }
.mb-4 { margin-bottom: 1.5rem; }
.mb-5 { margin-bottom: 3rem; }
.mt-2 { margin-top: .5rem; }
.mt-3 { margin-top: 1rem; }
.mt-4 { margin-top: 1.5rem; }
.mt-5 { margin-top: 3rem; }
.py-4 { padding-block: 1.5rem; }
.py-5 { padding-block: 3.5rem; }
.p-4  { padding: 1.5rem; }