/* ============================================================
   e1ps/site-footer

   Aufbau dieser Datei wie beim Kopfbereich: Aufbau, Gestaltung, schmale
   Breiten. Farben ausschliesslich ueber Token.

   Masse 1:1 aus Prototyp.dc.html Zeile 2610-2632:
     Innencontainer  max-width 1180px, padding var(--space-7) var(--space-6),
                     Spalte, zentriert, gap var(--space-5)
     Logo            height 44px
     Zeile           gap var(--space-3) var(--space-4), --text-sm
     Trennstrich     senkrechter Balken in --footer-rule
     Gruppenzeile    --text-sm in --footer-muted
   ============================================================ */

/*
   Die Linie oben schliesst den Fussbereich gegen die Seite ab.

   Farbe aus --footer-rule und nicht aus --section-line: Der Fuss ist eine
   eigene Welt, immer Petrol, unabhaengig vom Farbschema — --section-line
   waere im hellen Schema Sand und damit die Linie der Seitenflaeche, nicht
   die des Fusses. --footer-rule traegt hier schon die senkrechten
   Trennstriche zwischen den Angaben; beides ist derselbe Trenner und soll
   deshalb dieselbe Farbe haben. Im Backend steht sie unter
   Fussbereich → Trennstriche, seit der Umstellung getrennt fuer hell und
   dunkel.

   1px, weil das Design-System keine eigene Staerke kennt: Jeder Trenner im
   Theme ist 1px, und --border-hairline/--border-solid haben die 1 fest
   eingebacken. Ein Token nur fuer diese eine Linie wuerde die Regel nicht
   vereinheitlichen, sondern eine zweite danebenstellen.

   Am Element selbst und nicht an __inner: Das ist auf 1180px begrenzt, die
   Linie soll aber von Rand zu Rand laufen.
*/
.ps-footer {
  background: var(--footer-bg);
  color: var(--footer-text);
  border-top: 1px solid var(--footer-rule);
}

.ps-footer__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-5);
  max-width: 1180px;
  margin-inline: auto;
  padding: var(--space-7) var(--space-6);
  text-align: center;
}

.ps-footer__logo {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-4);
}
.ps-footer__logo img {
  height: 44px;
  width: auto;
  max-width: none;
  object-fit: contain;
}

.ps-footer__line {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: var(--space-3) var(--space-4);
  font-size: var(--text-sm);
  color: var(--footer-text);
}

/*
   Angabe und vorangestellter Trennstrich bilden eine Einheit. Ohne diese
   Klammer landete der Strich beim Umbruch am Zeilenende oder allein am Anfang
   der naechsten Zeile — auf schmalen Geraeten bricht die Zeile vier Mal um.
*/
.ps-footer__item {
  display: inline-flex;
  align-items: center;
  gap: var(--space-4);
}

.ps-footer__sep {
  color: var(--footer-rule);
  user-select: none;
}

/* min-height statt Innenabstand: haelt die 24px aus WCAG 2.2 ein, ohne die
   Zeilenhoehe des umgebenden Textes zu veraendern. */
.ps-footer a {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  color: var(--footer-text);
  transition: color var(--dur-base) var(--ease-out);
}
.ps-footer a:hover { color: var(--footer-text-hover); }

.ps-footer__social {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
}

.ps-footer__group {
  font-size: var(--text-sm);
  color: var(--footer-muted);
}

/* ---------- Schmale Breiten ---------- */

@media (max-width: 768px) {
  .ps-footer__inner { padding: var(--space-7) var(--space-4); }
  .ps-footer__logo img { height: 36px; }
}