/* --- Root Variables --- */
:root {
    --font-n: 'Neue Haas Grotesk Display Pro';
    --font-h: "Helvetica-Neue";
    --primary: #1d1d1d;
    --secondary: #eae6df;
    --lightgrey: #b3b3b3;
    --dark: #060100;
    --black: #000;
}
/* --- Global Reset --- */
*,
li,
ul {
    margin: 0;
    padding: 0;
    list-style: none;
}
/* --- HTML and Body Styles --- */
html {
    font-size: 16px;
    scroll-behavior: smooth;
}

body {
    overflow-x: hidden !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    overscroll-behavior: none;
    scroll-behavior: smooth;
    background-color: #fff;
}
/* --- Typography Styles --- */
body,
button,
input,
optgroup,
select,
textarea {
    color: var(--primary);
    font-family: "Helvetica-Neue";
    font-weight: 400;
    font-size: 1rem;
    line-height: 1.2;
}
/* --- Link Styles --- */
a {
    text-decoration: none;
    transition: 0.4s;
    -moz-transition: 0.4s;
    -webkit-transition: 0.4s;
    color: var(--primary);
}
/* --- Form Control Styles --- */
.form-control:focus {
    border-color: none !important;
    outline: 0 !important;
    box-shadow: none !important;
}
/* --- Font Weight Utility Classes --- */
.fw-200 {
    font-weight: 200;
}

.fw-300 {
    font-weight: 300;
}

.fw-400 {
    font-weight: 400;
}

.fw-500 {
    font-weight: 500;
}

.fw-600 {
    font-weight: 600;
}

.fw-700 {
    font-weight: 700;
}

.fw-900 {
    font-weight: 900;
}
/* --- Font Family Utility Classes --- */
.font-f {
    font-family: var(--font-f);
}
.font-h {
    font-family: var(--font-h) !important;
}
.font-n {
    font-family: var(--font-n);
}
img {
    height: auto;
    max-width: 100%;
}
/* --- Heading Styles --- */
h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6 {
    font-family: var(--font-n);
    font-weight: 500;
}

h1, .h1 {
    font-size: 2.5vw;
    line-height: 1;
    text-transform: uppercase;
}

h2,
.h2 {
    font-size: 4.38vw;
    line-height: 3.85vw;
}

h3,
.h3 {
    font-size: 48px;
    line-height: 0.96;
}

h4,
.h4 {
    font-family: var(--font-n);
    font-weight: 500;
    font-size: 64px;

    line-height: 62px;
    letter-spacing: -2.56px;
}

h5,
.h5 {
    font-size: 22px;
    line-height: 28px;
}

h6,
.h6 {
    font-size: 1rem;
    line-height: 28px;
}

/* --- Body Text Styles --- */
.body1 {
    font-size: 24px;
}
.body2 {
    font-size: 20px;
    font-family: var(--font-h);
    font-weight: 400;
}

/* --- Background and Text Color Utility Classes --- */
.BgPrimary {
    background-color: var(--primary);
}
.BgDark {
    background-color: var(--dark);
}

.bgBlack {
    background-color: var(--black);
}

.textPrimary {
    color: var(--primary);
}

.textDark {
    color: var(--dark);
}

.textPrimary80 {
    color: rgb(29 29 29 / 80%);
}

.BgSecondary {
    background-color: var(--secondary);
}

.textSecondary {
    color: var(--secondary);
}

.textLightgrey {
    color: var(--lightgrey);
}

.container-fluid {
    padding: 0 20px;
}
/* For Chrome, Safari, Edge, Opera */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* For Firefox */
input[type="number"] {
    -moz-appearance: textfield;
}

.br-32 {
    border-radius: 32px;
}

.br-12 {
    border-radius: 12px;
}
.br-8 {
    border-radius: 8px;
}
.imgInvert {
    filter: brightness(1) invert(1);
}
/* --- Gradient Background Utility Classes --- */
.gradientBlue {
    background: linear-gradient(241.11deg, #5365ff 6.84%, #384cff 80.88%);
}
.gradientGreen {
    background: linear-gradient(214.86deg, #d1ff7d 32.6%, #97e426 107.27%);
}

.gradientDark {
    background: linear-gradient(180deg, #313030 0%, #1d1d1d 100%);
}
.gradientOrange {
    background: linear-gradient(219.45deg, #fea43c 6.27%, #ff8900 80.48%);
}
.gradientSkyblue {
    background: linear-gradient(219.54deg, #92daec 10.23%, #41b8d5 107.05%);
}

.gradientLightgreen {
    background: linear-gradient(223.37deg, #dcffe0 14.85%, #63af6b 109.78%);
}

.gradientPink {
    background: linear-gradient(223.37deg, #ffcce4 14.85%, #e96ca1 109.78%);
}

.gradientBrown {
    background: linear-gradient(220.88deg, #ffcb78 13.12%, #d37e34 121.56%);
}

.bgOrange {
    background-color: #ea623d;
}

.fs-20 {
    font-size: 20px;
}

.bgGrey {
    background-color: #f4f4f4;
}
.bgGrey2 {
    background-color: #f6f6f6;
}

.cursorPointer {
    cursor: pointer;
}

input::placeholder,
textarea::placeholder {
    color: var(--dark) !important;
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
    color: var(--dark) !important;
}

input::-moz-placeholder,
textarea::-moz-placeholder {
    color: var(--dark) !important;
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
    color: var(--dark) !important;
}

.mmshow {
    display: none !important;
}
/* --- Responsive Adjustments --- */
@media (max-width: 990px) {
    body,
    button,
    input,
    optgroup,
    select,
    textarea {
        font-size: 14px;
    }

    h1,
    .h1 {
        font-size: 44px;
    }
    h2,
    .h2 {
        font-size: 44px;
        line-height: 40px;
    }

    h3,
    .h3 {
        font-size: 20px;
    }

    h4,
    .h4 {
        font-size: 24px;
        line-height: 120%;
        letter-spacing: inherit;
    }

    h5,
    .h5 {
        font-size: 16px;
    }

    h6,
    .h6 {
        font-size: 14px;
    }
    .body1 {
        font-size: 16px;
    }

    .body2 {
        font-size: 14px;
    }

    .mmhide {
        display: none !important;
    }

    .mmshow {
        display: block !important;
    }

    .container-fluid {
        max-width: 100%;
    }

    br {
        display: none;
    }
}