@font-face {
    font-family: "Organic Brand";
    src: url("/assets/fonts/Organic-Brand.ttf") format("truetype");
}
@font-face {
    font-family: "Typo Gortesk Medium";
    src: url("/assets/fonts/typo_grotesk/GROTESKTYPO-Black.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "Typo Gortesk Bold";
    src: url("/assets/fonts/typo_grotesk/GROTESKTYPO-Bold.ttf") format("truetype");
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: "Typo Gortesk Thin";
    src: url("/assets/fonts/typo_grotesk/GROTESKTYPO-Thin.ttf") format("truetype");
    font-weight: lighter;
    font-style: normal;
}
@font-face {
    font-family: "Typo Gortesk Regular";
    src: url("/assets/fonts/typo_grotesk/GROTESKTYPO-Regular.ttf") format("truetype");
    font-weight: lighter;
    font-style: normal;
}
:root {
    --brand-red: #E9202C;
    --brand-green:#3CA849;
    --brand-yellow:#F3BC26;
    --brand-black:#231F20;
    --brand-dark-green:#01730D;
    --brand-orange:#FF6B00;
    --bg100: #fff;
    --bg150: rgb(175, 175, 175);
    --bg200: #0a0a0a;
    --bg250: #5f5f5f;
    --bg300: #000;
    --text100: #fff;
    --text200: #000;
    --text250: #838383;
    --default-font: "Typo Gortesk Thin", sans-serif;
    --organic-font: "Organic Brand", sans-serif;
    --screen: 1440;
    --container-padding: 33px;
    --vh: 6.72px;
    --r-container: clamp(16px, calc((116 / (var(--screen) / 100)) * 1vw), 155px);
    --r-mob-container: clamp(16px, calc((28 / (560 / 100)) * 1vw), 40px);
    --header-h: clamp(76px, calc((124 / (var(--screen) / 100)) * 1vw), 164px);
    --r248: clamp(190px, calc((248 / (var(--screen) / 100)) * 1vw), 315px);
    --r200: clamp(142px, calc((200 / (var(--screen) / 100)) * 1vw), 267px);
    --r144: clamp(40px, calc((144 / (var(--screen) / 100)) * 1vw), 192px);
    --r120: clamp(80px, calc((120 / (var(--screen) / 100)) * 1vw), 160px);
    --r104: clamp(74px, calc((104 / (var(--screen) / 100)) * 1vw), 139px);
    --r100: clamp(71px, calc((100 / (var(--screen) / 100)) * 1vw), 133px);
    --r80: clamp(40px, calc((80 / (var(--screen) / 100)) * 1vw), 107px);
    --r72: clamp(20px, calc((72 / (var(--screen) / 100)) * 1vw), 96px);
    --r64: clamp(48px, calc((64 / (var(--screen) / 100)) * 1vw), 85px);
    --r56: clamp(40px, calc((56 / (var(--screen) / 100)) * 1vw), 75px);
    --r48: clamp(24px, calc((48 / (var(--screen) / 100)) * 1vw), 64px);
    --r40: clamp(20px, calc((40 / (var(--screen) / 100)) * 1vw), 54px);
    --r32: clamp(28px, calc((32 / (var(--screen) / 100)) * 1vw), 42px);
    --r30: clamp(30px, calc((30 / (var(--screen) / 100)) * 1vw), 40px);
    --r16: clamp(14px, calc((16 / (var(--screen) / 100)) * 1vw), 22px);
    /* swiper */
    --swiper-image-ratio: 80%;
        /* ratio 16:9 = 56.25% */
    --swiper-width: 40%;
    --swiper-inactive-scale: .85;
    /* makes the other slide smaller */
    /* responsive settings */
    --swiper-tab-width:30%;
    --swiper-mobile-width: 90%;
    --swiper-mobile-inactive-scale: .95;
}

*,
::before,
::after {    
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    border-width: 0;
    border-style: solid;
    
}

body {
    font-family: var(--default-font);
    color: var(--text300);    
    background-color: var(--bg100); 
    overflow-x: hidden;    
}
main{
    overflow: hidden;
    background-image: url(/assets/webp/paper-textured-background.webp);
    background-position: center;
    background-size: cover;
    background-repeat: repeat;
}
img,
video {
    max-width: 100%;
    height: auto;
}

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
    display: block;
}

a {
    color: var(--text100);
    text-decoration: none;
}
a:hover{
    color: var(--text100);
}
b,
strong {
    font-weight: bolder;
}

button,
input,
optgroup,
select,
textarea {
    padding: 0;
    line-height: inherit;
    color: inherit;
}

button {
    /* cursor: none; */
    border-color: currentColor;
}

button {
    background-color: transparent;
    background-image: none;
}

button,
[type="button"],
[type="submit"] {
    -webkit-appearance: button;
}

button,
select {
    text-transform: none;
}

.button_icon {
    font-family: var(--default-font);
    font-size: clamp(16px, calc((24 / (var(--screen) / 100)) * 1vw), 32px);
    line-height: 2;
}

.t-heading-200r {
    font-family: var(--default-font);
    font-size: clamp(24px, calc((28 / (var(--screen) / 100)) * 1vw), 32px);
    font-weight: 400;
    line-height: 1.33;
}

.t-heading-200m {
    font-family: var(--default-font);
    font-size: clamp(20px, calc((28 / (var(--screen) / 100)) * 1vw), 32px);
    font-weight: 600;
    line-height: 1.33;
}

