/* Gap To Go | Hero responsiva à ALTURA da janela, não ao zoom.
   Escopo estrito: a primeira seção da Home. Não altera navbar, cards ou globo 3D. */
@media (min-width: 1024px) {
  .gap-hero-viewport {
    min-height: calc(100vh - 84px);
    min-height: calc(100svh - 84px);
  }
  .gap-hero-viewport .gap-hero-inner {
    padding-top: clamp(18px, 3svh, 44px);
    padding-bottom: clamp(18px, 3svh, 44px);
  }
  .gap-hero-viewport .gap-hero-grid { align-items: center; }
  .gap-hero-viewport .gap-hero-logo {
    display: block;
    width: clamp(105px, 17svh, 155px);
    max-width: 155px;
    height: clamp(58px, 9.5svh, 80px);
    flex-shrink: 0;
    object-fit: cover;
    object-position: center;
    margin-bottom: clamp(0px, .7svh, 7px);
  }
  .gap-hero-viewport .gap-hero-globe {
    /* Restam ~290px para logo, áreas de respiro e cabeçalho.
       Limite em px impede que o globo cresça demais em monitores altos. */
    width: 100%;
    max-width: min(510px, max(270px, calc(100svh - 300px))) !important;
  }
}
/* Notebooks e janelas baixas: retirar espaçamentos supérfluos antes de
   sacrificar o tamanho dos textos ou cortar botões. */
@media (min-width: 1024px) and (max-height: 780px) {
  .gap-hero-viewport .gap-hero-inner { padding-top: 18px; padding-bottom: 18px; }
  .gap-hero-viewport .gap-hero-grid { column-gap: 26px; }
  .gap-hero-viewport #hero-title { margin-top: 12px; font-size: clamp(2.25rem, 3.65vw, 3.55rem) !important; }
  .gap-hero-viewport #hero-title + p { margin-top: 16px; }
  .gap-hero-viewport #hero-title + p + div { margin-top: 20px; }
}
@media (min-width: 1024px) and (max-height: 600px) {
  .gap-hero-viewport .gap-hero-globe { max-width: min(385px, max(205px, calc(100svh - 285px))) !important; }
  .gap-hero-viewport .gap-hero-logo { height: 50px; width: 100px; }
  .gap-hero-viewport .gap-hero-inner { padding-top: 12px; padding-bottom: 12px; }
  .gap-hero-viewport #hero-title { font-size: clamp(2rem, 3vw, 2.9rem) !important; }
}
