/*
 * Rahmen der Seite: Kopf mit Menue, Hero, Fuss, Listen. Nur im Frontend geladen.
 * Aussehen wie der Django/Next-Nachbau (frontend/components/layout/*).
 */

*,
*::before,
*::after {
	box-sizing: border-box;
}

body {
	margin: 0;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}

.hauptbereich {
	flex: 1 0 auto;
}

button:not(:disabled),
[role="button"]:not(:disabled),
select,
summary,
label[for] {
	cursor: pointer;
}

:focus-visible {
	outline: 2px solid var(--vf-blau);
	outline-offset: 2px;
}

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

.sprunglink {
	position: absolute;
	left: 1rem;
	top: -4rem;
	z-index: 100;
	background: #fff;
	padding: 0.5rem 1rem;
	border: 2px solid var(--vf-blau);
}

.sprunglink:focus {
	top: 1rem;
}

/* --- Kopf --------------------------------------------------------------------------- */
.kopf {
	position: sticky;
	top: 0;
	z-index: 40;
	background: #fff;
	border-bottom: 1px solid var(--vf-linie);
}

.admin-bar .kopf {
	top: 32px;
}

@media (max-width: 782px) {
	.admin-bar .kopf {
		top: 46px;
	}
}

.kopf-innen {
	position: relative;
	z-index: 3;
	background: #fff;
	max-width: 72rem;
	margin: 0 auto;
	padding: 0 1rem;
	height: 4.5rem;
	display: flex;
	align-items: center;
	gap: 1rem;
}

.kopf-logo {
	flex-shrink: 0;
	display: block;
	line-height: 0;
	padding: 0.25rem 0;
}

.kopf-logo img {
	height: 2.25rem;
	width: auto;
}

.kopf-rechts {
	margin-left: auto;
	display: flex;
	align-items: center;
	gap: 0.25rem;
}

.kopf-knopf {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	padding: 0;
	border: 0;
	border-radius: var(--vf-radius);
	background: transparent;
	color: var(--vf-ueberschrift);
	transition: color 0.15s, background-color 0.15s;
}

.kopf-knopf:hover {
	color: var(--vf-blau);
	background: var(--vf-hellgrau);
}

.kopf-knopf svg {
	width: 1.35rem;
	height: 1.35rem;
}

.menue-knopf .symbol-zu,
.menue-offen .menue-knopf .symbol-menue {
	display: none;
}

.menue-offen .menue-knopf .symbol-zu {
	display: block;
}

/* Sprachumschalter DE | EN */
.sprachwahl ul {
	display: flex;
	align-items: center;
	margin: 0;
	padding: 0;
	list-style: none;
}

.sprachwahl li + li::before {
	content: "|";
	color: var(--vf-linie);
	padding: 0 0.1rem;
}

.sprachwahl a {
	display: inline-block;
	padding: 0.5rem 0.4rem;
	font-family: var(--wp--preset--font-family--oswald);
	font-size: 0.85rem;
	letter-spacing: 0.06em;
	color: var(--vf-gedaempft);
	text-decoration: none;
	transition: color 0.15s;
}

.sprachwahl a:hover {
	color: var(--vf-blau);
}

.sprachwahl a.aktiv {
	color: var(--vf-ueberschrift);
	font-weight: 600;
}

/* Hauptmenue - Handy zuerst: aufklappbare Flaeche unter dem Kopf, nur so hoch wie die
   Eintraege, darunter ein schwacher Schleier, der per Klick schliesst. */
.hauptmenue {
	display: none;
}

.menue-offen .hauptmenue {
	display: block;
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	z-index: 2;
	max-height: calc(100dvh - 4.5rem);
	overflow-y: auto;
	background: #fff;
	border-bottom: 1px solid var(--vf-linie);
	box-shadow: 0 12px 24px rgba(0, 0, 0, 0.08);
	padding: 0.5rem 1rem 1rem;
}

.menue-schleier {
	position: fixed;
	inset: 0;
	z-index: 1;
	background: rgba(0, 0, 0, 0.18);
	cursor: pointer;
}

.menue-schleier[hidden] {
	display: none;
}

