/**
 * CSS Variables — change colours here, ONE place for the whole site
 * To rebrand: update --color-primary and --color-accent, done.
 */
:root {
    /* ── Brand colours ───────────────────────────── */
    --color-primary:      #1A56DB;   /* main blue */
    --color-primary-dark: #1341AE;   /* hover state */
    --color-accent:       #E3342F;   /* red — urgency blocks, badges */
    --color-accent-dark:  #CC1F1A;

    /* ── Text ────────────────────────────────────── */
    --color-text:         #1F2937;
    --color-text-muted:   #6B7280;
    --color-text-light:   #9CA3AF;

    /* ── Backgrounds ─────────────────────────────── */
    --color-bg:           #FFFFFF;
    --color-bg-section:   #F9FAFB;
    --color-bg-dark:      #111827;
    --color-bg-card:      #FFFFFF;

    /* ── Borders ─────────────────────────────────── */
    --color-border:       #E5E7EB;
    --color-border-dark:  #D1D5DB;

    /* ── Status ──────────────────────────────────── */
    --color-success:      #10B981;
    --color-warning:      #F59E0B;
    --color-error:        #EF4444;

    /* ── Typography ──────────────────────────────── */
    --font-main:          'Inter', 'Segoe UI', Arial, sans-serif;
    --font-size-base:     16px;
    --line-height-base:   1.6;

    /* ── Spacing ─────────────────────────────────── */
    --space-xs:    4px;
    --space-sm:    8px;
    --space-md:    16px;
    --space-lg:    24px;
    --space-xl:    40px;
    --space-2xl:   64px;
    --space-3xl:   96px;

    /* ── Radius ──────────────────────────────────── */
    --radius-sm:   4px;
    --radius-md:   8px;
    --radius-lg:   12px;
    --radius-xl:   20px;
    --radius-full: 9999px;

    /* ── Shadows ─────────────────────────────────── */
    --shadow-sm:   0 1px 3px rgba(0,0,0,.08);
    --shadow-md:   0 4px 16px rgba(0,0,0,.10);
    --shadow-lg:   0 8px 32px rgba(0,0,0,.14);

    /* ── Transitions ─────────────────────────────── */
    --transition:  0.2s ease;

    /* ── Container ───────────────────────────────── */
    --container-width: 1200px;
    --container-pad:   0 20px;
}
