/* UTILITY */
.text-balance {
    text-wrap: balance;
}

.text-small {
    font-size: .85rem;
}

/* COMPONENTS */
.tile-drawing {
    position: relative;
    z-index: 1;
    background-color: #333;
}

.tile-drawing::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    opacity: .15;
    background: url("/resources/images/tile.svg") center / 256px 256px fixed;
    mix-blend-mode: multiply;
}

.tile-drawing.is-light {
    background-color: #f5f4ef;
}

.tile-drawing.is-light::before {
    opacity: .075;
}

/* MAUTIC */
.mauticform-page-wrapper {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: .5rem;
    display: flex !important;
    flex-wrap: wrap;
    margin-top: calc(-1 * var(--bs-gutter-y));
    margin-right: calc(-.5 * var(--bs-gutter-x));
    margin-left: calc(-.5 * var(--bs-gutter-x));
}

:where(.mauticform-page-wrapper) > * {
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left: calc(var(--bs-gutter-x) * .5);
    margin-top: var(--bs-gutter-y);
}

.mauticform-row {
    position: relative;
}

.mauticform-errormsg {
    position: absolute;
    inset-block-start: 100%;
    margin-block-start: .5em;
    max-inline-size: calc(100% - var(--bs-gutter-x, 0px));
    padding: .25em .5em;
    font-size: .85rem;
    border-radius: var(--bs-border-radius);
    background-color: #ffe1e1;
}

/* ROOT */
body {
    font-family: "Plus Jakarta Sans", system-ui, sans-serif;
    font-optical-sizing: auto;
}

/* HOME */
.paper-airplane {
    position: absolute;
    pointer-events: none;
    inset-block-end: 0;
    inset-inline-start: 40%;
    block-size: auto;
    inline-size: clamp(60%, 50vw + 1rem, 600px);
}

@media screen and (max-width: 35em) {
    .lesson-table {
        font-size: .75rem;
    }

    .lesson-table .btn {
        --bs-btn-font-size: .75rem;
    }
}

#mauticform_signup .mauticform-page-wrapper {
    align-items: end;
}