/* ==========================================================
   Einsatzgebiete – Verlinkung der Städte-Landingpages
   (/messie-notfallhilfe-<stadt>/). Footer-Leiste auf allen
   Seiten + Städte-Chips unter der Karte auf leistungen.html.
   ========================================================== */

/* ---------- Footer: Städteleiste ---------- */
.site-footer .footer-areas .container{
  display:block;
  padding:34px 0 26px;
  text-align:left;
}
.footer-areas{border-bottom:1px solid rgba(255,255,255,.12)}

.footer-areas-title{
  font-family:var(--font-head);
  font-weight:600;
  font-size:15px;
  letter-spacing:.02em;
  color:#fff;
  margin:0 0 14px;
}

.footer-areas ul{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:8px 24px;
}
.footer-areas a{
  display:inline-block;
  padding:4px 0;
  color:rgba(255,255,255,.78);
  font-size:14px;
  line-height:1.5;
  transition:color .2s ease;
}
.footer-areas a:hover,
.footer-areas a:focus-visible{color:#ffd9a0}

@media (max-width:1024px){
  .footer-areas ul{grid-template-columns:repeat(3, minmax(0, 1fr))}
}
@media (max-width:767px){
  .site-footer .footer-areas .container{text-align:center;padding:30px 0 22px}
  .footer-areas ul{grid-template-columns:repeat(2, minmax(0, 1fr));gap:2px 16px}
  .footer-areas a{padding:9px 0}   /* Tap-Target >= 40px */
}

/* ---------- Leistungen: Städte-Chips unter der Karte ---------- */
.area-links{
  list-style:none;
  margin:36px auto 0;
  padding:0;
  max-width:860px;
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:10px;
}
.area-links a{
  display:inline-flex;
  align-items:center;
  min-height:42px;
  padding:8px 18px;
  border:1px solid var(--red);
  border-radius:5px;
  color:var(--red);
  background:#fff;
  font-family:var(--font-ui);
  font-size:15px;
  font-weight:500;
  transition:background-color .2s ease, color .2s ease, transform .2s ease;
}
.area-links a:hover,
.area-links a:focus-visible{
  background:var(--red);
  color:#fff;
  transform:translateY(-2px);
}
@media (max-width:480px){
  .area-links{gap:8px}
  .area-links a{padding:8px 14px;font-size:14px}
}
@media (prefers-reduced-motion:reduce){
  .area-links a{transition:none}
  .area-links a:hover{transform:none}
}

/* Nach-oben-Button (bottom:82px über der Mobile-Bar) darf am Seitenende
   nicht auf den Footer-Links liegen. */
@media (max-width:1024px){
  .site-footer > .container:last-child{padding-bottom:64px}
}