.container {
    width: 100%;
    min-height: 100%;
}

.frame {
    width: min(90%, var(--container-lg));
    margin-inline: auto;
}

.frame800,
.frame-sm {
    width: min(90%, var(--container-sm));
    margin-inline: auto;
}

.frame960,
.frame-md {
    width: min(90%, var(--container-md));
    margin-inline: auto;
}

.frameFull {
    width: 100%;
}

.stripe,
.section {
    padding-block: var(--space-section);
}

.textHero {
    padding-block: var(--space-section-tight);
}

.hero,
.cover,
.pageCover {
    position: relative;
    overflow: hidden;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.hero {
    min-height: var(--size-hero-min);
}

.cover {
    min-height: 100vh;
}

.pageCover {
    min-height: var(--size-page-cover-min);
}

.cover .content,
.hero .content,
.heroContent {
    position: absolute;
    top: 50%;
    left: 50%;
    width: min(90%, var(--container-lg));
    transform: translate(-50%, -50%);
    z-index: 2;
}

.hero .spill {
    width: min(90%, var(--container-lg));
    margin-inline: auto;
}

.gridHalves {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(1.5rem, 4vw, 3rem);
    align-items: center;
}

.gridHalves.reverse {
    direction: rtl;
}

.ltr {
    direction: ltr;
}

.line {
    width: 100%;
    height: 2px;
    background: currentColor;
}

@media only screen and (max-width: 767px) {
    .gridHalves {
        grid-template-columns: 1fr;
    }
}