.kare-kapsayici {
    width: 100%;
    height: 200px;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    position: relative;
}

.kare-kapsayici img {
    width: 100%;
    height: 100%;
    object-fit: cover;  /* Önemli kısım: taşısa bile doldurur */
    object-position: center; /* Ortalanmış şekilde */
    display: block;
    transition: transform 0.4s ease;
}
.kare-kapsayici:hover img {
    transform: scale(1.1);
}

.yatay-kapsayici {
    width: 100%;
    height: 500px; /* Burayı ihtiyacına göre değiştir (örneğin 200px, 250px) */
    overflow: hidden;
    position: relative;
    border-radius: 12px; /* İsteğe bağlı */
}

.yatay-kapsayici img {
    width: 100%;
    height: 100%;
    object-fit: cover;        /* Görselin oranını koruyarak doldurur */
    object-position: center;  /* Ortalanır */
    display: block;
    transition: transform 0.4s ease;
}

.yatay-kapsayici:hover img {
    transform: scale(1.05);
}