/* Dual-layout reference: the captured mobile and desktop DOMs are kept intact
   and swapped at the original responsive breakpoint. */
html,
body {
  background: #000;
}
#lp-desktop-root {
  display: none;
}
#lp-mobile-root {
  display: block;
  width: 100%;
}
@media (min-width: 768px) {
  #lp-mobile-root {
    display: none;
  }
  #lp-desktop-root {
    display: block;
    width: 100%;
  }
}

/* Local control affordances */
[data-lp-local-control] {
  -webkit-tap-highlight-color: transparent;
}
#lp-mobile-root [data-lp-hero-dot],
#lp-desktop-root [data-lp-hero-thumb],
#lp-desktop-root .Slider_pageButtonHit__O3oNF {
  touch-action: manipulation;
}
#lp-mobile-root [data-lp-hero-dot] span {
  pointer-events: none;
}
#lp-desktop-root [data-lp-hero] {
  touch-action: pan-y;
}
/* Keep the slider list transitions used by the reference UI. */
#lp-desktop-root .Slider_sliderList__o0xyY {
  transition: transform .5s ease;
}
#lp-desktop-root .Slider_sliderList__o0xyY.lp-no-transition {
  transition: none;
}
@media (prefers-reduced-motion: reduce) {
  #lp-desktop-root .Slider_sliderList__o0xyY {
    transition: none;
  }
  #lp-mobile-root .transition-opacity,
  #lp-desktop-root .transition-opacity {
    transition: none;
  }
}
#lp-mobile-root [data-lp-hero],
#lp-desktop-root [data-lp-slider] .Slider_sliderList__o0xyY {
  touch-action: pan-y;
}
@media (max-width: 1023px) {
  #lp-desktop-root .lp-nav-spacer {
    display: none !important;
  }
}
