.hero-art[data-hero-cards]{container-type:size}.hero-card-fan{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:2;perspective:1200px}.hero-featured-card{position:absolute;left:50%;top:50%;height:min(84cqh,74cqw);width:calc(min(84cqh,74cqw) * var(--card-ratio));aspect-ratio:var(--card-ratio);transform:translate(calc(-50% + var(--fan-x)),calc(-50% + var(--fan-y))) rotate(var(--fan-angle)) scale(var(--fan-scale));transform-origin:50% 50%}.hero-featured-card[data-position=left]{--fan-x:-60%;--fan-y:9%;--fan-angle:-10deg;--fan-scale:.85;--fan-delay:0ms;z-index:1}.hero-featured-card[data-position=center]{--fan-x:0%;--fan-y:-5%;--fan-angle:0deg;--fan-scale:1;--fan-delay:80ms;z-index:3}.hero-featured-card[data-position=right]{--fan-x:60%;--fan-y:9%;--fan-angle:10deg;--fan-scale:.85;--fan-delay:.16s;z-index:2}.hero-card-float{position:absolute;top:0;right:0;bottom:0;left:0;transform-style:preserve-3d}.hero-featured-card{pointer-events:auto}.hero-card-touch{position:absolute;top:0;right:0;bottom:0;left:0;transform-style:preserve-3d;transform:perspective(850px) rotateX(0) rotateY(0);transition:transform .22s cubic-bezier(.2,.7,.2,1)}.hero-featured-card[data-card-hover] .hero-card-touch{transform:perspective(850px) translateY(-6px) rotateX(var(--card-tilt-x,0deg)) rotateY(var(--card-tilt-y,0deg)) scale(1.025)}.hero-card-turn{position:absolute;top:0;right:0;bottom:0;left:0;transform-style:preserve-3d;transform:rotateY(0)}.hero-card-front,.hero-card-back{position:absolute;top:0;right:0;bottom:0;left:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:8px}.hero-card-front{transform:translateZ(.5px)}.hero-card-photo{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 12px 14px #0005)}.hero-art .hero-card-back{--fish-mark:var(--hero-back-fish);padding:10% 6% 8%}.hero-art .hero-card-back .brand-transparent-mark{width:55%}.hero-card-shimmer{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(110deg,transparent 40%,#fff6ddb3 49%,#fff9ec33 53%,transparent 61%);background-size:300% 100%;background-position:140% 0;mask:var(--card-image) center / contain no-repeat;-webkit-mask:var(--card-image) center / contain no-repeat;opacity:0;pointer-events:none}.hero-card-glint{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at var(--glint-x,50%) var(--glint-y,30%),#fff7e744,transparent 62%);mask:var(--card-image) center / contain no-repeat;-webkit-mask:var(--card-image) center / contain no-repeat;opacity:0;pointer-events:none;transition:opacity .22s ease}.hero-featured-card[data-card-hover] .hero-card-glint{opacity:1}.hero-art[data-hero-cards] .hero-pack--front{width:64%;left:18%;transform:none}.hero-art[data-fan-ready]>.hero-pack--front{visibility:hidden}.hero-rip-pack{position:absolute;left:50%;top:50%;width:min(64%,66.6667cqh);aspect-ratio:2 / 3;transform:translate(-50%,-50%);pointer-events:none;z-index:3}.hero-rip-top,.hero-rip-bottom{position:absolute;top:0;right:0;bottom:0;left:0;transform-origin:50% 7%;opacity:0}.hero-rip-image{display:block;width:100%;height:100%;object-fit:contain}.hero-rip-top{clip-path:polygon(0 0,100% 0,100% 7%,92% 7.6%,84% 6.8%,76% 7.5%,68% 6.7%,60% 7.6%,52% 6.8%,44% 7.4%,36% 6.6%,28% 7.5%,20% 6.8%,12% 7.5%,0 7%)}.hero-rip-bottom{clip-path:polygon(0 7%,12% 7.5%,20% 6.8%,28% 7.5%,36% 6.6%,44% 7.4%,52% 6.8%,60% 7.6%,68% 6.7%,76% 7.5%,84% 6.8%,92% 7.6%,100% 7%,100% 100%,0 100%)}.hero-rip-seam{position:absolute;top:7%;left:4%;width:92%;height:2px;opacity:0;transform-origin:left center;background:linear-gradient(90deg,transparent,#fff5cd 45%,#ffffff 75%,transparent);box-shadow:0 0 9px #ffdfa580}.hero-slide[data-active] .hero-art[data-fan-ready] .hero-rip-seam{animation:hero-seam-shimmer 1.4s .2s ease-out both}.hero-slide[data-active] .hero-art[data-fan-ready] .hero-rip-top{animation:hero-tear-top .33s 1.6s cubic-bezier(.3,.05,.2,1) both}.hero-slide[data-active] .hero-art[data-fan-ready] .hero-rip-bottom{animation:hero-tear-bottom .4s 1.64s cubic-bezier(.3,.05,.2,1) both}.hero-slide[data-active] .hero-art[data-fan-ready] .hero-featured-card{animation:hero-card-emerge .6s 1.86s cubic-bezier(.22,.75,.2,1) both}.hero-slide[data-active] .hero-art[data-fan-ready] .hero-card-turn{animation:hero-card-flip .72s 2.64s cubic-bezier(.38,.05,.2,1) both}.hero-slide[data-active] .hero-art[data-fan-ready] .hero-card-shimmer{animation:hero-card-shimmer .72s 2.84s ease-in-out both}@keyframes hero-seam-shimmer{0%{opacity:0;transform:scaleX(0)}35%{opacity:1}75%{opacity:1;transform:scaleX(1)}to{opacity:0;transform:scaleX(1)}}@keyframes hero-tear-top{0%{opacity:1;transform:none}38%{opacity:1}to{opacity:0;transform:translate(-16%,-18%) rotate(-16deg)}}@keyframes hero-tear-bottom{0%{opacity:1;transform:none}30%{opacity:1}to{opacity:0;transform:translateY(35%) rotate(6deg) scale(.92)}}@keyframes hero-card-emerge{0%{opacity:0;transform:translate(-50%,5%) scale(.55)}20%{opacity:1}to{opacity:1;transform:translate(calc(-50% + var(--fan-x)),calc(-50% + var(--fan-y))) rotate(var(--fan-angle)) scale(var(--fan-scale))}}@keyframes hero-card-flip{0%{transform:rotateY(180deg)}to{transform:rotateY(0)}}@keyframes hero-card-shimmer{0%{opacity:0;background-position:140% 0}20%{opacity:.9}80%{opacity:.6}to{opacity:0;background-position:-40% 0}}.hero-slide[data-active] .hero-art[data-fan-ready] .hero-card-float{animation:hero-card-float 4.8s calc(3.69s + var(--fan-delay)) ease-in-out infinite}.hero-card-motes{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;pointer-events:none}.hero-card-motes i{position:absolute;bottom:16%;width:2px;height:2px;border-radius:50%;background:#fff4db;opacity:0}.hero-card-motes i:nth-child(3n){width:3px;height:3px}.hero-slide[data-active] .hero-card-motes i{animation:hero-mote-rise 4.2s calc(3.59s + var(--mote-i) * .42s) linear infinite}@keyframes hero-card-float{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes hero-mote-rise{0%{opacity:0;transform:translate(0)}15%{opacity:.6}75%{opacity:.32}to{opacity:0;transform:translate(9px,-180px)}}@media(max-width:749px){.hero-featured-card{height:min(84cqh,80cqw);width:calc(min(84cqh,80cqw) * var(--card-ratio))}}@media(prefers-reduced-motion:reduce){.hero-card-touch,.hero-card-glint{transition:none}.hero-featured-card[data-card-hover] .hero-card-touch{transform:none}.hero-slide[data-active] .hero-art[data-fan-ready] :is(.hero-featured-card,.hero-card-turn,.hero-card-float,.hero-card-shimmer,.hero-rip-top,.hero-rip-bottom,.hero-rip-seam,.hero-card-motes i){animation:none}}
/*# sourceMappingURL=/cdn/shop/t/6/assets/hero-cards.css.map */