/* general card layout and interaction feedback */
.card {
    box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1),
                0 1px 2px -1px rgb(0 0 0 / 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card:hover {
    transform: scale(1.02);
    /* Hover shadow - using Tailwind's "shadow-lg" */
    box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1),
                0 4px 6px -4px rgb(0 0 0 / 0.1);
    cursor: pointer;
}

.card-body {
    z-index: 3;
    background: transparent;
}