.hauptmenue .menue,
.hauptmenue .sub-menu {
	list-style: none;
	margin: 0;
	padding: 0;
}

.hauptmenue .menue > li {
	border-bottom: 1px solid var(--vf-linie);
	position: relative;
}

.hauptmenue .menue > li > a,
.hauptmenue .menue-gruppe {
	display: block;
	width: 100%;
	padding: 0.85rem 2.75rem 0.85rem 0;
	font-family: var(--wp--preset--font-family--oswald);
	font-size: 0.95rem;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--vf-ueberschrift);
	text-decoration: none;
	text-align: left;
	background: none;
	border: 0;
}

.hauptmenue .untermenue-knopf {
	position: absolute;
	right: 0;
	top: 0.2rem;
	width: 2.75rem;
	height: 2.75rem;
	border: 0;
	background: none;
	color: var(--vf-ueberschrift);
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.hauptmenue .untermenue-knopf svg,
.hauptmenue .menue-gruppe::after {
	transition: transform 0.15s;
}

/* Handy: Pfeil rechts an Gruppen ohne eigene Seite (Partei, Wahlen, Presse) */
.hauptmenue .menue-gruppe {
	position: relative;
}

.hauptmenue .menue-gruppe::after {
	content: "";
	position: absolute;
	right: 1.1rem;
	top: 50%;
	width: 0.45rem;
	height: 0.45rem;
	margin-top: -0.35rem;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
}

.hauptmenue .menue-gruppe[aria-expanded="true"]::after {
	transform: rotate(225deg);
	margin-top: -0.1rem;
}

.hauptmenue .untermenue-knopf[aria-expanded="true"] svg {
	transform: rotate(180deg);
}

.hauptmenue .sub-menu {
	display: none;
	padding: 0 0 0.6rem 0.75rem;
}

.hauptmenue li.offen > .sub-menu {
	display: block;
}

.hauptmenue .sub-menu a {
	display: block;
	padding: 0.5rem 0;
	font-size: 0.95rem;
	color: var(--vf-text);
	text-decoration: none;
}

/* Dritte Ebene (Landesverbaende, Vergangene Wahlen) im Handy-Menue: aufklappbar, eingerueckt */
.hauptmenue .sub-menu li {
	position: relative;
}

.hauptmenue .sub-menu .untermenue-knopf {
	top: -0.1rem;
}

.hauptmenue .sub-menu .menue-gruppe {
	padding: 0.5rem 2.75rem 0.5rem 0;
	font-family: inherit;
	font-size: 0.95rem;
	font-weight: 400;
	text-transform: none;
	letter-spacing: 0;
	color: var(--vf-text);
}

.hauptmenue .sub-menu .sub-menu {
	margin-left: 0.25rem;
	padding-left: 0.75rem;
	border-left: 2px solid var(--vf-linie);
}

.hauptmenue a:hover,
.hauptmenue .menue-gruppe:hover {
	color: var(--vf-blau);
}

.hauptmenue .current-menu-item > a {
	color: var(--vf-blau-dunkel);
}

.sprachwahl-desktop {
	display: none;
}

.sprachwahl-handy {
	margin-top: 0.75rem;
}

/* Desktop ab 64rem: Menue nebeneinander, Untermenues bei Hover und Tastaturfokus. */
@media (min-width: 64rem) {
	.kopf-innen {
		height: 6rem;
	}

	.kopf-logo img {
		height: 3.5rem;
	}

	.menue-knopf,
	.sprachwahl-handy,
	.menue-schleier,
	.hauptmenue .untermenue-knopf {
		display: none !important;
	}

	.sprachwahl-desktop {
		display: block;
		margin-left: 0.25rem;
	}

	.hauptmenue,
	.menue-offen .hauptmenue {
		display: block;
		position: static;
		max-height: none;
		overflow: visible;
		padding: 0;
		border: 0;
		box-shadow: none;
		background: none;
	}

	.hauptmenue .menue {
		display: flex;
		align-items: center;
	}

	.hauptmenue .menue > li {
		border: 0;
	}

	.hauptmenue .menue > li > a,
	.hauptmenue .menue-gruppe {
		display: inline-flex;
		align-items: center;
		gap: 0.25rem;
		width: auto;
		padding: 0.5rem 0.75rem;
		font-size: 0.82rem;
		color: rgba(42, 42, 42, 0.9);
	}

	.hauptmenue .menu-item-has-children > a::after,
	.hauptmenue .menue-gruppe::after {
		position: static;
		margin-top: 0;
		content: "";
		width: 0.4rem;
		height: 0.4rem;
		border-right: 1.5px solid currentColor;
		border-bottom: 1.5px solid currentColor;
		transform: rotate(45deg) translateY(-2px);
		opacity: 0.6;
		margin-left: 0.2rem;
	}

	.hauptmenue .sub-menu {
		display: block;
		visibility: hidden;
		opacity: 0;
		position: absolute;
		right: 0;
		top: 100%;
		z-index: 50;
		width: 18rem;
		max-height: 70vh;
		overflow-y: auto;
		padding: 0.375rem 0;
		background: #fff;
		border: 1px solid var(--vf-linie);
		box-shadow: 0 10px 24px rgba(0, 0, 0, 0.1);
		transition: opacity 0.15s, visibility 0.15s;
	}

	.hauptmenue li:hover > .sub-menu,
	.hauptmenue li:focus-within > .sub-menu,
	.hauptmenue li.offen > .sub-menu {
		visibility: visible;
		opacity: 1;
	}

	.hauptmenue .sub-menu a {
		padding: 0.5rem 1rem;
		font-size: 0.875rem;
		transition: background-color 0.15s, color 0.15s;
	}

	.hauptmenue .sub-menu a:hover {
		background: #eef4fb;
	}

	/* Dritte Ebene: klappt links neben dem Untermenue auf (Hover, Tastaturfokus, Klick) */
	.hauptmenue .menue > li > .sub-menu {
		max-height: none;
		overflow: visible;
	}

	.hauptmenue .sub-menu .sub-menu {
		top: -0.4rem;
		right: 100%;
		width: 16rem;
		margin: 0;
		padding: 0.375rem 0;
		border-left: 1px solid var(--vf-linie);
	}

	.hauptmenue .sub-menu .menue-gruppe {
		display: flex;
		justify-content: flex-start;
		align-items: center;
		width: 100%;
		padding: 0.5rem 1rem;
		font-size: 0.875rem;
		color: var(--vf-text);
		transition: background-color 0.15s, color 0.15s;
	}

	.hauptmenue .sub-menu .menue-gruppe:hover,
	.hauptmenue .sub-menu li:hover > .menue-gruppe,
	.hauptmenue .sub-menu li:hover > a {
		background: #eef4fb;
	}

	/* Pfeil nach links: dort klappt die naechste Ebene auf */
	.hauptmenue .sub-menu .menu-item-has-children > a::after,
	.hauptmenue .sub-menu .menue-gruppe::after {
		transform: rotate(135deg);
		margin-left: 0;
		order: -1;
		margin-right: 0.6rem;
	}

	.hauptmenue .sub-menu .menu-item-has-children > a {
		display: flex;
		align-items: center;
	}
}

/* Suchfeld unter dem Kopf */
.suchfeld {
	border-top: 1px solid var(--vf-linie);
	background: #fff;
	padding: 1rem;
}

.suchfeld form,
.suche-gross {
	max-width: 44rem;
	margin: 0 auto;
	display: flex;
	gap: 0.5rem;
}

.suchfeld input,
.suche-gross input {
	flex: 1;
	min-width: 0;
	padding: 0.65rem 0.9rem;
	font: inherit;
	border: 1px solid #d8dde5;
	border-radius: var(--vf-radius);
}

.suchfeld button,
.suche-gross button {
	padding: 0.65rem 1.2rem;
	font: inherit;
	font-weight: 600;
	color: #fff;
	background: var(--vf-blau-dunkel);
	border: 0;
	border-radius: var(--vf-radius);
	transition: background-color 0.15s;
}

.suchfeld button:hover,
.suche-gross button:hover {
	background: #155a8f;
}

/* --- Seitenkopf ----------------------------------------------------------------------- */
/* Kopfbild: immer das ganze Foto (kein Abschneiden von Koepfen, Felix 10.10.2026). Die Buehne
   hat das Seitenverhaeltnis des Fotos (--hero-format, aus functions.php) und ist hoechstens 75 %
   der Fensterhoehe hoch; die Flaeche daneben fuellt eine unscharfe Kopie des Fotos. */
.hero {
	position: relative;
	overflow: hidden;
	background: #1d2733;
}

.hero-hintergrund {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: blur(28px) brightness(0.7);
	transform: scale(1.15);
}

.hero-buehne {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: min(100%, calc(75vh * var(--hero-format, 2)));
	aspect-ratio: var(--hero-format, 2);
	min-height: 11rem; /* sehr breite Panoramen auf dem Handy: dann nur seitlich beschnitten */
	margin-inline: auto;
}

.hero-bild {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.hero-schatten {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.3);
}

.hero-titel {
	position: relative;
	z-index: 1;
	margin: 0;
	padding: 0 1rem;
	text-align: center;
	font-family: var(--wp--preset--font-family--oswald);
	font-weight: 500;
	font-size: 1.9rem;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: #fff;
	text-shadow: 0 2px 6px rgba(0, 0, 0, 0.45);
}

@media (min-width: 40rem) {
	.hero-titel {
		font-size: 2.25rem;
	}
}

@media (min-width: 64rem) {
	.hero-titel {
		font-size: 3rem;
	}
}

.hero-credit {
	position: absolute;
	right: 0.75rem;
	bottom: 0.4rem;
	z-index: 1;
	font-size: 0.65rem;
	color: rgba(255, 255, 255, 0.75);
}

.hero-credit a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.hero-credit a:hover {
	color: #fff;
}

.titelblock-breit {
	max-width: calc(72rem + 2rem) !important;
}

.titelblock {
	max-width: calc(56rem + 2rem);
	margin: 0 auto;
	padding: 2.5rem 1rem 0;
}

@media (min-width: 64rem) {
	.titelblock {
		padding-top: 3.5rem;
	}
}

.seitentitel {
	position: relative;
	margin: 0;
	padding-bottom: 0.75rem;
	font-size: 1.8rem;
}

@media (min-width: 40rem) {
	.seitentitel {
		font-size: 2.25rem;
	}
}

.seitentitel::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 3.5rem;
	height: 3px;
	background: var(--vf-blau);
}

