/* ==========================================================================
   LAYOUT DE BASE
   --------------------------------------------------------------------------
   Contentor de largura máxima reutilizável em todas as secções.
   ========================================================================== */

:root {
  /* Altura real do cabeçalho provisório (logótipo de 36px + padding-block
     de --space-3 em cima e em baixo). Secções que precisam de encaixar
     exatamente no primeiro ecrã (ex: Hero) leem este token em vez de um
     valor solto — atualizar aqui quando o cabeçalho definitivo (com
     menu) for desenvolvido, e a mudança propaga-se automaticamente. */
  --header-height: 76px; /* 68px → 76px: acomoda o logótipo maior (ver components/_header.css) mantendo respiro vertical confortável */
}

.container {
  width: 100%;
  max-width: var(--container-max); /* ver token em base/_variables.css */
  margin-inline: auto;
  padding-inline: var(--container-padding);
}

/* Compensa a altura do cabeçalho quando uma secção é o alvo direto de um
   link com hash (partilhado, na barra de endereço, ou navegação por
   teclado) — o scroll interativo normal é feito por JS
   (smooth-anchors.js), isto é só a rede de segurança nativa. */
section[id] {
  scroll-margin-top: calc(var(--header-height) + var(--space-4));
}

/* Cabeçalho: ver assets/css/components/_header.css e _menu-drawer.css */
/* Rodapé: ver assets/css/components/_footer.css */