.wwts-life-gallery-widget:not(:has(.wwts-rf-life-gallery)),
.wwts-idem-gallery-widget:not(:has(.wwts-rf-idem-gallery)),
.wwts-home-gallery-widget:not(:has(.wwts-rf-home-gallery)) {
    display: none;
}

/* Elementor owns the media-section composition. Generated gallery output only
 * supplies the data-driven grid/lightbox and lets empty sections collapse. */
.wwts-life-media-section:not(:has(.wwts-rf-life-gallery, iframe, video, .elementor-video)),
.wwts-idem-media-section:not(:has(.wwts-rf-idem-gallery, iframe, video, .elementor-video)),
.wwts-home-media-section:not(:has(.wwts-rf-home-gallery, iframe, video, .elementor-video)) {
    display: none !important;
}

.wwts-rf-life-gallery,
.wwts-rf-idem-gallery,
.wwts-rf-home-gallery {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

/* Home media can contain source images with a white canvas. Keep a visible
 * separator between adjacent cells by painting the grid gap with the accepted
 * dark media-surface color. */
.wwts-rf-home-gallery {
    gap: 20px !important;
    background-color: #1E1B17;
}

/* LIFE, IDEM and Home use a uniform editorial grid. Override the shared Brand
 * history hero/two-item spans so every image always occupies one grid cell. */
.wwts-rf-life-gallery .wwts-rf-life-gallery__item,
.wwts-rf-idem-gallery .wwts-rf-idem-gallery__item,
.wwts-rf-home-gallery .wwts-rf-home-gallery__item {
    grid-column: auto !important;
    align-self: stretch;
    aspect-ratio: 4 / 3;
    background: #24211d;
}

.wwts-rf-life-gallery .wwts-rf-lightbox-trigger,
.wwts-rf-idem-gallery .wwts-rf-lightbox-trigger,
.wwts-rf-home-gallery .wwts-rf-lightbox-trigger {
    width: 100%;
    height: 100%;
}

.wwts-rf-life-gallery .wwts-rf-life-gallery__image,
.wwts-rf-idem-gallery .wwts-rf-idem-gallery__image,
.wwts-rf-home-gallery .wwts-rf-home-gallery__image {
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    object-fit: cover;
}

/* Home product/editorial shots often include meaningful white canvas around the
 * object. Preserve each source image's natural ratio instead of forcing the
 * LIFE/IDEM 4:3 crop. Columns remain uniform and JavaScript upgrades the Home
 * grid to masonry after measuring the rendered item heights. */
.wwts-rf-home-gallery .wwts-rf-home-gallery__item {
    align-self: start;
    aspect-ratio: auto;
}

.wwts-rf-home-gallery .wwts-rf-lightbox-trigger {
    height: auto;
}

.wwts-rf-home-gallery .wwts-rf-home-gallery__image {
    height: auto;
    object-fit: contain;
}

/* Masonry keeps the normal CSS grid as a no-JS fallback. Once measured, each
 * item spans the exact number of 1px implicit rows it needs plus one visual
 * gap. Horizontal column gaps remain controlled by the responsive rules below. */
.wwts-rf-home-gallery.is-masonry-ready {
    grid-auto-rows: 1px;
    row-gap: 0 !important;
}

@media (max-width: 1024px) {
    .wwts-rf-life-gallery,
    .wwts-rf-idem-gallery,
    .wwts-rf-home-gallery {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
    }

    .wwts-rf-home-gallery {
        gap: 16px !important;
    }
}

@media (max-width: 767px) {
    .wwts-rf-life-gallery,
    .wwts-rf-idem-gallery,
    .wwts-rf-home-gallery {
        grid-template-columns: minmax(0, 1fr);
        gap: 14px;
    }

    .wwts-rf-home-gallery {
        gap: 14px !important;
    }
}
