.site-grid {
  padding-left: 4rem;
  padding-right: 4rem;
}

/* Auf kleinen Bildschirmen (Smartphones) weniger Rand */
@media (max-width: 768px) {
  .site-grid {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}

.container-banner,
.container-header,
.container-main {
    max-width: 1100px;
    margin: 0 auto;
}

/* Header kompakter */
header.container-header {
  padding: 0.3rem 2rem !important;   /* weniger vertikaler Innenabstand */
  min-height: auto !important;       /* verhindert feste Höhe */
}

header.container-header .navbar-brand img {
  max-height: 45px !important;       /* statt 60px */
  height: auto;
  width: auto;
}

/* Grundschrift */
body {
  font-size: 18px;        /* größer als Standard */
  line-height: 1.7;        /* mehr Zeilenabstand */
}

/* Abstand zwischen Absätzen */
p {
  margin-bottom: 1.2em;    /* mehr Luft unter Absätzen */
}

/* Überschriften etwas lockern */
h1, h2, h3 {
  margin-top: 2em;
  margin-bottom: 1em;
  line-height: 1.3;
}

/* Header transparent lassen (falls nötig) */
.container-header,
.container-header .navbar {
  background: transparent !important;
  box-shadow: none !important;
}

/* Header in eine Zeile bringen */
header.container-header {
  display: flex;                 /* Logo & Menü nebeneinander */
  align-items: center;           /* vertikal mittig */
  justify-content: space-between;/* Logo links / Menü rechts */
  padding: .5rem 2rem !important;/* schlanker Header */
}

/* Menü als horizontale Liste */
header.container-header .container-nav .mod-menu {
  display: flex; gap: 1.25rem; margin: 0; padding: 0;
}


/* Links im Header-Menü: schwarz */
header.container-header .mod-menu a {
  color: #000 !important;
}

/* Hover/Fokus: grün */
header.container-header .mod-menu a:hover,
header.container-header .mod-menu a:focus {
  color: #2e7d32 !important;
}

/* Aktiver Menüpunkt */
header.container-header .mod-menu li.current > a,
header.container-header .mod-menu li.active > a {
  color: #000 !important;
}

/* Falls die Navbar noch als 'dark' läuft: Variablen überschreiben */
header.container-header .navbar {
  --bs-navbar-color: #000 !important;
  --bs-navbar-hover-color: #2e7d32 !important;
  --bs-navbar-active-color: #000 !important;
}

/* Optional: Dropdown-Einträge */
header.container-header .mod-menu .dropdown-item {
  color: #000 !important;
}
header.container-header .mod-menu .dropdown-item:hover,
header.container-header .mod-menu .dropdown-item:focus {
  color: #2e7d32 !important;
}