.card-stack-hero{position:relative;width:100%;padding:1rem 0 2rem;display:flex;flex-direction:column;background-color:rgb(var(--color-background));color:rgb(var(--color-foreground));overflow:hidden}.card-stack-hero__heading-wrapper{display:flex;align-items:flex-start;justify-content:center;padding-bottom:4rem;z-index:10}.card-stack-hero__heading{font-family:var(--font-heading-family);font-size:clamp(2rem,4vw,4rem);text-align:center;margin:0;padding:0 1rem;line-height:1.2}.card-stack-hero__stack-wrapper{width:100%;display:flex;align-items:center;justify-content:center;position:relative;padding-bottom:3rem}.stack-iman{position:relative;width:85%;max-width:500px;aspect-ratio:3 / 2;display:flex;align-items:center;justify-content:center;transform-style:preserve-3d}.stack__item{position:absolute;width:100%;height:100%;background:#fff;border-radius:var(--media-radius, 8px);box-shadow:0 10px 20px #00000026;display:flex;align-items:center;justify-content:center;overflow:hidden;cursor:pointer;backface-visibility:hidden;opacity:1;pointer-events:auto;transform:translateZ(0)}@media screen and (min-width:750px){.card-stack-hero{padding:2rem 0 3rem}.stack-iman{width:80%;max-width:900px}}.stack__item img{width:100%;height:100%;object-fit:cover;pointer-events:none}.stack__item--accept{animation:imanAccept .5s forwards}.stack__item--reject{animation:imanReject .5s forwards}@keyframes imanAccept{0%{transform:translateZ(0) rotate3d(0,0,1,0)}to{transform:translate3d(300px,0,0) rotate3d(0,0,1,15deg);opacity:0;pointer-events:none}}@keyframes imanReject{0%{transform:translateZ(0) rotate3d(0,0,1,0)}to{transform:translate3d(-300px,0,0) rotate3d(0,0,1,-15deg);opacity:0;pointer-events:none}}.card-stack-hero__bottom-wrapper{flex-shrink:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-bottom:2rem;z-index:10}.card-stack-hero__indicator-text{font-family:var(--font-body-family);font-size:1.4rem;letter-spacing:.1em;text-transform:uppercase;margin-bottom:.5rem;animation:pulseOpacity 3s infinite alternate}.card-stack-hero__indicator-arrow{width:20px;height:20px;border-right:2px solid rgb(var(--color-foreground));border-bottom:2px solid rgb(var(--color-foreground));transform:rotate(45deg);animation:arrowBounce 2s infinite}@keyframes pulseOpacity{0%{opacity:.4}to{opacity:1}}@keyframes arrowBounce{0%,20%,50%,80%,to{transform:translateY(0) rotate(45deg);opacity:1}40%{transform:translateY(-10px) rotate(45deg);opacity:.5}60%{transform:translateY(-5px) rotate(45deg);opacity:.8}}
/*# sourceMappingURL=/cdn/shop/t/9/assets/card-stack.css.map */