/* Elementor-Pro-Galerie: Titel/Beschreibung unter dem Bild (Masonry). */

/* Item-Rahmen/Rundung/Clipping wandern vom Item auf das Bild, damit der Text nicht mitgerahmt wird. */
.gcb-caption-below .elementor-gallery-item {
	overflow: visible;
	border: 0;
	border-radius: 0;
}

.gcb-caption-below .e-gallery-image {
	border-radius: var(--image-border-radius, 0);
	box-shadow: inset 0 0 0 var(--image-border-width, 0) var(--image-border-color, transparent);
}

/* Bild-Hover-Animationen (Zoom etc.) würden sonst in den Text ragen. */
.gcb-caption-below .e-gallery-image {
	transform: none !important;
}

.gcb-caption-below .elementor-gallery-item__overlay {
	display: none;
}

.gcb-caption-below .elementor-gallery-item__content {
	position: static;
	display: block;
	width: 100%;
	height: auto;
	box-sizing: border-box;
	padding: var(--gcb-gap, 10px) 0 0;
	text-align: var(--content-text-align, inherit);
}

/* Overlay-Einblend-Animationen deaktivieren: Text ist immer sichtbar. */
.gcb-caption-below .elementor-gallery-item__content > div {
	opacity: 1 !important;
	transform: none !important;
	transition: none;
}

.gcb-caption-below .elementor-gallery-item__title {
	color: var(--gcb-title-color, inherit);
}

.gcb-caption-below .elementor-gallery-item__description {
	color: var(--gcb-description-color, inherit);
}

/* Masonry & Justified: Höhe und Positionen setzt das Skript in Pixeln (Bild + Text). */
.gcb-caption-below .e-gallery-masonry,
.gcb-caption-below .e-gallery-justified,
.gcb-caption-below .e-gallery-grid {
	padding-bottom: 0 !important;
}

.gcb-caption-below .e-gallery-masonry {
	margin-bottom: 0;
}

/*
 * Grid: E-Gallery schaltet während der Animation kurz auf feste Zeilenhöhen
 * (absolute Positionierung). Mit Text würde das überlappen, daher immer das
 * normale CSS-Grid verwenden – dort wachsen die Zeilen mit dem Text.
 */
.gcb-caption-below .e-gallery-grid.e-gallery--animated {
	display: grid;
	grid-gap: var(--vgap) var(--hgap);
	grid-template-columns: repeat(var(--columns), 1fr);
}

.gcb-caption-below .e-gallery-grid.e-gallery--animated .e-gallery-item {
	position: relative;
	top: auto;
	left: auto;
	right: auto;
	width: auto;
}

.gcb-caption-below .e-gallery-grid .e-gallery-item.e-gallery-item--hidden {
	position: absolute;
}