.video-carousel-section{overflow:hidden}.video-carousel-title{text-align:center;color:#fff;font-size:2rem;margin-bottom:30px;font-weight:600}.video-carousel-wrapper{position:relative;width:100%;display:flex;align-items:center;justify-content:center;height:580px;perspective:1000px}.carousel-arrow{position:absolute;top:50%;transform:translateY(-50%);background:#0009;border:none;color:#fff;width:50px;height:50px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.4,0,.2,1);z-index:100;box-shadow:0 2px 8px #0003}.carousel-arrow:hover{background:#000c;transform:translateY(-50%) scale(1.1);box-shadow:0 4px 12px #0000004d}.carousel-arrow:active{transform:translateY(-50%) scale(.95)}.carousel-arrow-left{left:20px}.carousel-arrow-right{right:20px}.video-carousel-track-container{position:absolute;left:0;right:0;top:0;bottom:0;overflow:hidden;touch-action:pan-y pinch-zoom}.video-carousel-track{display:flex;gap:20px;align-items:center;height:100%;transition:transform .5s cubic-bezier(.34,1.56,.64,1);will-change:transform;-webkit-backface-visibility:hidden;backface-visibility:hidden}.video-carousel-track.is-dragging{transition:none!important}.video-item{flex-shrink:0;width:220px;height:390px;position:relative;border-radius:16px;overflow:hidden;background:#1a1a1a;opacity:.4;transform:scale(.8) translateZ(-50px);filter:blur(1px) brightness(.7);transition:transform .5s cubic-bezier(.34,1.56,.64,1),opacity .4s ease-out,filter .4s ease-out,width .5s cubic-bezier(.34,1.56,.64,1),height .5s cubic-bezier(.34,1.56,.64,1),box-shadow .4s ease-out;-webkit-backface-visibility:hidden;backface-visibility:hidden;box-shadow:0 5px 20px #0000001a}.video-item.is-focused{width:280px;height:500px;opacity:1;transform:scale(1) translateZ(0);filter:blur(0) brightness(1);z-index:5;box-shadow:0 20px 60px #0000004d}.video-item.is-focused+.video-item,.video-item:has(+.video-item.is-focused){opacity:.6;transform:scale(.85) translateZ(-30px);filter:blur(.5px) brightness(.85)}.video-container{position:relative;aspect-ratio:9 / 16;background:#000}.carousel-video{width:100%;height:100%;object-fit:cover;display:block}.video-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#333;color:#666}.play-pause-btn{position:absolute;bottom:12px;left:50%;transform:translate(-50%) scale(.8);background:#000000b3;border:none;color:#fff;width:50px;height:50px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.34,1.56,.64,1);z-index:3;opacity:0;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.video-item.is-focused .play-pause-btn{opacity:1;transform:translate(-50%) scale(1)}.play-pause-btn:hover{background:#000000e6;transform:translate(-50%) scale(1.1)}.play-pause-btn:active{transform:translate(-50%) scale(.95)}.play-pause-btn svg{pointer-events:none;transition:transform .2s ease}.video-item .icon-play{display:block}.video-item .icon-pause,.video-item.is-playing .icon-play{display:none}.video-item.is-playing .icon-pause{display:block}.sound-btn{position:absolute;bottom:12px;right:12px;background:#000000b3;border:none;color:#fff;width:44px;height:44px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.34,1.56,.64,1);z-index:3;opacity:0;transform:scale(.8);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.video-item.is-focused .sound-btn{opacity:1;transform:scale(1)}.sound-btn:hover{background:#000000e6;transform:scale(1.1)}.sound-btn:active{transform:scale(.95)}.sound-btn svg{pointer-events:none}.video-item .icon-muted{display:block}.video-item .icon-sound,.video-item.has-sound .icon-muted{display:none}.video-item.has-sound .icon-sound{display:block}.video-item.is-focused:after{content:"";position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px;border-radius:18px;background:linear-gradient(135deg,#fff3,#fff0,#ffffff1a);pointer-events:none;opacity:0;transition:opacity .4s ease}.video-item.is-focused:after{opacity:1}.video-item.is-focused:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.1),transparent);z-index:10;pointer-events:none;animation:shine 2s ease-in-out infinite;animation-delay:.5s}@keyframes shine{0%{left:-100%}50%,to{left:100%}}@media (max-width: 768px){.carousel-arrow{width:40px;height:40px}.carousel-arrow-left{left:10px}.carousel-arrow-right{right:10px}.video-carousel-wrapper{height:420px}.video-carousel-track{gap:15px}.video-item{width:160px;height:285px}.video-item.is-focused{width:200px;height:355px}.video-item.is-focused:before{display:none}}@media (prefers-reduced-motion: reduce){.video-carousel-track,.video-item,.play-pause-btn,.sound-btn,.carousel-arrow{transition-duration:.1s}.video-item.is-focused:before{display:none}}.video-link-overlay{position:absolute;top:12px;right:12px;z-index:10;text-decoration:none;opacity:0;transform:translateY(-10px);transition:all .3s cubic-bezier(.34,1.56,.64,1);pointer-events:none}.video-item.is-focused .video-link-overlay{opacity:1;transform:translateY(0);pointer-events:auto}.video-link-btn{display:flex;align-items:center;gap:6px;padding:8px 14px;background:#000000b3;border-radius:20px;color:#fff;font-size:13px;font-weight:500;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:all .2s ease}.video-link-btn:hover{background:#000000e6;transform:scale(1.05)}.video-link-btn svg{flex-shrink:0}.video-link-text{white-space:nowrap}.video-link-btn{position:absolute;top:12px;right:12px;z-index:10;display:flex;align-items:center;justify-content:center;width:44px;height:44px;background:#000000b3;border-radius:50%;color:#fff;text-decoration:none;opacity:0;transform:scale(.8);transition:all .3s cubic-bezier(.34,1.56,.64,1);pointer-events:none;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.video-item.is-focused .video-link-btn{opacity:1;transform:scale(1);pointer-events:auto}.video-link-btn:hover{background:#000000e6;transform:scale(1.1)}.video-link-btn:active{transform:scale(.95)}.video-controls{position:absolute;bottom:12px;left:12px;right:12px;display:flex;justify-content:space-between;align-items:center;z-index:3}.play-pause-btn{position:relative;bottom:auto;left:auto;transform:scale(.8)}.video-item.is-focused .play-pause-btn{transform:scale(1)}.play-pause-btn:hover{transform:scale(1.1)}.sound-btn{position:relative;bottom:auto;right:auto}
/*# sourceMappingURL=/cdn/shop/t/9/assets/video-carousel.css.map */