/* Fußzeile your-matrix (Shortcode [ym_fusszeile]). Alle Klassen mit Präfix ym-fz-.
   Schrift: Open Sans, die Seite lädt sie schon. Werte wie im freigegebenen Entwurf. */
.ym-fz {
	--ym-fz-navy: #25385D;
	--ym-fz-navy-tief: #1C2C4A;
	--ym-fz-aqua: #7FD8DC;
	--ym-fz-weiss-92: rgba(255, 255, 255, .92);
	--ym-fz-weiss-72: rgba(255, 255, 255, .72);
	--ym-fz-linie: rgba(255, 255, 255, .12);
	display: block;
	box-sizing: border-box;
	width: 100%;
	background: var(--ym-fz-navy);
	color: var(--ym-fz-weiss-92);
	font-family: 'Open Sans', 'Segoe UI', Arial, sans-serif;
	font-size: 15px;
	line-height: 1.6;
	text-align: left;
}
.ym-fz *, .ym-fz *::before, .ym-fz *::after { box-sizing: border-box; }
.ym-fz img { max-width: 100%; height: auto; }
.ym-fz a { color: var(--ym-fz-weiss-92); text-decoration: none; }
.ym-fz a:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.ym-fz a:focus-visible { outline: 2px solid var(--ym-fz-aqua); outline-offset: 3px; border-radius: 4px; }
/* Form des Elements bleibt beim Fokus, wie im Ruhezustand (Pille, Kreis): gleiche oder höhere Spezifität */
.ym-fz a.ym-fz-knopf:focus-visible { border-radius: 999px; }
.ym-fz .ym-fz-sozial a:focus-visible { border-radius: 50%; }
.ym-fz a.ym-fz-knopf-voll:focus-visible { outline-color: #fff; }
/* Kritik R14 F7: Die seitenweite Fokusregel (ym-veredelung.css, Cyan #0A89C5) stach diese Farbe
   und lag auf Marine bei 2,99 : 1. Farbe hier fest: Aqua 7,08 : 1, beim vollen Knopf Weiß 11,65 : 1. */
.ym-fz a:focus-visible { outline-color: var(--ym-fz-aqua) !important; }
.ym-fz a.ym-fz-knopf-voll:focus-visible { outline-color: #fff !important; }

/* Raster wie Kopf und Seiteninhalt (Divi: 80 %, max. 1180 px), damit die Kanten fluchten.
   Bis 0.1.107 max. 1152 px: ab 1536 px saß die Fußzeile je Seite 14 px innerhalb von Kopf
   und Inhalt (raster-lr, Ursache 1). */
.ym-fz .ym-fz-innen { width: 80%; max-width: 1180px; margin: 0 auto; }

/* Band: Einladung */
.ym-fz .ym-fz-band { border-bottom: 1px solid var(--ym-fz-linie); }
.ym-fz .ym-fz-band .ym-fz-innen { display: flex; align-items: center; justify-content: space-between; gap: 32px; padding: 56px 0; }
.ym-fz .ym-fz-band-titel { margin: 0; padding: 0; font-family: inherit; font-size: clamp(22px, 1.4vw + 14px, 30px); font-weight: 600; line-height: 1.25; letter-spacing: normal; text-transform: none; color: #fff; }
.ym-fz .ym-fz-band-zeile { margin: 8px 0 0; padding: 0; color: var(--ym-fz-weiss-72); font-size: 15px; line-height: 1.6; }
.ym-fz .ym-fz-band-knoepfe { display: flex; flex-wrap: wrap; gap: 12px; flex: 0 0 auto; max-width: 100%; }
.ym-fz .ym-fz-knopf { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 24px; border-radius: 999px; font-weight: 600; font-size: 15px; line-height: 1.2; white-space: nowrap; }
.ym-fz a.ym-fz-knopf-voll { background: var(--ym-fz-aqua); color: var(--ym-fz-navy-tief); }
.ym-fz a.ym-fz-knopf-voll:hover { background: #fff; color: var(--ym-fz-navy-tief); text-decoration: none; }
.ym-fz a.ym-fz-knopf-rand { border: 1.5px solid rgba(255, 255, 255, .5); color: #fff; }
.ym-fz a.ym-fz-knopf-rand:hover { border-color: #fff; background: rgba(255, 255, 255, .12); text-decoration: none; }

/* Hauptteil */
.ym-fz .ym-fz-haupt .ym-fz-innen { display: grid; grid-template-columns: minmax(220px, 1.3fr) repeat(4, max-content); justify-content: space-between; gap: 40px; padding: 64px 0 56px; }
.ym-fz .ym-fz-marke { min-width: 0; }
/* Logo als SVG (04.10.2026): Die Vektorfassung hat rechts 15 Einheiten weniger Leerraum als das
   PNG v3 (viewBox 945 statt 960). 200 x 945/960 = 196,9 px ergibt dieselbe sichtbare Größe wie vorher. */
.ym-fz .ym-fz-logo { width: 196.9px; max-width: 100%; height: auto; display: block; }
.ym-fz .ym-fz-logolink { display: block; width: 200px; max-width: 100%; border-radius: 4px; }
.ym-fz .ym-fz-logolink:focus-visible { outline: 3px solid #7FD8DC; outline-offset: 6px; }
.ym-fz .ym-fz-marke address { font-style: normal; margin: 24px 0 0; color: var(--ym-fz-weiss-72); }
.ym-fz .ym-fz-marke address a { color: var(--ym-fz-weiss-92); display: inline-block; padding: 2px 0; }
/* Links im Fließtext: nicht nur über Farbe erkennbar (WCAG 1.4.1) */
.ym-fz .ym-fz-marke address a, .ym-fz .ym-fz-credit a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.ym-fz .ym-fz-sozial { display: flex; gap: 10px; margin-top: 20px; }
.ym-fz .ym-fz-sozial a { width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--ym-fz-linie); display: grid; place-items: center; }
.ym-fz .ym-fz-sozial a:hover { border-color: var(--ym-fz-aqua); text-decoration: none; }
.ym-fz .ym-fz-sozial svg { width: 18px; height: 18px; fill: currentColor; }
.ym-fz .ym-fz-spalte { min-width: 0; }
.ym-fz .ym-fz-h { margin: 0 0 14px; padding: 0; font-family: inherit; font-size: 14px; font-weight: 700; line-height: 1.6; letter-spacing: .02em; text-transform: none; text-align: left; color: var(--ym-fz-aqua); }
.ym-fz .ym-fz-spalte ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.ym-fz .ym-fz-spalte li { margin: 0; padding: 0; list-style: none; }
.ym-fz .ym-fz-spalte li a { display: inline-block; padding: 2px 0; white-space: nowrap; }

/* Leiste unten */
.ym-fz .ym-fz-leiste { border-top: 1px solid var(--ym-fz-linie); }
.ym-fz .ym-fz-leiste .ym-fz-innen { display: flex; align-items: center; justify-content: space-between; gap: 16px 32px; padding: 20px 0 24px; font-size: 13px; line-height: 1.6; color: var(--ym-fz-weiss-72); flex-wrap: wrap; }
.ym-fz .ym-fz-leiste a { color: var(--ym-fz-weiss-72); }
.ym-fz .ym-fz-credit a { color: var(--ym-fz-weiss-92); display: inline-block; padding: 2px 0; }

/* 1280 bis 1399: fünf Spalten wie bei 1440, nur die Marke schmaler und die Lücken enger
   (gemessen: vier Linkspalten 705 px + Marke 200 + 4 x 28 = 1017, Raster bei 1280 = 1024).
   Bis 0.1.107 stand die Marke hier allein in einer Zeile, rechts daneben bis 715 px leer (N28). */
@media (min-width: 1280px) and (max-width: 1399px) {
	.ym-fz .ym-fz-haupt .ym-fz-innen { grid-template-columns: minmax(200px, 1fr) repeat(4, max-content); column-gap: 28px; }
}
/* 981 bis 1279: Marke links über zwei Reihen, die vier Spalten 2 x 2 rechts daneben (N28).
   Breiteste Spalte (Bibliothek) 237 px, bei 981 px stehen je Spalte 252 px bereit. */
@media (min-width: 981px) and (max-width: 1279px) {
	.ym-fz .ym-fz-haupt .ym-fz-innen { grid-template-columns: 200px minmax(0, 1fr) minmax(0, 1fr); justify-content: stretch; gap: 40px; }
	.ym-fz .ym-fz-marke { grid-row: span 2; }
}
/* Tablet und Handy: Marke als Zeile oben, darunter die vier Spalten 2 x 2 */
@media (max-width: 980px) {
	.ym-fz .ym-fz-haupt .ym-fz-innen { grid-template-columns: 1fr 1fr; justify-content: stretch; gap: 32px 40px; }
	.ym-fz .ym-fz-marke { grid-column: 1 / -1; display: flex; align-items: flex-start; justify-content: flex-start; gap: 48px; flex-wrap: wrap; }
	.ym-fz .ym-fz-marke address { margin-top: 0; }
	/* Kritik R14 F8: Tablets werden mit dem Finger bedient, Linkziele auch 768 bis 980 mindestens 44 px (vorher 30) */
	.ym-fz .ym-fz-spalte ul { gap: 0; }
	.ym-fz .ym-fz-spalte li a { display: block; padding: 10px 0; white-space: normal; }
	.ym-fz .ym-fz-marke address a, .ym-fz .ym-fz-credit a { padding: 12px 0; }
}
/* Band: Text und Knöpfe bleiben ab 768 px nebeneinander, der Titel bricht bei Bedarf zweizeilig um
   (N28: bis 0.1.107 rutschten die Knöpfe unter 1150 px unter den Text, rechts blieben 320 px leer) */
.ym-fz .ym-fz-band-text { flex: 1 1 0; min-width: 0; }
@media (max-width: 767px) {
	.ym-fz .ym-fz-band .ym-fz-innen { flex-direction: column; align-items: flex-start; }
	.ym-fz .ym-fz-band-text { flex: none; }
}
@media (max-width: 767px) {
	.ym-fz .ym-fz-innen { width: calc(100% - 40px); max-width: none; }
	.ym-fz .ym-fz-band .ym-fz-innen { padding: 40px 0; }
	.ym-fz .ym-fz-band-knoepfe .ym-fz-knopf { flex: 1; }
	.ym-fz .ym-fz-haupt .ym-fz-innen { gap: 32px 20px; padding: 48px 0 40px; }
	.ym-fz .ym-fz-marke { display: block; }
	.ym-fz .ym-fz-marke address { margin-top: 20px; }
	.ym-fz .ym-fz-spalte ul { gap: 0; }
	/* Link so breit wie die Spalte: Ziel mindestens 44 px, auch bei kurzen Wörtern („Petra“) */
	.ym-fz .ym-fz-spalte li a { display: block; padding: 10px 0; white-space: normal; }
	.ym-fz .ym-fz-marke address a, .ym-fz .ym-fz-credit a { padding: 12px 0; }
	.ym-fz .ym-fz-leiste .ym-fz-innen { flex-direction: column; align-items: flex-start; }
}

/* Band-Knöpfe bis 600 px: beide zusammen volle Breite, gleich breit (raster-lr, Ursache 5; vorher rechts bis 278 px leer) */
@media (max-width: 600px) {
	.ym-fz .ym-fz-band-knoepfe { width: 100%; }
}
/* Band-Knöpfe unter 360 px: beide volle Breite untereinander, nichts läuft über den Rand (N24) */
@media (max-width: 359px) {
	.ym-fz .ym-fz-band-knoepfe { flex-direction: column; flex-wrap: nowrap; width: 100%; }
	.ym-fz .ym-fz-band-knoepfe .ym-fz-knopf { flex: 0 0 auto; width: 100%; box-sizing: border-box; justify-content: center; text-align: center; }
	/* N33: rechte Spalte so breit wie „Cookie-Einstellungen“ (146 px), damit das Wort nicht am
	   Bindestrich bricht; die linke Spalte bricht an Leerzeichen, längstes Wort „Empfehlungen“ passt */
	.ym-fz .ym-fz-haupt .ym-fz-innen { grid-template-columns: minmax(0, 1fr) fit-content(140px); column-gap: 16px; }
	/* Links hier 14 px: sonst ist „Empfehlungen“ (122 px) breiter als die linke Spalte (114 px) */
	.ym-fz .ym-fz-spalte li a { font-size: 14px; }
}

/* Kritik R15 N12: Adresse-Mail und geh-online reagieren wie die übrigen Fußzeilenlinks (Aqua, Linie 2 px). */
.ym-fz .ym-fz-marke address a:hover, .ym-fz .ym-fz-credit a:hover { color: var(--ym-fz-aqua, #7FD8DC); text-decoration-thickness: 2px; }

/* Kritik R18 N7: Abstände des Divi-Fußzeilenabschnitts (Vorlage 22988288). Divi lädt sie aus
   et-core-unified-tb-22988288-deferred-*.css erst nach dem ersten Bild; auf kurzen Seiten (Impressum)
   rutschte die Fußzeile dabei um 50 px (CLS bis 0,015). Gleiche Werte hier, im Kopf geladen. */
.et-l--footer > .et_builder_inner_content .et_pb_section.et_pb_section_0_tb_footer { background-color: #25385D !important; }
.et_pb_section_0_tb_footer.et_pb_section, .et_pb_column_0_tb_footer { padding: 0; }
.et_pb_row_0_tb_footer.et_pb_row { margin: 0 !important; padding: 0 !important; }
.et_pb_row_0_tb_footer, .et_pb_pagebuilder_layout.single-post:not(.et-tb-has-body) #main-content .et_pb_row.et_pb_row_0_tb_footer { width: 100% !important; }
.et_pb_row_0_tb_footer { max-width: 100% !important; }
.et_pb_code_0_tb_footer { margin-bottom: 0 !important; }