@font-face {
    font-family: "Inter";
    src: url("../fonts/Inter/Inter-VariableFont_opsz\,wght.ttf") format("truetype");
    font-weight: 100 900;
    font-style: normal;
}

.fc-black {
    color: var(--color-black);
}

.fc-grey {
    color: var(--color-brand-primary);
}

.fc-lightgrey {
    color: var(--color-neutral-400);
}

.fc-lightblue {
    color: var(--color-brand-accent);
}

.fc-white {
    color: var(--color-neutral-400);
}

.fs-small-regular {
    font-size: 16px;
    font-weight: 400;
}

.fs-small-bold {
    font-size: 16px;
    font-weight: 700;
}

.fs-medium-regular {
    font-size: 20px;
    font-weight: 400;
}

.fs-large-regular {
    font-size: 27px;
    font-weight: 400;
}

.fs-large-bold {
    font-size: 27px;
    font-weight: 700;
}

.fs-xlarge-medium {
    font-size: 47px;
    font-weight: 500;
}

.fs-medium-bold {
    font-size: 21px;
    font-weight: 700;
}

.fs-xxlarge-bold {
    font-size: 61px;
    font-weight: 700;
}

.fs-xxxlarge-bold {
    font-size: 64px;
    font-weight: 700;
}

@media (max-width: 1200px) {
    .fs-xlarge-bold-responsive {
        font-size: 47px;
        font-weight: 700;
    }

    .fs-large-bold-responsive {
        font-size: 27px;
        font-weight: 700;
    }

    .fs-medium-bold-responsive {
        font-size: 20px;
        font-weight: 700;
    }

    .fs-large2-regular-responsive {
        font-size: 36px;
        font-weight: 400;
    }

    .fs-medium-regular-responsive {
        font-size: 20px;
        font-weight: 400;
    }

    .fs-small-regular-responsive {
        font-size: 16px;
        font-weight: 400;
    }
}

@media (max-width: 400px) {
    .fs-xlarge-bold-responsive {
        font-size: 32px;
        font-weight: 700;
    }
}
