:root {
    --scrollbarColor: #EE6D0F;
    --scrollbarColorBg: #e6ecf4;

    --black: #000000;
    --white: #FFFFFF;
    --primary: #EE6D0F;
    --primary-100: #F48A3D;
    --primary-200: #EE6D0F;
    --primary-300: #B24D00;
    --primary-400: #C95B0C;
    --primary-500: #A1490A;
    --primary-600: #783607;
    --primary-700: #4F2405;
    --secondary: #171F48;
    --gray-900: #151515;
    --gray-800: #363636;
    --gray-700: #535353;
    --gray-600: #737373;
    --gray-500: #858585;
    --gray-400: #8A8A8A;
    --gray-300: #A2A2A2;
    --gray-200: #A7A7A7;
    --gray-100: #BEBEBE;
    --gray-50: #DADADA;
    --border-default: #3C3C3C;
    --border-hover: #D9D9D9;
    --border-focus: #3182F6;
    --semantic-error: #F04452;
    --semantic-success: #04C09E;

    --gradient: linear-gradient(90deg, #EE6D0F  0%, #FF956F  100%);

    --display-hero: 7.5rem;
    --display-hero2: 1.75rem;
    --heading-1: 3.125rem;
    --heading-2: 1.875rem;
    --heading-3: 1.5rem;
    --heading-4: 1.25rem;
    --text-28: 1.75rem;
    --text-22: 1.375rem;
    --text-20: 1.25rem;
    --text-18: 1.125rem;
    --text-16: 1rem;
    --text-15: 0.9375rem;
    --text-14: 0.875rem;
    --text-13: 0.8125rem;
    --text-12: 0.75rem;
    --button-lg: 1.125rem;
    --button-default: 1rem;
    --chip: 0.875rem;
    --caption: 0.75rem;

    --card-padding: 20px;

    --card-gap : 16px;
    --card-gap-sm : 12px;
    --card-gap-lg : 24px;
    --card-gap-xl : 32px;

    --rounded-sm: 12px;
    --rounded-md: 20px;
    --rounded-full: 200px;

    --shadow-card:  0px 4px 16px rgba(0, 0, 0, 0.04);
    --shadow-card-hover:  0px 8px 24px rgba(0, 0, 0, 0.08);
}
@media (max-width:768px) {
    :root {
        --display-hero: 4rem;
        --display-hero2: 1.5rem;
        --heading-1: 2rem;
        --heading-2: 1.5rem;
        --heading-3: 1.25rem;
        --heading-4: 1.2857rem;
        --text-22: 1.2857rem;
        --text-20: 1.1428rem;
        --text-16: 1.1428rem;
        --text-15: 1.1428rem;

        --button-lg: 1.1428rem;
        --button-default: 1.1428rem;

        --card-gap-sm : 8px;
        --card-gap : 10px;
        --card-gap-lg : 16px;
    }
}