/* GallaPlaza HERO logo safe sizing correction | 2026-10-12
   Append to the END of the EXISTING assets/site.css.
   Do not replace or remove existing CSS. Public homepage hero only. */

/* The original panoramic 1904:638 aspect ratio makes the hero shorter than
   its logo and text when a desktop browser is narrowed. Protect their space. */
@media (min-width: 901px) and (max-width: 1904px) {
  #home > section.hero {
    aspect-ratio: auto !important;
    height: auto !important;
    min-height: clamp(600px, calc(400px + 15vw), 690px) !important;
    max-height: none !important;
  }
  #home > section.hero .hero-content {
    top: clamp(100px, 9vw, 135px) !important;
  }
  #home > section.hero .hero-main-brand {
    max-width: min(410px, 35vw);
  }
}

/* Tablet and phone: make the logo part of normal document flow, so the
   hero naturally grows with the content instead of cropping the letters. */
@media (max-width: 900px) {
  #home > section.hero {
    aspect-ratio: auto !important;
    height: auto !important;
    min-height: max(640px, 80svh) !important;
    max-height: none !important;
  }
  #home > section.hero .hero-content {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: 100%;
    max-width: min(650px, 100%);
    padding-bottom: 112px;
  }
  #home > section.hero .hero-main-brand {
    max-width: min(430px, 82vw);
  }
  #home > section.hero .hero-main-brand img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
  }
  #home > section.category-rail-shell {
    margin-top: 0;
  }
}