/* --- Inhaltsbereich ------------------------------------------------------------------- */
.inhalt {
	padding: 2rem 0 3rem;
}

.inhalt > .karten,
.inhalt > .volltext-liste,
.inhalt > .hinweis-sprache,
.inhalt > .seitennummern,
.inhalt > .treffer,
.inhalt > .suche-gross,
.inhalt > p {
	max-width: 72rem;
	margin-left: auto;
	margin-right: auto;
	padding-left: 1rem;
	padding-right: 1rem;
}

.inhalt > .volltext-liste,
.inhalt > .treffer,
.inhalt > .suche-gross {
	max-width: calc(56rem + 2rem);
}

/* Breiten regelt WordPress ueber "is-layout-constrained" + "has-global-padding"
   (theme.json: contentSize 56rem, wideSize 72rem). Die Startseite ist breiter, damit die
   zweispaltigen Abschnitte wie im Original nebeneinander Platz haben. */
.inhalt-startseite .inhalt-prosa {
	--wp--style--global--content-size: 72rem;
}

.beitrag-meta {
	font-size: 0.9rem;
	color: var(--vf-gedaempft);
}

.startseite-titel {
	max-width: 72rem;
	margin: 0 auto 1.5rem;
	padding: 1.5rem 1rem 0;
	text-align: center;
	font-size: 1.55rem;
	line-height: 1.3;
	text-wrap: balance;
}

