/* ==========================================================================
   Layout global — shell, utilitários de página
   ========================================================================== */

.shell {
    width: min(100% - 2 * var(--gutter), var(--shell));
    margin-inline: auto;
}

main {
    position: relative;
    z-index: var(--z-content);
}

/* A página assenta sobre o rodapé: a última seção arredonda os cantos de baixo
   e o rodapé, que sobe por trás do <main> (footer.css), aparece neles. */
main > :last-child {
    border-end-start-radius: var(--radius-lg);
    border-end-end-radius: var(--radius-lg);
}

/* Seções seguintes (fases futuras) partem deste espaçamento padrão. */
.section {
    padding-block: clamp(4.5rem, 9vw, 8.5rem);
}