/* Blur Reveal Scroll – Frontend */

.brs-wrap {
	--brs-p: 0;
	--brs-s: 1.1;
	--brs-step: var(--brs-step-d, 100px);
	--brs-fs: var(--brs-fs-d, 64px);
	--brs-stage-h: calc(var(--brs-vh, 100) * 1vh - var(--brs-top, 0px));
	--brs-dist: calc(var(--brs-steps, 6) * var(--brs-step));
	position: relative;
	width: 100%;
	box-sizing: border-box;
}

@supports (height: 1svh) {
	.brs-wrap {
		--brs-stage-h: calc(var(--brs-vh, 100) * 1svh - var(--brs-top, 0px));
	}
}

@media (max-width: 767px) {
	.brs-wrap {
		--brs-step: var(--brs-step-m, 80px);
		--brs-fs: var(--brs-fs-m, 36px);
	}
}

.brs-wrap .brs-stage {
	position: relative;
	box-sizing: border-box;
	width: 100%;
	height: var(--brs-stage-h);
	min-height: 120px;
	overflow: hidden;
	background: var(--brs-bg, transparent);
}

.brs-wrap .brs-content {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

.brs-wrap .brs-media {
	position: absolute;
	inset: 0;
	margin: 0;
	padding: 0;
}

.brs-wrap .brs-media img,
.brs-wrap .brs-media .brs-img {
	display: block;
	width: 100%;
	max-width: none;
	height: 100%;
	margin: 0;
	object-fit: var(--brs-fit, cover);
	object-position: var(--brs-pos, center center);
}

.brs-wrap .brs-text {
	position: relative;
	z-index: 1;
	box-sizing: border-box;
	width: 100%;
	max-width: min(var(--brs-tmax, 900px), 100%);
	padding: 0 24px;
	color: var(--brs-color, #fff);
	font-family: var(--brs-font, inherit);
	font-size: var(--brs-fs);
	font-weight: var(--brs-fw, 700);
	font-style: var(--brs-fst, normal);
	line-height: var(--brs-lh, 1.25);
	letter-spacing: var(--brs-ls, normal);
	text-transform: var(--brs-tt, none);
	text-align: var(--brs-align, center);
}

.brs-wrap .brs-code {
	position: relative;
	z-index: 1;
	box-sizing: border-box;
	width: 100%;
	max-width: min(var(--brs-tmax, 900px), 100%);
	padding: 0 24px;
	color: var(--brs-color, #fff);
	font-family: var(--brs-font, inherit);
	font-size: var(--brs-fs-code, inherit);
	font-style: var(--brs-fst, inherit);
	line-height: var(--brs-lh, inherit);
	letter-spacing: var(--brs-ls, inherit);
	text-transform: var(--brs-tt, inherit);
	text-align: var(--brs-align, center);
}

.brs-wrap .brs-code > :first-child { margin-top: 0; }
.brs-wrap .brs-code > :last-child { margin-bottom: 0; }

.brs-wrap .brs-text > :first-child { margin-top: 0; }
.brs-wrap .brs-text > :last-child { margin-bottom: 0; }

.brs-wrap .brs-text p,
.brs-wrap .brs-text h1,
.brs-wrap .brs-text h2,
.brs-wrap .brs-text h3,
.brs-wrap .brs-text h4,
.brs-wrap .brs-text h5,
.brs-wrap .brs-text h6,
.brs-wrap .brs-text li,
.brs-wrap .brs-text a {
	color: inherit;
	font-family: inherit;
	font-weight: inherit;
	font-style: inherit;
	line-height: inherit;
	letter-spacing: inherit;
	text-transform: inherit;
}

.brs-wrap .brs-text p { font-size: 1em; margin: 0 0 .6em; }
.brs-wrap .brs-text h1 { font-size: 1.5em; margin: 0 0 .4em; }
.brs-wrap .brs-text h2 { font-size: 1.3em; margin: 0 0 .4em; }
.brs-wrap .brs-text h3 { font-size: 1.15em; margin: 0 0 .4em; }
.brs-wrap .brs-text h4,
.brs-wrap .brs-text h5,
.brs-wrap .brs-text h6 { font-size: 1em; margin: 0 0 .4em; }

/* Glas-Effekt (Glassmorphism) */
.brs-wrap .brs-glass-bg,
.brs-colwrap .brs-glass-bg {
	position: absolute;
	inset: 0;
	z-index: 0;
	box-sizing: border-box;
	border-radius: var(--brs-glass-radius, 24px);
	border: 1px solid var(--brs-glass-bfb, rgba(255, 255, 255, .35));
	background: var(--brs-glass-fb, rgba(255, 255, 255, .18));
	-webkit-backdrop-filter: blur(var(--brs-glass-blur, 16px)) saturate(var(--brs-glass-sat, 140%));
	backdrop-filter: blur(var(--brs-glass-blur, 16px)) saturate(var(--brs-glass-sat, 140%));
	pointer-events: none;
}

@supports (background: color-mix(in srgb, red 10%, transparent)) {
	.brs-wrap .brs-glass-bg,
	.brs-colwrap .brs-glass-bg {
		background: color-mix(in srgb, var(--brs-glass-c, #fff) calc(var(--brs-glass-o, 18) * 1%), transparent);
		border-color: color-mix(in srgb, var(--brs-glass-c, #fff) calc(var(--brs-glass-b, 35) * 1%), transparent);
	}
}

/* Ohne backdrop-filter-Unterstützung: Glas deckender, damit der Text lesbar bleibt */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	.brs-wrap .brs-glass-bg,
	.brs-colwrap .brs-glass-bg {
		background: var(--brs-glass-fb, rgba(255, 255, 255, .6));
	}
}

.brs-wrap.brs-glass-shadow .brs-glass-bg,
.brs-colwrap.brs-glass-shadow .brs-glass-bg {
	box-shadow: 0 8px 32px rgba(0, 0, 0, .25), inset 0 1px 0 rgba(255, 255, 255, .3);
}

.brs-wrap .brs-glass-layer,
.brs-colwrap .brs-glass-layer {
	border-radius: 0;
	border-width: 0;
}

.brs-wrap .brs-card {
	position: relative;
	z-index: 1;
	box-sizing: border-box;
	width: auto;
	max-width: min(var(--brs-tmax, 900px), calc(100% - 32px));
	padding: var(--brs-glass-pad, 40px);
	border-radius: var(--brs-glass-radius, 24px);
}

.brs-wrap .brs-card .brs-text,
.brs-wrap .brs-card .brs-code {
	width: auto;
	max-width: none;
	padding: 0;
}

@media (max-width: 767px) {
	.brs-wrap .brs-card {
		padding: min(var(--brs-glass-pad, 40px), 24px);
	}
}

/* Ab hier nur, wenn JavaScript aktiv ist: ohne JS bleibt alles scharf und normal im Fluss. */
.brs-js .brs-wrap {
	height: calc(var(--brs-stage-h) + var(--brs-dist));
}

.brs-js .brs-wrap:not(.brs-fixedmode) .brs-stage {
	position: sticky;
	top: var(--brs-top, 0px);
}

.brs-js .brs-wrap .brs-content {
	filter: blur(calc((1 - var(--brs-p)) * var(--brs-blur, 40px)));
	transform: scale(calc(1 + (1 - var(--brs-p)) * (var(--brs-s) - 1)));
	will-change: filter, transform;
}

/* Avada-Container-Modus: Blur-Ebene (Overlay) über frei im Builder gestaltetem Container */
.brs-wrap.brs-avada[data-brs-pending],
.brs-colwrap[data-brs-pending] {
	display: none;
}

/* Spalten-Modi: Ebenen liegen direkt in der Avada-Spalte (ohne Hülle) */
.brs-colwrap {
	--brs-p: 0;
	position: relative;
}

.brs-colwrap > .brs-veil,
.brs-colwrap > .brs-glass-bg {
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.brs-colwrap > .brs-veil {
	z-index: 50;
	-webkit-backdrop-filter: blur(calc((1 - var(--brs-p)) * var(--brs-blur, 40px)));
	backdrop-filter: blur(calc((1 - var(--brs-p)) * var(--brs-blur, 40px)));
}

.brs-colwrap > .brs-glass-bg {
	z-index: 49;
}

.brs-colwrap.brs-sharp > .brs-veil {
	display: none;
}

.brs-js .brs-colwrap.brs-pinned {
	position: sticky;
	top: var(--brs-top, 0px);
	align-self: flex-start;
}

.brs-wrap.brs-avada > .brs-pin {
	box-sizing: border-box;
}

.brs-js .brs-wrap.brs-avada {
	height: auto;
}

.brs-wrap .brs-pin > .brs-veil,
.brs-wrap .brs-pin > .brs-glass-bg {
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.brs-wrap .brs-pin > .brs-veil {
	z-index: 50;
	-webkit-backdrop-filter: blur(calc((1 - var(--brs-p)) * var(--brs-blur, 40px)));
	backdrop-filter: blur(calc((1 - var(--brs-p)) * var(--brs-blur, 40px)));
}

.brs-wrap .brs-pin > .brs-glass-bg {
	z-index: 49;
}

.brs-wrap.brs-sharp .brs-pin > .brs-veil {
	display: none;
}

.brs-js .brs-wrap.brs-avada:not(.brs-fixedmode) > .brs-pin {
	position: sticky;
	top: var(--brs-top, 0px);
}

.brs-js .brs-wrap.brs-avada.brs-fixedmode > .brs-pin {
	position: absolute;
	top: 0;
	left: 0;
}

.brs-js .brs-wrap.brs-avada.brs-fixedmode.brs-state-fixed > .brs-pin {
	position: fixed;
	top: var(--brs-top, 0px);
}

.brs-js .brs-wrap.brs-avada.brs-fixedmode.brs-state-after > .brs-pin {
	top: auto;
	bottom: 0;
}

/* Glas folgt dem Scrollfortschritt */
.brs-js .brs-wrap.brs-glassfx-in .brs-glass-bg,
.brs-js .brs-colwrap.brs-glassfx-in .brs-glass-bg {
	opacity: var(--brs-p);
}

.brs-js .brs-wrap.brs-glassfx-out .brs-glass-bg,
.brs-js .brs-colwrap.brs-glassfx-out .brs-glass-bg {
	opacity: calc(1 - var(--brs-p));
}

/* Fixierung per JavaScript (Kompatibilitätsmodus) */
.brs-js .brs-wrap.brs-fixedmode .brs-stage {
	position: absolute;
	top: 0;
	left: 0;
}

.brs-js .brs-wrap.brs-fixedmode.brs-state-fixed .brs-stage {
	position: fixed;
	top: var(--brs-top, 0px);
}

.brs-js .brs-wrap.brs-fixedmode.brs-state-after .brs-stage {
	top: auto;
	bottom: 0;
}

/* Bewegung reduzieren: sofort scharf, keine Fixierung */
@media (prefers-reduced-motion: reduce) {
	.brs-js .brs-wrap.brs-rm {
		height: auto !important;
	}

	.brs-js .brs-wrap.brs-rm > .brs-pin {
		position: relative !important;
		top: auto !important;
		left: auto !important;
		bottom: auto !important;
		width: auto !important;
	}

	.brs-js .brs-wrap.brs-rm .brs-veil {
		display: none;
	}

	.brs-js .brs-wrap.brs-rm .brs-stage {
		position: relative;
		top: auto;
		left: auto;
		bottom: auto;
		width: 100%;
	}

	.brs-js .brs-wrap.brs-rm .brs-content {
		filter: none;
		transform: none;
		will-change: auto;
	}

	.brs-js .brs-wrap.brs-rm .brs-glass-bg,
	.brs-js .brs-colwrap.brs-rm .brs-glass-bg {
		opacity: 1;
	}

	.brs-js .brs-colwrap.brs-rm .brs-veil {
		display: none;
	}

	.brs-js .brs-colwrap.brs-rm.brs-pinned {
		position: relative !important;
		top: auto !important;
		align-self: auto !important;
	}
}