/* HTML Content
--------------------------------------------- */

.html-content {
    padding-block: 4rem;
}

.html-content.theme-white {
    margin-block: 4rem;
    padding-block: 0;
}

.html-content h2 {
    font-size: 4rem;
}

.html-content:not(.theme-white) {
    margin-inline: var(--grid_gap);
    margin-block: var(--grid_gap);
    border-radius: var(--border_radius);
}

.html-content .content-wrapper .content {
    grid-column: 2 / -2;
    text-align: center;
}

.html-content .content-wrapper .content > * {
    margin-inline: 2rem;
}

.html-content .logo-group {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    justify-content: center;
    align-items: center;
    margin-inline: 0;
}

.html-content.html-content-align-left .logo-group {
    justify-content: start;
}

.html-content .logo-group img {
    max-width: 20rem;
    max-height: 14rem;
    height: auto;
    mix-blend-mode: darken;
}

.html-content.html-content-align-left .content-wrapper .content {
    text-align: left;
}

.html-content.html-content-align-center .content-wrapper .content {
    text-align: center;
}

@media (max-width: 1250px) {
    .html-content h2 {
        font-size: 3.5rem;
    }
    .html-content .content-wrapper .content {
        grid-column: 1 / -1;
    }
}

@media (max-width: 800px) {
    .html-content .content-wrapper .content > * {
        margin-inline: 0;
    }
    .html-content .logo-group img {
        max-width: 15rem;
        max-height: 10rem;
    }
}

@media (max-width: 700px) {
    .html-content h2 {
        font-size: 3rem;
    }
}
