@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=DM+Serif+Text:ital@0;1&display=swap');


/* DM Sans – Variable Font */
.dm-sans {
    font-family: "DM Sans", sans-serif;
    font-weight: 100 900;
    font-style: normal;
}

/* DM Serif Text – Regular only */
.dm-serif {
    font-family: "DM Serif Text", serif;
    font-weight: 400;
    font-style: normal;
}

/* Theme Variables */
:root {
    --primary-color: #0037A7;
    --light-primary-color: #8BBFFE;
    --backup-primary-color: #3F75DE;

    --secondary-color: #DC001A;
    --light-secondary-color: #FE4914;
    --tertiary-color: #FFAF0B;
    --backup-color: #8D5382;

    --gradient-color-1: linear-gradient(90deg,
            var(--tertiary-color) 0%,
            var(--secondary-color) 52%,
            var(--tertiary-color) 88%);

    --main-white-color: #FFFFFF;
    --white-color: #F5F5F5;
    --off-white-color: #F4F4F7;

    --black-color-1: #111810;
    --black-color-2: #20211A;
    --black-color-3: rgba(32, 33, 26, 0.822);

    --gray-color-1: #4e4b51;
    --gray-color-2: #B7B7B7;
    --gray-color-3: #dbd8d8;

    --primary-color-rgb: #0038a780;
    --secondary-color-rgb: rgba(220, 0, 26, 0.5);
    --tertiary-color-rgb: rgba(255, 174, 11, 0.5);

    --dark-primary-color-rgb: rgba(3, 25, 70, 0.568);

    --primary-color-tag: #0038a834;

    --primary-color-80: hsla(220, 100%, 33%, 0.8);
    --secondary-color-80: hsla(353, 99%, 30%, 0.8);
    --tertiary-color-80: hsla(40, 100%, 30%, 0.8);
    --light-primary-color-80: hsla(213, 98%, 50%, 0.8);

    --primary-color-70: hsla(220, 100%, 33%, 0.7);
    --secondary-color-70: hsla(353, 99%, 30%, 0.7);

    --primary-color-40: hsla(220, 100%, 33%, 0.4);
    --light-primary-color-40: rgba(139, 191, 254, 0.4);
    --secondary-color-40: hsla(353, 71%, 67%, 0.4);

    --primary-color-30: hsla(220, 100%, 33%, 0.3);
    --secondary-color-30: hsla(353, 71%, 67%, 0.3);


    --primary-color-10: #0038a81a;

    --gray-color-1-10: hsla(270, 4%, 31%, 0.1);



    /* Updated font variables */
    --primary-font: "DM Sans", sans-serif;
    --heading-font: "DM Serif Text", serif;
}


* {
    margin: 0;
    padding: 0;
    font-family: var(--primary-font);
}

html {
    scroll-behavior: smooth;
    -webkit-font-smoothing: antialiased;
}

body {
    background-color: var(--main-white-color);
    overflow-x: hidden;
}

[x-cloak] {
    display: none !important;
}

img {
    -webkit-user-drag: none;
    user-select: none;
}

/* HEADINGS */

.heading-h2 {
    font-size: 3rem;
    /* text-4xl */
    font-weight: 700;
    /* font-bold */
    color: var(--secondary-color);
}

/* SECTION CONTAINER */
.section-container {
    padding-top: 5rem;
    /* py-20 */
    padding-bottom: 5rem;
    padding-left: 1rem;
    /* px-4 */
    padding-right: 1rem;
    max-width: 80rem;
    /* max-w-7xl */
    margin-left: auto;
    margin-right: auto;
    gap: 3rem;
    /* approximate space-y-12 */
}


.full-section-wrapper {
    width: 100%;
    /* w-full */
    padding-top: 4rem;
    /* py-16 */
    padding-bottom: 4rem;
}

.badge {
    text-align: center;
    background-color: var(--main-white-color);
    color: var(--primary-color);
    padding: 1rem 2rem;
    /* p-1 */
    border-radius: 1rem;
    /* rounded-2xl */
    font-weight: 700;
    /* font-bold */
    display: inline-block;
    font-size: 1rem;
    /* text-sm */
    margin-bottom: 0.5rem;
}

@media (min-width: 640px) {
    .badge {
        font-size: 1.0625rem;
        /* 17px, sm:text-[17px] */
        padding: 0.5rem 0.5rem;
        /* sm:p-2 */
    }

    .section-container {
        padding-left: 1.5rem;
        /* sm:px-6 */
        padding-right: 1.5rem;
    }

    .heading-h2 {
        font-size: 3.7rem;
        /* text-5xl */
    }
}


@media (min-width: 768px) {

    /* md: */
    .section-wrapper {
        padding-top: 6rem;
        /* py-24 */
        padding-bottom: 6rem;
    }
}

@media (min-width: 1024px) {
    .section-container {
        padding-left: 2rem;
        /* lg:px-8 */
        padding-right: 2rem;
    }
}

/* Hide scrollbar completely */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}

.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Prevent text & image selection while dragging */
.drag-slider,
.drag-slider * {
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

/* Prevent image dragging ghost effect */
.drag-slider img {
    pointer-events: none;
    -webkit-user-drag: none;
    user-drag: none;
}

/* Improve touch horizontal scrolling */
.drag-slider {
    touch-action: pan-x;
}