.carousel{--carousel-padding-v: 0;--carousel-padding-h: 0;--carousel-bg: transparent;--carousel-radius: 0;--carousel-viewport-overflow: hidden;--carousel-scroll-behavior: smooth;--carousel-snap-type: x mandatory;--carousel-peek: 0;--carousel-mobile-peek: 2.5rem;--carousel-slide-min-width: 280px;--carousel-slide-bg: transparent;--carousel-slide-padding: 0;--carousel-nav-offset: calc(var(--act-base-unit) * 2);--carousel-nav-opacity-disabled: .3;--carousel-dot-size: .5rem;--carousel-dot-gap: calc(var(--act-base-unit) * 2);--carousel-dot-bg: var(--act-color-border);--carousel-dot-bg-active: var(--act-color-primary);--carousel-dot-radius: 50%;--carousel-scrollbar-height: 2px;--carousel-scrollbar-height-hover: 6px;--carousel-scrollbar-bg: color-mix(in oklch, var(--act-color-foreground), transparent 88%);--carousel-scrollbar-color: color-mix(in oklch, var(--act-color-foreground), transparent 45%);--carousel-scrollbar-visible: 0;--carousel-thumbnail-min-width: 60px;--carousel-thumbnail-max-width: 80px;--carousel-thumbnail-border-active: var(--act-color-primary);--carousel-items-per-view: 1;display:flex;position:relative;flex-direction:column;padding:var(--carousel-padding-v) var(--carousel-padding-h);border-radius:var(--carousel-radius);background-color:var(--carousel-bg)}.carousel-header{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:var(--act-spacing);gap:var(--act-spacing)}.carousel-header h1,.carousel-header h2,.carousel-header h3,.carousel-header h4,.carousel-header h5,.carousel-header h6{margin:0}.carousel-header .carousel-count{font-weight:400;opacity:.7}.carousel-link{flex-shrink:0;white-space:nowrap}.carousel-header__actions{display:flex;flex-shrink:0;align-items:center;gap:calc(var(--act-base-unit) * 3);margin-left:auto}.carousel-header__actions .carousel-link{margin-right:calc(var(--act-base-unit) * 3)}.carousel[data-arrows=heading] .carousel-header{align-items:center}.carousel-header .carousel-prev,.carousel-header .carousel-next{position:relative;top:auto;left:auto;right:auto;transform:none}.carousel-viewport{position:relative;overflow:var(--carousel-viewport-overflow)}.carousel-track{display:flex;margin:0;padding:0;padding-right:var(--carousel-peek);overflow-x:scroll;overflow-y:hidden;gap:var(--carousel-gap, var(--act-spacing));list-style:none;scroll-behavior:var(--carousel-scroll-behavior);scroll-snap-type:var(--carousel-snap-type);-webkit-overflow-scrolling:touch;scrollbar-width:none}.carousel-track::-webkit-scrollbar{display:none}.carousel-slide{flex:0 0 calc((100% - (var(--act-spacing) * (var(--carousel-items-per-view) - 1))) / var(--carousel-items-per-view));min-width:var(--carousel-slide-min-width);padding:var(--carousel-slide-padding);border-radius:var(--act-border-radius, 0);background-color:var(--carousel-slide-bg);scroll-snap-align:start}.carousel-slide>img,.carousel-slide>picture img{display:block;width:100%;height:auto;border-radius:inherit}.carousel-image-slide{position:relative;display:block;border-radius:inherit}.carousel-image-slide img,.carousel-image-slide>.placeholder-svg{display:block;width:100%;height:auto;border-radius:inherit}.carousel-image-slide__play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;width:3.875rem;height:3.875rem;border:var(--act-border-width) solid var(--act-color-border);border-radius:50%;background-color:var(--act-color-background);color:var(--act-color-foreground);transition:transform var(--duration-short) ease;pointer-events:none}.carousel-image-slide__play svg{width:1.4rem;height:1.4rem;margin-left:.2rem}.carousel-image-slide:hover .carousel-image-slide__play{transform:translate(-50%,-50%) scale(1.1)}.carousel-slide:has(>.skeleton){position:relative;overflow:hidden}.carousel-slide:has(>.skeleton)>.skeleton{display:block;width:100%;border-radius:inherit}.carousel-slide:has(>.skeleton)>img,.carousel-slide:has(>.skeleton)>picture img{z-index:1;position:absolute;width:100%;height:100%;top:0;right:0;bottom:0;left:0;object-fit:cover;opacity:0;transition:opacity .3s ease-out}.carousel-slide[data-loaded]>.skeleton{display:none}.carousel-slide[data-loaded]>img,.carousel-slide[data-loaded]>picture img{position:relative;height:auto;inset:auto;opacity:1}.carousel-prev,.carousel-next{z-index:1;position:absolute;top:50%;transform:translateY(-50%)}.carousel-prev[disabled],.carousel-next[disabled]{opacity:var(--carousel-nav-opacity-disabled);pointer-events:none}.carousel-prev{left:var(--carousel-nav-offset)}.carousel-next{right:var(--carousel-nav-offset)}.carousel-pagination{display:flex;justify-content:center;margin-top:var(--act-spacing);gap:var(--carousel-dot-gap)}.carousel-pagination button{width:var(--carousel-dot-size);height:var(--carousel-dot-size);padding:0;border:none;border-radius:var(--carousel-dot-radius);background-color:var(--carousel-dot-bg);cursor:pointer;transition:background-color var(--act-transition),width var(--act-transition),transform var(--act-transition)}.carousel-pagination button:hover:not([aria-current=true]){transform:scale(1.2)}.carousel-pagination button[aria-current=true]{background-color:var(--carousel-dot-bg-active)}.carousel-pagination button:focus-visible{outline:2px solid var(--act-color-primary);outline-offset:calc(var(--act-base-unit) * .5)}.carousel[data-scroll-by=page] .carousel-pagination button{--carousel-dot-width-active: calc(var(--carousel-dot-size) * 4);border-radius:var(--carousel-dot-size)}.carousel[data-scroll-by=page] .carousel-pagination button[aria-current=true]{width:var(--carousel-dot-width-active)}.carousel-scrollbar{position:relative;height:var(--carousel-scrollbar-height-hover);margin-top:var(--act-spacing);opacity:var(--carousel-scrollbar-visible);transition:opacity var(--act-transition)}.carousel-scrollbar:before{content:"";position:absolute;top:50%;left:0;right:0;height:var(--carousel-scrollbar-height);transform:translateY(-50%);border-radius:var(--act-border-radius, 0);background:var(--carousel-scrollbar-bg);transition:height var(--act-transition)}.carousel-scrollbar-thumb{position:absolute;top:50%;left:0;min-width:2rem;height:var(--carousel-scrollbar-height);transform:translateY(-50%);border-radius:var(--act-border-radius, 0);background:var(--carousel-scrollbar-color);cursor:grab;transition:height var(--act-transition),left .1s ease-out}.carousel-scrollbar-thumb:active{cursor:grabbing}.carousel:hover .carousel-scrollbar,.carousel-scrollbar:hover,.carousel-scrollbar.is-dragging{opacity:1}.carousel:hover .carousel-scrollbar:before,.carousel-scrollbar:hover:before,.carousel-scrollbar.is-dragging:before,.carousel:hover .carousel-scrollbar-thumb,.carousel-scrollbar:hover .carousel-scrollbar-thumb,.carousel-scrollbar.is-dragging .carousel-scrollbar-thumb{height:var(--carousel-scrollbar-height-hover)}.carousel[data-carousel=full]{--carousel-items-per-view: 1;--carousel-slide-min-width: 100%;--carousel-gap: 0}.carousel[data-carousel=full] .carousel-slide{flex:0 0 100%;scroll-snap-align:center}.carousel-thumbnails{position:relative;margin-top:var(--act-spacing);overflow:hidden}.carousel-thumbnails .carousel-track{--carousel-gap: calc(var(--act-base-unit) * 2);display:flex;margin:0;padding:0;overflow-x:auto;overflow-y:hidden;gap:var(--carousel-gap);list-style:none;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none}.carousel-thumbnails .carousel-track::-webkit-scrollbar{display:none}.carousel-thumbnails .carousel-slide{flex:0 0 auto;width:var(--carousel-thumbnail-max-width);min-width:var(--carousel-thumbnail-min-width);padding:0;border:var(--act-border-width) solid transparent;border-radius:var(--act-border-radius, 0);cursor:pointer;transition:border-color var(--act-transition),opacity var(--act-transition)}.carousel-thumbnails .carousel-slide[aria-selected=true]{border-color:var(--carousel-thumbnail-border-active)}.carousel-thumbnails .carousel-slide:hover:not([aria-selected=true]){opacity:.8}.carousel-thumbnails .carousel-slide button[role=tab]{display:block;aspect-ratio:1;width:100%;padding:0;border:none;background:none;cursor:pointer;touch-action:pan-x pan-y}.carousel-thumbnails .carousel-slide button[role=tab] img{display:block;aspect-ratio:1;width:100%;height:100%;object-fit:cover;border-radius:calc(var(--act-border-radius, 0) - var(--act-border-width))}.carousel-thumbnails .carousel-slide button[role=tab] .skeleton{z-index:0;position:absolute;top:0;right:0;bottom:0;left:0;border-radius:calc(var(--act-border-radius, 0) - var(--act-border-width))}.carousel-thumbnails .carousel-slide button[role=tab]:has(.skeleton){position:relative;overflow:hidden}.carousel-thumbnails .carousel-slide button[role=tab]:has(.skeleton) img{z-index:1;position:relative;opacity:0;transition:opacity .3s ease-out}.carousel-thumbnails .carousel-slide button[role=tab]:focus-visible{outline:2px solid var(--act-color-primary);outline-offset:calc(var(--act-base-unit) * .5)}.carousel-thumbnails .carousel-slide[data-loaded] button[role=tab] .skeleton{display:none}.carousel-thumbnails .carousel-slide[data-loaded] button[role=tab] img{opacity:1}.carousel-thumbnails .carousel-prev,.carousel-thumbnails .carousel-next{--_carousel-nav-size: var(--carousel-thumbnail-nav-size, 1.75rem);position:absolute;top:50%;transform:translateY(-50%);opacity:0;pointer-events:none;transition:opacity var(--act-transition)}.carousel-thumbnails .carousel-prev svg,.carousel-thumbnails .carousel-next svg{width:var(--act-icon-sm);height:var(--act-icon-sm)}.carousel-thumbnails .carousel-prev{left:0}.carousel-thumbnails .carousel-next{right:0}@media(hover:hover)and (pointer:fine){.carousel-thumbnails:hover .carousel-prev:not([disabled]),.carousel-thumbnails:hover .carousel-next:not([disabled]){opacity:1;pointer-events:auto}}.carousel[data-thumbnails-position=left],.carousel[data-thumbnails-position=right]{flex-direction:row;align-items:stretch}.carousel[data-thumbnails-position=left]>.carousel-viewport,.carousel[data-thumbnails-position=right]>.carousel-viewport{flex:1;min-width:0}.carousel[data-thumbnails-position=left] .carousel-thumbnails,.carousel[data-thumbnails-position=right] .carousel-thumbnails{flex:0 0 auto;width:var(--carousel-thumbnail-max-width, 80px);margin-top:0;overflow:hidden}.carousel[data-thumbnails-position=left] .carousel-thumbnails .carousel-track,.carousel[data-thumbnails-position=right] .carousel-thumbnails .carousel-track{flex-direction:column;max-height:100%;overflow-x:hidden;overflow-y:auto}.carousel[data-thumbnails-position=left] .carousel-thumbnails .carousel-slide,.carousel[data-thumbnails-position=right] .carousel-thumbnails .carousel-slide{width:100%;min-width:unset;max-width:unset}.carousel[data-thumbnails-position=left] .carousel-thumbnails{order:-1;margin-right:var(--act-spacing)}.carousel[data-thumbnails-position=right] .carousel-thumbnails{margin-left:var(--act-spacing)}@media screen and (min-width:750px){.carousel{--carousel-items-per-view: var(--carousel-items-per-view-sm, var(--carousel-items-per-view))}}@media screen and (min-width:990px){.carousel{--carousel-items-per-view: var( --carousel-items-per-view-md, var(--carousel-items-per-view-sm, var(--carousel-items-per-view)) )}}@media screen and (min-width:1200px){.carousel{--carousel-items-per-view: var( --carousel-items-per-view-lg, var( --carousel-items-per-view-md, var(--carousel-items-per-view-sm, var(--carousel-items-per-view)) ) )}}@media(prefers-reduced-motion:reduce){.carousel-track{scroll-behavior:auto}}@media(hover:none)and (pointer:coarse){.carousel-prev,.carousel-next{display:none}}@media screen and (max-width:749px){.carousel-prev,.carousel-next{display:none}.carousel:not([data-carousel=full]) .carousel-slide{flex-basis:calc((100% - (var(--act-spacing) * (var(--carousel-items-per-view) - 1)) - var(--carousel-mobile-peek)) / var(--carousel-items-per-view));min-width:0}}.carousel--full-bleed>.carousel-viewport{width:100vw;margin-left:calc(50% - 50vw)}.carousel--full-bleed>.carousel-viewport>.carousel-track{padding-left:calc((100vw - 100cqw)/2);padding-right:calc((100vw - 100cqw)/2);scroll-padding-left:calc((100vw - 100cqw)/2)}.carousel--full-bleed{container-type:inline-size}.carousel--full-bleed .carousel-slide{flex-basis:calc((100cqw - (var(--act-spacing) * (var(--carousel-items-per-view) - 1))) / var(--carousel-items-per-view));min-width:0}@media screen and (max-width:749px){.carousel--full-bleed:not([data-carousel=full]) .carousel-slide{flex-basis:calc((100cqw - (var(--act-spacing) * (var(--carousel-items-per-view) - 1)) - var(--carousel-mobile-peek)) / var(--carousel-items-per-view))}}.carousel-banner{flex:0 0 auto;position:relative;list-style:none;background-color:var(--act-color-background);overflow:hidden}.carousel-banner__image{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover}.carousel-banner__content{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;padding:calc(var(--act-spacing) * 2.5);color:var(--carousel-banner-text, #fff);background:linear-gradient(180deg,#0d0b0600 34%,#0d0b062e 56%,#0d0b06bd)}.carousel-banner__heading{margin:0 0 .75rem;font-size:clamp(1.75rem,1.4rem + 1.4vw,2.25rem);font-weight:400;line-height:1.08;color:inherit}.carousel-banner__text{max-width:22rem;margin:0 0 1.4rem;font-size:var(--act-text-sm);font-weight:300;line-height:1.5;color:inherit;opacity:.84}.carousel-banner__link{display:inline-flex;align-items:center;gap:11px;white-space:nowrap;color:inherit;text-decoration:none;text-transform:uppercase;letter-spacing:.16em;font-size:var(--act-text-xs);padding-bottom:4px;border-bottom:1px solid color-mix(in oklch,currentColor,transparent 50%);transition:gap .22s ease,border-color .2s ease}.carousel-banner__link:hover{gap:17px;border-color:currentColor}.carousel-banner__link-arrow{flex-shrink:0;width:var(--act-icon-sm);height:var(--act-icon-sm)}@media screen and (min-width:750px){.carousel--has-banner .carousel-banner{position:sticky;z-index:3;flex-basis:var(--carousel-banner-width, 33%)}.carousel--has-banner[data-banner-side=left] .carousel-banner{left:0}.carousel--has-banner[data-banner-side=right] .carousel-banner{right:0}.carousel--has-banner[data-banner-side=left] .carousel-track{scroll-padding-left:calc(var(--carousel-banner-width, 33%) + var(--carousel-gap, var(--act-spacing)))}.carousel--has-banner[data-banner-side=right] .carousel-track{scroll-padding-right:calc(var(--carousel-banner-width, 33%) + var(--carousel-gap, var(--act-spacing)))}.carousel--has-banner .carousel-slide{flex-basis:calc((100% - var(--carousel-banner-width, 33%) - (var(--carousel-items-per-view) * var(--carousel-gap, var(--act-spacing)))) / var(--carousel-items-per-view));min-width:0;padding-bottom:var(--carousel-banner-controls-space, calc(var(--act-spacing) * 2))}.carousel--has-banner .carousel-pagination,.carousel--has-banner .carousel-scrollbar{position:absolute;bottom:0;margin:0}.carousel--has-banner[data-banner-side=left] .carousel-pagination,.carousel--has-banner[data-banner-side=left] .carousel-scrollbar{left:calc(var(--carousel-banner-width, 33%) + var(--carousel-gap, var(--act-spacing)));right:0}.carousel--has-banner[data-banner-side=right] .carousel-pagination,.carousel--has-banner[data-banner-side=right] .carousel-scrollbar{left:0;right:calc(var(--carousel-banner-width, 33%) + var(--carousel-gap, var(--act-spacing)))}}@media screen and (max-width:749px){.carousel-banner{flex-basis:calc(100% - var(--carousel-mobile-peek));min-width:0;scroll-snap-align:start}.carousel--banner-mobile-hidden .carousel-banner{display:none}}@media screen and (min-width:750px){.carousel--full-bleed.carousel--has-banner>.carousel-viewport{width:auto;margin-left:0}.carousel--full-bleed.carousel--has-banner>.carousel-viewport>.carousel-track{padding-left:0;padding-right:0}}
/*# sourceMappingURL=/cdn/shop/t/60/assets/component-carousel.css.map */