@media (min-width: 64rem) {
	.startseite-titel {
		font-size: 2.4rem;
		padding-top: 2.5rem;
	}
}

/* Videos auf der breiten Startseite nicht ueber die ganze Breite ziehen */
.inhalt-startseite .inhalt-prosa > .wp-block-embed {
	max-width: 56rem;
}

/* Karten (Blog, Archive) */
.karten {
	display: grid;
	gap: 1.5rem;
	grid-template-columns: 1fr;
	margin-top: 2rem;
}

@media (min-width: 40rem) {
	.karten {
		grid-template-columns: repeat(2, 1fr);
		/* alle Reihen so hoch wie die hoechste: alle Karten gleich gross (Felix 10.10.2026) */
		grid-auto-rows: 1fr;
	}
}

@media (min-width: 64rem) {
	.karten {
		grid-template-columns: repeat(3, 1fr);
	}
}

.karte {
	position: relative;
	cursor: pointer; /* ganze Karte ist ueber den Titel-Link klickbar */
	display: flex;
	flex-direction: column;
	border: 1px solid var(--vf-linie);
	border-radius: var(--vf-radius);
	background: #fff;
	overflow: hidden;
	transition: box-shadow 0.15s, border-color 0.15s;
}

.karte:hover {
	border-color: var(--vf-blau);
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
}

