/* =============================
   Galerie-Grid: 5 Columns
============================= */
.cc-pagemode-default .j-gallery.cta_gal .cc-m-gallery-container {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 0px;
	justify-items: center;
	align-items: start;
	padding: 0;
	overflow: visible;

}

/* Globale Bilder-Stile */
.cc-pagemode-default .j-gallery.cta_gal .cc-m-gallery-stack-item img {
	border-radius: 50%;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
	transition: transform 0.25s ease, box-shadow 0.25s ease;
	max-width: 100%;
	cursor: pointer;
	z-index: 1;
	transform: scale(0.9);
}

/* Hover Desktop */
.cc-pagemode-default .j-gallery.cta_gal .cc-m-gallery-stack-item img:hover {
	transform: scale(1.0);
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.35);
	z-index: 10;
	/* vor anderen Bildern */
}

/* Touchstart Effekt Tablets (kein Rasterbruch) */
@media (max-width: 1024px) {
	.cc-pagemode-default .j-gallery.cta_gal .cc-m-gallery-stack-item img.hover-touch {
		transform: scale(1.0);
		z-index: 10;
		box-shadow: 0 12px 30px rgba(0, 0, 0, 0.4);
	}

	.cc-pagemode-default .j-gallery.cta_gal .cc-m-gallery-container {
		margin: 0 auto;
		padding: 0;
		gap: 0;
	}

	.cta_gal .cc-m-gallery-stack-item {
		margin-bottom: -5px !important;
	}

}


/* iPhone / kleine Screens: Hoverbild mittig und groß */
@media (max-width: 767px) {


	/* Columns für Grid „unsichtbar“ machen */
	.cc-pagemode-default .j-gallery.cta_gal .cc-m-gallery-stack-column {
		display: contents;
	}

	/* Grid Container auf 3 Spalten */
	.cc-pagemode-default .j-gallery.cta_gal .cc-m-gallery-container {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 0;
		justify-items: center;
		align-items: start;
		max-width: 100vw;
		margin: 0 auto;
		padding: 0;
		overflow: visible;
	}

	/* Bilder proportional skalieren */
	.cc-pagemode-default .j-gallery.cta_gal .cc-m-gallery-stack-item img {
		max-width: 100%;
		height: auto !important;
		width: 100% !important;

	}


	.cc-pagemode-default .j-gallery.cta_gal .cc-m-gallery-stack-item img.hover-touch {
		position: fixed;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%) scale(1);
		max-width: 250px !important;
		min-height: 250px !important;
		width: 250px !important;
		z-index: 9999 !important;
		box-shadow: 0 12px 30px rgba(0, 0, 0, 0.4);
		border-radius: 50%;
		overflow: visible;
		-webkit-backface-visibility: hidden;
		transition: transform 0.25s ease, box-shadow 0.25s ease;
		transition: transform 0.35s cubic-bezier(0.75, 1.25, 1.5, 1), box-shadow 0.35s ease;

	}
}