/* Houdt de ingezoomde afbeelding binnen haar eigen kader */
.hover-zoom {
    overflow: hidden;
}

/* Normale toestand */
.hover-zoom img {
    display: block;
    width: 100%;
    transition: transform 0.18s ease-out;
    transform: scale(1);
    transform-origin: center;
    will-change: transform;
}

/* Wanneer je met de muis over de afbeelding gaat */
.hover-zoom:hover img {
    transform: scale(1.07);
}

/* Houd rekening met bezoekers die animaties uitschakelen */
@media (prefers-reduced-motion: reduce) {
    .hover-zoom img {
        transition: none;
    }

    .hover-zoom:hover img {
        transform: none;
    }
}