.cl-root .cl-hero--3d{--cl-3d-perspective: 3060px;--cl-3d-z-scale: .9;--cl-3d-badge: #a7b9a4;--cl-3d-lift: clamp(16px, 4.2vw, 60.8px);--cl-3d-rise-dur: .52s;--cl-3d-rise-ease: cubic-bezier(.3, .08, .2, 1);padding-bottom:calc(var(--cl-hero-pb) + var(--cl-3d-lift))}.cl-root .cl-hero--3d .cl-hero__inner{padding-top:calc(clamp(24px,4.22vw,60.8px) - var(--cl-3d-lift));perspective:var(--cl-3d-perspective);perspective-origin:50% 50%}.cl-root .cl-3d{position:relative;width:90%;margin-inline:auto;aspect-ratio:848.61 / 638.84;transform-style:preserve-3d;transform:rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg))}.cl-root .cl-3d__layer{position:absolute;left:var(--x);top:var(--y);width:var(--w);height:var(--h);--zz: calc(var(--z) * var(--cl-3d-z-scale));transform:translateZ(var(--zz));transform-style:preserve-3d;transition:transform var(--cl-3d-rise-dur) var(--cl-3d-rise-ease),filter var(--cl-3d-rise-dur) var(--cl-3d-rise-ease);will-change:transform}.cl-root .cl-3d__layer img{width:100%;height:100%;object-fit:contain;pointer-events:none;transition:filter var(--cl-3d-rise-dur) var(--cl-3d-rise-ease)}.cl-root .cl-hero--3d .cl-hero__inner:hover .cl-3d__layer,.cl-root .cl-hero--3d .cl-hero__inner:focus-within .cl-3d__layer{transform:translate3d(0,calc(var(--cl-3d-stage-travel, 6px) * -1),calc(var(--zz) * 1.2 + var(--cl-3d-stage-depth, 24px)))}.cl-root .cl-hero--3d .cl-hero__inner .cl-3d__layer:hover,.cl-root .cl-hero--3d .cl-hero__inner .cl-3d__layer:focus-visible{transform:translate3d(0,calc(var(--cl-3d-hover-travel, 18px) * -1),calc(var(--zz) * 1.2 + var(--cl-3d-hover-depth, 44px)));z-index:50}.cl-root .cl-hero--3d .cl-hero__inner .cl-3d__layer--badge:hover,.cl-root .cl-hero--3d .cl-hero__inner .cl-3d__layer--badge:focus-visible{transform:translate3d(0,calc(var(--cl-3d-badge-travel, 7px) * -1),calc(var(--zz) * 1.2 + var(--cl-3d-badge-depth, 34px)))}.cl-root .cl-hero--3d .cl-hero__inner:hover .cl-3d__layer img{filter:drop-shadow(0 10px 16px rgba(16,24,40,.16))}.cl-root .cl-hero--3d .cl-hero__inner .cl-3d__layer:hover img,.cl-root .cl-hero--3d .cl-hero__inner .cl-3d__layer:focus-visible img{filter:drop-shadow(0 16px 22px rgba(16,24,40,.28))}.cl-root .cl-3d__badge{width:100%;height:100%;overflow:visible;animation:cl-3d-spin var(--cl-3d-badge-spin, 24s) linear infinite;transform-origin:50% 50%}.cl-root .cl-hero--3d .cl-hero__inner:hover .cl-3d__badge{animation-duration:var(--cl-3d-badge-spin-hover, 12s)}@keyframes cl-3d-spin{to{transform:rotate(360deg)}}.cl-root .cl-3d__badge text{fill:var(--cl-3d-badge);font-family:var(--cl-font);font-size:var(--cl-3d-badge-size, 15px);font-weight:600;letter-spacing:0}@media(max-width:639px){.cl-root .cl-hero--3d{--cl-3d-perspective: 1500px;--cl-3d-z-scale: .5;--cl-3d-lift: 0px}}@media(prefers-reduced-motion:reduce){.cl-root .cl-3d__badge{animation:none}.cl-root .cl-3d{transform:none}.cl-root .cl-hero--3d .cl-hero__inner .cl-3d__layer,.cl-root .cl-hero--3d .cl-hero__inner:hover .cl-3d__layer,.cl-root .cl-hero--3d .cl-hero__inner .cl-3d__layer:hover,.cl-root .cl-hero--3d .cl-hero__inner .cl-3d__layer:focus-visible{transform:translateZ(var(--zz));transition:none}}
/*# sourceMappingURL=/cdn/shop/t/32/assets/hero-3d.css.map */