/**
 * Footer der Kulturspinnerei-Tickets
 *
 * Farben aus den Theme-Variablen; Werte nach dem Komma sind Rueckfallwerte.
 *   --vts-header-bg  dunkle Grundfarbe
 *   --vts-accent     Akzent (Linie, Hover)
 */

.vts-footer {
	margin-top: 64px;
	color: rgba(255, 255, 255, .82);
	background: var(--vts-header-bg, #1f2430);
	border-top: 4px solid var(--vts-accent, #2563eb);
	font-size: 15px;
	line-height: 1.6;
}

/* Spalten */
.vts-footer__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 40px;
	padding-top: 48px;
	padding-bottom: 40px;
}

.vts-footer__title {
	margin: 0 0 16px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: #fff;
}

/* Kontakt */
.vts-footer__address {
	font-style: normal;
}
.vts-footer__address strong {
	display: inline-block;
	margin-bottom: 4px;
	font-size: 17px;
	color: #fff;
}
.vts-footer__phone {
	display: block;
	margin-top: 12px;
}

/* Linklisten */
.vts-footer__list {
	margin: 0;
	padding: 0;
	list-style: none;
}
.vts-footer__list li {
	margin: 0 0 8px;
}

/* Links */
.vts-footer a {
	color: rgba(255, 255, 255, .82);
	text-decoration: none;
	border-bottom: 1px solid transparent;
	transition: color .15s ease, border-color .15s ease;
}
.vts-footer a:hover,
.vts-footer a:focus-visible {
	color: #fff;
	border-bottom-color: var(--vts-accent, #2563eb);
}
.vts-footer a:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 3px;
	border-radius: 2px;
}

/* Untere Leiste */
.vts-footer__bottom {
	padding: 18px 0;
	font-size: 13px;
	color: rgba(255, 255, 255, .6);
	border-top: 1px solid rgba(255, 255, 255, .12);
}
.vts-footer__bottom p {
	margin: 0;
}

/* Tablet: Kontakt ueber die volle Breite, darunter zwei Spalten */
@media (max-width: 860px) {
	.vts-footer__grid {
		grid-template-columns: 1fr 1fr;
		gap: 32px;
	}
	.vts-footer__grid > :first-child {
		grid-column: 1 / -1;
	}
}

/* Smartphone: eine Spalte */
@media (max-width: 520px) {
	.vts-footer {
		margin-top: 40px;
	}
	.vts-footer__grid {
		grid-template-columns: 1fr;
		gap: 28px;
		padding-top: 36px;
		padding-bottom: 28px;
	}
}
