/* RMH Lamellenbild, Masse und Bewegung aus Entwurf B (.jalousie-bild, .jalousie).
 * Ausgangszustand: Abdeckung offen (ueber dem Bild, ausserhalb abgeschnitten). Geschlossen wird erst unter html.rmh-js
 * (Kopf-Skript: JavaScript laeuft, keine reduzierte Bewegung, nicht im Editor); die Klasse rmh-lb--offen aus script.js faehrt sie hoch.
 * Faellt das Skript aus, setzt der Kopf nach dem Laden html.rmh-notfall, dann faehrt die Abdeckung von selbst hoch. */
.rmh-lb {
	--rmh-lb-licht: #f2b544;
	--rmh-lb-lam: 18px;
	--rmh-lb-ease-io: cubic-bezier(0.77, 0, 0.175, 1);
	box-sizing: border-box;
	width: 100%;
	margin: 0;
	padding: 0;
	font-family: "IBM Plex Sans", "Segoe UI", sans-serif;
	line-height: 1.6;
}
.rmh-lb *,
.rmh-lb *::before,
.rmh-lb *::after {
	box-sizing: border-box;
}
.rmh-lb .rmh-lb__figur {
	position: relative;
	overflow: hidden;
	width: 100%;
	aspect-ratio: 16 / 10;
	border-radius: 3px;
	background: #262c31;
}
.rmh-lb .rmh-lb__bild {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	border-radius: 0;
}
.rmh-lb .rmh-lb__unterschrift {
	margin: 10px 0 0;
	padding: 0;
	font-size: 14.7px;
	font-style: normal;
	line-height: 1.5;
	color: #b0b7bd;
}
.rmh-lb .rmh-lb__abdeckung {
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	transform: translateY(-102%);
	transition: transform 1200ms var(--rmh-lb-ease-io);
	transition-delay: var(--rmh-lb-verz, 0ms);
	background: linear-gradient(180deg, #555d62 0%, #41484c 30%, #33393d 78%, #22272a 96%, #15191b 100%) 0 0 / 100% var(--rmh-lb-lam) repeat-y;
}
.rmh-lb .rmh-lb__abdeckung::after { /* Endleiste */
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 9px;
	background: linear-gradient(180deg, #6a7277, #15191b);
}
.rmh-lb .rmh-lb__schlitze { /* gestrichelte Lichtlinie am unteren Rand jeder Lamelle */
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: repeating-linear-gradient(90deg, var(--rmh-lb-licht) 0 9px, transparent 9px 21px);
	-webkit-mask: repeating-linear-gradient(180deg, transparent 0 calc(var(--rmh-lb-lam) - 4px), #000 calc(var(--rmh-lb-lam) - 4px) calc(var(--rmh-lb-lam) - 2px), transparent calc(var(--rmh-lb-lam) - 2px) var(--rmh-lb-lam));
	mask: repeating-linear-gradient(180deg, transparent 0 calc(var(--rmh-lb-lam) - 4px), #000 calc(var(--rmh-lb-lam) - 4px) calc(var(--rmh-lb-lam) - 2px), transparent calc(var(--rmh-lb-lam) - 2px) var(--rmh-lb-lam));
	opacity: 0.5;
}
/* Mit Skript: beim ersten Zeichnen geschlossen, bis das Bild im Blick ist */
html.rmh-js:not(.rmh-notfall) .rmh-lb[data-animation="an"]:not(.rmh-lb--offen) .rmh-lb__abdeckung {
	transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
	.rmh-lb .rmh-lb__abdeckung { display: none; }
}
/* Elementor-Editor: immer der Endzustand */
.elementor-editor-active .rmh-lb .rmh-lb__abdeckung { display: none; }
