/* Modul „Laufband": Referenzen in einer Zeile, endlos nach links.
   Maße aus `01 Startseite` (Referenzen) und `02`/`04` (Orte-Band).
   Die Bewegung selbst (Keyframes, Dauer, Pause per `.is-pausiert`) steht
   zentral in site.css; hier nur Band, Schrift und die beiden Zustände
   „ruhige Liste" und „verdoppelte Spur". */

.modul--marquee {
	margin: 0 0 var(--sektion-y-klein);
	padding: 15px 0;
	overflow: hidden;
	border-top: 1px solid var(--linie-10);
	border-bottom: 1px solid var(--linie-10);
}

/* Direkt unter dem Hero ersetzt das Band die Kante des Bildes: keine Linie
   oben, und der folgende Abschnitt bringt seinen vollen Abstand selbst mit. */
.modul--hero + .modul--marquee {
	margin-bottom: 0;
	border-top: 0;
}

/* Ruhige Liste (ohne JavaScript, bei reduzierter Bewegung): umbrechend und
   zentriert, damit nichts hinter dem Rand verschwindet. */
.modul-marquee__liste {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	/* Zeilenhöhe des Fließtexts wie im Prototyp, dessen Band aus einer
	   Textzeile entsteht: 15 px + Zeile + 15 px. */
	min-height: calc(var(--fs-text) * var(--lh-text));
	gap: 8px 34px;
	margin: 0;
	padding: 0 var(--pad-x);
	list-style: none;
	font-size: var(--fs-label);
	font-weight: var(--fw-label);
	letter-spacing: var(--ls-label);
	line-height: var(--lh-text);
	text-transform: uppercase;
	color: var(--text-50);
}

.modul-marquee__liste li {
	display: inline-flex;
	gap: 34px;
	margin: 0;
	white-space: nowrap;
}

/* Der Trenner ist Schmuck: `/ ""` gibt ihm einen leeren Alternativtext, damit
   Screenreader nicht „Punkt" zwischen jede Location sagen. */
.modul-marquee__liste li::after {
	content: "·";
	content: "·" / "";
	color: var(--gold);
}

.modul-marquee__liste li:last-child::after { content: none; }

/* ---------- Verdoppelte Spur (site.js) ----------
   Eine Zeile ohne Umbruch; jede Liste endet mit Trenner und 34 px Luft, damit
   die Fuge zur Kopie genauso breit ist wie jeder andere Abstand. */

.modul--marquee.is-dupliziert .modul-marquee__liste {
	flex: 0 0 auto;
	flex-wrap: nowrap;
	justify-content: flex-start;
	padding: 0 34px 0 0;
}

.modul--marquee.is-dupliziert .modul-marquee__liste li:last-child::after {
	content: "·";
	content: "·" / "";
}

/* Anhalten auch ohne Skript-Zutun, sobald Zeiger oder Fokus im Band sind. */
.modul--marquee:hover [data-marquee-spur],
.modul--marquee:focus-within [data-marquee-spur] { animation-play-state: paused; }