/* ==========================================================================
   Teixeira IP — padrão do herói interno

   Um arquivo só governa a altura de TODA página interna com fotografia no
   topo. Não vive dentro de `acervo.v*.css` nem de `portal.v*.css` de
   propósito: duplicar a medida em dois arquivos garante que um dia eles
   divergem, e a divergência só aparece quando alguém compara duas telas lado
   a lado — que foi exatamente como este problema apareceu.

   Página nova com herói fotográfico carrega este arquivo e herda a altura.
   Nada a decidir, nada a copiar.

   Carregar depois de site.v2.css e ANTES do CSS da área.
   ========================================================================== */

:root {
  /* A medida. Mexer aqui muda todas as páginas de uma vez.
     O piso de 380px protege o celular; o teto de 600px impede que o herói
     coma a tela inteira em monitor grande e empurre o conteúdo para fora. */
  --pagehead-altura: clamp(380px, 56vh, 600px);
}

.page-head--foto,
.page-head--portal {
  min-height: var(--pagehead-altura);
  display: flex;
  align-items: center;

  /* O padding deixa de definir a altura — quem define é o `min-height`.
     Fica só a folga mínima para o conteúdo não encostar nas bordas quando a
     tela é baixa e o piso não se aplica. */
  padding-block: clamp(2rem, 5vw, 3rem);
}

/* Filho direto vira item flex e precisa recuperar a largura. */
.page-head--foto > .wrap,
.page-head--portal > .wrap { width: 100%; }

/* Telas muito baixas em paisagem: o piso viraria uma prisão. */
@media (max-height: 520px) {
  .page-head--foto,
  .page-head--portal { min-height: 0; }
}