/* ---------------------------------------------------------------------------
   Site-Footer — geteilt zwischen Landing (landing.css) und Bestellstrecke
   (tokens.css + wizard.css).

   Jede Regel haengt unter `footer.site`, damit dieses File komplett
   selbsttragend ist: es braucht weder landing.css' :root-Variablen noch
   dessen generische .wrap/.brand-Regeln, und es kann umgekehrt nichts
   ausserhalb des Footers umfaerben. Deshalb stehen die Farben hier als
   Literale (navy #092043 / blue-4 #C3CDDB, 1:1 aus landing.css).
   Schriften erbt der Footer bewusst vom jeweiligen Layout.
--------------------------------------------------------------------------- */

footer.site {
  background: #092043;
  color: #C3CDDB;
  padding-block: 34px 30px;
  font-size: .9rem;
}
footer.site a { color: #C3CDDB; text-decoration: none; }
footer.site a:hover { color: #fff; }

footer.site .wrap {
  max-width: 1240px;
  margin-inline: auto;
  padding-inline: 20px;
}

footer.site .brand { display: flex; align-items: center; text-decoration: none; }
footer.site .brand-logo { height: 28px; width: auto; display: block; }

/* ---------- Spalten (Carry-over freenet.de) ---------- */
footer.site .foot-cols {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px 28px;
  margin: 24px 0 4px;
}
@media (min-width: 600px) { footer.site .foot-cols { grid-template-columns: 1fr 1fr; } }
@media (min-width: 960px) { footer.site .foot-cols { grid-template-columns: repeat(4, 1fr); } }

footer.site .foot-cols h3 {
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #fff;
  margin: 0 0 6px;
}
footer.site .foot-cols ul { list-style: none; margin: 0; padding: 0; }
footer.site .foot-cols li a { display: inline-block; padding: 7px 0; line-height: 1.35; }

footer.site .foot-fam {
  display: flex;
  flex-wrap: wrap;
  gap: 2px 18px;
  margin: 18px 0 4px;
  font-size: .85rem;
}
footer.site .foot-fam a { padding: 7px 0; }

footer.site .foot-legal {
  display: flex;
  flex-wrap: wrap;
  gap: 2px 20px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, .16);
}
footer.site .foot-legal a { padding: 7px 0; font-weight: 600; }

/* blue-4 statt slate: Slate auf dem Navy-Footer ist fuer Fliesstext zu dunkel
   (axe: serious). */
footer.site .foot-fine { color: #C3CDDB; font-size: .82rem; line-height: 1.6; }

/* ---------------------------------------------------------------------------
   Checkout-Footer — die schlanke Variante der Bestellstrecke.

   freenet fuehrt im eigenen Checkout NICHT den navyfarbenen Vierspalter der
   Startseite, sondern ein helles Band mit einer Zeile Rechtslinks und den
   Fussnoten. Diese Regeln haengen unter .checkout-footer und kommen ohne
   landing.css aus, genau wie der Block darueber.
--------------------------------------------------------------------------- */

.checkout-footer {
  background: #f2f4f8;
  border-top: 1px solid #e1e6ef;
  padding-block: 26px 30px;
  color: #5A6982;
  font-size: .82rem;
  line-height: 1.6;
}
.checkout-footer__inner {
  max-width: 1240px;
  margin-inline: auto;
  padding-inline: 20px;
}

.checkout-footer__legal {
  display: flex;
  flex-wrap: wrap;
  gap: 2px 22px;
  padding-bottom: 16px;
  border-bottom: 1px solid #e1e6ef;
}
.checkout-footer__legal a {
  color: #092043;
  text-decoration: none;
  font-weight: 600;
  padding: 7px 0; /* 44px Touch-Ziel auf Mobil */
}
.checkout-footer__legal a:hover { text-decoration: underline; }

.checkout-footer__notes-heading {
  font-size: .82rem;
  font-weight: 800;
  color: #092043;
  margin: 18px 0 8px;
}
.checkout-footer__fine { margin: 0; font-size: .78rem; }