/*
 * AG Hero – Ersatz für Slider Revolution "Slider 1" (Startseite)
 * Werte 1:1 aus der RS-Konfiguration: Raster 1240 x 800, Schrift 170px,
 * Zeilenhöhe 80px, Versatz 100px unter Mitte; skaliert unter 1240px proportional.
 */
.ag-hero-wrap {
	container-type: inline-size;
	width: 100%;
}

.ag-hero {
	position: relative;
	overflow: hidden;
	width: 100%;
	height: min(800px, 64.5161cqw);
	background: #2b2622;
}

.ag-hero__slide {
	position: absolute;
	inset: 0;
	opacity: 0;
	visibility: hidden;
	z-index: 1;
}

.ag-hero__slide.is-active,
.ag-hero__slide.is-leaving {
	visibility: visible;
}

.ag-hero__slide.is-active {
	z-index: 2;
}

.ag-hero__img {
	position: absolute;
	inset: 0;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	object-fit: cover;
	object-position: center center;
	transform-origin: 50% 50%;
	will-change: transform;
}

.ag-hero__word {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%) translateY(min(100px, 8.0645cqw));
	margin: 0 !important;
	padding: 0;
	font-family: Barcelony, cursive !important;
	font-weight: 400 !important;
	font-style: normal;
	font-size: min(170px, 13.7097cqw) !important;
	line-height: min(80px, 6.4516cqw) !important;
	letter-spacing: 0;
	text-transform: none;
	text-align: center;
	white-space: nowrap;
	color: #fff !important;
	z-index: 7;
	pointer-events: none;
	transform-origin: 50% 50%;
	will-change: transform, opacity, filter;
}

/* Großzügiger Innenabstand: Die Schreibschrift ragt weit über ihre Zeilenhöhe hinaus.
   Ohne Puffer schneiden manche Browser (v. a. Safari) Ober-/Unterlängen bei
   Animationen mit Unschärfe ab. Der negative Außenabstand hält die Position gleich. */
.ag-hero__text {
	padding: 0.8em 0.5em;
	box-sizing: border-box;
}

.ag-hero__text {
	display: inline-block;
	margin: -0.8em -0.5em;
}

.ag-hero__sr {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

@media (prefers-reduced-motion: reduce) {
	.ag-hero__img { will-change: auto; }
}
