/* Explain: Layout utilities for section padding and background colors. */
.section-pad {
    padding-top: clamp(5rem, 10vw, 9rem);
    padding-bottom: clamp(5rem, 10vw, 9rem);
}

.hero-scrim {
    background:
        linear-gradient(180deg, rgba(34, 32, 30, 0.58) 0%, rgba(34, 32, 30, 0.30) 42%, rgba(34, 32, 30, 0.74) 100%);
}

.espresso-section {
    background: var(--primary-color);
    color: var(--background-color);
}

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