.gallery-box-17fd766b {
    box-sizing: border-box;
    width: 100%;
}

.gallery-grid-17fd766b {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    width: 100%;
    aspect-ratio: 16 / 6.5; /* Increases width in comparison to height */
}

.gallery-image-17fd766b {
    position: relative;
    overflow: hidden;
    display: flex;
}

.gallery-image-17fd766b img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease, opacity 0.4s ease;
}

/* Item Placement Rules */
.item-1-17fd766b {
    grid-column: 1;
    grid-row: 1 / span 2;
}

.item-2-17fd766b {
    grid-column: 2 / span 2;
    grid-row: 1;
}

.item-3-17fd766b {
    grid-column: 2;
    grid-row: 2;
}

.item-4-17fd766b {
    grid-column: 3;
    grid-row: 2;
}

/* Hover Animations */
.gallery-image-17fd766b.hover-zoom:hover img {
    transform: scale(1.06);
}

.gallery-image-17fd766b.hover-opacity:hover img {
    opacity: 0.8;
}

/* Responsive adjustments */
@media (max-width: 767px) {
    .gallery-grid-17fd766b {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        aspect-ratio: auto; /* Allow organic vertical stacking on mobile */
    }
    .gallery-image-17fd766b {
        aspect-ratio: 16 / 9;
    }
    .item-1-17fd766b,\n    .item-2-17fd766b,\n    .item-3-17fd766b,\n    .item-4-17fd766b {
        grid-column: span 1 !important;
        grid-row: auto !important;
    }
}
