/* MeerHeimatLiebe 2.5.2-r100
   Stabile, professionelle Header-Fassung im Stil der gelieferten Vorlage.
   Ziel: saubere linke Markenfläche, keine Schaf-/Flaggen-Artefakte,
   keine grüne Linie, kein Überlagern bei 100/125/150 % Zoom. */

:root {
  --mhl-r100-header-height: 5.15rem;
  --mhl-r100-script: "Segoe Script", "Brush Script MT", "Snell Roundhand", "Segoe Print", "Apple Chancery", cursive;
  --mhl-r100-title-white: #fdfcff;
  --mhl-r100-title-pink: #ff8fad;
  --mhl-r100-tagline: #f8fbff;
  --mhl-r100-cyan: #5fd1ff;
  --mhl-r100-cyan-soft: #48bbed;
  --mhl-r100-pink: #ff7eaa;
}

.site-header,
.site-header .header-inner,
.site-header [data-header-inner] {
  min-height: var(--mhl-r100-header-height) !important;
}

.site-header .header-inner.mhl-r100-header-inner,
.site-header [data-header-inner].mhl-r100-header-inner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: nowrap !important;
  gap: clamp(.75rem, 1.25vw, 1.35rem) !important;
  overflow: hidden !important;
}

.site-header .brand.mhl-brand-r100 {
  display: inline-flex !important;
  align-items: center !important;
  gap: .78rem !important;
  min-width: 0 !important;
  flex: 0 1 auto !important;
}

.site-header .brand.mhl-brand-r100 .brand-mark,
.site-header .brand.mhl-brand-r100 .anchor-badge,
.site-header .brand.mhl-brand-r100 .brand-icon {
  flex: 0 0 auto !important;
}

.site-header .brand.mhl-brand-r100 .brand-copy.mhl-brand-copy-r100 {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: .18rem !important;
  min-width: 0 !important;
  max-width: clamp(14rem, 24vw, 26rem) !important;
  overflow: visible !important;
}

.site-header .brand.mhl-brand-r100 .brand-copy.mhl-brand-copy-r100 > * {
  box-sizing: border-box;
}

.site-header .mhl-brand-title-row-r100 {
  display: inline-flex;
  align-items: flex-end;
  gap: .28rem;
  min-width: 0;
  white-space: nowrap;
  line-height: 1;
}

.site-header .mhl-brand-title-r100 {
  display: inline-block;
  margin: 0;
  padding: 0;
  font-family: var(--mhl-r100-script);
  font-style: normal;
  font-weight: 600;
  letter-spacing: .006em;
  font-size: clamp(1.68rem, 2.08vw, 2.7rem);
  line-height: .92;
  color: transparent;
  background-image: linear-gradient(96deg,
    var(--mhl-r100-title-white) 0%,
    #ffffff 34%,
    #ffdfe8 61%,
    var(--mhl-r100-title-pink) 81%,
    #ff6c97 100%);
  background-size: 220% 220%;
  -webkit-background-clip: text;
  background-clip: text;
  filter: drop-shadow(0 .07rem .08rem rgba(0, 0, 0, .24));
  animation: mhl-r100-title-shimmer 9s ease-in-out infinite;
}

.site-header .mhl-brand-heart-r100 {
  position: relative;
  width: 1.1rem;
  height: 1.05rem;
  flex: 0 0 auto;
  transform: translateY(-.62rem) rotate(-8deg);
  animation: mhl-r100-heartbeat 4.8s ease-in-out infinite;
}

.site-header .mhl-brand-heart-r100::before {
  content: "♡";
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: var(--mhl-r100-pink);
  font-size: 1.48rem;
  line-height: 1;
  font-weight: 700;
}

.site-header .mhl-brand-flag-r100 {
  width: 1.82rem;
  height: 1.14rem;
  flex: 0 0 auto;
  transform-origin: left center;
  background: center / contain no-repeat url('/assets/header/sh-flag-r100.svg');
  filter: drop-shadow(0 .08rem .08rem rgba(0, 0, 0, .18));
  animation: mhl-r100-flag-wave 3.8s ease-in-out infinite;
}

.site-header .mhl-brand-grass-r100 {
  position: relative;
  width: 100%;
  height: .46rem;
  margin-top: .02rem;
  border-bottom: 1px solid rgba(76, 197, 246, .55);
  overflow: hidden;
}

.site-header .mhl-brand-grass-r100::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: .42rem;
  background:
    repeating-linear-gradient(90deg,
      rgba(65, 191, 244, 0) 0 .18rem,
      rgba(96, 219, 255, .95) .18rem .22rem,
      rgba(96, 219, 255, .22) .22rem .28rem,
      rgba(65, 191, 244, 0) .28rem .42rem),
    linear-gradient(90deg,
      rgba(61, 182, 235, 0),
      rgba(72, 192, 245, .58) 16%,
      rgba(118, 225, 255, .96) 50%,
      rgba(72, 192, 245, .58) 84%,
      rgba(61, 182, 235, 0));
  clip-path: polygon(0 88%, 2% 54%, 4% 92%, 6% 36%, 8% 84%, 10% 48%, 12% 92%, 14% 32%, 16% 84%, 18% 44%, 20% 90%, 22% 38%, 24% 81%, 26% 49%, 28% 92%, 30% 34%, 32% 86%, 34% 42%, 36% 91%, 38% 36%, 40% 83%, 42% 48%, 44% 93%, 46% 36%, 48% 81%, 50% 45%, 52% 92%, 54% 35%, 56% 83%, 58% 47%, 60% 92%, 62% 34%, 64% 82%, 66% 49%, 68% 90%, 70% 38%, 72% 84%, 74% 44%, 76% 92%, 78% 35%, 80% 84%, 82% 47%, 84% 91%, 86% 36%, 88% 84%, 90% 48%, 92% 90%, 94% 38%, 96% 83%, 98% 56%, 100% 88%, 100% 100%, 0 100%);
}

