/* Fixierte Menüleiste Styling */
#header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 10003;
  transition: background-color 0.3s ease;
  background-color: transparent;
}

/* Zustand beim Scrollen - Hintergrundfarbe wird transparent */
#header.scrolled {
  background-color: rgba(250, 250, 250, 0.9); /* Semi-transparentes Weiß */
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}

/* Zusätzlicher Abstand für den Inhalt, damit er nicht unter dem Header verschwindet */
body {
  padding-top: 60px; /* Höhe des Headers anpassen */
}

/* Bei alternativer Header-Version (z.B. auf der Startseite) */
body.home {
  padding-top: 0;
}

#header.alt {
  background-color: transparent;
  box-shadow: none;
}

/* Anpassungen für mobile Ansicht */
@media screen and (max-width: 980px) {
  body {
	padding-top: 60px; /* Höhe des Headers in mobilem Layout */
  }
}

@media screen and (max-width: 736px) {
  body {
	padding-top: 44px; /* Höhe des Headers im kleinsten Layout */
  }
}