/* =========================================================
   footer.css — nur für Seiten, die diese Body/Layout-Regeln brauchen
   (z.B. impressum.php).  -> body class: "page-with-footer-layout"
   ========================================================= */

/* Aktiviert "Footer always at bottom" nur für Seiten mit class */
body.page-with-footer-layout {
  min-height: 100vh;              /* body füllt Viewport */
  display: flex;
  flex-direction: column;         /* header + main + footer stacken */
}

/* main nimmt den verfügbaren Platz ein, damit Footer unten bleibt.
   Das ist sicher — wirkt nur auf Seiten mit body.page-with-footer-layout. */
body.page-with-footer-layout main {
  flex: 1 1 auto;
  display: block;                 /* kein zentrierendes flex, vermeidet das graue Loch */
  padding: 40px 20px;
}

/* Wrapper zum Zentrieren des Content innerhalb des main */
.impressum-wrapper {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 20px;
  display: flex;
  justify-content: center;
  align-items: center; /* optional — falls du vertikal zentrieren willst */
}

/* Optional: kleine Anpassungen an Impressum-Card auf dieser Seite */
.impressum-card {
  /* visuelles Feintuning; die visuelle Basis kommt aus style.css */
  padding: 40px 48px;
  box-shadow: 0 8px 30px rgba(2,8,12,0.5);
}

/* Footer-spezifische Feinheiten (nur Aussehen, kein Hintergrund) */
.footer {
  margin-top: 24px;
  padding: 20px;
  border-top: 1px solid rgba(255,255,255,0.03);
  background: transparent; /* WICHTIG: Hintergrund global verwenden */
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.footer .links { display:flex; gap:12px }
.footer .small { color: var(--muted) }
.badge { padding:8px 12px; border-radius:10px; font-weight:800 }

/* Responsiveness: kleinere Stacks auf kleinen Screens */
@media (max-width:700px) {
  .impressum-card { padding: 28px 20px; }
  .footer { flex-direction: column; align-items: flex-start; gap:10px; }
}