/* MeerHeimatLiebe 2.5.2-r34 — Sandstrand am echten Seitenende, farbige maritime Symbole und Segelboot */
:root {
  --r29-header-height: 76px;
  --r29-footer-text-height: 52px;
  --r29-beach-height: 58px;
}

html,
body {
  min-height: 100% !important;
}

body {
  min-height: 100vh !important;
  min-height: 100dvh !important;
  display: flex !important;
  flex-direction: column !important;
  margin: 0 !important;
  padding-top: var(--r29-header-height) !important;
  padding-bottom: 0 !important;
  overflow-x: hidden !important;
}

.site-header {
  position: fixed !important;
  inset: 0 0 auto 0 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 1100 !important;
}

.header-inner {
  width: 100% !important;
  max-width: none !important;
  min-height: var(--r29-header-height) !important;
  margin: 0 !important;
}

.site-main {
  flex: 1 0 auto !important;
  width: 100% !important;
  min-height: calc(100dvh - var(--r29-header-height) - var(--r29-footer-text-height) - var(--r29-beach-height)) !important;
  margin: 0 !important;
  padding-bottom: clamp(1.25rem, 3vw, 2.5rem) !important;
}

/* Der Footer bleibt im normalen Dokumentfluss und ist das letzte Seitenelement. */
.site-footer {
  position: relative !important;
  inset: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  min-height: calc(var(--r29-footer-text-height) + var(--r29-beach-height)) !important;
  height: auto !important;
  margin: auto 0 0 !important;
  padding: 0 0 var(--r29-beach-height) !important;
  overflow: visible !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  isolation: isolate;
  z-index: 40 !important;
}

/* Der Sandstrand liegt jetzt wirklich ganz unten unterhalb des Footertexts. */
.site-footer::before {
  content: '' !important;
  position: absolute !important;
  inset: auto 0 0 0 !important;
  width: 100% !important;
  height: var(--r29-beach-height) !important;
  background:
    linear-gradient(180deg, rgba(238,205,147,.95) 0%, rgba(215,174,111,.94) 48%, rgba(187,137,78,.96) 100%) !important;
  clip-path: polygon(0 34%,7% 20%,15% 31%,24% 17%,34% 30%,45% 19%,56% 32%,67% 18%,78% 29%,89% 17%,100% 27%,100% 100%,0 100%) !important;
  border: 0 !important;
  box-shadow: 0 -4px 14px rgba(54,34,12,.18) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

.site-footer::after {
  content: '' !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 18px !important;
  background: linear-gradient(180deg, rgba(164,113,60,.04), rgba(119,77,37,.13)) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

.shoreline,
.shoreline::before,
.shoreline::after {
  position: absolute !important;
  inset: auto 0 0 0 !important;
  width: 100% !important;
  height: var(--r29-beach-height) !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

.shoreline::before,
.shoreline::after,
.foam-belt,
.wet-sand,
.dry-sand,
.shoreline-wave,
.wave-far,
.wave-near,
.shore-boat,
.shore-boat-b {
  display: none !important;
  content: none !important;
}

/* Farbige, klar erkennbare Symbole direkt auf dem Sand. */
.shoreline > span {
  position: absolute !important;
  top: auto !important;
  bottom: 7px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  opacity: 1 !important;
  filter: drop-shadow(0 2px 1px rgba(69,42,18,.36)) !important;
}

.shore-starfish {
  left: 8% !important;
  color: #e56f58 !important;
  transform: rotate(-12deg) !important;
}
.shore-shell-a {
  left: 22% !important;
  color: #fff0cd !important;
  transform: rotate(-18deg) !important;
}
.shore-seagull {
  left: 36% !important;
  color: #57c9dc !important;
}
.shore-sailboat {
  left: 50% !important;
  bottom: 3px !important;
  width: 50px !important;
  height: 50px !important;
  transform: translateX(-50%) !important;
}
.shore-anchor-left {
  left: 64% !important;
  color: #2ca7be !important;
}
.shore-shell-b {
  right: 21% !important;
  color: #ffe9bd !important;
  transform: rotate(17deg) !important;
}
.shore-anchor {
  right: 8% !important;
  color: #76512f !important;
}

.shore-sailboat-svg {
  width: 48px !important;
  height: 48px !important;
  overflow: visible !important;
}
.shore-sailboat-svg .shore-sailboat-mast,
.shore-sailboat-svg .shore-sailboat-wave {
  fill: none !important;
  stroke: #147e99 !important;
  stroke-width: 2.5 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
.shore-sailboat-svg .shore-sailboat-hull {
  fill: #fff8e9 !important;
  stroke: #75492b !important;
  stroke-width: 2.3 !important;
  stroke-linejoin: round !important;
}
.shore-sailboat-svg .shore-sailboat-sail--left {
  fill: #ffffff !important;
  stroke: #8b3b31 !important;
  stroke-width: 2.1 !important;
  stroke-linejoin: round !important;
}
.shore-sailboat-svg .shore-sailboat-sail--right {
  fill: #d8483c !important;
  stroke: #8b3b31 !important;
  stroke-width: 2.1 !important;
  stroke-linejoin: round !important;
}

.footer-inner,
.site-footer .footer-inner {
  position: relative !important;
  inset: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: .34rem .78rem !important;
  width: 100% !important;
  max-width: none !important;
  min-height: var(--r29-footer-text-height) !important;
  margin: 0 !important;
  padding: .62rem .85rem !important;
  transform: none !important;
  color: #f5fcfd !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  z-index: 2 !important;
}

.footer-inner .copyright,
.footer-social {
  margin: 0 !important;
  color: #f7fcfd !important;
  text-shadow: 0 2px 6px rgba(0,0,0,.82), 0 0 12px rgba(0,28,43,.44) !important;
}
.footer-inner .copyright span {
  color: rgba(184,239,244,.92) !important;
}
.footer-social .icon:nth-child(1) { color: #62d8e6 !important; }
.footer-social .icon:nth-child(2) { color: #ffffff !important; }
.footer-social .icon:nth-child(3) { color: #e26d58 !important; }
.footer-social .icon:nth-child(4) { color: #f7c85f !important; }
.image-credit { display: none !important; }

/* Segelschiff bleibt zusätzlich sichtbar im Preloader-Fortschritt. */
.preloader-ship {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 8 !important;
  color: #9ee9f2 !important;
}
.preloader-ship .mhl-sailboat {
  display: block !important;
  width: 42px !important;
  height: 42px !important;
  overflow: visible !important;
}