/* spurenweise - eigene mobile Navigation (ersetzt das Webflow-w-nav unter 992px) */

@media (max-width: 991px) {
  /* Webflow-Mobilmenü komplett stilllegen */
  .menu-button-2,
  .w-nav-overlay {
    display: none !important;
  }
}

/* ---------- Burger-Button ---------- */
.sw-burger {
  display: none;
  position: relative;
  width: 48px;
  height: 48px;
  padding: 0;
  border: none;
  background: transparent;
  border-radius: 999px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.sw-burger:focus-visible {
  outline: 3px solid #3f7c80;
  outline-offset: 2px;
}
.sw-burger span {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 26px;
  height: 3px;
  margin-left: -13px;
  background: #3f7c80;
  border-radius: 3px;
  transition: transform 0.25s ease, opacity 0.2s ease;
}
.sw-burger span:nth-child(1) { transform: translateY(-8px) rotate(-1.5deg); }
.sw-burger span:nth-child(2) { transform: translateY(0) rotate(1deg); }
.sw-burger span:nth-child(3) { transform: translateY(8px) rotate(-1deg); }
.sw-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(0) rotate(45deg); }
.sw-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; transform: scaleX(0.2); }
.sw-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(0) rotate(-45deg); }

@media (max-width: 991px) {
  .sw-burger { display: block; }
}

/* ---------- Overlay-Panel ---------- */
.sw-nav {
  position: fixed;
  inset: 0;
  z-index: 9; /* unter der Navbar (z-index 10), Logo + Burger bleiben sichtbar */
  display: none;
  flex-direction: column;
  padding: 103px 28px 32px; /* 79px Navbar + Luft */
  background: #f8f5ee;
  overflow-y: auto;
  opacity: 0;
  transition: opacity 0.22s ease;
}
.sw-nav.is-open { display: flex; }
.sw-nav.is-visible { opacity: 1; }

.sw-nav__main {
  list-style: none;
  margin: 0;
  padding: 0;
}
.sw-nav__main a {
  display: block;
  padding: 13px 4px;
  font-family: Alegreya, Vollkorn, serif;
  font-size: 27px;
  line-height: 1.25;
  font-weight: 500;
  color: #14383c;
  text-decoration: none;
  border-bottom: 1px solid rgba(63, 124, 128, 0.14);
  transition: color 0.15s ease;
}
.sw-nav__main a:hover,
.sw-nav__main a:active { color: #3f7c80; }
.sw-nav__main a.is-current {
  color: #3f7c80;
  font-weight: 700;
}
.sw-nav__main a.is-current::after {
  content: "";
  display: block;
  width: 44px;
  height: 3px;
  margin-top: 6px;
  border-radius: 3px;
  background: #d9a63e; /* Senf-Akzent */
}

.sw-nav__legal {
  list-style: none;
  margin: 28px 0 0;
  padding: 0;
}
.sw-nav__legal a {
  display: block;
  padding: 12px 4px;
  font-family: Lora, serif;
  font-size: 16px;
  color: #51636a;
  text-decoration: none;
}
.sw-nav__legal a:hover { color: #3f7c80; }

.sw-nav__social {
  margin-top: auto; /* ans untere Ende */
  padding-top: 28px;
  font-family: Lora, serif;
  font-size: 16px;
}
.sw-nav__social a {
  color: #33676b; /* dunkleres Petrol: 4.5:1-Kontrast für 16px-Text */
  text-decoration: none;
  padding: 12px 2px;
  display: inline-block;
}
.sw-nav__social span {
  color: rgba(63, 124, 128, 0.45);
  padding: 0 8px;
}
.sw-nav__social .sw-nav__social-label {
  /* entlinkter Eintrag (Instagram): gleiche Optik wie die Links */
  color: #33676b;
  padding: 12px 2px;
  display: inline-block;
}

.sw-nav a:focus-visible {
  outline: 3px solid #3f7c80;
  outline-offset: 2px;
  border-radius: 4px;
}

/* sanftes Einfliegen der Einträge */
.sw-nav__main li,
.sw-nav__legal li,
.sw-nav__social {
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 0.28s ease, transform 0.28s ease;
}
.sw-nav.is-visible .sw-nav__main li,
.sw-nav.is-visible .sw-nav__legal li,
.sw-nav.is-visible .sw-nav__social {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  .sw-burger span,
  .sw-nav,
  .sw-nav__main li,
  .sw-nav__legal li,
  .sw-nav__social {
    transition: none !important;
  }
}

/* Scroll-Sperre, solange das Menü offen ist */
html.sw-nav-lock,
html.sw-nav-lock body {
  overflow: hidden !important;
  height: 100%;
}

@media (min-width: 992px) {
  .sw-burger,
  .sw-nav { display: none !important; }
}
