/*
 * Footer (SIRUPE_REDESIGN_SPEC.md 6.5): dunkel, vier Spalten, darunter
 * Social Icons + Copyright aus dem Astra-Footer-Builder.
 *
 * Geladen auf allen sirupe-site-Seiten UND auf der Oaschwossa-Landingpage
 * (Ausnahme zu Regel 2.1, siehe Spezifikation). Jeder Selektor beginnt mit
 * .sirupe-site-footer (Body-Klasse auf genau diesen Seiten).
 *
 * Weil tokens.css auf der Oaschwossa-Seite nicht geladen wird, definiert diese
 * Datei die benötigten Tokens selbst – nur innerhalb des Footers. Werte
 * müssen mit tokens.css übereinstimmen.
 */

.sirupe-site-footer #colophon,
.sirupe-site-footer.sirupe-site #ast-scroll-top {
	--s-bg: #fbf6ee;
	--s-ink: #1d1a16;
	--s-max: 1280px;
	--s-gutter: 24px;
	--s-radius-pill: 999px;
	--s-font-head: "Bricolage Grotesque", "Helvetica Neue", Arial, sans-serif;
	--s-font-body: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	--s-tracking-head: -0.02em;
}

.sirupe-site-footer #colophon {
	background: var(--s-ink);
	color: var(--s-bg);
	font-family: var(--s-font-body);
	font-size: 17px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.sirupe-site-footer #colophon a {
	color: var(--s-bg);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
}

.sirupe-site-footer #colophon a:hover {
	color: #ffffff;
	text-decoration-thickness: 2px;
}

.sirupe-site-footer #colophon :focus-visible {
	outline: 2px solid var(--s-bg);
	outline-offset: 3px;
}

/* ---------- Vier Spalten ---------- */

.sirupe-site-footer .sirupe-footer__inner {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 32px;
	max-width: var(--s-max);
	margin: 0 auto;
	padding: 64px var(--s-gutter) 40px;
	box-sizing: border-box;
	font-size: 15px;
	line-height: 1.7;
}

.sirupe-site-footer .sirupe-footer p {
	margin: 0;
	color: inherit;
}

.sirupe-site-footer .sirupe-footer p + p {
	margin-top: 10px;
}

.sirupe-site-footer .sirupe-footer .sirupe-footer__brand {
	font-family: var(--s-font-head);
	font-size: 24px;
	font-weight: 800;
	letter-spacing: var(--s-tracking-head);
	line-height: 1.2;
	margin-bottom: 8px;
}

.sirupe-site-footer .sirupe-footer .sirupe-footer__title,
.sirupe-site-footer .sirupe-footer .wp-block-heading,
.sirupe-site-footer .sirupe-footer h2,
.sirupe-site-footer .sirupe-footer h3 {
	margin: 0 0 6px;
	color: inherit;
	font-family: var(--s-font-body);
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0;
	line-height: 1.7;
}

.sirupe-site-footer .sirupe-footer ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* ---------- Reihe darunter: Social Icons + Copyright ---------- */

.sirupe-site-footer #colophon .site-below-footer-wrap[data-section="section-below-footer-builder"] {
	background: transparent;
	border-top: 1px solid rgba(251, 246, 238, 0.16);
	padding: 20px var(--s-gutter) 28px;
}

.sirupe-site-footer #colophon .site-below-footer-wrap[data-section="section-below-footer-builder"] .ast-builder-grid-row {
	max-width: calc(var(--s-max) - 2 * var(--s-gutter));
}

.sirupe-site-footer #colophon .ast-footer-copyright,
.sirupe-site-footer #colophon .ast-footer-copyright.site-footer-focus-item {
	color: rgba(251, 246, 238, 0.78);
	font-size: 14px;
	line-height: 1.7;
}

.sirupe-site-footer #colophon .ast-footer-copyright p {
	margin: 0;
}

.sirupe-site-footer #colophon .ast-footer-copyright a {
	color: rgba(251, 246, 238, 0.9);
}

.sirupe-site-footer #colophon .ast-builder-social-element,
.sirupe-site-footer #colophon .ast-builder-social-element:hover {
	color: var(--s-bg);
	background: transparent;
	text-decoration: none;
}

.sirupe-site-footer #colophon .footer-social-inner-wrap .ast-builder-social-element svg,
.sirupe-site-footer #colophon .ast-footer-social-1-wrap .ast-builder-social-element svg {
	fill: var(--s-bg);
	width: 20px;
	height: 20px;
}

.sirupe-site-footer #colophon .ast-builder-social-element {
	min-width: 44px;
	min-height: 44px;
	margin: 0 2px;
}

/* Scroll-nach-oben-Button von Astra im neuen Stil (die Oaschwossa-Seite behält ihren eigenen). */
.sirupe-site-footer.sirupe-site #ast-scroll-top {
	background: var(--s-ink);
	color: var(--s-bg);
	border-radius: var(--s-radius-pill);
}
