/* One acceleration curve for storefront rolling banners, regardless of page. */
[data-crp-rolling-banner]{
  --crp-roll-duration:1000ms;
  --crp-roll-easing:cubic-bezier(.58,0,.82,1);
  --crp-roll-distance:clamp(24px,4vw,52px);
  --crp-roll-enter-x:var(--crp-roll-distance);
  --crp-roll-exit-x:calc(0px - var(--crp-roll-distance));
}
[data-crp-rolling-banner][data-crp-direction="backward"]{
  --crp-roll-enter-x:calc(0px - var(--crp-roll-distance));
  --crp-roll-exit-x:var(--crp-roll-distance);
}
[data-crp-rolling-banner] .crp-carousel-slides{display:grid;touch-action:pan-y pinch-zoom}
[data-crp-rolling-banner] .crp-hero-slide{grid-area:1/1;visibility:hidden;pointer-events:none;opacity:0}
[data-crp-rolling-banner] .crp-hero-caption{min-height:var(--crp-banner-caption-height,0px)}
[data-crp-rolling-banner] .crp-hero-slide.is-active{visibility:visible;pointer-events:auto;opacity:1}
[data-crp-rolling-banner] .crp-hero-slide.is-drag-preview{visibility:visible;pointer-events:none;opacity:1}
[data-crp-rolling-banner] .crp-carousel-slides.is-settling .crp-hero-slide{pointer-events:none}
[data-crp-rolling-banner] .crp-hero-slide.is-leaving{visibility:visible;pointer-events:none}
[data-crp-rolling-banner] .crp-carousel-controls{z-index:2}
[data-crp-rolling-banner] .crp-hero-slide.is-entering{z-index:1;animation:crp-rolling-banner-enter var(--crp-roll-duration) var(--crp-roll-easing) both}
[data-crp-rolling-banner] .crp-hero-slide.is-leaving{animation:crp-rolling-banner-leave var(--crp-roll-duration) var(--crp-roll-easing) both}
@keyframes crp-rolling-banner-enter{from{opacity:0;transform:translate3d(var(--crp-roll-enter-x),0,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes crp-rolling-banner-leave{from{opacity:1;transform:translate3d(0,0,0)}to{opacity:0;transform:translate3d(var(--crp-roll-exit-x),0,0)}}
@media(prefers-reduced-motion:reduce){[data-crp-rolling-banner] .crp-hero-slide:is(.is-entering,.is-leaving){animation:none;transform:none}}
