/* Keep both header rows visible on every webshop page, without a spacer. */
html.pitlane-fixed-header { scroll-padding-top: var(--pitlane-header-scroll-offset, 184px); }
html.pitlane-fixed-header body > .utility {
  position: sticky;
  top: 0;
  z-index: 101;
}
html.pitlane-fixed-header .pitlane-header {
  position: sticky;
  top: var(--pitlane-utility-height, 42px);
  z-index: 100;
  box-shadow: 0 8px 24px rgb(10 16 20 / 12%);
}
@media (max-width: 760px) {
  html.pitlane-fixed-header .pitlane-header { top: var(--pitlane-utility-height, 40px); }
}
body.pitlane .pitlane-hero.parallax-ready {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background-image: none;
}
body.pitlane .pitlane-hero.parallax-ready::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: calc(-1 * var(--pitlane-hero-overscan, 80px)) 0;
  background: #39434b var(--pitlane-hero-image, url("hero-winter.webp")) center calc(65% - var(--pitlane-hero-overscan, 80px) * .3) / cover no-repeat;
  pointer-events: none;
  transform: translate3d(0, var(--pitlane-hero-y, 0px), 0);
  will-change: transform;
}
body.pitlane .pitlane-hero.parallax-ready > .hero-grid {
  position: relative;
  z-index: 1;
}
@media (max-width: 760px), (prefers-reduced-motion: reduce) {
  body.pitlane .pitlane-hero.parallax-ready {
    background-image: var(--pitlane-hero-image, url("hero-winter.webp"));
  }
  body.pitlane .pitlane-hero.parallax-ready::before { content: none; }
}

/* Keep the page content stable throughout the header's animated size change. */
body.pitlane #wrapper.wrapper { margin-top: var(--pitlane-header-space, 0px); }
@supports (zoom: .8) {
    html.pitlane-header-compact body > .utility,
    html.pitlane-header-compact .pitlane-header { zoom: var(--pitlane-header-scale, .8); }
    html.pitlane-header-compact .pitlane-header {
      top: calc(var(--pitlane-utility-height, 33.6px) / var(--pitlane-header-scale, .8));
    }
    html.pitlane-header-compact :is(.utility,.pitlane-header) .pitlane-wrap {
      /* Match the normal 1260px content cap even on ultrawide/4K screens. */
      width: min(1260px, var(--pitlane-header-layout-width, 100vw));
      max-width: 1260px;
    }
}

/* Prevent browser scroll anchoring throughout the animated header resize. */
html.pitlane-header-sizing { overflow-anchor: none; }
