/* Container Defaults */
.nazcalab-gallery-container {
    display: grid;
    width: 100%;
    box-sizing: border-box;
}

.nazcalab-gallery-item {
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
}

.nazcalab-gallery-item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.3s ease;
}

.nazcalab-gallery-image {
    width: 100%;
    height: 100%;
    position: relative;
}

/* Aspect Ratios (Only applied if class exists) */
.nazcalab-ratio-11 .nazcalab-gallery-image { padding-bottom: 100%; height: 0; }
.nazcalab-ratio-43 .nazcalab-gallery-image { padding-bottom: 75%; height: 0; }
.nazcalab-ratio-34 .nazcalab-gallery-image { padding-bottom: 133.33%; height: 0; }
.nazcalab-ratio-169 .nazcalab-gallery-image { padding-bottom: 56.25%; height: 0; }
.nazcalab-ratio-916 .nazcalab-gallery-image { padding-bottom: 177.78%; height: 0; }

[class*="nazcalab-ratio-"] .nazcalab-gallery-image img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
}

/* Masonry Layout - Isotope overrides grid */
.nazcalab-gallery-layout-masonry {
    display: block; /* Isotope needs block container */
}
.nazcalab-gallery-layout-masonry .nazcalab-gallery-item {
    float: left;
    /* Width set by JS/Inline styles */
}
.nazcalab-gallery-layout-masonry:after {
    content: '';
    display: block;
    clear: both;
}

/* Advanced Grid Layouts (Metro, Bento, Mosaic) */
.nazcalab-gallery-layout-metro,
.nazcalab-gallery-layout-bento,
.nazcalab-gallery-layout-mosaic {
    grid-auto-flow: dense;
}

/* Pattern Definitions (Loop of 10 items) */

/* Metro: Boxy, some wide */
.nazcalab-gallery-layout-metro .nazcalab-layout-item-0 { grid-column: span 2; grid-row: span 2; }
.nazcalab-gallery-layout-metro .nazcalab-layout-item-3 { grid-column: span 2; }
.nazcalab-gallery-layout-metro .nazcalab-layout-item-6 { grid-column: span 2; }

/* Bento: Asymmetric */
.nazcalab-gallery-layout-bento .nazcalab-layout-item-0 { grid-column: span 2; grid-row: span 2; }
.nazcalab-gallery-layout-bento .nazcalab-layout-item-2 { grid-row: span 2; }
.nazcalab-gallery-layout-bento .nazcalab-layout-item-5 { grid-column: span 2; }
.nazcalab-gallery-layout-bento .nazcalab-layout-item-8 { grid-column: span 2; }

/* Mosaic: Vertical flow feel */
.nazcalab-gallery-layout-mosaic .nazcalab-layout-item-1 { grid-row: span 2; }
.nazcalab-gallery-layout-mosaic .nazcalab-layout-item-4 { grid-column: span 2; grid-row: span 2; }
.nazcalab-gallery-layout-mosaic .nazcalab-layout-item-7 { grid-row: span 2; }

/* Mobile Responsiveness for Grid Patterns */
@media (max-width: 767px) {
    .nazcalab-gallery-layout-metro .nazcalab-gallery-item,
    .nazcalab-gallery-layout-bento .nazcalab-gallery-item,
    .nazcalab-gallery-layout-mosaic .nazcalab-gallery-item {
        grid-column: span 1 !important;
        grid-row: span 1 !important;
    }
}

/* Captions */
.nazcalab-gallery-caption {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 15px;
    background: linear-gradient(to top, rgba(0,0,0,0.8), transparent);
    color: #fff;
    opacity: 0;
    transition: opacity 0.3s ease;
    z-index: 2;
}

.nazcalab-gallery-item:hover .nazcalab-gallery-caption {
    opacity: 1;
}

/* Anchor tag should fill */
.nazcalab-gallery-item a {
    display: block;
    width: 100%;
    height: 100%;
}
