/*
 * SUBWAY Footer · Quelle: 07 Final Referenz (subway-final.css 7.9 + Tablet/Mobil), Werte unverändert, Namen auf --sw-* umgestellt.
 * Global auf allen Seiten ([sw_footer] im Footer-Template).
 */
.sw-ft { background: var(--sw-paper); color: var(--sw-text); padding: var(--sw-sec-c) var(--sw-pad) var(--sw-s-l); border-top: var(--sw-line-sec); }
.sw-ft, .sw-ft * { box-sizing: border-box; }
.sw-ft a { color: inherit; }
.sw-ft .mark { grid-column: 1 / 4; }
.sw-ft .mark img { display: block; width: clamp(128px, 11.05vw, 179px); height: auto; aspect-ratio: 1; }
.sw-ft nav:nth-of-type(1) { grid-column: 5 / 7; }
.sw-ft nav:nth-of-type(2) { grid-column: 7 / 9; }
.sw-ft nav:nth-of-type(3) { grid-column: 9 / 11; }
.sw-ft nav:nth-of-type(4) { grid-column: 11 / -1; }
.sw-ft h3 { margin: 0 0 var(--sw-s-s); padding-bottom: var(--sw-s-xs); border-bottom: var(--sw-line-content); color: inherit; }
.sw-ft ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sw-s-xs); font-size: var(--sw-fs-small); line-height: 1.35; }
.sw-ft .claim { grid-column: 1 / -1; font-size: var(--sw-fs-small); color: var(--sw-text-2); margin: var(--sw-s-xl) 0 0; }
.sw-ft .base { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: baseline; gap: var(--sw-s-m); flex-wrap: wrap; margin-top: var(--sw-s-s); padding-top: var(--sw-s-s); border-top: var(--sw-line-micro); color: var(--sw-text-2); }
.sw-ft .base .sw-langeweile { margin-left: auto; } /* ganz rechts (letztes Element der Zeile; „Nach oben ↑“ entfällt, Stefan 08.10.2026) */
@media (max-width: 1199px) {
	.sw-ft .mark { grid-column: 1 / -1; margin-bottom: var(--sw-s-l); }
	.sw-ft .mark img { width: 104px; }
	.sw-ft nav:nth-of-type(1) { grid-column: 1 / 3; }
	.sw-ft nav:nth-of-type(2) { grid-column: 3 / 5; }
	.sw-ft nav:nth-of-type(3) { grid-column: 5 / 7; }
	.sw-ft nav:nth-of-type(4) { grid-column: 7 / -1; }
}
@media (max-width: 767px) {
	.sw-ft .mark { display: flex; align-items: center; margin-bottom: var(--sw-s-l); }
	.sw-ft .mark img { width: 88px; }
	.sw-ft nav:nth-of-type(1) { grid-column: 1 / 3; }
	.sw-ft nav:nth-of-type(2) { grid-column: 3 / -1; }
	.sw-ft nav:nth-of-type(3) { grid-column: 1 / 3; margin-top: var(--sw-s-l); }
	.sw-ft nav:nth-of-type(4) { grid-column: 3 / -1; margin-top: var(--sw-s-l); }
	.sw-ft .claim { margin-top: var(--sw-s-l); }
	.sw-ft .base { flex-direction: column; gap: var(--sw-s-xs); }
	.sw-ft .base .sw-langeweile { margin-left: 0; align-self: flex-end; } /* untereinander: rechtsbündig */
}
/* „Langeweile?“ (bestehende Funktion) auf hellem Footer lesbar */
.sw-ft .sw-langeweile, .sw-ft .sw-langeweile:focus:not(:focus-visible) { color: var(--sw-text-2); font: inherit; letter-spacing: inherit; }

/* ---------- Dunkle Variante (Stefan 08.10.2026) – nur Farben ----------
   Themenseiten Klangfarben (/musik/), Filmwelt (/film-serien/), Veranstaltungen (Kalender); Auswahl in sw_footer_dunkel().
   Gleiche Komponente, gleiche Struktur, Typografie, Abstände und Bildmarkengröße – nur Farbwerte; Bildmarke als pinke Fassung
   (subway-bildmarke-pink.svg, Original-Pink #B70074 aus subway-logo.svg). Kontrast auf Schwarz: Weiß 21 : 1, Fließtext
   #D8D0C4 13,7 : 1, Sekundärtext #B3A99D 9,1 : 1, Bildmarke 3,3 : 1 (Grafik ≥ 3 : 1). */
.sw-ft--dunkel { background: #000000; color: #FFFFFF; border-top-color: #000000; }
.sw-ft--dunkel h3 { border-bottom-color: var(--sw-text-2); }                     /* Spaltenlinie: dezentes Grau */
.sw-ft--dunkel .claim { color: var(--sw-line-color); }                           /* Fließtext: helles Grau */
.sw-ft--dunkel .base { color: var(--sw-text-inv-2); border-top-color: var(--sw-line-color-dark); } /* Copyright, feine Linie */
.sw-ft--dunkel .sw-langeweile, .sw-ft--dunkel .sw-langeweile:focus:not(:focus-visible) { color: var(--sw-text-inv-2); }
/* Hover: Weiß bleibt Weiß, Linie wie im hellen Footer (2 px); Fokus: weißer Rahmen + Ring in der Akzentfarbe der Farbwelt statt Tintenring (auf Schwarz unsichtbar; alle Farbwelten ≥ 3,3 : 1) */
.sw-ft--dunkel a:hover, .sw-ft--dunkel a:active { color: #FFFFFF; }
.sw-ft--dunkel .base a:hover, .sw-ft--dunkel .base a:active { color: var(--sw-text-inv); }
.sw-ft--dunkel :focus-visible { outline-color: #FFFFFF; box-shadow: 0 0 0 6px var(--sw-accent); }