.karte-bild {
	position: relative;
	background: var(--vf-hellgrau);
	aspect-ratio: 16 / 9; /* Videoformat: Vorschaubilder passen ohne Beschnitt */
	overflow: hidden;
}

.karte-bild img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

/* Video-Vorschaubild fuellt die Flaeche; 4:3-Bilder mit schwarzen Balken werden so weit
   vergroessert, dass die Balken ausserhalb liegen. */
.karte-bild img.karte-video {
	object-fit: cover;
}

.karte-bild img.karte-video-balken {
	top: -16.67%;
	bottom: auto;
	height: 133.34%;
}

.karte-abspielen {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 3.5rem;
	height: auto;
	transform: translate(-50%, -50%);
}

/* Beitrag ohne Bild und ohne Video: Parteilogo klein auf hellem Grund */
.karte-bild img.karte-platzhalter {
	inset: 0 18%;
	width: 64%;
	opacity: 0.35;
	mix-blend-mode: multiply; /* weisser Hintergrund des Logos verschwindet */
}

.karte-text {
	padding: 1rem 1.1rem 1.25rem;
}

.karte-datum {
	margin: 0 0 0.25rem;
	font-size: 0.8rem;
	color: var(--vf-gedaempft);
}

.karte-titel {
	margin: 0 0 0.5rem;
	font-size: 1.15rem;
	line-height: 1.35;
}

/* Ab zwei Spalten sind alle Reihen gleich hoch: sehr lange Titel kuerzen, damit keine einzelne
   Karte alle Reihen hochzieht. Auf dem Handy (eine Spalte) steht der Titel ganz da. */
@media (min-width: 40rem) {
	.karte-titel {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 4;
		line-clamp: 4;
		overflow: hidden;
	}
}

.karte-titel a {
	color: var(--vf-ueberschrift);
	text-decoration: none;
}

/* Ganze Karte klickbar ueber den Titel-Link */
.karte-titel a::after {
	content: "";
	position: absolute;
	inset: 0;
}

.karte:hover .karte-titel a {
	color: var(--vf-blau-dunkel);
}

.karte-auszug {
	margin: 0;
	font-size: 0.95rem;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 5;
	line-clamp: 5;
	overflow: hidden;
}

/* Neuigkeiten als Volltext-Liste */
.volltext {
	padding: 2rem 0;
	border-bottom: 1px solid var(--vf-linie);
}

.volltext .inhalt-prosa {
	padding: 0;
}

.volltext .inhalt-prosa > * {
	max-width: none;
}

.volltext-titel {
	margin: 0;
	font-size: 1.5rem;
}

.volltext-titel a {
	color: var(--vf-ueberschrift);
	text-decoration: none;
}

.volltext-titel a:hover {
	color: var(--vf-blau-dunkel);
	text-decoration: underline;
}

/* Seitennummern */
.seitennummern ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem;
	justify-content: center;
	list-style: none;
	margin: 2.5rem 0 0;
	padding: 0;
}

