/* MeerHeimatLiebe 2.5.2-r106
   - stärkerer Premium-Glass-Effekt für den Header
   - Dropdown-Menüs sauber untereinander ohne Überlappung
   - Download-Kai weiter nach unten
   - rotierender Logbuch-Bereich mit lesbaren Kurzgeschichten */

:root {
  --mhl-r106-glass-top: rgba(255,255,255,.22);
  --mhl-r106-glass-mid: rgba(104, 210, 247, .16);
  --mhl-r106-glass-low: rgba(8, 46, 74, .50);
  --mhl-r106-glass-base: rgba(2, 18, 34, .88);
  --mhl-r106-glass-border: rgba(163, 234, 255, .34);
  --mhl-r106-glass-border-soft: rgba(255, 255, 255, .14);
  --mhl-r106-glass-shadow: rgba(1, 13, 27, .44);
  --mhl-r106-glass-shadow-soft: rgba(34, 172, 233, .14);
}

/* Kräftigerer Premium-Glass-Look im Header */
.site-header {
  position: relative;
  z-index: 10000 !important;
  background:
    radial-gradient(circle at 15% -15%, rgba(163, 236, 255, .21) 0%, rgba(163, 236, 255, 0) 28%),
    radial-gradient(circle at 82% -25%, rgba(255, 172, 212, .12) 0%, rgba(255, 172, 212, 0) 26%),
    linear-gradient(180deg,
      rgba(5, 36, 58, .97) 0%,
      rgba(3, 27, 46, .95) 48%,
      rgba(2, 18, 34, .94) 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 1rem 2.2rem rgba(1, 12, 25, .24) !important;
}

.site-header .header-inner.mhl-r100-header-inner,
.site-header [data-header-inner].mhl-r100-header-inner {
  position: relative;
  overflow: visible !important;
  isolation: isolate;
  border-top: 1px solid var(--mhl-r106-glass-border-soft);
  border-bottom: 1px solid rgba(126, 207, 245, .22);
  background:
    linear-gradient(180deg,
      var(--mhl-r106-glass-top) 0%,
      var(--mhl-r106-glass-mid) 22%,
      rgba(255,255,255,.07) 40%,
      rgba(255,255,255,.03) 58%,
      var(--mhl-r106-glass-low) 76%,
      var(--mhl-r106-glass-base) 100%),
    linear-gradient(125deg,
      rgba(11, 70, 108, .46) 0%,
      rgba(9, 48, 78, .30) 28%,
      rgba(5, 31, 53, .18) 58%,
      rgba(1, 16, 31, .72) 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    inset 0 -.5px 0 rgba(255,255,255,.06),
    inset 0 0 0 1px rgba(255,255,255,.03),
    0 1.2rem 2.9rem var(--mhl-r106-glass-shadow),
    0 .2rem .8rem var(--mhl-r106-glass-shadow-soft) !important;
  backdrop-filter: blur(24px) saturate(190%);
  -webkit-backdrop-filter: blur(24px) saturate(190%);
}

.site-header .header-inner.mhl-r100-header-inner::before,
.site-header [data-header-inner].mhl-r100-header-inner::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none !important;
  background:
    linear-gradient(180deg,
      rgba(255,255,255,.28) 0%,
      rgba(255,255,255,.14) 10%,
      rgba(255,255,255,.04) 24%,
      rgba(255,255,255,0) 55%),
    radial-gradient(circle at 18% 8%, rgba(171, 237, 255, .23) 0%, rgba(171, 237, 255, 0) 31%),
    radial-gradient(circle at 82% 0%, rgba(255, 196, 220, .12) 0%, rgba(255, 196, 220, 0) 24%);
  opacity: .98;
}

.site-header .header-inner.mhl-r100-header-inner::after,
.site-header [data-header-inner].mhl-r100-header-inner::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  z-index: -1;
  pointer-events: none !important;
  background: linear-gradient(90deg,
    rgba(95, 209, 255, 0) 0%,
    rgba(95, 209, 255, .42) 20%,
    rgba(255, 255, 255, .26) 50%,
    rgba(95, 209, 255, .42) 80%,
    rgba(95, 209, 255, 0) 100%);
  opacity: .95;
}

.site-header .brand.mhl-brand-r100 .brand-mark,
.site-header .brand.mhl-brand-r100 .anchor-badge,
.site-header .brand.mhl-brand-r100 .brand-icon,
.site-header .mhl-r100-header-inner :is(.btn, .button, button, .nav-dropdown__toggle, [data-nav-dropdown-toggle]) {
  border-color: var(--mhl-r106-glass-border) !important;
  background:
    linear-gradient(180deg,
      rgba(255,255,255,.20) 0%,
      rgba(255,255,255,.11) 42%,
      rgba(255,255,255,.05) 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.20),
    0 .42rem 1rem rgba(0, 11, 24, .23),
    0 0 0 1px rgba(255,255,255,.035) inset,
    0 0 1.1rem rgba(87, 202, 242, .08) !important;
  backdrop-filter: blur(16px) saturate(155%);
  -webkit-backdrop-filter: blur(16px) saturate(155%);
}

