.card{overflow:hidden;color:#fff;border:1px solid #474466;border-radius:var(--rounded);position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.25rem;--tw-bg-opacity: 1;background-color:rgb(27 27 49 / var(--tw-bg-opacity));padding:1rem;will-change:transform;transition:scale .2s ease-in-out}.card.fade:before{position:absolute;content:"";top:0;left:0;width:100%;height:100%;background:linear-gradient(90deg,rgb(27,27,49) 0%,transparent 20%,transparent 80%,rgb(27,27,49) 100%);z-index:1}.card:hover{scale:1.05;transform:translate(var(--x),var(--y))}.content{will-change:transform}.card:hover .content>*{transform:translate(calc(-1 * var(--x)),calc(-1 * var(--y)))}.content-hs{overflow:hidden}.card .content-hs>*{scale:calc(1 + var(--offset))}