/* ==========================================================================
   STANDOUT-Footer
   Version 1.1 - 05.09.2026

   Kapselung nach dem Muster von eocn-quickcheck: alles haengt unter .so-footer,
   jede Regel nennt den Wrapper. Dadurch ist die Spezifitaet ueberall
   mindestens (0,2,0) und die Ladereihenfolge gegenueber Salient spielt keine
   Rolle. Kein !important.

   Farben absichtlich NICHT aus dem Saeulensystem: der Block muss auf jedem
   dunklen Grund lesbar sein, den die Theme Options hergeben. Deshalb
   durchgehend Weiss in abgestufter Deckkraft. Auf Markenblau #134591
   gemessen: Fliesstext 7,24:1, Kleingedrucktes 5,82:1 - beides ueber der
   WCAG-AA-Schwelle von 4,5:1.
   ========================================================================== */


/* --------------------------------------------------------------------------
   0 - Salients Widgetbereich ausblenden

   AUSNAHME: das ist ein Eingriff in Theme-Markup, nicht additiv.

   Grund: der Bereich enthaelt genau ein Textwidget mit dem Copyright-Satz und
   ist trotzdem 246 px hoch (gemessen am 05.09.2026) - drei der vier Spalten
   sind leer. Unter unserem Footer stehend ergaebe das eine leere Farbflaeche
   von einem Viertel Bildschirmhoehe. Der Copyright-Satz wird weiter unten
   wortgleich wieder ausgegeben, nur in der Hausschrift statt in Roboto.

   FOLGE, die man wissen muss: Widgets, die jemand kuenftig in den
   Footer-Widgetbereich legt, erscheinen nicht. Wer dort wieder arbeiten will,
   loescht diese eine Regel.

   Kein !important noetig - zwei IDs schlagen alles, was Salient hier setzt.
   -------------------------------------------------------------------------- */

#footer-outer #footer-widgets {
  display: none;
}


/* --------------------------------------------------------------------------
   0b - Widgets im mobilen Menue ausblenden

   Auch ein Eingriff in Theme-Markup, aus demselben Grund wie oben: fuer
   Widgets gibt es keine Ability.

   Am 07.09.2026 stand in #slide-out-widget-area genau ein Textwidget
   (#text-2) mit der Ueberschrift "About us" und der Anschrift
   "street / city / country" - unausgefuellter Platzhaltertext, oeffentlich
   sichtbar im mobilen Menue. Die Anschrift steht jetzt vollstaendig im
   Footer, das Widget ist damit auch inhaltlich ueberfluessig.

   Bewusst ALLE Widgets des Bereichs und nicht #text-2: die ID vergibt
   WordPress, sie kann sich beim naechsten Speichern der Widgets aendern.
   Waere sie verdrahtet, wuerde die Regel still aufhoeren zu wirken und der
   Platzhalter kaeme zurueck. So kann dort nichts Unerwuenschtes auftauchen.

   FOLGE: wer im mobilen Menue absichtlich ein Widget zeigen will, loescht
   diese Regel. Das Menue selbst ist nicht betroffen, es liegt in
   .off-canvas-menu-container.

   Der saubere Weg bleibt, das Widget in Design -> Widgets zu loeschen - dann
   verschwindet der Platzhalter auch aus dem Quelltext.
   -------------------------------------------------------------------------- */

#slide-out-widget-area .inner .widget {
  display: none;
}


/* --------------------------------------------------------------------------
   1 - Der Rahmen
   -------------------------------------------------------------------------- */

.so-footer {
  /* Vorgabe fuer den Fall, dass das Skript ausfaellt. Zur Laufzeit gegen die
     echte Farbe von #footer-outer getauscht, siehe
     so_footer_hintergrund_skript(). */
  background-color: #134591;
  color: rgba(255, 255, 255, 0.86);

  /* Am 05.09.2026 gemessen: die Grundschrift dieser Installation ist Roboto,
     nicht Glacial Indifference. Die Hausschrift haengt an der Hilfsklasse
     .so-font-body in standout.css und wird ueber el_class an einzelne
     WPBakery-Elemente gehaengt - geerbt wird sie also nicht. Deshalb hier
     ausdruecklich, mit derselben Ersatzkette wie dort. */
  font-family: "Glacial Indifference", "Segoe UI", -apple-system, system-ui, sans-serif;
}


/* --------------------------------------------------------------------------
   2 - Anschrift und Navigation
   -------------------------------------------------------------------------- */