.site-header .brand.mhl-brand-r100 .brand-copy.mhl-brand-copy-r100,
.site-header .mhl-brand-title-r100,
.site-header .mhl-brand-tagline-r100,
.site-header .mhl-r100-header-inner :is(nav a, .site-nav a, [data-nav] a) {
  text-shadow: 0 .08rem .24rem rgba(0, 8, 20, .28);
}

/* Dropdowns: saubere Positionierung und keine Überlagerungen */
.site-header,
.site-header .header-inner,
.site-header [data-header-inner],
.site-header .site-nav,
.site-header [data-nav],
.site-header .nav-dropdown {
  overflow: visible !important;
}

.site-header .site-nav,
.site-header [data-nav] {
  position: relative;
  z-index: 10020 !important;
}

.site-header .nav-dropdown,
.site-header [data-nav-dropdown] {
  position: relative !important;
  z-index: 10030 !important;
}

.site-header .nav-dropdown.open,
.site-header [data-nav-dropdown].open {
  z-index: 10100 !important;
}

.site-header .nav-dropdown__menu,
.site-header [data-nav-dropdown-menu] {
  position: absolute !important;
  top: calc(100% + .55rem) !important;
  left: 0 !important;
  right: auto !important;
  margin: 0 !important;
  transform: none !important;
  min-width: clamp(15rem, 18vw, 18.5rem);
  max-width: min(24rem, calc(100vw - 1rem));
  border-radius: 1.2rem !important;
  z-index: 10200 !important;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  backdrop-filter: blur(22px) saturate(175%);
  -webkit-backdrop-filter: blur(22px) saturate(175%);
  background:
    linear-gradient(180deg,
      rgba(255,255,255,.14) 0%,
      rgba(95, 188, 225, .10) 18%,
      rgba(4, 39, 61, .95) 100%),
    rgba(3, 34, 51, .96) !important;
  border: 1px solid rgba(148, 224, 252, .30) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.17),
    0 1.5rem 3.8rem rgba(0, 8, 20, .46),
    0 0 1.8rem rgba(72, 196, 237, .10) !important;
}

.site-header .nav-dropdown.open > .nav-dropdown__menu,
.site-header .nav-dropdown.open > [data-nav-dropdown-menu],
.site-header [data-nav-dropdown].open > .nav-dropdown__menu,
.site-header [data-nav-dropdown].open > [data-nav-dropdown-menu] {
  display: grid;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.site-header .nav-dropdown__toggle,
.site-header [data-nav-dropdown-toggle] {
  position: relative;
  z-index: 2;
  pointer-events: auto !important;
  touch-action: manipulation;
}

/* Download-Kai nach unten verschieben */
.mhl-r106-downloadkai-lowered {
  margin-top: clamp(6rem, 7vw, 8.75rem) !important;
}

/* Lesbarer Logbuch-Bereich */
.mhl-r106-news-root {
  position: relative;
}

.mhl-r106-news-root .mhl-r106-news-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
  gap: 1rem;
  margin-top: 1rem;
}

.mhl-r106-news-root .mhl-r106-news-card {
  position: relative;
  border-radius: 1.15rem;
  padding: 1rem 1rem 1.05rem;
  border: 1px solid rgba(116, 208, 244, .24);
  background:
    linear-gradient(180deg,
      rgba(255,255,255,.08) 0%,
      rgba(76, 164, 204, .08) 26%,
      rgba(4, 29, 48, .84) 100%),
    rgba(4, 31, 50, .80);
  backdrop-filter: blur(12px) saturate(140%);
  -webkit-backdrop-filter: blur(12px) saturate(140%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 .65rem 1.8rem rgba(0, 9, 21, .18);
}

.mhl-r106-news-root .mhl-r106-news-date {
  display: inline-block;
  margin-bottom: .6rem;
  font-size: .82rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(165, 235, 255, .95);
}

.mhl-r106-news-root .mhl-r106-news-title {
  margin: 0 0 .55rem;
  font-size: 1.15rem;
  line-height: 1.22;
  font-weight: 800;
  color: #f4fbff;
}

.mhl-r106-news-root .mhl-r106-news-excerpt,
.mhl-r106-news-root .mhl-r106-news-story {
  margin: 0;
  color: rgba(235, 247, 252, .92);
  line-height: 1.55;
}

.mhl-r106-news-root .mhl-r106-news-excerpt {
  margin-bottom: .6rem;
  font-weight: 700;
  color: rgba(226, 244, 252, .96);
}

.mhl-r106-news-root .mhl-r106-news-story {
  font-size: .96rem;
}





@supports not ((backdrop-filter: blur(2px)) or (-webkit-backdrop-filter: blur(2px))) {
  .site-header .header-inner.mhl-r100-header-inner,
  .site-header [data-header-inner].mhl-r100-header-inner {
    background:
      linear-gradient(180deg,
        rgba(17, 55, 82, .75) 0%,
        rgba(6, 28, 47, .96) 100%) !important;
  }

  .site-header .nav-dropdown__menu,
  .site-header [data-nav-dropdown-menu] {
    background: rgba(7, 40, 63, .97) !important;
  }
}
