/* p { } entfernt, um Konflikte mit textformat.css zu vermeiden */
h1, h2, h3 {


}
html, body { margin: 0 !important; padding: 0 !important; }

/* Fix: wechselbild-container immer ganz hinten */
#wechselbild-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: -2 !important; /* war z-index: 0, jetzt ganz hinten */
  overflow: hidden;
  pointer-events: none;
}

/* Die Bilder im wechselbild-container ebenfalls ganz hinten */
#wechselbild-container img {
  z-index: -2 !important;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  object-fit: cover;
  display: block;
  pointer-events: none;
}

/* Top-Banner */
.top-banner {
    margin-top: 0 !important;
    position: relative !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw;
    z-index: 2000 !important; /* Hoch genug, damit es über allem liegt */
    background: rgba(255,255,255,0.7);

    box-shadow: 0 2px 12px rgba(78,103,34,0.08);
    border-radius: 0 0 18px 18px;
    padding-top: 10px;
    /* margin-top: 0 !important; /* Kein Abstand nach oben */
}


/* Menü fixiert unter dem Banner */
header {
    position: relative !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw;
    z-index: 1999 !important; /* Direkt unter dem Banner */
}
.navbar {
    width: 100vw;
    background: linear-gradient(90deg, #4e6722 80%, #6b8e23 100%);

    border-radius: 0 0 10px 10px;
    box-shadow: 0 4px 16px rgba(78,103,34,0.13);
    border-bottom: 2px solid #e6ffb3;
    backdrop-filter: blur(2px);
    min-height: 0;
    padding: 0;
    z-index: 1999 !important;
}
.nav-list {
    list-style: none;
    margin: 0;
    padding: 0 10%;
    display: flex;
    align-items: center;
    height: 54px;
}
.nav-list li {
    position: relative;
    height: 54px;
    display: flex;
    align-items: center;
}
.nav-list a {

    text-decoration: none;
    padding: 10px 18px 8px 18px;
    display: flex;
    align-items: center;

    transition: background 0.2s, color 0.2s, transform 0.2s;
    border-radius: 8px 8px 0 0;


    height: 100%;

    white-space: nowrap;
}
.nav-list a .arrow {

    margin-left: 6px;
    display: inline-block;
    vertical-align: middle;
}
.nav-list a:hover {
  background-color: #6b8e23;
  color: #fff;
  transform: translateY(-2px) scale(1.04);
}
.nav-list a.active,
 .nav-list a:focus {
  background-color: #6b8e23;
  color: #fff;
  outline: none;
}
.dropdown-content {
  display: none;
  position: absolute;
  min-width: 220px;
  top: 100%;
  left: 0;
  border-radius: 0 0 8px 8px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  z-index: 10;
  list-style: none;
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 0.25s, transform 0.25s;
  border-top: 2px solid #e6ffb3;
}
.dropdown-content li a {
  border-radius: 0 0 8px 8px;
  padding: 12px 18px;
  height: auto;
  display: block;
}
.dropdown:hover .dropdown-content {
    display: block;
    opacity: 1;
    transform: translateY(0);
}
@media (max-width: 900px) {
    .nav-list {
        padding: 0 2vw;
        height: 44px;
    }
    .nav-list li {
        height: 44px;
    }
    .nav-list a {

        padding: 7px 8px 6px 8px;
    }
    .dropdown-content li a {

        padding: 9px 10px;
    }
}

/* Abstand für den Seiteninhalt, damit nichts unter dem Banner/Menü verschwindet */
body {
    animation: bg-move 18s linear infinite alternate;
    padding-top: 145px; /* 87px Banner + ca. 58px Menü */
}
@keyframes bg-move {
  0% { background-position: center top; }
  100% { background-position: center bottom; }
}
h1, h2, h3 {


}

/* Footer */
.footer-main {
    background: #4e6722;


    padding: 18px 0 12px 0;
    border-radius: 15px 15px 0 0;
    box-shadow: 0 -2px 8px rgba(0,0,0,0.08);
    position: relative;
    z-index: 10;
    margin-top: 60px;
    border-top: 2px solid #e6ffb3;
    background: linear-gradient(90deg, #4e6722 80%, #6b8e23 100%);
}
.footer-main-container {
    max-width: 900px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    align-items: center;
    gap: 16px;
}
.footer-main a {

    text-decoration: underline;


}
.footer-main a:hover {

}
@media (max-width: 700px) {
    .footer-main-container {
        flex-direction: column;
        gap: 4px;
        padding: 0 8px;

    }
    .footer-main {
        padding: 14px 0 8px 0;
    }
}

/* Glow-Effekt für Überschriften */
h1, h2, h3, h4 {
  text-shadow: 0 2px 12px #6b8e23cc, 0 1px 0 #fff;
  transition: text-shadow 0.3s;
}
h1, h2, h3, h4, h5, h6 {




    margin-top: 0.7em;
    margin-bottom: 0.3em;
}
/* p { } entfernt, um Konflikte mit textformat.css zu vermeiden */
h1:hover, h2:hover, h3:hover, h4:hover {
  text-shadow: 0 4px 24px #e6ffb3cc, 0 2px 0 #fff;
}

/* Sanfte Schatten für Container */
.content-container,
.content-flex,
.impressum-container,
.Begrüßungstext,
.bild-overlay {
  box-shadow: 0 4px 32px rgba(78,103,34,0.18), 0 1px 0 #e6ffb3;
  transition: box-shadow 0.3s;
}
.content-container:hover,
.content-flex:hover,
.impressum-container:hover,
.Begrüßungstext:hover,
.bild-overlay:hover {
  box-shadow: 0 8px 48px rgba(78,103,34,0.28), 0 2px 0 #e6ffb3;
}

/* Glow-Animation für Navbar */
.navbar {
  background: linear-gradient(90deg, #4e6722 80%, #6b8e23 100%);
  box-shadow: 0 4px 24px #6b8e23cc;
  animation: navbar-glow 4s infinite alternate;
}
@keyframes navbar-glow {
  0% { box-shadow: 0 4px 24px #6b8e23cc; }
  100% { box-shadow: 0 8px 48px #e6ffb3cc; }
}

/* Animierter Hover für Buttons und Links */
a, .bild-overlay-btn, .footer-main a {
  transition: color 0.2s, background 0.2s, box-shadow 0.3s;
}
a:hover, .bild-overlay-btn:hover, .footer-main a:hover {

  background: #e6ffb3 !important;
  box-shadow: 0 2px 12px #6b8e23cc;
}

/* Leichtes "Pop" beim Hover auf Bilder */
img:hover {
  transform: none;
  box-shadow: 0 8px 32px #e6ffb3cc;
  transition: box-shadow 0.2s;
}

/* Farbige Rahmen für wichtige Boxen */
.content-container,
.content-flex,
.impressum-container,
.Begrüßungstext {
  border: 2px solid #e6ffb3;
}

/* Animierte Border für Buttons */
.bild-overlay-btn, .footer-main a {
  border: 2px solid #6b8e23;
  box-shadow: 0 2px 8px #e6ffb3cc;
}
.bild-overlay-btn:hover, .footer-main a:hover {
  box-shadow: 0 4px 16px #6b8e23cc;
}

/* Schimmer-Effekt für das Logo */
.Logo {
  filter: drop-shadow(0 2px 12px #4e6722aa) brightness(1.08);
  animation: logo-shimmer 2.5s infinite alternate;
}
@keyframes logo-shimmer {
  0% { filter: drop-shadow(0 2px 12px #4e6722aa) brightness(1.08); }
  100% { filter: drop-shadow(0 6px 24px #e6ffb3cc) brightness(1.18); }
}

/* Pulsierender Glow für Call-to-Action Buttons */
.bild-overlay-btn {
  animation: pulse-glow 2.2s infinite alternate;
}
@keyframes pulse-glow {
  0% { box-shadow: 0 2px 12px #e6ffb3cc; }
  100% { box-shadow: 0 8px 32px #6b8e23cc; }
}

/* Farbige Scrollbar */
::-webkit-scrollbar {
  width: 12px;
  background: #e6ffb3;
}
::-webkit-scrollbar-thumb {
  background: #6b8e23;
  border-radius: 8px;
  border: 2px solid #e6ffb3;
}

/* Hintergrundbild als fixiertes, gestrecktes Element hinter allen Objekten */
.body-bg-image {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: -1;
  object-fit: cover;
  pointer-events: none;
  background: none;
}

/* EPLR-Hinweis Box */
.eplr-hinweis {
    position: relative;
    z-index: 2;
    margin: 40px auto 0 auto;
    max-width: 900px;
    background: rgba(255,255,255,0.9);
    border-radius: 10px;
    padding: 20px 20px 10px 20px;




    box-shadow: 0 2px 8px rgba(0,0,0,0.07);
    border: 1.5px solid #e6ffb3;
    margin-bottom: 32px;
}
.eplr-logo {
    width: 80%;
    height: auto;
    margin: 0 auto 15px auto;
    display: block;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(78,103,34,0.10);
}
.eplr-hinweis p {
    margin: 0 0 10px 0;

}
.eplr-klein {


}

/* Bild-Overlay mittig und nur sichtbar oben */
.bild-overlay {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 20;
  background: rgba(0,0,0,0.4);
  padding: 30px 40px;
  border-radius: 15px;


  min-width: 300px;
  display: flex;
  flex-direction: column;
  align-items: center;
  opacity: 1;
  transition: opacity 0.3s;
  pointer-events: auto;

}
.bild-overlay-text {



  margin-bottom: 22px;

  text-decoration: none !important;
}
.bild-overlay-btn {

  padding: 18px 48px !important;
  border-radius: 32px !important;

  background: linear-gradient(90deg,#6b8e23 70%,#e6ffb3 100%) !important;

  box-shadow: 0 6px 32px #e6ffb3cc !important;
  border: none !important;

  display: inline-flex !important;
  align-items: center !important;
  gap: 14px !important;
  transition: background 0.2s, color 0.2s, box-shadow 0.2s !important;
  text-decoration: none !important;
}
.bild-overlay-btn:hover {
  background: linear-gradient(90deg,#e6ffb3 70%,#6b8e23 100%) !important;

  box-shadow: 0 8px 40px #6b8e23cc !important;
  text-decoration: underline !important;
}
.bild-overlay.hide {
  opacity: 0;
  pointer-events: none;
}

/* Slider-Dots für Karussell */
#slider-dots {
  z-index: 2000 !important; /* deutlich höher, damit sie über allem liegen */
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: 38px;
  display: flex;
  gap: 14px;
  transition: opacity 0.3s;
  pointer-events: auto;
}
.slider-dot {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  opacity: 0.7;
  border: 2px solid #4e6722;
  display: inline-block;
  cursor: pointer;
  transition: background 0.2s, opacity 0.2s;
  z-index: 2001 !important;
  position: relative;
}
.slider-dot.active {
  background: #4e6722;
  opacity: 1;
}
@media (max-width: 600px) {
  .transparent-box {
    padding: 16px 8px;
    max-width: 98vw;
    margin: 16px auto;
  }
  h1, h2, h3 {
    font-size: 1.2em !important;
    text-align: left !important;
  }
}