/* MeerHeimatLiebe 2.5.2-r25 — Footer transparent am Dokumentende, Hintergründe zentriert und rotierend */
:root {
  --r25-footer-symbol-height: 34px;
  --r25-footer-text-height: 46px;
}

html,
body {
  min-height: 100%;
}
body {
  min-height: 100dvh !important;
  display: flex !important;
  flex-direction: column !important;
}
.site-main {
  flex: 1 0 auto !important;
}

/* Footer bleibt im normalen Dokumentfluss und erscheint ausschließlich ganz unten. */
.site-footer {
  position: relative !important;
  inset: auto !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  min-height: calc(var(--r25-footer-symbol-height) + var(--r25-footer-text-height)) !important;
  height: auto !important;
  margin: auto 0 0 !important;
  padding: var(--r25-footer-symbol-height) 0 0 !important;
  overflow: visible !important;
  z-index: 20 !important;
  pointer-events: auto !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Sandwelle bleibt, aber nur noch dezent transparent. */
.site-footer::before {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  inset: 0 0 auto 0 !important;
  width: 100% !important;
  height: var(--r25-footer-symbol-height) !important;
  background: linear-gradient(180deg, rgba(216,184,126,.42), rgba(183,134,79,.32)) !important;
  clip-path: polygon(0 44%, 8% 31%, 17% 45%, 27% 28%, 38% 42%, 49% 30%, 61% 46%, 72% 29%, 84% 44%, 100% 27%, 100% 100%, 0 100%) !important;
  border: 0 !important;
  box-shadow: none !important;
  pointer-events: none !important;
}
.site-footer::after {
  content: none !important;
  display: none !important;
}

.shoreline,
.shoreline::before,
.shoreline::after {
  position: absolute !important;
  inset: 0 0 auto 0 !important;
  width: 100% !important;
  height: var(--r25-footer-symbol-height) !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  pointer-events: none !important;
}
.shoreline::before,
.shoreline::after {
  content: none !important;
  display: none !important;
}
.foam-belt,
.wet-sand,
.dry-sand,
.shoreline-wave,
.wave-far,
.wave-near {
  display: none !important;
}
.shoreline > span { opacity: .28 !important; }

.footer-inner,
.site-footer .footer-inner {
  position: relative !important;
  inset: auto !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: .35rem .78rem !important;
  width: 100% !important;
  max-width: none !important;
  min-height: var(--r25-footer-text-height) !important;
  margin: 0 !important;
  padding: .58rem .8rem !important;
  transform: none !important;
  color: #edf9fb !important;
  background: rgba(3,42,61,.16) !important;
  backdrop-filter: blur(3px) !important;
  -webkit-backdrop-filter: blur(3px) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.footer-inner .copyright,
.footer-social {
  color: #f4fbfc !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.72) !important;
}
.footer-inner .copyright span { color: rgba(182,235,241,.82) !important; }
.image-credit { display: none !important; }

/* Zwei Ebenen ermöglichen einen ruhigen Bildwechsel. Das komplette Motiv bleibt sichtbar. */
.site-backdrop {
  display: block !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: 0 !important;
  width: 100vw !important;
  height: 100dvh !important;
  min-height: 100vh !important;
  pointer-events: none !important;
  background-color: #0a3448 !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-attachment: scroll !important;
  opacity: 0 !important;
  visibility: visible !important;
  filter: saturate(.94) contrast(1.015) brightness(.90) !important;
  transform: none !important;
  transition: opacity 1.35s ease-in-out !important;
  will-change: opacity;
}
.site-backdrop.is-active {
  opacity: 1 !important;
}
.site-backdrop--a { z-index: 0 !important; }
.site-backdrop--b { z-index: 0 !important; }
.site-vignette {
  z-index: 1 !important;
  pointer-events: none !important;
  background:
    linear-gradient(90deg, rgba(2,19,31,.20), rgba(2,19,31,.02) 48%, rgba(2,19,31,.15)),
    linear-gradient(180deg, rgba(2,16,28,.05), rgba(2,16,28,.01) 44%, rgba(2,16,28,.42)) !important;
}



@media (prefers-reduced-motion: reduce) {
  .site-backdrop { transition: none !important; }
}