/* Explain: App-specific layout utilities for containers and sections. */
.container-cf {
    width: 100%;
    max-width: 80rem;
    margin-inline: auto;
    padding-inline: 1.15rem;
}

@media (min-width: 640px) {
    .container-cf { padding-inline: 1.75rem; }
}

@media (min-width: 1024px) {
    .container-cf { padding-inline: 2.25rem; }
}

.section {
    padding-block: clamp(3.5rem, 7vw, 6rem);
}

.section-tight {
    padding-block: clamp(2.75rem, 5vw, 4rem);
}

.band-dark {
    background: var(--ink-color);
    color: #ffffff;
}

.band-surface {
    background: var(--surface-color);
}