:root {

    /* scroll bar */

    --ct-scrollbar-width: 12px;
    --ct-scrollbar-track-bg: white;
    --ct-scrollbar-thumb-bg: #3A7AFE;
    --ct-scrollbar-thumb-hover: #3A7AFE;
    --ct-scrollbar-border-size: 12px;

    /* font */

    /* font-family */
    --ct-body-setup-font-family: "Outfit", sans-serif;

    /* font-size scale */
        --ct-font-size-2xs: 10px;
        --ct-font-size-xs: 12px;
        --ct-font-size-sm: 14px;
        --ct-font-size-base: 16px;
        --ct-font-size-md: 18px;
        --ct-font-size-lg: 20px;
        --ct-font-size-xl: 25px;
        --ct-font-size-2xl: 28px;
        --ct-font-size-3xl: 30px;
        --ct-font-size-4xl: 35px;
        --ct-font-size-5xl: 40px;

    /* font-size semantic aliases */
    --ct-body-setup-font-size: var(--ct-font-size-base);
    --ct-banner-title: var(--ct-font-size-5xl);
    --ct-section-heading: var(--ct-font-size-4xl);
    --ct-footer-heading: var(--ct-font-size-2xl);
    --ct-section-sub-heading: var(--ct-font-size-md);
    --ct-section-para: var(--ct-font-size-base);
    --ct-badge-font-size: var(--ct-font-size-sm);

    /* font-weight */
    --font-weight-bold: 600;
    --font-weight-normal: 400;

    /* solid colors */

    /* main colors */
    --ct-primary-solid-color: #3A7AFE;
    --ct-secondary-solid-color: #1a2536;
    --ct-tertiary-solid-color: #e0e0e0;
    --ct-quatarnary-solid-color: #EEF4FF;
    --ct-quinary-solid-color: #858585;
    --ct-senary-solid-color: #f6f6f6;

    /* base contrast colors */
    --white: white;
    --black: black;
    /* gradient colors */

    /* linear gradient */
    --ct-primary-gradient-color: linear-gradient(to right, #66a5fe 0%, #3b82f6 30%, #2d67cc 50%, #3b82f6 70%, #66a5fe 100%);
    --ct-secondary-gradient-color: linear-gradient(to right, #f0f0f0 0%, #ffffff 30%, #ffffff 50%, #ffffff 70%, #f0f0f0 100%);

    /* shadow */

    /* box shadow */
    --ct-primary-box-shadow: 0 4px 15px rgba(59, 130, 246, 0.4);
    --ct-secondary-box-shadow: 0 4px 15px rgba(116, 116, 116, 0.4);
    --ct-tertiary-box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);

    /* box shadow inset versions */
    --ct-primary-box-shadow-inset: inset 0 25px 50px rgba(0, 50, 130, 0.25);
    --ct-secondary-box-shadow-inset: inset 2px 2px 5px rgba(180, 195, 225, 0.7);

    /* filter drop shadow */
    --ct-primary-drop-shadow: drop-shadow(0 4px 15px rgba(59, 130, 246, 0.4));
    --ct-secondary-drop-shadow: drop-shadow(0 4px 15px rgba(116, 116, 116, 0.4));
    --ct-tertiary-drop-shadow: drop-shadow(0 10px 30px rgba(0, 0, 0, 0.08));

    /* margin */
    --ct-margin-top-header: var(--ct-space-md);

    /* border */
    --border-radius-inner: 15px;
    --border-radius-badge-outer: 5px;
    --border-radius-outer: 10px;
    --border-radius-full: 9999px;
    --border-radius-null: 0px;

    /* spacing scale */
    --ct-space-xxxs: 4px;
    --ct-space-xxs: 8px;
    --ct-space-xs: 12px;
    --ct-space-sm: 14px;
    --ct-space-default: 20px;
    --ct-space-md: 30px;
    --ct-space-lg: 40px;
    --ct-space-xl: 60px;
    --ct-space-xxl: 90px;
    --ct-space-xxxl: 120px;

    /* spacing semantic aliases */
    --ct-section-padding-x: var(--ct-space-xl);
    --ct-section-padding-sm: var(--ct-space-md);
    --ct-btn-padding: var(--ct-space-xs) var(--ct-space-default);
    --ct-input-padding: var(--ct-space-xxs) var(--ct-space-xs);
    --ct-gap-lg: var(--ct-space-md);
    --ct-gap-md: var(--ct-space-default);
    --ct-gap-sm: var(--ct-space-sm);
    --ct-form-group-margin: var(--ct-space-sm);
    --ct-form-max-width: 970px;
    --ct-form-section-heading: 23px;

    /* icon */
    --ct-icon-lg-size: 40px;

    /* transition durations */
    --ct-transition-fast: 0.2s;
    --ct-transition-base: 0.3s;
    --ct-transition-slow: 0.6s;

    /* additional colors */
    --ct-error-color: #ef4444;
    --ct-info-color: #0d6efd;
    --ct-dark-heading: #17233c;
    --ct-border-light: #e8edf8;
    --ct-bg-dark: #333;
    --ct-bg-white: #ffffff;
    --ct-text-muted: #6b7280;
    --ct-text-dark: #212529;
    --ct-bg-pale-blue: #F0F8FF;

}

@media (min-width: 1200px) and (max-width: 1399.98px) {

    :root {

        /* font */

        /* font-size */
        --ct-body-setup-font-size: var(--ct-font-size-sm);
        --ct-section-para: var(--ct-font-size-sm);
        --ct-section-sub-heading: var(--ct-font-size-base);
        --ct-footer-heading: var(--ct-font-size-lg);
    }

}

@media (min-width: 991.98px) and (max-width: 1199.98px) {

    :root {

        /* font */

        /* font-size */
        --ct-body-setup-font-size: var(--ct-font-size-sm);
        --ct-footer-heading: var(--ct-font-size-lg);
    }

}

@media (min-width: 767.98px) and (max-width: 991.98px) {

    :root {

        /* font */

        /* font-size */
        --ct-body-setup-font-size: var(--ct-font-size-sm);
        --ct-banner-title: var(--ct-font-size-4xl);
        --ct-section-heading: var(--ct-font-size-3xl);
        --ct-footer-heading: var(--ct-font-size-lg);
        --ct-section-sub-heading: var(--ct-font-size-base);
        --ct-section-para: var(--ct-font-size-sm);


    }

}

@media (min-width: 576px) and (max-width: 767.98px) {

    :root {

        /* font */

        /* font-size */
        --ct-body-setup-font-size: var(--ct-font-size-sm);
        --ct-banner-title: var(--ct-font-size-3xl);
        --ct-section-heading: var(--ct-font-size-xl);
        --ct-footer-heading: var(--ct-font-size-md);
        --ct-section-sub-heading: var(--ct-font-size-base);
        --ct-section-para: var(--ct-font-size-sm);
    }

}

@media (min-width: 0px) and (max-width: 575.98px) {

    :root {

        /* font */

        /* font-size */
        --ct-body-setup-font-size: var(--ct-font-size-xs);
        --ct-banner-title: var(--ct-font-size-xl);
        --ct-section-heading: var(--ct-font-size-lg);
        --ct-footer-heading: var(--ct-font-size-base);
        --ct-section-sub-heading: var(--ct-font-size-sm);
        --ct-section-para: var(--ct-font-size-xs);

        /* margin */
        --ct-margin-top-header: var(--ct-space-default);
    }

}