/*
 * spurenweise - Konsistenz-Fixes (Design-Review 07/2026)
 * Behebt Ungleichmäßigkeiten aus dem Webflow-Export, ohne das Original-CSS anzutasten.
 */

/* 1) Seitentitel h1.title (Impressum, Datenschutz): Im Webflow-CSS fehlte die
   Responsive-Skalierung - der Titel fiel auf Mobilgeräten auf 17px zurück und war
   damit kleiner als die Zwischenüberschriften. Skala übernommen von
   .title.expanded (FAQ-Seite): 46px Desktop → 42 → 35 → 28. */
@media (max-width: 991px) {
  h1.title { font-size: 42px; }
}
@media (max-width: 767px) {
  h1.title { font-size: 35px; }
}
@media (max-width: 479px) {
  h1.title { font-size: 28px; }
}

/* 2) 404-Seite: Titel war mit 28px Desktop / 17px mobil deutlich kleiner als alle
   anderen Seitentitel - an dieselbe Skala angeglichen. */
.utility-page-content h3.title {
  font-size: 42px;
  line-height: 1.2;
  margin-bottom: 12px;
}
@media (max-width: 767px) {
  .utility-page-content h3.title { font-size: 35px; }
}
@media (max-width: 479px) {
  .utility-page-content h3.title { font-size: 28px; }
}

/* 3) Blog-Artikel-Titel auf schmalen Screens: 22px lag zu nah an den
   h2-Zwischenüberschriften (20px) - klarere Hierarchie. */
@media (max-width: 479px) {
  h1.blog_h1 { font-size: 26px; }
}

/* 4) Feature-Grid der Startseite (.section.margin_increased): Das Webflow-Grid
   hatte feste 220px-Zeilenhöhen - der längere Text lief unten aus der Sektion
   heraus und verschluckte den 70px-Abstand zur nächsten Sektion. Mit auto-Zeilen
   wächst die Sektion mit dem Inhalt, der Abstand entspricht wieder dem der
   übrigen Sektionen. */
.grid-features {
  grid-template-rows: auto;
  grid-auto-rows: auto;
}

/* 5) Hero-Absatz der Startseite: Der Text lag ohne Schatten oder Hinterlegung
   direkt auf dem Foto - je nach Viewport-Beschnitt (Steg, Tasse, Kopfhörer)
   kaum lesbar. Sanftes Milchglas-Feld im Stil der Navbar sichert den Kontrast
   in jeder Breite; die Überschrift (140px, fett) braucht das nicht. */
.hero_full-image .hero_paragraph {
  background: rgba(248, 245, 238, 0.62);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  border-radius: 18px;
  padding: 18px 26px;
}

/* Startseite: Abstand zwischen Themen-Karten und Footer
   (nach Entfernung des Fachbegriffe-Blocks, 20.07.2026) */
.sw-bottom-space {
  padding-bottom: 6em;
}