@import "base-styles.scss";

.title-size-1 {
    font-size: calc(1.3625rem + 1.35vw);
}

.title-size-2 {
    font-size: calc(1.325rem + 0.9vw);
}

.title-size-3 {
    font-size: calc(1.2875rem + 0.45vw);
}

.title-size-4 {
    font-size: calc(1.2625rem + 0.15vw);
}

.title-size-5 {
    font-size: 1.125rem;
}

.title-size-6 {
    font-size: 0.9375rem;
}

.title-size-1,
.title-size-2,
.title-size-3,
.title-size-4,
.title-size-5,
.title-size-6 {
    margin-top: 0;
    margin-bottom: 1rem;
    font-weight: 500;
    line-height: 1.1;
    color: rgb(85.8, 105.6, 127.2);
}

@media (min-width: 1200px) {
    .title-size-1 {
        font-size: 2.375rem;
    }

    .title-size-2 {
        font-size: 2rem;
    }

    .title-size-3 {
        font-size: 1.625rem;
    }

    .title-size-4 {
        font-size: 1.375rem;
    }

    .title-size-5 {
        font-size: 1.125rem;
    }

    .title-size-6 {
        font-size: 0.9375rem;
    }
}

.modal-title {
    &.title-size-1,
    &.title-size-2,
    &.title-size-3,
    &.title-size-4,
    &.title-size-5,
    &.title-size-6 {
        line-height:var(--bs-modal-title-line-height) !important;
        margin-bottom: 0 !important;
    }
}