.traces-container{width:100%;max-width:2000px;height:100vh;margin:0 auto;position:relative;overflow:hidden}.traces-container .traces-nav,.traces-container .traces-footer{z-index:1;justify-content:space-between;align-items:flex-start;width:100%;padding:1rem;display:flex;position:absolute}.traces-container .traces-nav{top:0}.traces-container .traces-footer{bottom:0}.traces-container .traces-nav p,.traces-container .traces-footer p{-webkit-backdrop-filter:blur(.2rem);backdrop-filter:blur(.2rem);color:var(--base-100);background-color:#f2eeda0d;border:1px solid #f2eeda26;border-radius:.25rem;padding:.6rem 1rem}.traces-container .traces-nav .trace-name p{background-color:var(--base-100);color:var(--base-300);font-weight:600}.traces-container .traces-slider{width:100%;height:100svh;position:absolute;overflow:hidden}.traces-container .traces-slider .traces{width:300px;height:300px;position:absolute;top:42.5%;left:50%;transform:translate(-50%,-50%)}.traces-container .traces-slider .traces li{will-change:transform;aspect-ratio:4/5;filter:url(#goo);backface-visibility:hidden;perspective:1000px;justify-content:center;align-items:center;width:100%;padding:.5rem;display:flex;position:absolute;transform:translate(0,0)scale(0)}.traces-container .traces-slider .traces li .product-item-bg-wrapper,.traces-container .traces-slider .traces li .outline-wrapper,.traces-container .traces-slider .traces li .product-img-wrapper{filter:url(#goo);backface-visibility:hidden;width:100%;height:100%;position:absolute;top:0;left:0;transform:translate(0,0)}.traces-container .traces-slider .traces li .outline-wrapper{z-index:-1}.traces-container .traces-slider .traces li .product-item-bg-wrapper{z-index:0}.traces-container .traces-slider .traces li .product-img-wrapper{z-index:1;padding:.75rem}.traces-container .traces-slider .traces li .product-item-bg-wrapper .product-item-bg{clip-path:polygon(2.5rem 0%,calc(100% - 2.5rem) 0%,100% 2.5rem,100% calc(100% - 2.5rem),calc(100% - 2.5rem) 100%,2.5rem 100%,0% calc(100% - 2.5rem),0% 2.5rem);background-color:var(--base-300);z-index:0;width:100%;height:100%}.traces-container .traces-slider .traces li .outline-wrapper .product-bg-outline{clip-path:polygon(2.5rem 0%,calc(100% - 2.5rem) 0%,100% 2.5rem,100% calc(100% - 2.5rem),calc(100% - 2.5rem) 100%,2.5rem 100%,0% calc(100% - 2.5rem),0% 2.5rem);background-color:#3c3c3c;width:100%;height:100%;transform:scaleX(1.0095)scaleY(1.0075)}.traces-container .traces-slider .traces li img{clip-path:polygon(2rem 0%,calc(100% - 2rem) 0%,100% 2rem,100% calc(100% - 2rem),calc(100% - 2rem) 100%,2rem 100%,0% calc(100% - 2rem),0% 2rem);backface-visibility:hidden;width:100%;height:100%;transform:translate(0,0)}.traces-container .traces-slider .controller{-webkit-user-select:none;user-select:none;cursor:pointer;z-index:10;width:11rem;height:11rem;position:absolute;bottom:2rem;left:50%;transform:translate(-50%)translateY(300px)}.traces-container .traces-slider .controller .controller-inner{clip-path:circle(40%);will-change:clip-path;cursor:pointer;z-index:1;background:#383838;border-radius:50%;justify-content:center;align-items:center;width:5rem;height:5rem;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.traces-container .traces-slider .controller .controller-inner .controller-close-icon{width:24px;height:24px;position:relative}.traces-container .traces-slider .controller .controller-inner .controller-close-icon span{background:var(--base-100);transform-origin:50%;width:0;height:2px;position:absolute;top:50%;left:50%}.traces-container .traces-slider .controller .controller-inner .controller-close-icon span:first-child{transform:translate(-50%,-50%)rotate(45deg)}.traces-container .traces-slider .controller .controller-inner .controller-close-icon span:last-child{transform:translate(-50%,-50%)rotate(-45deg)}.traces-container .traces-slider .controller .controller-outer{background:var(--base-300);clip-path:circle(50%);will-change:clip-path;z-index:-1;border-radius:50%;width:100%;height:100%;position:absolute;top:0;left:0}.traces-container .traces-slider .controller .controller-outer .controller-label p{text-transform:uppercase;color:var(--base-1000);will-change:opacity;position:absolute;top:1.5rem;left:50%;transform:translate(-50%)}.traces-controller-nav-btn{justify-content:center;align-items:center;padding:.5rem .8rem;display:flex}.traces-container .traces-slider .controller .controller-outer .traces-controller-nav-btn{color:var(--base-100);will-change:opacity;cursor:pointer;transition:transform .3s ease-out;position:absolute;top:50%;transform:translateY(-50%)}.traces-container .traces-slider .controller .controller-outer .traces-controller-nav-btn:active{transform:translateY(-50%)scale(.75)}.traces-container .traces-slider .controller .controller-outer .traces-controller-nav-btn svg{font-size:1.5rem}.traces-container .traces-slider .controller .controller-outer .traces-controller-nav-btn.prev{left:.25rem}.traces-container .traces-slider .controller .controller-outer .traces-controller-nav-btn.next{right:.25rem}.traces-container .traces-slider .controller .controller-outer .traces-controller-nav-btn.disabled{opacity:.25;pointer-events:none}.traces-container .traces-preview{background-color:var(--base-300);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:2;border:1px solid #f2eeda26;border-radius:.5rem;flex-direction:column;gap:1rem;width:75%;height:72.5%;padding:1rem;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,100%)}.traces-container .traces-preview .traces-preview-info{justify-content:space-between;align-items:flex-end;gap:.5rem;display:flex}.traces-container .traces-preview .traces-preview-info .traces-preview-tag p{text-transform:uppercase}.traces-container .traces-preview .traces-preview-img{aspect-ratio:1;background-color:var(--base-100);border-radius:.25rem;width:100%;overflow:hidden}.traces-container .traces-preview .traces-preview-img img{object-fit:cover;width:100%;height:100%}@media (max-width:1000px){.traces-container .traces-nav,.traces-container .traces-footer{display:none}.traces-container .traces-slider .traces{top:40%}.traces-container .traces-slider .traces li .product-item-bg-wrapper,.traces-container .traces-slider .traces li .outline-wrapper,.traces-container .traces-slider .traces li .product-img-wrapper{transform:scale(.8)}.traces-container .traces-slider .controller{width:9rem;height:9rem;bottom:1rem}.traces-controller-nav-btn{padding:5px}.traces-container .traces-slider .controller .controller-outer .traces-controller-nav-btn.prev{left:.15rem}.traces-container .traces-slider .controller .controller-outer .traces-controller-nav-btn.next{right:.15rem}.traces-container .traces-slider .controller .controller-outer .controller-label p{font-size:.7rem;top:1rem}.traces-container .traces-preview{justify-content:center;width:calc(100% - 2rem);height:max-content}.traces-container .traces-slider .traces li .product-item-bg-wrapper,.traces-container .traces-slider .traces li .outline-wrapper{display:none}}