.so-footer .so-footer__main {
  display: flex;
  flex-wrap: wrap;
  gap: 34px 56px;
  padding: 52px 0 46px;
}

.so-footer .so-footer__col {
  flex: 1 1 200px;
  min-width: 200px;
}

/* Spalte 3 traegt einen langen Satz und bekommt deshalb mehr Grundbreite. */
.so-footer .so-footer__col--projekt {
  flex: 1 1 300px;
}

.so-footer .so-footer__head {
  margin: 0 0 14px;
  padding: 0;
  /* Wie beim <strong> weiter unten: Salient setzt fuer Ueberschriften eine
     eigene Schrift (Cabin). Eine geerbte Schrift verliert gegen jede
     ausdrueckliche Regel, deshalb hier inherit statt Vererbung. */
  font-family: inherit;
  font-size: 13px;
  line-height: 1.3;
  /* Glacial Indifference hat nur 400 und 700. */
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.62);
}

.so-footer .so-footer__adresse {
  /* Salient stellt <address> kursiv. */
  font-style: normal;
  margin: 0;
  font-size: 15px;
  line-height: 1.62;
  font-weight: 400;
}

.so-footer .so-footer__mail {
  margin: 12px 0 0;
  font-size: 15px;
  line-height: 1.5;
}

.so-footer .so-footer__mail a,
.so-footer .so-footer__nav a {
  color: #fff;
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0);
  transition: border-color 0.15s ease;
}

.so-footer .so-footer__mail a:hover,
.so-footer .so-footer__mail a:focus,
.so-footer .so-footer__nav a:hover,
.so-footer .so-footer__nav a:focus {
  border-bottom-color: rgba(255, 255, 255, 0.75);
}


/* --- Navigation ------------------------------------------------------------
   Im Footer gibt es kein Dropdown. Die Unterpunkte stehen eingerueckt unter
   ihrem Elternteil, der selbst kein Link ist - im Hauptmenue zeigt er auf "#"
   und oeffnet dort nur das Dropdown.
   -------------------------------------------------------------------------- */

.so-footer .so-footer__nav,
.so-footer .so-footer__nav-unter {
  list-style: none;
  margin: 0;
  padding: 0;
}

.so-footer .so-footer__nav > li {
  /* list-style gehoert auf das li, nicht auf das ul: Salient setzt
     list-style-type auf dem li mit hoeherer Spezifitaet als eine einzelne
     Klasse. (0,2,1) genuegt, kein !important - Design-Learnings 2.2. */
  list-style: none;
  margin: 0 0 9px;
  font-size: 15px;
  line-height: 1.45;
}

.so-footer .so-footer__nav-unter {
  /* Die Einrueckung ist die ganze Hierarchie - mehr braucht es hier nicht. */
  margin: 8px 0 12px;
  padding-left: 18px;
  border-left: 1px solid rgba(255, 255, 255, 0.22);
}

.so-footer .so-footer__nav-unter > li {
  list-style: none;
  margin: 0 0 7px;
  font-size: 14px;
  line-height: 1.45;
}

.so-footer .so-footer__nav-unter > li:last-child {
  margin-bottom: 0;
}

/* Elternteil ohne Ziel: als Text, nicht als tote Verknuepfung. */
.so-footer .so-footer__navtext {
  color: rgba(255, 255, 255, 0.86);
}


/* --------------------------------------------------------------------------
   3 - Spalte 3: Bezug zum Projekt

   Das Logo traegt sein eigenes Blau #0B4591 auf transparentem Grund - auf
   Markenblau waere davon nichts zu sehen. Es sitzt deshalb auf einer weissen
   Platte. Radius und weicher Schatten, damit es eingebettet wirkt und nicht
   wie ein aufgeklebtes Rechteck.

   Der Schatten ist dunkelblau getoent, nicht schwarz: reines Schwarz wird auf
   gesaettigtem Blau schnell schmutzig.
   -------------------------------------------------------------------------- */

.so-footer .so-footer__logo {
  display: inline-block;
  margin: 0 0 18px;
  padding: 15px 19px;
  background-color: #fff;
  border-radius: 12px;
  box-shadow: 0 12px 28px rgba(5, 26, 58, 0.3);
}

.so-footer .so-footer__logo img {
  display: block;
  height: 50px;
  width: auto;
}

.so-footer .so-footer__projekttext {
  margin: 0;
  font-size: 14px;
  line-height: 1.62;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.86);
}