.t-heading-300 {
    font-family: var(--default-font);
    font-size: clamp(24px, calc((32 / (var(--screen) / 100)) * 1vw), 43px);
    font-weight: 700;
    line-height: 1.25;
}

.t-heading-400r {
    font-family: var(--default-font);
    font-size: clamp(24px, calc((40 / (var(--screen) / 100)) * 1vw), 54px);
    font-weight: 400;
    line-height: 1.2;
}

.t-heading-500 {
    font-family: var(--default-font);
    font-size: clamp(32px, calc((64 / (var(--screen) / 100)) * 1vw), 85px);
    font-weight: 700;
    line-height: 1.2;
}

.t-heading-600 {
    font-family: var(--default-font);
    font-size: clamp(32px, calc((88 / (var(--screen) / 100)) * 1vw), 117px);
    font-weight: 700;
    line-height: 1.18;
    letter-spacing: -0.03em;
}

.t-heading-600r {
    font-family: var(--default-font);
    font-size: clamp(64px, calc((88 / (var(--screen) / 100)) * 1vw), 117px);
    font-weight: 700;
    line-height: 1.18;
    letter-spacing: -0.03em;
}

.t-heading-700 {
    font-family: var(--default-font);
    font-size: clamp(48px, calc((120 / (var(--screen) / 100)) * 1vw), 170px);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.03em;
}

.t-heading-100 {
    font-family: var(--default-font);
    font-size: clamp(48px, calc((88 / (var(--screen) / 100)) * 1vw), 170px);
    font-weight: 50;
    line-height: 1.2;
    letter-spacing: -0.03em;
}

.t-paragraph {
    font-family: var(--default-font);
    font-size: clamp(16px, calc((24 / (var(--screen) / 100)) * 1vw), 32px);
    line-height: 2;
}

.t-tagline-50 {
    font-family: var(--default-font);
    font-size: clamp(12px, calc((13 / (var(--screen) / 100)) * 1vw), 14px);
    font-weight: 600;
    line-height: 1.25;
}

.t-tagline-100m {
    font-family: var(--default-font);
    font-size: clamp(16px, calc((16 / (var(--screen) / 100)) * 1vw), 24px);
    font-weight: 600;
    line-height: 1.5;
}

.t-tagline-100r {
    font-family: var(--default-font);
    font-size: clamp(16px, calc((16 / (var(--screen) / 100)) * 1vw), 24px);
    font-weight: 400;
    line-height: 1.5;
}

.t-tagline-200b {
    font-family: var(--default-font);
    font-size: clamp(18px, calc((18 / (var(--screen) / 100)) * 1vw), 24px);
    font-weight: 700;
    line-height: 1.3;
}

.t-tagline-200r {
    font-family: var(--default-font);
    font-size: clamp(18px, calc((18 / (var(--screen) / 100)) * 1vw), 24px);
    font-weight: 400;
    line-height: 1.3;
}

.t-tagline-300r {
    font-family: var(--default-font);
    font-size: clamp(56px, calc((56 / (var(--screen) / 100)) * 1vw), 75px);
    line-height: 1.2;
}

.t-tagline-300r {
    font-family: var(--default-font);
    font-size: clamp(56px, calc((56 / (var(--screen) / 100)) * 1vw), 75px);
    font-weight: 400;
    line-height: 1.2;
}

.pb-r100 {
    padding-bottom: var(--r100);
}

.pb-r200 {
    padding-bottom: var(--r200);
}

.pt-r100 {
    padding-top: var(--r100);
}

.pt-r200 {
    padding-top: var(--r200);
}

.pr-r80 {
    padding-right: var(--r80);
}

.py-r120 {
    padding-top: var(--r120);
    padding-bottom: var(--r120);
}

.mb-r16 {
    margin-bottom: var(--r16);
}

.mb-r40 {
    margin-bottom: var(--r40);
}

.mb-r48 {
    margin-bottom: var(--r48);
}

.mb-r80 {
    margin-bottom: var(--r80);
}

.mb-r100 {
    margin-bottom: var(--r100);
}

.mb-r120 {
    margin-bottom: var(--r120);
}

.mt-r30 {
    margin-top: var(--r30);
}

.flex {
    display: flex;
}

.flex-col {
    flex-direction: column;
}

.items-center {
    align-items: center;
}

.relative {
    position: relative;
}

.inline-block {
    display: inline-block;
}

.top-1 {
    top: 8px;
}

.bottom-1 {
    bottom: 8px;
}

.opacity-50 {
    opacity: 0.5;
}

.text-center {
    text-align: center;
}

.text-left {
    text-align: left;
}

.text-right {
    text-align: right;
}

@media (min-width: 768px) and (max-width: 1023px) {
    .sm\:mb-3 {
        margin-bottom: 24px;
    }
}

@media (min-width: 648px) and (max-width: 767px) {
    .xs\:mb-1 {
        margin-bottom: 8px;
    }

    .xs\:mb-3 {
        margin-bottom: 24px;
    }
}

@media (min-width: 0px) and (max-width: 647px) {
    .bs\:mb-1 {
        margin-bottom: 8px;
    }

    .bs\:mb-2 {
        margin-bottom: 16px;
    }
}


.page__container {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    padding-left: var(--r-container);
    padding-right: var(--r-container);
    max-width: calc(1610px + var(--r-container) * 2);
}

@media (max-width: 768px) {
    .page__container {
        padding-left: var(--r-mob-container);
        padding-right: var(--r-mob-container);
    }
}

.tagline-text {
    color: var(--text250);
    font-weight: 300;
    margin-bottom: 40px;
    font-size: 20px;
}