:root{--card-border-color:#0ea5e9;--card-border-width:3px;--card-animation-duration:.4s;--card-scale-duration:.3s;--card-border-radius:8px}.hover-card{border-radius:var(--card-border-radius);transition:transform var(--card-scale-duration) ease-in-out;cursor:pointer;box-sizing:border-box;background-color:#fff;border:1px solid #e5e7eb;padding:.65rem;position:relative;overflow:hidden;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a}.hover-card-content{z-index:1;position:relative}.hover-card:hover{border-color:#0000;transform:scale(1.03)}.hover-card:before,.hover-card:after{content:"";pointer-events:none;border-radius:inherit;border:var(--card-border-width) solid var(--card-border-color);opacity:0;transition:opacity var(--card-animation-duration) ease-out;box-sizing:border-box;position:absolute;inset:0}.hover-card:before{clip-path:polygon(0 0,0 0,0 100%,0 100%);transition:clip-path calc(var(--card-animation-duration) / 2) ease-in, opacity calc(var(--card-animation-duration) / 2) ease-in}.hover-card:after{clip-path:polygon(0 0,100% 0,100% 0,0 0);transition:clip-path calc(var(--card-animation-duration) / 2) ease-out calc(var(--card-animation-duration) / 2), opacity calc(var(--card-animation-duration) / 2) ease-out calc(var(--card-animation-duration) / 2)}.hover-card:hover:before,.hover-card:hover:after{clip-path:polygon(0 0,100% 0,100% 100%,0 100%);opacity:1}.hover-card:not(:hover):before,.hover-card:not(:hover):after{opacity:0;transition-duration:calc(var(--card-animation-duration) / 2);transition-timing-function:ease-out}.hover-card:not(:hover):before{transition-delay:calc(var(--card-animation-duration) / 2)}.hover-card:not(:hover):after{transition-delay:0s}.hover-card.image-hidden img{display:none}
