/*======================================================================*/
/* CSS Variables in Root */
/*======================================================================*/
:root {
    /* Max Width */
    --max-width: 1240px;
    --max-width-padding: 60px;
    --max-width-padding-small: 50px;
    --max-width-padding-smaller: 30px;
    /* Brand Pallet - Neutral Tones */
    --clr-neutral-100: #2b2e34;
    --clr-neutral-200: #a9aaba;
    --clr-neutral-300: #b4b4c3;
    --clr-neutral-400: #c9c9d4;
    --clr-neutral-500: #d4d4dc;
    --clr-neutral-550: #e3e4e8;
    --clr-neutral-600: #eeeff2;
    --clr-neutral-700: #ffffff;
    /* Brand Pallet - Primary Colours */
    --clr-primary-100: #dc0c15;
    --clr-primary-200: #ae1c3f;
    --clr-primary-300: #ff5700;
    --clr-primary-400: #ff7ba3;
    --clr-primary-500: #ffe4ec;
    /* Brand Pallet - Secondary Colours */
    --clr-secondary-100: #523078;
    --clr-secondary-200: #bab1ff;
    --clr-secondary-300: #96b9b9;
    /* Fonts */
    --ff-primary-100: "Neue Haas Grotesk Display Pro", sans-serif;
    /* Font Weights */
    --fw-thin: 300;
    --fw-light: 400;
    --fw-roman: 500;
    --fw-medium: 600;
    --fw-bold: 700;
    /* Font Sizes */
    --fs-1000: clamp(2.625rem, 4.5vw, 3rem); /* 32px -> 48px */
    --fs-900: clamp(2rem, 4vw, 2.25rem); /* 32px -> 36px */
    --fs-800: clamp(1.5rem, 3.5vw, 2rem); /* 28px -> 32px */
    --fs-700: clamp(1.375rem, 3vw, 1.75rem); /* 22px -> 28px */
    --fs-600: clamp(1.25rem, 2.5vw, 1.5rem); /* 20px -> 24px */
    --fs-500: clamp(1.125rem, 2.35vw, 1.375rem); /* 18px -> 22px */
    --fs-400: clamp(1rem, 2.2vw, 1.25rem); /* 16px -> 20px */
    --fs-300: clamp(1rem, 2.2vw, 1.125rem); /* 16px -> 18px */
    --fs-200: 1rem; /* 16px */
    --fs-100: 0.875rem; /* 14px */
    /* Line Heights */
    --lh-1000: 1.9em;
    --lh-900: 1.8em;
    --lh-800: 1.7em;
    --lh-700: 1.6em;
    --lh-600: 1.5em;
    --lh-500: 1.4em;
    --lh-400: 1.3em;
    --lh-300: 1.2em;
    --lh-200: 1.1em;
    --lh-100: 1em;
    /* Borders */
    --brd-primary-100: 1px solid var(--clr-primary-100);
    --brd-neutral-100: 1px solid var(--clr-neutral-100);
    --brd-neutral-200: 1px solid var(--clr-neutral-200);
    --brd-neutral-300: 1px solid var(--clr-neutral-300);
    --brd-neutral-400: 1px solid var(--clr-neutral-400);
    --brd-neutral-500: 1px solid var(--clr-neutral-500);
    --brd-neutral-600: 1px solid var(--clr-neutral-600);
    --brd-neutral-700: 1px solid var(--clr-neutral-700);
}
/*======================================================================*/
/* Utility Classes */
/*======================================================================*/
/* Utilty Classes - Font Weight */
.fw-thin {
    font-weight: var(--fw-thin);
}
.fw-light {
    font-weight: var(--fw-light);
}
.fw-roman {
    font-weight: var(--fw-roman);
}
.fw-medium {
    font-weight: var(--fw-medium);
}
.fw-bold {
    font-weight: var(--fw-bold);
}
/* Utilty Classes - Font Size */
.fs-1000 {
    font-size: var(--fs-1000);
}
.fs-900 {
    font-size: var(--fs-900);
}
.fs-800 {
    font-size: var(--fs-800);
}
.fs-700 {
    font-size: var(--fs-700);
}
.fs-600 {
    font-size: var(--fs-600);
}
.fs-500 {
    font-size: var(--fs-500);
}
.fs-400 {
    font-size: var(--fs-400);
}
.fs-300 {
    font-size: var(--fs-300);
}
.fs-200 {
    font-size: var(--fs-200);
}
.fs-100 {
    font-size: var(--fs-100);
}
/* Utilty Classes - Line height */
.lh-1000 {
    line-height: var(--lh-1000);
}
.lh-900 {
    line-height: var(--lh-900);
}
.lh-800 {
    line-height: var(--lh-800);
}
.lh-700 {
    line-height: var(--lh-700);
}
.lh-600 {
    line-height: var(--lh-600);
}
.lh-500 {
    line-height: var(--lh-500);
}
.lh-400 {
    line-height: var(--lh-400);
}
.lh-300 {
    line-height: var(--lh-300);
}
.lh-200 {
    line-height: var(--lh-200);
}
.lh-100 {
    line-height: var(--lh-100);
}
/*======================================================================*/
/* Body and HTML */
/*======================================================================*/
html,
body {
    margin: 0px !important;
    padding: 0px !important;
    min-height: 100%;
    height: auto;
}
body {
    box-sizing: border-box;
    font-family: var(--ff-primary-100) !important;
    font-size: var(--fs-400) !important;
    font-weight: var(--fw-roman) !important;
    color: var(--clr-neutral-100);
    background-color: var(--clr-neutral-700) !important;
    letter-spacing: 0.015rem;
    overflow-x: hidden;
}
body > * {
    font-family: var(--ff-primary-100) !important;
}
body.no-scroll {
    width: 100vw;
    height: 100vh !important;
    overflow: hidden;
}
/*======================================================================*/
/* Image Setings */
/*======================================================================*/
img {
    max-width: 100%;
    height: unset;
    vertical-align: bottom;
}
/*======================================================================*/
/* Sreen Readers Only */
/*======================================================================*/
.sr-only {
    display: none !important;
}
/*======================================================================*/
/* Give links a transition */
/*======================================================================*/
a {
    transition: all 0.2s ease;
}
/*======================================================================*/
/* Scrollbars & Sections */
/*======================================================================*/
body::-webkit-scrollbar {
    width: 0.8rem;
}
body::-webkit-scrollbar-track {
    box-shadow: none;
    background-color: var(--clr-neutral-600);
}
body::-webkit-scrollbar-thumb {
    background-color: var(--clr-neutral-100);
    outline: 0px;
}
/* selections */
::selection {
    color: var(--clr-neutral-700);
    background-color: var(--clr-neutral-100);
}
/*======================================================================*/
/* Custom Container Styles */
/*======================================================================*/
.responsive-padding {
    padding-top: clamp(50px, 5vw, 70px) !important;
    padding-bottom: clamp(50px, 5vw, 70px) !important;
}
.et_pb_row p:last-of-type {
    padding-bottom: 0px !important;
}
/*======================================================================*/
/* Custom Container Styles */
/*======================================================================*/
.max-width {
    width: 100%;
    max-width: calc(var(--max-width) + var(--max-width-padding) * 2) !important;
    padding-left: var(--max-width-padding);
    padding-right: var(--max-width-padding);
    margin: auto !important;
}
.max-width.no-padding {
    width: 100%;
    max-width: var(--max-width) !important;
    padding-left: 0px !important;
    padding-right: 0px !important;
}
.full-width {
    width: 100%;
    max-width: 100% !important;
    padding: 0px !important;
    margin: 0px !important;
}
@media (max-width: 1400px) {
    .max-width {
        padding-left: var(--max-width-padding-small);
        padding-right: var(--max-width-padding-small);
        max-width: calc(
            var(--max-width) + var(--max-width-padding-small) * 2
        ) !important;
    }
}
@media (max-width: 820px) {
    .max-width {
        padding-left: var(--max-width-padding-small);
        padding-right: var(--max-width-padding-small);
        max-width: calc(
            var(--max-width) + var(--max-width-padding-small) * 2
        ) !important;
    }
}
@media (max-width: 767px) {
    .max-width {
        padding-left: var(--max-width-padding-smaller);
        padding-right: var(--max-width-padding-smaller);
        max-width: calc(
            var(--max-width) + var(--max-width-padding-smaller) * 2
        ) !important;
    }
}
/*======================================================================*/
/* Unset Some Defaults from Divi */
/*======================================================================*/
@media (min-width: 981px) {
    .et_pb_code {
        margin-bottom: 0px !important;
    }
}
@media (max-width: 980px) {
    .et_pb_section {
        padding: unset !important;
    }
}
@media (max-width: 980px) {
    .et_pb_column .et_pb_module {
        margin-bottom: unset !important;
    }
}
