.zoom {
    display: inline-block;  
    position: relative;
    overflow: hidden;  
    border-radius: 12px;  
    line-height: 0;  
}

    .zoom img {
        display: block;
        width: 100%;
        object-fit: cover;  
        transform: scale(1);
        transition: transform .35s ease, filter .35s ease;
        will-change: transform;
    }

  
    .zoom:hover img,
    .zoom:focus-visible img {
        transform: scale(1.02); 
        filter: brightness(.98) contrast(1.02);  
    }

    
    .zoom:hover {
        box-shadow: 0 10px 24px rgba(0,0,0,.18);
    }

 
@media (prefers-reduced-motion: reduce) {
    .zoom img, .zoom {
        transition: none;
    }
}