.seitennummern a,
.seitennummern span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.75rem;
	height: 2.75rem;
	padding: 0 0.8rem;
	border: 1px solid var(--vf-linie);
	border-radius: var(--vf-radius);
	color: var(--vf-text);
	text-decoration: none;
	transition: border-color 0.15s, color 0.15s;
}

.seitennummern a:hover {
	border-color: var(--vf-blau);
	color: var(--vf-blau-dunkel);
}

.seitennummern .current {
	background: var(--vf-blau-dunkel);
	border-color: var(--vf-blau-dunkel);
	color: #fff;
}

/* Suche */
.treffer-eintrag {
	padding: 1.25rem 0;
	border-bottom: 1px solid var(--vf-linie);
}

.treffer-eintrag h2 {
	margin: 0 0 0.35rem;
	font-size: 1.25rem;
}

.treffer-eintrag p {
	margin: 0;
}

/* --- Fuss ----------------------------------------------------------------------------- */
.fuss {
	margin-top: 4rem;
	border-top: 4px solid var(--vf-blau);
	background: #f8f9fb;
	font-size: 0.875rem;
}

.fuss-innen {
	max-width: 72rem;
	margin: 0 auto;
	padding: 3rem 1rem;
}

.fuss-spalten {
	display: grid;
	gap: 2.5rem;
}

@media (min-width: 48rem) {
	.fuss-spalten {
		grid-template-columns: 1.4fr 1fr 1fr;
	}
}

.fuss-marke img {
	height: 2.5rem;
	width: auto;
	mix-blend-mode: multiply;
}

.fuss-marke p {
	margin: 1rem 0;
	max-width: 24rem;
	color: var(--vf-gedaempft);
}

.fuss-mail {
	display: inline-flex;
	align-items: center;
	min-height: 2.75rem;
	gap: 0.5rem;
	color: var(--vf-blau-dunkel);
	text-decoration: none;
}

.fuss-mail:hover {
	text-decoration: underline;
}

.fuss-mail svg {
	width: 1rem;
	height: 1rem;
}

.social {
	display: flex;
	gap: 0.5rem;
	list-style: none;
	margin: 1.25rem 0 0;
	padding: 0;
}

.social a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	border: 1px solid var(--vf-linie);
	border-radius: 50%;
	background: #fff;
	color: rgba(70, 80, 105, 0.75);
	transition: background-color 0.15s, color 0.15s, border-color 0.15s;
}

.social a:hover {
	background: var(--vf-blau-dunkel);
	border-color: var(--vf-blau-dunkel);
	color: #fff;
}

.social svg {
	width: 1rem;
	height: 1rem;
}

.fuss-ueberschrift {
	margin: 0;
	font-weight: 700;
	font-size: 0.875rem;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--vf-ueberschrift);
}

.fuss-liste ul {
	list-style: none;
	margin: 0.4rem 0 0;
	padding: 0;
}

.fuss-liste li {
	margin: 0;
}

.fuss-liste a {
	display: inline-flex;
	align-items: center;
	min-height: 2.75rem;
	padding: 0 0;
	color: var(--vf-gedaempft);
	text-decoration: none;
	transition: color 0.15s;
}

.fuss-liste a:hover {
	color: var(--vf-blau-dunkel);
}

.fuss-copyright {
	margin: 2.5rem 0 0;
	padding-top: 1.25rem;
	border-top: 1px solid var(--vf-linie);
	font-size: 0.75rem;
	color: var(--vf-gedaempft);
}

.hinweis-sprache {
	color: var(--vf-gedaempft);
	font-style: italic;
}

/* Lange zusammengesetzte Woerter ("Unterstuetzungsunterschriften") in Ueberschriften auf dem
   Handy trennen statt die Seite breiter als den Bildschirm zu machen. */
h1,
h2,
h3,
h4,
.karte-titel,
.volltext-titel {
	overflow-wrap: break-word;
	hyphens: auto;
	-webkit-hyphens: auto;
	/* nur lange Woerter trennen ("Gruendungsversammlung"), nicht "Ham-burg" oder "Ver-juengung" */
	hyphenate-limit-chars: 14 6 6;
}