/* =========================================================
   V21 HERO SPACING FIX
   Keeps the scroll motion but removes excessive blank space.
   Load this file last.
   ========================================================= */

@media (min-width: 761px) {
  body main#home > .hero-scroll-stage,
  body .hero-scroll-stage {
    height: 112vh !important;
    min-height: 820px !important;
    max-height: 980px !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  body .hero-sticky {
    height: 100vh !important;
    min-height: 720px !important;
    padding-top: 94px !important;
    padding-bottom: 10px !important;
    align-items: center !important;
    justify-content: center !important;
  }

  body .hero-motion-card {
    min-height: min(680px, calc(100vh - 118px)) !important;
    margin-bottom: 0 !important;
  }

  body .hero-scroll-stage .scroll-hint {
    bottom: 10px !important;
  }

  body .hero-scroll-stage + .motion-marquee {
    margin-top: 0 !important;
  }
}

@media (min-width: 1200px) {
  body main#home > .hero-scroll-stage,
  body .hero-scroll-stage {
    height: 108vh !important;
    min-height: 780px !important;
    max-height: 940px !important;
  }

  body .hero-motion-card {
    min-height: min(660px, calc(100vh - 118px)) !important;
  }
}

@media (min-width: 1200px) and (min-height: 900px) {
  body main#home > .hero-scroll-stage,
  body .hero-scroll-stage {
    height: 104vh !important;
    min-height: 760px !important;
    max-height: 900px !important;
  }
}

@media (max-width: 760px) {
  body main#home > .hero-scroll-stage,
  body .hero-scroll-stage {
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    padding-bottom: 0 !important;
  }

  body .hero-sticky {
    position: relative !important;
    height: auto !important;
    min-height: 100vh !important;
  }
}
