/*
 * Mizuki event projects: natural-height masonry for mixed-ratio photography.
 * The extra widget class wins over the original page-level grid declarations,
 * even when Elementor prints those declarations after the global stylesheet.
 * Workshops and the Visual Portfolio Events index already use masonry.
 */
.mz-event .elementor-widget-glacier-gallery.mz-event-gallery .widget-gallery {
    --mz-event-gallery-gap: 32px;
    display: block;
    grid-template-columns: none;
    row-gap: 0;
    column-count: 3;
    column-width: auto;
    column-gap: var(--mz-event-gallery-gap);
    column-fill: balance;
}

.mz-event .elementor-widget-glacier-gallery.mz-event-gallery .widget-gallery > a {
    display: block;
    width: 100%;
    padding: 0;
    margin: 0 0 var(--mz-event-gallery-gap);
    -webkit-column-break-inside: avoid;
    break-inside: avoid;
}

.mz-event .elementor-widget-glacier-gallery.mz-event-gallery .widget-gallery > a > img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    margin: 0;
}

.mz-event .elementor-widget-glacier-gallery.mz-event-gallery .widget-gallery > a:focus-visible {
    outline: 2px solid #000;
    outline-offset: 5px;
}

@media (max-width: 1024px) {
    .mz-event .elementor-widget-glacier-gallery.mz-event-gallery .widget-gallery {
        --mz-event-gallery-gap: 24px;
        column-count: 2;
    }
}

@media (max-width: 767px) {
    .mz-event .elementor-widget-glacier-gallery.mz-event-gallery .widget-gallery {
        --mz-event-gallery-gap: 28px;
        column-count: 1;
    }
}