:root {

    /* ==========================================================
       BRAND COLORS
    ========================================================== */

    --color-primary: #D62828;
    --color-primary-dark: #B71C1C;

    --color-secondary: #2F3437;
    --color-secondary-light: #4B5563;

    --color-success: #16A34A;
    --color-warning: #F59E0B;
    --color-danger: #DC2626;

    /* ==========================================================
       BACKGROUNDS
    ========================================================== */

    --bg-body: #F5F6F7;
    --bg-card: #FFFFFF;
    --bg-dark: #243042;

    /* ==========================================================
       TYPOGRAPHY
    ========================================================== */

    --font-body: "Inter", sans-serif;
    --font-heading: "Poppins", sans-serif;

    --text-primary: #111827;
    --text-secondary: #6B7280;
    --text-light: #FFFFFF;

    /* ==========================================================
       BORDERS
    ========================================================== */

    --border-color: #E5E7EB;

    /* ==========================================================
       SHADOWS
    ========================================================== */

    --shadow-sm: 0 2px 4px rgba(0,0,0,.06);
    --shadow-md: 0 6px 18px rgba(0,0,0,.08);
    --shadow-lg: 0 12px 32px rgba(0,0,0,.12);

    /* ==========================================================
       SPACING
    ========================================================== */

    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 16px;
    --space-lg: 24px;
    --space-xl: 40px;
    --space-xxl: 64px;

    /* ==========================================================
       RADIUS
    ========================================================== */

    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 20px;

    /* ==========================================================
       LAYOUT
    ========================================================== */

    --container-width: 1320px;
    --header-height: 80px;

    /* ==========================================================
       TRANSITIONS
    ========================================================== */

    --transition-fast: .2s ease;
    --transition-normal: .3s ease;

}