@font-face {
    font-family: 'Montserrat Bold';
    src: url('../fonts/Montserrat-Bold.ttf');
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat Semibold', sans-serif;
    src: url('../fonts/Montserrat-SemiBold.ttf');
    font-weight: 600;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat Regular', sans-serif;
    src: url('../fonts/Montserrat-Regular.ttf');
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: 'Clash Display Bold';
    src: url('../fonts/ClashDisplay-Bold.ttf');
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: 'Clash Display Semibold', sans-serif;
    src: url('../fonts/ClashDisplay-Semibold.ttf');
    font-weight: 600;
    font-display: swap;
}

@font-face {
    font-family: 'Clash Display Regular', sans-serif;
    src: url('../fonts/ClashDisplay-Regular.ttf');
    font-weight: 400;
    font-display: swap;
}

// FONT FAMILY
.montserrat-bold {
    font-family: "Montserrat Bold", sans-serif;
}

.montserrat-semibold {
    font-family: "Montserrat Semibold", sans-serif;
}

.montserrat-regular {
    font-family: "Montserrat Regular", sans-serif;
}

.clash-display-bold {
    font-family: "Clash Display Bold", sans-serif;
}

.clash-display-semibold {
    font-family: "Clash Display Semibold", sans-serif;
}

.clash-display-regular {
    font-family: "Clash Display Regular", sans-serif;
}

// FONT SIZE
.fs-56 {
    font-size: 56px;
    line-height: 140%;
}

.fs-32 {
    font-size: 32px;
    line-height: 140%;
}

.fs-20 {
    font-size: 20px;
    line-height: 140%;
}

.fs-16 {
    font-size: 16px;
    line-height: 120%;
}

.fs-14 {
    font-size: 14px;
    line-height: 120%;
}

.fs-12 {
    font-size: 12px;
    line-height: 120%;
}

h1,
h2,
h3,
p {
    margin: 0;
}

// TEXT ALIGN
.text-left {
    text-align: left;
}

.text-center {
    text-align: center;
}

// TEXT DECORATION
.decoration-none {
    text-decoration: none;

    &.hover-underline:hover {
        text-decoration: underline;
    }
}

@media (max-width: 992px) {
    .fs-56 {
        font-size: 32px;
    }

    .fs-32 {
        font-size: 24px;
    }
}