/* Only apply hover effects on devices that actually support hover */
@media (hover: hover) and (pointer: fine) {
    .blkymal:hover .ymal-excerpt {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Separate styles for touch devices */
@media (hover: none) and (pointer: coarse) {
    .blkymal.touch-active .ymal-excerpt {
        opacity: 1;
        transform: translateY(0);
    }
}