.site-header .mhl-brand-tagline-r100 {
  position: relative;
  display: inline-block;
  margin: 0;
  padding: .02rem .78rem 0 .78rem;
  width: max-content;
  max-width: 100%;
  color: var(--mhl-r100-tagline);
  font-size: .81rem;
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: .13em;
  text-transform: uppercase;
  white-space: nowrap;
  text-shadow: 0 0 .22rem rgba(76, 203, 245, .08);
}

.site-header .mhl-brand-tagline-r100::before,
.site-header .mhl-brand-tagline-r100::after {
  content: "";
  position: absolute;
  top: 50%;
  width: .38rem;
  height: .38rem;
  margin-top: -.02rem;
  border-radius: 999px;
  background: radial-gradient(circle at 35% 35%, #ffb3c8 0 18%, var(--mhl-r100-pink) 20% 58%, rgba(255, 126, 170, 0) 62%);
}

.site-header .mhl-brand-tagline-r100::before { left: .02rem; }
.site-header .mhl-brand-tagline-r100::after { right: .02rem; }

.site-header .mhl-brand-sr-only-r100 {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Frühere Header-Artefakte restlos ausblenden. */
.site-header .mhl-header-stage-r99,
.site-header .mhl-header-sheep-r99,
.site-header .mhl-header-sheep-r90,
.site-header .mhl-header-sheep-r91,
.site-header .mhl-header-sheep-image-r92,
.site-header .mhl-header-sheep-image-r94,
.site-header .mhl-header-sheep-image-r95,
.site-header .mhl-header-sheep-image-r96,
.site-header .mhl-header-sheep-image-r97,
.site-header .mhl-header-sheep-image-r98,
.site-header .mhl-brand-divider-r88,
.site-header .mhl-brand-divider-r89,
.site-header [class*="mhl-brand-divider-r"],
.site-header .mhl-brand-flag,
.site-header .mhl-sh-flag,
.site-header [data-mhl-brand-flag],
.site-header [data-sh-flag],
.site-header [class*="mhl-sh-flag-r"],
.site-header [class*="mhl-preferred-top-flag"],
.site-header .mhl-r99-stage-ghost,
.site-header .mhl-r99-broken-icon,
.site-header .mhl-r98-broken-icon {
  display: none !important;
  visibility: hidden !important;
}

/* Rechte Seite: Originalnavigation darf schrumpfen, aber nicht umbrechen. */
.site-header .mhl-r100-header-inner > nav,
.site-header .mhl-r100-header-inner > .site-nav,
.site-header .mhl-r100-header-inner > [data-nav] {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}









@keyframes mhl-r100-title-shimmer {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

@keyframes mhl-r100-heartbeat {
  0%, 78%, 100% { transform: translateY(-.62rem) rotate(-8deg) scale(1); }
  84% { transform: translateY(-.66rem) rotate(-8deg) scale(1.08); }
  90% { transform: translateY(-.62rem) rotate(-8deg) scale(.98); }
}

@keyframes mhl-r100-flag-wave {
  0%, 100% { transform: rotate(0deg) translateY(0); }
  25% { transform: rotate(2deg) translateY(-.01rem); }
  50% { transform: rotate(-2.6deg) translateY(.02rem); }
  75% { transform: rotate(1.3deg) translateY(-.01rem); }
}