/* --------------------------------------------------------------------------
   4 - Spalte 4: Copyright und Datenschutz
   -------------------------------------------------------------------------- */

.so-footer .so-footer__copyright {
  margin: 0;
  font-size: 13px;
  line-height: 1.6;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.74);
}

.so-footer .so-footer__privacy {
  margin: 14px 0 0;
  font-size: 14px;
  line-height: 1.5;
}

.so-footer .so-footer__privacy a {
  color: #fff;
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.4);
  transition: border-color 0.15s ease;
}

.so-footer .so-footer__privacy a:hover,
.so-footer .so-footer__privacy a:focus {
  border-bottom-color: #fff;
}


/* --------------------------------------------------------------------------
   5 - EU-Abbinder, weisse Zeile

   Weiss statt Markenblau, damit der vorgeschriebene Freiraum um das Emblem
   garantiert ist - er entsteht jetzt aus echtem Weissraum und nicht aus der
   weissen Platte im Bild.

   Der Wechsel erlaubt es, die Liefergrafik exakt zu reproduzieren statt sie
   zu annaehern: Text in ihrem Grau #404141 (10,4:1 auf Weiss), und die
   Striche in ihren Originalfarben - Blau #1B3C88 vor dem Foerdersatz, Tuerkis
   #21A09A vor dem Disclaimer. Auf Blau waren beide unsichtbar und mussten
   durch weisse ersetzt werden.

   Zum Tuerkis: Projektregel 2 haelt Tuerkis fuer Saeulen-Identitaet. Hier ist
   es keine Saeulenaussage, sondern die Reproduktion gelieferter Grafik. Falls
   das anders gesehen wird, sind es zwei Farbwerte - neutrales #D6D6D6 tut es
   auch.
   -------------------------------------------------------------------------- */

.so-footer .so-footer-eu {
  display: block;
  padding: 32px 0;
  background-color: #fff;
  color: #404141;
}

.so-footer .so-footer-eu__inner {
  display: flex;
  align-items: center;
  gap: 30px;
}

.so-footer .so-footer-eu__emblem {
  flex: 0 0 auto;
}

.so-footer .so-footer-eu__emblem img {
  display: block;
  /* Die Platte im Bild traegt oben und unten je 10 % weissen Rand, das Emblem
     selbst fuellt also rund 83 % der Bildhoehe. Auf weissem Grund geht dieser
     Rand im Untergrund auf, deshalb 80 px Bildhoehe fuer rund 66 px
     sichtbares Emblem. */
  height: 80px;
  width: auto;
}

.so-footer .so-footer-eu__support,
.so-footer .so-footer-eu__disclaimer {
  margin: 0;
  padding-left: 26px;
}

.so-footer .so-footer-eu__support {
  flex: 0 1 30%;
  font-size: 15px;
  line-height: 1.5;
  font-weight: 400;
  /* Originalfarbe des Strichs vor dem Foerdersatz. */
  border-left: 3px solid #1B3C88;
}

.so-footer .so-footer-eu__disclaimer {
  flex: 1 1 46%;
  font-size: 13px;
  line-height: 1.6;
  font-weight: 400;
  /* Originalfarbe des Strichs vor dem Disclaimer. */
  border-left: 3px solid #21A09A;
}

/* font-family: inherit ist noetig, weil Salient
   `.bold, strong, b { font-family: Roboto }` setzt (am 05.09.2026 im
   gerenderten DOM gefunden). Ohne diese Zeile stuende genau das Wort
   "Disclaimer:" in einer anderen Schrift als der Satz dahinter. */
.so-footer .so-footer-eu__disclaimer strong {
  font-weight: 700;
  font-family: inherit;
}


/* --------------------------------------------------------------------------
   6 - Gestapelt
   -------------------------------------------------------------------------- */

@media (max-width: 999px) {
  .so-footer .so-footer__main {
    gap: 34px;
    padding: 40px 0 34px;
  }

  .so-footer .so-footer__col {
    flex: 1 1 100%;
  }

  .so-footer .so-footer-eu__inner {
    display: block;
  }

  .so-footer .so-footer-eu__emblem img {
    height: 58px;
  }

  .so-footer .so-footer-eu__support,
  .so-footer .so-footer-eu__disclaimer {
    border-left: 0;
    padding-left: 0;
    /* Auf weissem Grund braucht der Trenner Grau, kein Weiss. */
    border-top: 1px solid #DFDFDF;
    margin-top: 18px;
    padding-top: 18px;
  }
}