:root { --section-space: clamp(4rem, 7vw, 7rem); }

/* One vertical rhythm for all content sections; full-bleed images stay flush. */
.content-section {
    min-height: 0;
    padding-block: var(--section-space);
}
.content-section > div > p:last-child { margin-bottom: 0; }

/* A clear, full-width closing section in the existing black-and-white palette. */
#contact { background: #fff; color: #000; }

/* Keep mobile browser toolbar changes from resizing the hero. */
@media (max-width: 63.99rem), (hover: none) and (pointer: coarse) {
    .hero-section {
        min-height: var(--hero-height, 100vh);
        min-height: var(--hero-height, 100svh);
        background-attachment: scroll;
    }
}