/*
 * REFERENCE MARKUP — copy this block verbatim into any page that needs the footer.
 * ─────────────────────────────────────────────────────────────────────────────────
 *
 * <footer class="site-footer">
 *
 *   <div class="site-footer__main container">
 *     <div class="site-footer__col site-footer__col--about">
 *       <p class="site-footer__tagline">ANTRIEB MENSCH. SEIT 1908.</p>
 *       <p>Menschliche Anforderungen treiben unser Handeln an. Für und mit
 *       unseren Kunden entwickeln und produzieren wir Abfüllanlagen,
 *       Prozessanlagen, Labore und Lernräume als individuelle Lösungen.
 *       Innovativ und weltweit. Um gemeinsam Menschenmögliches für Ernährung,
 *       Gesundheit und Bildung zu erreichen.</p>
 *     </div>
 *
 *     <div class="site-footer__col site-footer__col--links">
 *       <ul class="site-footer__link-list">
 *         <li><a href="https://www.waldner.de/de/dosomat-packaging-solutions">DOSOMAT Packaging Solutions</a></li>
 *         <li><a href="https://www.waldner.de/de/process-automation-solutions">Process &amp; Automation Solutions</a></li>
 *         <li><a href="https://www.waldner.de/de/lab-space-solutions">Lab Space Solutions</a></li>
 *         <li><a href="https://www.waldner.de/de/education">Education</a></li>
 *       </ul>
 *     </div>
 *
 *     <div class="site-footer__col site-footer__col--social">
 *       <p class="site-footer__newsletter-label">Newsletter</p>
 *       <a class="site-footer__newsletter-btn btn btn--secondary" href="https://www.waldner.de/de/newsletter" rel="noopener noreferrer">Jetzt anmelden</a>
 *
 *       <p class="site-footer__follow-label">Follow us</p>
 *       <ul class="site-footer__social-list">
 *         <li>
 *           <a class="site-footer__social-link site-footer__social-link--linkedin"
 *              href="https://de.linkedin.com/company/waldner"
 *              rel="noopener noreferrer"
 *              aria-label="Waldner auf LinkedIn">
 *             <svg aria-hidden="true" width="20" height="20" viewBox="0 0 24 24" fill="currentColor">
 *               <path d="M20.45 20.45h-3.56v-5.57c0-1.33-.03-3.04-1.85-3.04-1.85 0-2.13 1.45-2.13 2.94v5.67H9.35V9h3.41v1.56h.05c.48-.9 1.64-1.85 3.37-1.85 3.6 0 4.27 2.37 4.27 5.45v6.29zM5.34 7.43a2.07 2.07 0 1 1 0-4.14 2.07 2.07 0 0 1 0 4.14zm1.78 13.02H3.56V9h3.56v11.45zM22.23 0H1.77C.79 0 0 .77 0 1.73v20.54C0 23.23.79 24 1.77 24h20.46c.98 0 1.77-.77 1.77-1.73V1.73C24 .77 23.21 0 22.23 0z"/>
 *             </svg>
 *             <span>LinkedIn</span>
 *           </a>
 *         </li>
 *         <li>
 *           <a class="site-footer__social-link site-footer__social-link--youtube"
 *              href="https://www.youtube.com/c/WALDNERGroup"
 *              rel="noopener noreferrer"
 *              aria-label="Waldner auf YouTube">
 *             <svg aria-hidden="true" width="20" height="20" viewBox="0 0 24 24" fill="currentColor">
 *               <path d="M23.5 6.19a3.02 3.02 0 0 0-2.12-2.14C19.55 3.5 12 3.5 12 3.5s-7.55 0-9.38.55A3.02 3.02 0 0 0 .5 6.19C0 8.04 0 12 0 12s0 3.96.5 5.81a3.02 3.02 0 0 0 2.12 2.14C4.45 20.5 12 20.5 12 20.5s7.55 0 9.38-.55a3.02 3.02 0 0 0 2.12-2.14C24 15.96 24 12 24 12s0-3.96-.5-5.81zM9.75 15.5V8.5l6.25 3.5-6.25 3.5z"/>
 *             </svg>
 *             <span>Youtube</span>
 *           </a>
 *         </li>
 *       </ul>
 *     </div>
 *   </div>
 *
 *   <div class="site-footer__meta">
 *     <div class="container">
 *       <ul class="site-footer__meta-list">
 *         <li><span>© WALDNER Holding SE &amp; Co. KG</span></li>
 *         <li><a href="https://www.waldner.de/de/impressum">Impressum</a></li>
 *         <li><a href="https://www.waldner.de/de/datenschutzerklaerung">Datenschutz</a></li>
 *       </ul>
 *     </div>
 *   </div>
 *
 * </footer>
 *
 * ─────────────────────────────────────────────────────────────────────────────────
 */

/* ── Site Footer ──────────────────────────────────────────────────────────────── */

.site-footer {
	background: var(--c-secondary);
	color: var(--c-surface);
	margin-top: 4rem;
}

/* ── Main section: 3-column grid ─────────────────────────────────────────────── */

.site-footer__main {
	display: grid;
	grid-template-columns: 2fr 1fr 1fr;
	gap: 3rem;
	padding-block: 3rem;
}

.site-footer__col {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}

/* About column */
.site-footer__tagline {
	font-size: 0.875rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	margin: 0 0 0.25rem;
	color: var(--c-surface);
}

.site-footer__col p {
	font-size: 0.875rem;
	line-height: 1.6;
	margin: 0;
	color: rgb(255 255 255 / 0.8);
}

/* Links column */
.site-footer__link-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.site-footer__link-list a {
	font-size: 0.875rem;
	color: rgb(255 255 255 / 0.85);
	text-decoration: none;
	transition: color 0.15s;
}

.site-footer__link-list a:hover { color: var(--c-surface); text-decoration: underline; }

/* Newsletter + Social column */
.site-footer__newsletter-label {
	font-size: 0.875rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin: 0;
	color: var(--c-surface);
}

.site-footer__newsletter-btn {
	align-self: flex-start;
	color: var(--c-surface);
	border-color: rgb(255 255 255 / 0.6);
	font-size: 0.875rem;
	padding: 0.5rem 1.25rem;
}

.site-footer__newsletter-btn:hover {
	background: rgb(255 255 255 / 0.1);
	border-color: var(--c-surface);
	color: var(--c-surface);
}

.site-footer__follow-label {
	font-size: 0.875rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin: 0.75rem 0 0;
	color: var(--c-surface);
}

.site-footer__social-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: 0.75rem;
}

.site-footer__social-link {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	font-size: 0.8125rem;
	color: rgb(255 255 255 / 0.75);
	text-decoration: none;
	transition: color 0.15s;
}

.site-footer__social-link:hover { color: var(--c-surface); }

/* ── Meta bar (copyright / legal links) ──────────────────────────────────────── */

.site-footer__meta {
	background: var(--c-navy);
	padding-block: 0.875rem;
}

.site-footer__meta-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.25rem 1.5rem;
	align-items: center;
}

.site-footer__meta-list span,
.site-footer__meta-list a {
	font-size: 0.8125rem;
	color: rgb(255 255 255 / 0.65);
	text-decoration: none;
}

.site-footer__meta-list a:hover { color: var(--c-surface); text-decoration: underline; }

/* ── Responsive ──────────────────────────────────────────────────────────────── */

@media (max-width: 48rem) {
	.site-footer__main {
		grid-template-columns: 1fr;
		gap: 2rem;
		padding-block: 2rem;
	}

	.site-footer__meta-list {
		flex-direction: column;
		align-items: flex-start;
		gap: 0.5rem;
	}
}