.hover-card {
    border-radius: 40px;
    overflow: hidden;

    transition:
        translate 0.5s cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 0.5s ease;

    -webkit-mask-image: -webkit-radial-gradient(white, black);
}

@media (hover: hover) and (pointer: fine) {
    .hover-card:hover {
        translate: 0 -8px;
        box-shadow: 0 20px 40px rgba(0, 0, 0, 0.12);
    }
}

@media (hover: none) {
    .hover-card:active {
        translate: 0 -4px;
    }
}