/* =====================================================================
   footer.css – Fußbereich nach Trilium-Note 14
   Später: _footer.scss. Farbe folgt dem Farbbalken (data-farbe); bei Orange
   abgedunkelt (#B25F00, 4,64:1 mit Weiß). Text, Links, Icons weiß.
   Logo Landeskirche: Platzhalter, Position per data-evlks (Spalte / Meta).
   ===================================================================== */

/* ---------- Varianten → Tokens ---------- */
:root { --footer-color: var(--bar-color); }
:root[data-farbe="orange"] { --footer-color: var(--lk-orange-text); }   /* AA statt 2,74:1 */
/* Unterer Footer etwas dunkler: Blau konkret #036195 (Jürgen), andere Farben
   abgeleitet (87 % Farbe / 13 % Schwarz – entspricht dem Verhältnis bei Blau) */
:root { --footer-color-dark: color-mix(in srgb, var(--footer-color) 87%, #000); }
:root[data-farbe="blau"] { --footer-color-dark: #036195; }

/* ---------- Fläche ---------- */
.site-footer {
  position: relative;
  margin-block-start: var(--gap-big);
  background: var(--footer-color);
  color: var(--lk-weiss);
  font-size: 0.95rem;                      /* ≈ 15 px, Regular – kein Light auf Farbe */
  line-height: 1.5;
}
.site-footer > * { position: relative; z-index: 1; }

/* ---------- Hauptbereich ---------- */
.site-footer__inner {
  grid-column: content;
  padding-block: 3rem 2.5rem;
}
/* Unterer Footer: eigene Fläche über die volle Breite (eigenes page-grid);
   die Trennlinie zum oberen Footer läuft ebenfalls randlos */
.site-footer__bottom {
  grid-column: full;
  background: var(--footer-color-dark);
  border-block-start: 1px solid rgba(255, 255, 255, 0.35);   /* nur Deko */
  padding-bottom: 2em;
}
.site-footer__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem 2.5rem;
}
@media (min-width: 768px)  { .site-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .site-footer__grid { grid-template-columns: 1.4fr 1fr 1fr 1.2fr; } }

.site-footer__col > :last-child { margin-block-end: 0; }
.site-footer__heading {
  margin: 0 0 0.9rem;
  font-family: var(--lk-font);
  font-stretch: var(--lk-stretch-condensed);  /* Noto Sans SemiCondensed */
  font-weight: var(--lk-weight-bold);
  font-size: 1.2rem;
  line-height: 1.25;
}
.site-footer__address {
  font-style: normal;
  margin: 0 0 1rem;
}
.site-footer__office { margin: 0 0 1rem; }
.site-footer__hours { display: inline-block; opacity: 1; }
.site-footer__list { margin: 0; padding: 0; list-style: none; }
.site-footer__list li { margin: 0 0 0.35rem; }

/* Links: weiß, Unterstreichung bei Hover/Fokus, Fokusring weiß mit Abstand */
.site-footer a { color: var(--lk-weiss); }
.site-footer__link { text-decoration: none; }
.site-footer__link:hover,
.site-footer__link:focus-visible {
  text-decoration: underline;
  text-underline-offset: 0.2em;
}
.site-footer :focus-visible {
  outline: 2px solid var(--lk-weiss);
  outline-offset: 4px;
  box-shadow: none;
}

/* Telefonseelsorge: deutlich hervorgehoben */
.site-footer__hotline { margin: 0 0 1.25rem; }
.site-footer__hotline-link {
  display: inline-block;
  padding: 0.6rem 0.9rem;
  border: 2px solid var(--lk-weiss);
  text-decoration: none;
  line-height: 1.3;
}
.site-footer__hotline-link:hover,
.site-footer__hotline-link:focus-visible { background: var(--lk-weiss); color: var(--footer-color); }
.site-footer__hotline-label { display: block; font-size: 0.85rem; }
.site-footer__hotline-number { display: block; font-size: 1.35rem; font-weight: var(--lk-weight-bold); letter-spacing: 0.02em; }
.site-footer__hotline .site-footer__hours { display: block; margin-top: 0.4rem; }
.site-footer__safe { margin: 0 0 1.25rem; }

/* Zeile im unteren Footer: links das Logo der Landeskirche (Default-Position,
   Schalter evlks), rechts „Folgen Sie uns auf:“ mit den Social-Media-Links */
.site-footer__extra {
  grid-column: content;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 1.25rem 2rem;
  padding-block: 2.5rem;
}
.site-footer__social-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 1rem;
  margin-inline-start: auto;             /* rechts */
}
.site-footer__social-label { margin: 0; }
.site-footer__evlks-slot--zeile { margin-inline-end: auto; }   /* links */

/* ---------- Social-Media-Icons ----------
   Kreisfläche über --icon-bg: hier Weiß auf der Farbfläche. */
.social { display: flex; align-items: center; gap: 0.5rem; }
.social__link { display: inline-flex; padding: 0.3rem; color: var(--lk-weiss); }
.social__icon { width: 2rem; height: 2rem; --icon-bg: currentColor; }
.icon__bg { fill: var(--icon-bg, currentColor); }
.social__link:hover .social__icon { opacity: 0.8; }

/* ---------- Logo Landeskirche (weiße Fassung mit Schriftzug) ---------- */
.site-footer__evlks { display: flex; }
.site-footer__evlks-link { display: inline-block; }
.site-footer__evlks-logo { display: block; width: 15rem; height: auto; }
.site-footer__evlks-slot:empty { display: none; }
.site-footer__evlks-slot--spalte .site-footer__evlks { margin-block-start: 0.5rem; }
.site-footer__evlks-slot--meta .site-footer__evlks-logo { width: 11rem; }
.site-footer__evlks-slot--meta { margin-inline-start: auto; }

/* ---------- Meta-Zeile ---------- */
.site-footer__meta {
  grid-column: content;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 1.75rem;
  padding-block: 1rem 1.25rem;
  border-block-start: 1px solid rgba(255, 255, 255, 0.35);   /* nur Deko */
  font-size: 0.875rem;
}
.site-footer__copyright { margin: 0; }
.site-footer__legal-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 1.25rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.site-footer__link--login { }                   /* dezent nur durch die Position; Farbe exakt Weiß */

/* Mobil: Meta-Zeile untereinander */
@media (max-width: 767px) {
  .site-footer__inner { padding-block: 2.5rem 2rem; }
  .site-footer__meta { flex-direction: column; align-items: flex-start; gap: 0.5rem; }
  .site-footer__evlks-slot--meta { margin-inline-start: 0; }
  .site-footer__social-nav { margin-inline-start: 0; }
}