.product-3d-marquee-section{position:relative;width:100%;overflow:hidden;padding:4rem 0}.marquee-3d-container{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:600px;overflow:hidden;perspective-origin:center center}.marquee-3d-wrapper{display:flex;flex-direction:row;align-items:center;gap:1.5rem;transform-style:preserve-3d;will-change:transform}.marquee-3d-column{display:flex;flex-direction:column;gap:1rem;min-width:280px;max-width:320px;will-change:transform}.marquee-3d-track{display:flex;flex-direction:column;gap:1rem;animation:marquee-scroll var(--marquee-duration, 20s) linear infinite;will-change:transform}.marquee-reverse .marquee-3d-track{animation-direction:reverse}.product-3d-marquee-section[data-pause-on-hover=true]:hover .marquee-3d-track{animation-play-state:paused}@keyframes marquee-scroll{0%{transform:translateY(0)}to{transform:translateY(-50%)}}.marquee-3d-card{position:relative;width:100%;cursor:pointer;transition:transform .3s cubic-bezier(.4,0,.2,1);will-change:transform}.marquee-3d-card:hover{transform:scale(1.05) translateZ(20px);z-index:10}.marquee-card-inner{position:relative;display:flex;flex-direction:column;background:var(--color-background);border:1px solid rgba(0,0,0,.1);border-radius:.5rem;overflow:hidden;transition:all .3s ease;box-shadow:0 2px 8px #00000014}.marquee-3d-card:hover .marquee-card-inner{border-color:#0003;box-shadow:0 8px 24px #00000026}.color-scheme-dark .marquee-card-inner,.dark .marquee-card-inner{background:#ffffff0d;border-color:#ffffff1a}.color-scheme-dark .marquee-3d-card:hover .marquee-card-inner,.dark .marquee-3d-card:hover .marquee-card-inner{background:#ffffff1a;border-color:#fff3}.marquee-card-media{position:relative;width:100%;aspect-ratio:1 / 1;overflow:hidden;background:#00000005}.marquee-card-img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.4,0,.2,1)}.marquee-3d-card:hover .marquee-card-img{transform:scale(1.1)}.marquee-card-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f5f5f5,#e0e0e0)}.marquee-card-placeholder svg{width:60%;height:60%;opacity:.3}.marquee-card-overlay{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;background:#0006;opacity:0;transition:opacity .3s ease;z-index:2}.marquee-3d-card:hover .marquee-card-overlay{opacity:1}.marquee-quick-view-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:#fff;color:#000;border:none;border-radius:.375rem;font-weight:500;font-size:.875rem;cursor:pointer;transition:all .2s ease;transform:translateY(10px);box-shadow:0 4px 12px #0003}.marquee-3d-card:hover .marquee-quick-view-btn{transform:translateY(0)}.marquee-quick-view-btn:hover{background:#f5f5f5;transform:translateY(-2px);box-shadow:0 6px 16px #00000040}.marquee-quick-view-btn .icon{width:1.25rem;height:1.25rem}.marquee-card-info{padding:1rem;display:flex;flex-direction:column;gap:.5rem}.marquee-card-title{margin:0;font-size:.875rem;font-weight:600;line-height:1.3;color:var(--color-foreground);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.marquee-card-link{text-decoration:none;color:inherit;transition:color .2s ease}.marquee-card-link:hover{color:var(--color-link)}.marquee-card-price{font-size:.875rem;font-weight:500;color:var(--color-foreground)}.marquee-card-info .badge{align-self:flex-start;margin-bottom:.25rem}.marquee-3d-gradient{position:absolute;pointer-events:none;z-index:5;background:linear-gradient(to bottom,var(--color-background) 0%,transparent 100%)}.marquee-3d-gradient--top{top:0;left:0;right:0;height:25%;background:linear-gradient(to bottom,var(--color-background) 0%,transparent 100%)}.marquee-3d-gradient--bottom{bottom:0;left:0;right:0;height:25%;background:linear-gradient(to top,var(--color-background) 0%,transparent 100%)}.marquee-3d-gradient--left{top:0;bottom:0;left:0;width:15%;background:linear-gradient(to right,var(--color-background) 0%,transparent 100%)}.marquee-3d-gradient--right{top:0;bottom:0;right:0;width:15%;background:linear-gradient(to left,var(--color-background) 0%,transparent 100%)}@media screen and (max-width: 989px){.marquee-3d-container{height:500px;perspective:250px!important}.marquee-3d-wrapper{gap:1rem;transform:translate(-50px) translateY(0) translateZ(-50px) rotateX(15deg) rotateY(-5deg) rotate(10deg)!important}.marquee-3d-column{min-width:200px;max-width:240px}.marquee-card-info{padding:.75rem}.marquee-card-title{font-size:.8125rem}.marquee-quick-view-btn{padding:.625rem 1.25rem;font-size:.8125rem}}@media screen and (max-width: 749px){.product-3d-marquee-section{padding:2rem 0}.marquee-3d-container{height:450px;perspective:200px!important}.marquee-3d-wrapper{gap:.75rem;transform:translate(-30px) translateY(0) translateZ(-30px) rotateX(10deg) rotateY(-3deg) rotate(8deg)!important}.marquee-3d-column{min-width:160px;max-width:200px}.marquee-3d-track{gap:.75rem}.marquee-card-info{padding:.625rem;gap:.375rem}.marquee-card-title{font-size:.75rem;-webkit-line-clamp:1}.marquee-card-price{font-size:.75rem}.marquee-quick-view-btn{padding:.5rem 1rem;font-size:.75rem}.marquee-quick-view-btn .btn-text{display:none}.marquee-quick-view-btn .icon{width:1rem;height:1rem}}@media screen and (max-width: 480px){.marquee-3d-container{height:400px}.marquee-3d-column{min-width:140px;max-width:180px}.marquee-3d-column:nth-child(n+3){display:none}.marquee-3d-wrapper{gap:.5rem}}@media (prefers-reduced-motion: reduce){.marquee-3d-track{animation:none}.marquee-3d-card,.marquee-card-img,.marquee-card-overlay,.marquee-quick-view-btn{transition:none}}.marquee-quick-view-btn:focus-visible,.marquee-card-link:focus-visible{outline:2px solid var(--color-link);outline-offset:2px}.marquee-3d-track,.marquee-3d-card,.marquee-card-img{-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.marquee-3d-wrapper,.marquee-3d-column,.marquee-3d-track{transform:translateZ(0);will-change:transform}
/*# sourceMappingURL=/cdn/shop/t/2/assets/product-3d-marquee.css.map */
