/**
 * Statische HTTrack/Framer-Seiten ohne Framer-Runtime.
 *
 * WICHTIG: Kein globales display:block auf .ssr-variant setzen — Framer blendet
 * alternative Breakpoint-Varianten per .hidden-* aus. Mit #main .ssr-variant
 * { display:block !important } würden ALLE Varianten gleichzeitig sichtbar (massiver
 * Leerraum, doppelte Header/Footer).
 *
 * Keine Höhe/Breite an .framer-w4r5u2 o. Ä. überschreiben (Flex-Hacks mit height:1px).
 */
#main [data-layout-template="true"] {
	display: block !important;
}

#main [style*="opacity:0.001"],
#main [style*="opacity: 0.001"] {
	opacity: 1 !important;
}

#main header.framer-SFHaD,
#main header.framer-SFHaD .framer-1npekcz li {
	opacity: 1 !important;
}

/*
 * Hero-Slideshow: Framer legt die Folien als Flex-Zeile (nebeneinander).
 * Nur visibility umzuschalten blendet aus, lässt die Breiten stehen → sichtbar
 * bleibt oft nur der erste Ausschnitt (grau/Overlay). Folien stapeln.
 */
#main [data-framer-name="Hero Section"] .framer-19f1ni1 ul {
	position: relative !important;
	width: 100% !important;
	height: 100% !important;
	min-height: 100% !important;
}
#main [data-framer-name="Hero Section"] .framer-19f1ni1 ul > li > div {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	box-sizing: border-box !important;
}

/* Ticker/Banderole: ohne Framer-JS bleibt die Liste bei opacity:0 */
#main .framer-202ntr ul[role="group"] {
	opacity: 1 !important;
}

/* Marquee (wird per JS in .heroscale-ticker-viewport eingehängt) */
#main .heroscale-ticker-viewport {
	overflow: hidden;
	width: 100%;
}
#main .heroscale-ticker-track {
	display: flex;
	width: max-content;
	animation-name: heroscale-marquee;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	animation-duration: var(--hs-marquee-duration, 45s);
	will-change: transform;
}
#main .heroscale-ticker-track > ul[role="group"] {
	flex-shrink: 0;
}
@keyframes heroscale-marquee {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-50%);
	}
}
@media (prefers-reduced-motion: reduce) {
	#main .heroscale-ticker-track {
		animation: none;
	}
}

/* Soll: dunkler Streifen unter dem Hero (Hintergrund sonst weiß) */
#main [id="1gc48n1"] .framer-202ntr {
	background-color: rgb(42, 42, 44);
	padding-top: 12px;
	padding-bottom: 12px;
}

#main [id="1gc48n1"] .framer-qm4yf0 h3.framer-text {
	color: rgba(255, 255, 255, 0.92) !important;
}

/* Hero-Slider: Pfeile leicht hervorheben (ohne Framer-Animation) */
#main fieldset.framer--slideshow-controls button[type="button"] {
	transition: transform 0.2s ease, background-color 0.2s ease, opacity 0.2s ease;
	cursor: pointer;
}
#main fieldset.framer--slideshow-controls button[type="button"]:hover {
	transform: scale(1.08);
	background-color: rgba(0, 0, 0, 0.38) !important;
}
#main fieldset.framer--slideshow-controls button[type="button"]:active {
	transform: scale(0.96);
}

#main .heroscale-ticker-track .framer-qm4yf0 h3.framer-text {
	white-space: nowrap;
}

/* Newsroom/Blog: Karten nutzen inline opacity:0 (nicht 0.001) — ohne Framer-JS unsichtbar */
#main [data-framer-name="Blog Section"] a.framer-5IvsI {
	opacity: 1 !important;
	transform: none !important;
}