/* ============================================================
   CONTACT.CSS — Kontakt und Footer
   ------------------------------------------------------------
   Nach dem Vorhang bleibt die Seite dunkel bis zum Schluss.
   Dadurch gibt es zwischen About und Kontakt keine zweite harte
   Kante: der Vorhang fuehrt ins Dunkle, und dort endet die Seite.
   ============================================================ */
#contact {
  background: var(--dk-bg); color: var(--dk-txt);
  text-align: center; padding: 5rem 3rem;
  border-top: 1px solid var(--dk-line);   /* ruhige Zaesur statt Farbwechsel */
}
#contact .s-tag { color: var(--dk-ac); }
#contact h2 { font-size: clamp(3rem,7vw,6rem); margin-bottom: 1.2rem; color: var(--dk-txt); }
#contact h2 i { color: var(--dk-muted); }
#contact p { color: var(--dk-muted); font-size: .95rem; line-height: 1.85; margin-bottom: 1.8rem; max-width: 440px; margin-left: auto; margin-right: auto; }
#contact :focus-visible { outline-color: var(--dk-ac); }

/* Auf Dunkel darf der Hauptknopf im kraeftigen Aqua stehen: dunkle
   Schrift auf #00bfb3 ergibt 8,2:1, der Knopf selbst hebt sich mit
   8,2:1 vom Grund ab. */
#contact .btn-solid { background: var(--dk-ac); color: var(--dk-bg); }
#contact .btn-solid:hover { background: #3fd2c8; }
#contact .btn-line { border-color: var(--dk-line2); color: var(--dk-muted); }
#contact .btn-line:hover { border-color: var(--dk-ac); color: var(--dk-ac); }
.contact-row { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }
footer {
  padding: 1.5rem 3rem; border-top: 1px solid var(--line);
  display: flex; align-items: center; justify-content: space-between;
  font-size: .75rem; color: var(--muted);
}
/* Nur auf der Startseite dunkel. Impressum und Datenschutz nutzen
   dieselbe Datei und behalten ihren hellen Footer. */
footer.ft-dark { background: var(--dk-bg); border-top-color: var(--dk-line); color: var(--dk-muted); }
footer.ft-dark .ft-legal a { color: var(--dk-muted); }
footer.ft-dark .ft-legal a:hover { color: var(--dk-ac); }
footer.ft-dark :focus-visible { outline-color: var(--dk-ac); }
.ft-loc::before { content: ''; display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: var(--a); margin-right: .45rem; vertical-align: middle; }
.ft-legal a { color: var(--muted); transition: color .2s; display: inline-block; padding: .5rem .15rem; }
.ft-legal a:hover { color: var(--a-text); }
/* mobile layout: see responsive.css */