@keyframes autoRun3d{0%{transform:perspective(800px)rotateY(-360deg)}to{transform:perspective(800px)rotateY(0)}}@keyframes animateBrightness{10%{filter:brightness()}50%{filter:brightness(.1)}90%{filter:brightness()}}.card-3d{width:400px;height:200px;transform-style:preserve-3d;will-change:transform;animation:20s linear infinite autoRun3d;position:relative;transform:perspective(800px)}.card-3d div{border:solid 1px var(--accent-a12);transform-origin:50%;will-change:transform, filter;width:92px;height:129px;box-shadow:0 0 8px var(--accent-a08);border-radius:.5rem;transition-duration:.2s;animation:20s linear infinite animateBrightness;position:absolute;top:50%;left:50%;overflow:hidden}.card-3d div img{object-fit:cover;border-radius:.375rem;width:100%;height:100%}.card-3d div:first-child{animation-delay:0s;transform:translate(-50%,-50%)rotateY(0)translateZ(150px)}.card-3d div:nth-child(2){animation-delay:-2.5s;transform:translate(-50%,-50%)rotateY(45deg)translateZ(150px)}.card-3d div:nth-child(3){animation-delay:-5s;transform:translate(-50%,-50%)rotateY(90deg)translateZ(150px)}.card-3d div:nth-child(4){animation-delay:-7.5s;transform:translate(-50%,-50%)rotateY(135deg)translateZ(150px)}.card-3d div:nth-child(5){animation-delay:-10s;transform:translate(-50%,-50%)rotateY(180deg)translateZ(150px)}.card-3d div:nth-child(6){animation-delay:-12.5s;transform:translate(-50%,-50%)rotateY(225deg)translateZ(150px)}.card-3d div:nth-child(7){animation-delay:-15s;transform:translate(-50%,-50%)rotateY(270deg)translateZ(150px)}.card-3d div:nth-child(8){animation-delay:-17.5s;transform:translate(-50%,-50%)rotateY(315deg)translateZ(150px)}
