/**
 * Footer.
 *
 * Vorher: Unterband 121 px hoch bei 80 px Inhalt in kaltem #404040,
 * Links unterstrichen beim Hover, harte Kante zum Inhalt.
 */

/* #colophon vorangestellt, weil Astras dynamisches CSS hier
   background-image: none setzt. */
#colophon .site-primary-footer-wrap {
	position: relative;
	background-image: var(--cz-verlauf-blau);
	color: var(--cz-weiss);
	padding-block: clamp(2.75rem, 5vw, 4rem) clamp(2.25rem, 4vw, 3rem);
}

/* Wellen-Uebergang vom Inhalt in den Footer */


.site-primary-footer-wrap .widget-title,
.site-primary-footer-wrap h2,
.site-primary-footer-wrap h3 {
	color: var(--cz-weiss);
	font-family: "Quicksand", sans-serif;
	font-weight: 600;
	font-size: 1.2rem;
	margin-bottom: 0.9rem;
}

.site-primary-footer-wrap,
.site-primary-footer-wrap p,
.site-primary-footer-wrap li {
	color: var(--cz-weiss);
	font-size: 0.95rem;
	line-height: 1.7;
}

/* --- Links: kein Unterstreichen, stattdessen Einrueckung ------------- */
.site-primary-footer-wrap a {
	color: var(--cz-weiss);
	text-decoration: none;
	transition:
		color var(--cz-dauer-kurz) var(--cz-easing),
		padding-left var(--cz-dauer-kurz) var(--cz-easing);
}

.cz-footer-links li a {
	position: relative;
	display: inline-block;
}

.cz-footer-links li a::before {
	content: "→";
	position: absolute;
	left: -1.1em;
	opacity: 0;
	transform: translateX(-4px);
	transition:
		opacity var(--cz-dauer-kurz) var(--cz-easing),
		transform var(--cz-dauer-kurz) var(--cz-easing);
}

.cz-footer-links li a:hover {
	padding-left: 0.35rem;
	color: var(--cz-flaeche);
	text-decoration: none;
}

.cz-footer-links li a:hover::before {
	opacity: 0.7;
	transform: translateX(0);
}

.cz-footer-links {
	list-style: none;
	margin: 0;
	padding: 0;
}

.cz-footer-links li {
	margin-bottom: 0.45rem;
	padding-left: 0;
}

.cz-footer-links li::before {
	display: none;
}

/* --- CTA im Footer ---------------------------------------------------
   Der alte Stand wurde beim Hover unterstrichen, weil die generische
   a:hover-Regel des Footers griff. */
.cz-footer-cta {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	margin-top: 0.6rem;
	padding: 0.75em 1.7em;
	border-radius: var(--cz-radius-pill);
	background: var(--cz-weiss);
	color: var(--cz-petrol) !important;
	font-family: "Quicksand", sans-serif;
	font-weight: 600;
	text-decoration: none !important;
	transition:
		background-color var(--cz-dauer) var(--cz-easing),
		color var(--cz-dauer) var(--cz-easing),
		transform var(--cz-dauer) var(--cz-easing),
		box-shadow var(--cz-dauer) var(--cz-easing);
}

.cz-footer-cta:hover,
.cz-footer-cta:focus-visible {
	background: var(--cz-orange-braun);
	color: var(--cz-weiss) !important;
	transform: translateY(-2px);
	box-shadow: var(--cz-schatten-m);
	text-decoration: none !important;
	padding-left: 1.7em;
}

.cz-footer-cta::before {
	display: none !important;
}

/* --- Social ----------------------------------------------------------- */
.cz-social {
	display: flex;
	gap: 0.6rem;
	margin-top: 1rem;
	padding: 0;
	list-style: none;
}

.cz-social li {
	margin: 0;
	padding-left: 0;
}

.cz-social li::before {
	display: none;
}

.cz-social a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.18);
	color: var(--cz-weiss);
	transition:
		background-color var(--cz-dauer-kurz) var(--cz-easing),
		transform var(--cz-dauer-kurz) var(--cz-easing);
}

.cz-social a:hover {
	background: var(--cz-weiss);
	color: var(--cz-petrol);
	transform: translateY(-3px);
	padding-left: 0;
}

/* --- Unterband: flacher und waermer ---------------------------------- */
.site-below-footer-wrap {
	background-color: var(--cz-dunkel);
	color: rgba(255, 255, 255, 0.82);
	font-size: var(--cz-text-klein);
	padding-block: 0.9rem !important;
	min-height: 0 !important;
}

.site-below-footer-wrap .ast-builder-grid-row,
.site-below-footer-wrap .site-footer-section {
	padding-block: 0 !important;
	min-height: 0 !important;
}

.site-below-footer-wrap p {
	margin: 0;
	font-size: var(--cz-text-klein);
	line-height: 1.5;
}

.site-below-footer-wrap a {
	color: var(--cz-blau-hell);
	text-decoration: none;
}

.site-below-footer-wrap a:hover {
	text-decoration: underline;
}
/* Widerruf-Schaltflaeche im Footer – ersetzt den frueher global
   eingebetteten Button am Seitenende. */
.cz-widerruf-button {
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
	margin-top: 0.7rem;
	padding: 0.55em 1.2em;
	border-radius: var(--cz-radius-pill);
	background: rgba(255, 255, 255, 0.16);
	color: var(--cz-weiss) !important;
	font-family: "Quicksand", sans-serif;
	font-weight: 600;
	font-size: 0.85rem;
	text-decoration: none !important;
	transition: background-color var(--cz-dauer-kurz) var(--cz-easing), transform var(--cz-dauer-kurz) var(--cz-easing);
}

.cz-widerruf-button:hover,
.cz-widerruf-button:focus-visible {
	background: var(--cz-weiss);
	color: var(--cz-petrol) !important;
	transform: translateY(-2px);
	padding-left: 1.2em;
}
