/* -- Variable -- */
:root {
    --primary: #FE3528;

    --gray-50: #808080;
}

/* -- Reset -- */
body {
    font-family: "Archivo", sans-serif;
    font-size: 16px;
    line-height: 20px;
    color: var(--gray-90);
    
}

body::-webkit-scrollbar {
    width: 0;
}

/* -- Typography -- */
.h1,
h1,
.h2,
h2,
.h3,
h3,
.h4,
h4,
.h5,
h5,
.h6,
h6 {
    font-family: "Archivo", sans-serif;
}

h1,
.h1 {
    font-size: clamp(56px, 6vw, 92px);
    line-height: clamp(56px, 6vw, 92px);
}

h2,
.h2 {
    font-size: clamp(32px, 4.5vw, 48px);
    line-height: clamp(32px, 4.5vw, 48px);
}

h3,
.h3 {
    font-size: clamp(28px, 4vw, 40px);
    line-height: clamp(30px, 4.2vw, 44px);
}

h4,
.h4 {
    font-size: clamp(24px, 3.5vw, 36px);
    line-height: clamp(26px, 3.8vw, 40px);
}

h5,
.h5 {
    font-size: clamp(20px, 3vw, 32px);
    line-height: clamp(22px, 3.5vw, 36px);
}

h6,
.h6 {
    font-size: clamp(18px, 2.5vw, 28px);
    line-height: clamp(20px, 3vw, 32px);
}

.text-display1 {
    font-size: clamp(60px, 6.2vw, 152px);
    line-height: clamp(60px, 6.2vw, 152px);
}

.text-sub-head {
    font-size: clamp(18px, 2vw, 24px);
    line-height: 28px;
}

.text-body-1 {
    font-size: clamp(18px, 1.5vw, 20px);
    line-height: clamp(24px, 2vw, 28px);
}

.text-body-2 {
    font-size: 18px;
    line-height: 24px;
}

.text-body-3 {
    font-size: 16px;
    line-height: 20px;
}

.text-body-4 {
    font-size: 14px;
    line-height: 18px;
}

.text-caption {
    font-size: 12px;
    line-height: 14px;
}

.text-sm {
    font-size: 14px;
    line-height: 16px;
}

.overflow-unset {
    overflow: unset !important;
}