:root {

    /* ========= Brand Colors ========= */

    --clr-primary: #040158;
    --clr-secondary: #15ADEA;
    --clr-accent: #06E7AB;
    --clr-warning: #FFD700;

    --clr-dark: #333333;
    --clr-light: #F5F5F5;
    --clr-white: #FFFFFF;

    /* ========= Text ========= */

    --text-primary: var(--clr-dark);
    --text-secondary: #666666;
    --text-light: #888888;

    /* ========= Background ========= */

    --bg-primary: #FFFFFF;
    --bg-secondary: #F5F5F5;
    --bg-dark: #040158;

    /* ========= Border ========= */

    --border-color: #E8E8E8;

    /* ========= Shadow ========= */

    --shadow-sm: 0 2px 10px rgba(0,0,0,.05);

    --shadow-md: 0 8px 30px rgba(0,0,0,.08);

    --shadow-lg: 0 15px 50px rgba(0,0,0,.12);

    /* ========= Radius ========= */

    --radius-sm: 8px;
    --radius-md: 14px;
    --radius-lg: 20px;
    --radius-xl: 30px;
    --radius-pill: 999px;

    /* ========= Transition ========= */

    --transition: .35s ease;

}

:root{

    --space-1: .25rem;
    --space-2: .5rem;
    --space-3: .75rem;
    --space-4: 1rem;
    --space-5: 1.5rem;
    --space-6: 2rem;
    --space-7: 3rem;
    --space-8: 4rem;
    --space-9: 5rem;
    --space-10: 6rem;
    --space-11: 8rem;

}

:root{

--fs-100: clamp(.875rem,.84rem + .2vw,.95rem);

--fs-200: clamp(1rem,.95rem + .25vw,1.125rem);

--fs-300: clamp(1.125rem,1rem + .5vw,1.35rem);

--fs-400: clamp(1.35rem,1.2rem + .8vw,1.7rem);

--fs-500: clamp(1.7rem,1.4rem + 1vw,2.3rem);

--fs-600: clamp(2.2rem,2rem + 1.5vw,3.2rem);

--fs-700: clamp(2.8rem,2.4rem + 2vw,4.5rem);

}

:root{

    --container-width: 1200px;

    --header-height: 88px;

}