/* Custom overrides for Bus Upfitters */

:root {
  /* The fixed navbar has two heights: it starts tall on desktop and shrinks
     on scroll. Measured, not estimated. */
  --bu-nav-height: 72px;      /* shrunk, and the height at every width < 992px */
  --bu-nav-height-tall: 94px; /* desktop before navbar-shrink kicks in */
}

/* Ensure masthead appears below fixed navbar and has proper height */
header.masthead {
  margin-top: var(--bu-nav-height);
  min-height: 600px; /* Ensure enough height to show background */
  background-image: url("../assets/img/header-bg.jpg") !important;
  background-repeat: no-repeat !important;
  background-attachment: scroll !important;
  background-position: center center !important;
  background-size: cover !important;
}

@media (min-width: 992px) {
  /* Clear the navbar at its tallest. Sizing for the shrunk height left the top
     22px of the masthead tucked under the bar until the user scrolled. The
     navbar only gets shorter from here, so the tall value is always safe. */
  header.masthead {
    margin-top: var(--bu-nav-height-tall);
  }
}

/* Add smooth scroll behavior */
html {
  scroll-behavior: smooth;
  /* Anchor jumps always land with the navbar already shrunk. */
  scroll-padding-top: var(--bu-nav-height);
}