/*
 * Nachbauten von tomasa.de (siehe src/lib/live-kopf.ts): dort ist manches
 * keine Ueberschrift, was im Nachbau als h2 gestaltet war, und umgekehrt.
 * Die Ebenen folgen jetzt der alten Seite, das Aussehen bleibt.
 *
 * Die wie-h*-Klassen tragen dieselben Werte wie die h-Elemente in
 * basis.css. Diese Datei steht vor dem Export-Stylesheet, damit dessen
 * Klassen (herold-titel usw.) wie zuvor gewinnen.
 */

.wie-h2 {
  margin-top: 20px;
  margin-bottom: 10px;
  font-size: 32px;
  line-height: 36px;
  font-weight: bold;
}

.wie-h3 {
  margin-top: 20px;
  margin-bottom: 10px;
  font-size: 24px;
  line-height: 30px;
  font-weight: bold;
}

/* Umgekehrt: eine Ueberschrift wie live, die aussieht wie der Text davor. */
.wie-text {
  margin: 0;
  font-size: inherit;
  line-height: inherit;
  font-weight: inherit;
}

/* Footer der alten Seiten wie auf tomasa.de: Links unterstrichen in
   Dunkelbraun, dazwischen weisse (unsichtbare) Trennstriche. */
section.footer-herold { padding: 15px 45px; gap: 30px; align-items: flex-start; justify-content: flex-start; }
/* Die Symbole beginnen live in der zweiten Spalte des Rasters */
section.footer-herold .footer-links-live { flex: 0 0 268px; }
@media screen and (min-width: 768px) and (max-width: 991px) {
  section.footer-herold .footer-links-live { flex-basis: 375px; font-size: 15px; line-height: 24px; }
}
/* Symbole wie live in 35px-Feldern mit 10px Abstand */
section.footer-herold .div-block-14 { gap: 10px; }
section.footer-herold .div-block-14 a { display: flex; align-items: center; justify-content: center; width: 35px; height: 35px; }
.footer-links-live {
  margin: 0;
  color: #fff;
  font-family: Roboto, Roboto Variablefont Wdth Wght, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.6;
}
.footer-links-live .link.footer {
  color: #352b23;
  font-family: inherit;
  font-size: inherit;
  text-decoration: underline;
}
.footer-links-live .link.footer:hover { text-decoration: none; }
@media screen and (max-width: 767px) {
  /* Am Handy wie live: Symbole unter den Links, damit das Cookie-Symbol
     unten links nichts verdeckt */
  section.footer-herold { flex-direction: column; align-items: flex-start; gap: 20px; padding: 15px 25px 35px; }
  section.footer-herold .footer-links-live { flex: none; }
  section.footer-herold .div-block-14 a { width: 33px; height: 33px; }
  .footer-links-live { font-size: 15px; }
}