/*=========<!--Autor: A3700-->
<!--14.10.2025 Ubdate: 3.00-->=====*/
  /* ========== Variablen / Farbpalette ========== */
  
   :root {
      --primary: #6A2FA0;
      --primary-700: #54267F;
      --accent: #31C2C7;
      --dark: #2b2b2b;
      --muted: #666;
      --bg: #ffffff;
      --bg-alt: #f7f7fb;
      --border: #e6e6ee;
      /* Layout */
      --nav-h: 70px;
      /* entspricht der schlanken Leistenhöhe */
      /* Effekte */
      --shadow-deep: 0 18px 40px rgba(0, 0, 0, .35);
      --shadow-soft: 0 6px 22px rgba(0, 0, 0, .25);
  }
  /* ========== Basics ========== */
  
  * {
      box-sizing: border-box;
  }
  
  html,
  body {
      margin: 0;
      padding: 0;
  }
  
  body {
      font: 16px/1.6 system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, "Helvetica Neue", Arial, sans-serif;
      color: var(--dark);
      background: var(--bg);
      padding-top: var(--nav-h);
      font-family: "Arial Rounded MT Bold", "Helvetica Rounded", Arial, sans-serif;
  }
  
  img {
      max-width: 100%;
      height: auto;
      display: block;
  }
  
  a {
      color: var(--primary);
      text-decoration: none;
  }
  
  a:hover {
      text-decoration: underline;
  }
  
  .container {
      max-width: 1100px;
      margin-inline: auto;
      padding: 0 32px;
  }
  
  @media (min-width:992px) {
      .container {
          padding: 0 48px;
      }
  }
  /* Tastatur-Shortcut */
  
  .skip-link {
      position: absolute;
      left: -9999px;
      top: auto;
      width: 1px;
      height: 1px;
      overflow: hidden;
  }
  
  .skip-link:focus {
      left: 16px;
      top: 16px;
      width: auto;
      height: auto;
      background: var(--accent);
      color: #000;
      padding: 8px 12px;
      border-radius: 8px;
      outline: 0;
  }
  /* ========== NAVIGATION (Desktop, final & schlank) ========== */
  
  .nav-neo {
      position: fixed;
      left: 0;
      right: 0;
      top: 0;
      z-index: 1000;
      height: 70px;
      display: flex;
      justify-content: center;
      align-items: center;
      padding: 6px 12px;
      background: linear-gradient(180deg, #6b33ad 0%, #53208f 55%, #3b0f63 100%);
      border-top: 1px solid rgba(0, 0, 0, .65);
      border-bottom: 1px solid rgba(0, 0, 0, .65);
      box-shadow: 0 12px 30px rgba(0, 0, 0, .45), inset 0 10px 18px rgba(255, 255, 255, .12), inset 0 -10px 22px rgba(0, 0, 0, .35);
      transition: box-shadow .25s ease, background .25s ease;
  }
  
  .nav-neo__grid {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: clamp(10px, 2.5vw, 28px);
      margin: 0;
      padding: 0 10px;
      list-style: none;
  }
  
  .nav-neo a {
      color: #fff;
      font-weight: 900;
      font-size: 20px;
      letter-spacing: .3px;
      text-decoration: none;
      text-shadow: 0 1px 0 rgba(255, 255, 255, .25), 0 3px 8px rgba(0, 0, 0, .60);
      transition: transform .15s ease, text-shadow .2s ease;
      padding: 10px 16px;
  }
  
  .nav-neo a:hover {
      text-decoration: underline;
      text-underline-offset: 4px;
      transform: translateY(-1px);
  }
  /* Logo genau zwischen „Leistungen“ und „Galerie“ – groß, ohne BG, beeinflusst Höhe NICHT */
  
  .nav-neo .brand {
      position: relative;
      width: 0;
      height: 0;
  }
  
  .brand__badge {
      position: absolute;
      left: 50%;
      top: -40px;
      transform: translateX(-50%);
      pointer-events: none;
  }
  
  .brand__badge img {
      width: 130px;
      height: auto;
      display: block;
      filter: drop-shadow(0 6px 12px rgba(0, 0, 0, .40));
      transition: transform .25s ease;
  }
  
  .nav-neo.is-shrink .brand__badge img {
      transform: translateY(4px) scale(.90);
  }
  
  @media (max-width: 1200px) {
      .nav-neo {
          height: 64px;
      }
      .nav-neo .brand .brand__badge {
          top: -36px;
      }
  }
  
  @media (max-width: 1024px) {
      .nav-neo {
          height: 60px;
      }
      .nav-neo__grid {
          gap: clamp(8px, 1.8vw, 18px);
      }
  }
  /* ========= HERO-BEREICH (kompakter Stil) ========= */
  
  .hero-neo {
      position: relative;
      min-height: 70vh;
      display: grid;
      place-items: center;
      text-align: center;
      background: url("bilder/kuecheMontageNacher.jpg")!important;
      background-position: center center !important;
      background-size: cover !important;
      background-repeat: no-repeat !important;
      overflow: hidden;
      color: #2b2b2b;
      z-index: 1;
  }
  
  .hero-neo::before,
  .hero-neo::after {
      content: none !important;
  }
  /* Inhalt */
  
  .hero-inner {
      position: relative;
      z-index: 1;
      padding: 10px 30px;
  }
  /* Vollbreiter, transparenter Weißbalken mit weichen Kanten OBEN/UNTEN */
  /* 1) Hero bleibt Bezugsfläche */
  
  .hero-neo {
      position: relative;
      /* overflow:hidden kann bleiben */
  }
  /* 2) Vollbreiter, vertikal weich ausblendender Streifen */
  /* Vollbreiter, transparenter Weißbalken mit weichen Kanten OBEN/UNTEN */
  
  .hero-inner::before {
      content: "";
      position: absolute;
      /* am Viewport zentrieren, unabhängig vom Container */
      left: 50%;
      transform: translateX(-50%) translateY(-50%);
      top: 50%;
      width: 100vw;
      /* ganze Seitenbreite */
      height: 80%;
      /* Balkenhöhe: gern 25–45% testen */
      /* nur vertikal weich ausblenden */
      background: linear-gradient( to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.85) 25%, rgba(255, 255, 255, 0.85) 75%, rgba(255, 255, 255, 0) 100%);
      /* wichtig für Stack: unter dem Text, aber NICHT negativ */
      z-index: -2;
      pointer-events: none;
  }
  /* Textblock sicher drüber legen */
  
  .hero-inner {
      position: relative;
      z-index: 1;
  }
  /* --- Herzlich Willkommen --- */
  
  .hero-welcome {
      font-family: "Arial Rounded MT Bold", "Helvetica Rounded", Arial, sans-serif;
      font-size: 1.3rem;
      font-weight: 700;
      color: #2b2b2b;
      text-shadow: 0 2px 6px rgba(255, 255, 255, 0.9), 0 6px 18px rgba(0, 0, 0, 0.25);
      margin: 0.1rem;
  }
  /* --- Haupttitel: ASLAN --- */
  
  .hero-title {
      font-family: "Arial Rounded MT Bold", "Helvetica Rounded", Arial, sans-serif;
      font-size: clamp(80px, 15vw, 200px);
      letter-spacing: 5px;
      font-weight: bold;
      color: #5a2a97;
      text-shadow: 0 2px 4px rgba(0, 0, 0, 0.25), 0 6px 12px rgba(0, 0, 0, 0.20);
      margin-top: 0.1rem;
      margin-bottom: 0.05rem;
  }
  /* --- Untertitel --- */
  
  .hero-sub {
      font-family: "Arial Rounded MT Bold", Arial, sans-serif;
      font-size: 1.6rem;
      color: #2b2b2b;
      text-shadow: 0 2px 6px rgba(255, 255, 255, 0.9);
      margin-top: -2rem;
      margin-bottom: 1rem;
      letter-spacing: 3px;
  }
  /* --- WhatsApp-Button --- */
  
  .cta-outline {
      display: inline-flex;
      align-items: center;
      gap: 0.5rem;
      padding: 8px 18px;
      border-radius: 10px;
      border: 2px solid #6a2fa0;
      color: #6a2fa0;
      background: rgba(255, 255, 255, 0.95);
      font-family: "Arial Rounded MT Bold", Arial, sans-serif;
      font-weight: 700;
      font-size: 1.5rem;
      text-decoration: none;
      box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
      transition: all 0.25s ease;
  }
  
  .cta-outline:hover {
      transform: translateY(-2px);
      background: #6a2fa0;
      color: #fff;
      border-color: #53208f;
      box-shadow: 0 8px 20px rgba(86, 36, 143, 0.35);
  }
  
  .cta-outline img,
  .cta-icon {
      height: 30px;
      width: auto;
      display: inline-block;
  }
  /* --- Responsiv --- */
  
  @media (max-width: 768px) {
      .hero-neo {
          min-height: 80vh;
      }
      .hero-title {
          font-size: clamp(65px, 20vw, 130px);
          letter-spacing: 3px;
      }
      .hero-sub {
          font-size: 1rem;
      }
      .cta-outline {
          font-size: 0.95rem;
          padding: 8px 16px;
      }
  }
  
  s
  /* ========== Sektionen (allgemein) ========== */
  
  section {
      padding: 28px 0;
  }
  
  section:nth-of-type(odd) {
      background: var(--bg);
  }
  
  section:nth-of-type(even) {
      background: var(--bg-alt);
  }
  
  h2 {
      margin: 0 0 12px;
      font-size: clamp(22px, 4vw, 28px);
      color: var(--primary-700);
      padding-left: 3px;
  }
  
  ul {
      padding-left: 18px;
  }
  /* Abschnitt-Linie Utility */
  
  .section-line {
      display: flex;
      align-items: center;
      gap: 8px;
      margin: 40px auto 0;
      max-width: 1000px;
  }
  
  .section-line .line {
      flex: 1;
      height: 2px;
      background: var(--primary);
  }
  
  .section-line .dot {
      width: 12px;
      height: 12px;
      background: #c2f2a4;
      border: 2px solid var(--primary);
      border-radius: 50%;
  }
  /* ========== Über uns ========== */
  
  .about {
      position: relative;
      padding: 50px 0;
      background: var(--bg);
      z-index: 1;
  }
  
  .about-header {
      display: flex;
      align-items: center;
      gap: 16px;
      margin-bottom: 30px;
  }
  
  .about-header h2 {
      font-size: 2rem;
      color: var(--primary);
      margin: 0;
  }
  
  .about-header .line {
      flex: 1;
      height: 4px;
      background: var(--primary);
      border-radius: 4px;
      z-index: 2;
  }
  
  .about-content {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 40px;
      align-items: start;
  }
  
  .about-left p {
      font-size: 1.05rem;
      line-height: 1.6;
      margin: 0;
  }
  
  .about-right ul {
      position: relative;
      list-style: none;
      padding: 0;
      margin: 0;
      z-index: 1;
  }
  
  .about-right li {
      font-size: 1.1rem;
      font-weight: 600;
      color: var(--primary);
      margin-bottom: 12px;
  }
  
  .about-bg {
      position: absolute;
      top: 55%;
      right: 0;
      transform: translateY(-50%);
      width: 360px;
      opacity: 20;
      z-index: 0;
      pointer-events: none;
  }
  /* ========== Leistungen (Flip-Cards) ========== */
  
  .services {
      padding: 60px 0;
      background: var(--bg-alt);
      text-align: center;
  }
  
  .services-header h2 {
      font-size: 2rem;
      margin-bottom: 10px;
      color: var(--primary);
  }
  
  .services-header .motto {
      font-size: 1.3rem;
      font-weight: 600;
      margin-bottom: 40px;
      color: var(--dark);
  }
  
  .services-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
      gap: 24px;
      max-width: 1000px;
      margin: 0 auto;
  }
  
  .service-card {
      perspective: 1000px;
      height: 220px;
      cursor: pointer;
      outline: none;
  }
  
  .service-card:focus-visible {
      box-shadow: 0 0 0 3px var(--accent);
      border-radius: 16px;
  }
  
  .card-inner {
      position: relative;
      width: 100%;
      height: 100%;
      transform-style: preserve-3d;
      transition: transform .6s cubic-bezier(.2, .6, .2, 1);
      border-radius: 16px;
      box-shadow: 0 6px 18px rgba(0, 0, 0, .10);
  }
  
  .card-face {
      position: absolute;
      inset: 0;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 20px;
      border-radius: 16px;
      backface-visibility: hidden;
      background: linear-gradient(180deg, #eef4fb 0%, #ffffff 100%);
      border: 2px solid var(--primary);
  }
  
  .card-front img {
      height: 48px;
      margin-bottom: 12px;
  }
  
  .card-front h3 {
      margin: 0;
      font-size: 1.05rem;
      text-align: center;
      color: var(--dark);
  }
  
  .card-back {
      transform: rotateY(180deg);
      text-align: center;
  }
  
  .card-back h4 {
      margin: 0 0 6px;
      color: var(--primary-700);
  }
  
  .card-back p {
      margin: 0 0 12px;
      color: var(--dark);
      font-size: .98rem;
  }
  
  .cta-mini,
  a.cta-mini {
      display: inline-block;
      padding: 8px 12px;
      border-radius: 10px;
      background: #fff;
      color: var(--primary);
      font-weight: 700;
      border: 2px solid var(--primary);
      text-decoration: none;
      transition: background .2s, color .2s;
  }
  
  .cta-mini:hover,
  a.cta-mini:hover {
      background: var(--primary);
      color: #fff;
  }
  
  .service-card.flipped .card-inner {
      transform: rotateY(180deg);
  }
  
  @media (hover:hover) {
      .service-card:hover .card-inner {
          transform: rotateY(180deg);
      }
  }
  
  @media (max-width:520px) {
      .service-card {
          height: 260px;
      }
  }
  /* Abschlusslinie Leistungen */
  
  .services-footer-line {
      display: flex;
      align-items: center;
      gap: 8px;
      margin: 40px auto 0;
      max-width: 1000px;
  }
  
  .services-footer-line .line {
      flex: 1;
      height: 2px;
      background: var(--primary);
  }
  /* ========== Laufende Mini-Galerie (Scroll + Pfeile) ========== */
  
  .scroll-gallery {
      position: relative;
      width: 100%;
      overflow: hidden;
      margin-top: 40px;
      padding: 20px 0;
      background: var(--bg-alt);
      border-top: 1px solid var(--border);
      border-bottom: 1px solid var(--border);
  }
  
  .scroll-container {
      overflow-x: auto;
      scroll-behavior: smooth;
      scrollbar-width: none;
  }
  
  .scroll-container::-webkit-scrollbar {
      display: none;
  }
  
  .scroll-track {
      display: inline-flex;
      gap: 14px;
      padding: 10px 20px;
      white-space: nowrap;
  }
  
  .scroll-track img {
      width: 150px;
      height: 150px;
      object-fit: cover;
      border-radius: 10px;
      border: 2px solid #fff;
      box-shadow: 0 2px 6px rgba(0, 0, 0, .1);
      flex-shrink: 0;
      transition: transform .2s;
  }
  
  .scroll-track img:hover {
      transform: scale(1.05);
  }
  
  .scroll-btn {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      background: rgba(255, 255, 255, .9);
      border: none;
      color: var(--primary);
      font-size: 2rem;
      font-weight: 700;
      width: 44px;
      height: 44px;
      border-radius: 50%;
      cursor: pointer;
      box-shadow: 0 2px 6px rgba(0, 0, 0, .15);
      transition: background .2s, color .2s;
      z-index: 2;
  }
  
  .scroll-btn:hover {
      background: var(--primary);
      color: #fff;
  }
  
  .scroll-btn.left {
      left: 10px;
  }
  
  .scroll-btn.right {
      right: 10px;
  }
  
  @media (hover:hover) {
      .scroll-btn {
          opacity: 0;
          pointer-events: none;
      }
      .scroll-gallery:hover .scroll-btn {
          opacity: 1;
          pointer-events: auto;
      }
  }
  
  @media (max-width:520px) {
      .scroll-track img {
          width: 120px;
          height: 120px;
      }
  }
  /* ========== Galerie ========== */
  
  .gallery-title {
      text-align: center;
      font-size: 2rem;
      margin: 0 0 8px;
      color: var(--primary);
  }
  
  .gallery-sub {
      text-align: center;
      margin-bottom: 30px;
      color: var(--muted);
  }
  
  .grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
      gap: 16px;
  }
  
  figure {
      margin: 0;
      padding: 10px;
      border: 1px solid var(--border);
      border-radius: 12px;
      background: #fff;
  }
  
  figcaption {
      color: var(--muted);
      font-size: .95rem;
      margin-top: 6px;
      text-align: center;
  }
  
  .before-after {
      display: flex;
      gap: 8px;
      justify-content: center;
      align-items: flex-start;
  }
  
  .before-after img {
      width: 100%;
      max-width: 200px;
      border-radius: 8px;
      border: 1px solid var(--border);
      background: #fff;
      box-shadow: 0 4px 10px rgba(0, 0, 0, .15);
      transition: box-shadow .2s;
  }
  
  .before-after img:hover {
      box-shadow: 0 6px 14px rgba(0, 0, 0, .25);
  }
  /* Galerie Footer */
  
  .gallery-footer {
      display: flex;
      justify-content: flex-end;
      margin-top: 20px;
  }
  
  .btn-more {
      padding: 8px 14px;
      background: var(--primary);
      color: #fff;
      font-weight: 600;
      text-decoration: none;
      border-radius: 8px;
      transition: background .2s;
  }
  
  .btn-more:hover {
      background: var(--primary-700);
  }
  
  .gallery-footer-line {
      display: flex;
      align-items: center;
      gap: 8px;
      margin: 40px auto 0;
      max-width: 1000px;
  }
  
  .gallery-footer-line .line {
      flex: 1;
      height: 2px;
      background: var(--primary);
  }
  
  .gallery-footer-line .dot {
      width: 12px;
      height: 12px;
      background: #c2f2a4;
      border: 2px solid var(--primary);
      border-radius: 50%;
  }
  /* ========== Kontakt (Karte) ========== */
  
  address {
      font-style: normal;
  }
  
  form {
      margin-top: 12px;
      max-width: 560px;
      padding: 12px;
      border: 1px solid var(--border);
      border-radius: 12px;
      background: #fff;
  }
  
  label {
      display: block;
      margin: 10px 0 4px;
  }
  
  input,
  textarea {
      width: 100%;
      padding: 10px;
      border: 1px solid var(--border);
      border-radius: 10px;
      font: inherit;
      background: #fff;
  }
  
  input:focus,
  textarea:focus {
      outline: 3px solid var(--accent);
      border-color: transparent;
  }
  
  button {
      margin-top: 10px;
      padding: 10px 14px;
      border-radius: 12px;
      border: 1px solid var(--primary);
      background: var(--primary);
      color: #fff;
      font-weight: 700;
      cursor: not-allowed;
  }
  /* Karte */
  
  .contact-card {
      padding: 60px 0;
      background: var(--bg);
  }
  
  .contact-card-wrap {
      background: var(--primary);
      border-radius: 28px;
      padding: 12px;
      box-shadow: 0 14px 40px rgba(0, 0, 0, .18);
  }
  
  .card-header {
      background: var(--primary);
      border-radius: 20px 20px 0 0;
      text-align: center;
      padding: 18px 16px 10px;
  }
  
  .card-header h2 {
      color: #fff;
      font-size: 2rem;
      margin: 0;
      text-decoration: underline;
      text-underline-offset: 6px;
  }
  
  .card-body {
      background: #fff;
      border-radius: 20px;
      padding: 28px 24px 26px;
      box-shadow: inset 0 0 40px rgba(0, 0, 0, .10);
      text-align: center;
  }
  
  .brand-name {
      margin: 6px 0 10px;
      font-size: 1.6rem;
      color: var(--dark);
  }
  
  .contact-lines {
      margin: 0 auto 8px;
      color: var(--dark);
      font-size: 2rem;
  }
  
  .contact-lines a {
      color: #2d6a6f;
      text-decoration: underline;
  }
  
  .oder {
      margin: 10px 0;
      color: var(--muted);
  }
  
  .wa-big {
      display: inline-block;
      padding: 12px 28px;
      border: 3px solid var(--primary);
      border-radius: 14px;
      font-size: 1.6rem;
      font-weight: 800;
      color: var(--primary);
      text-decoration: none;
      background: transparent;
      transition: background .2s, color .2s, transform .08s;
  }
  
  .wa-big:hover {
      background: var(--primary);
      color: #fff;
  }
  
  .wa-big:active {
      transform: translateY(1px);
  }
  
  .wa-big img {
      height: 1.2em;
      margin-left: 8px;
      vertical-align: -2px;
  }
  
  .contact-three {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      gap: 18px;
      margin: 20px 0 4px;
      text-align: left;
  }
  
  .contact-three .col strong {
      display: block;
      font-size: 2rem;
      color: var(--dark);
  }
  
  .contact-three .col p {
      margin: 4px 0 0;
      color: var(--dark);
  }
  
  .contact-three .center {
      text-align: center;
  }
  
  .contact-three .right {
      text-align: right;
  }
  
  @media (max-width:780px) {
      .contact-three {
          grid-template-columns: 1fr;
          text-align: center;
      }
      .contact-three .col,
      .contact-three .center,
      .contact-three .right {
          text-align: center;
      }
  }
  
  .contact-footer-line {
      display: flex;
      align-items: center;
      gap: 8px;
      margin: 26px auto 0;
      max-width: 1000px;
  }
  
  .contact-footer-line .line {
      flex: 1;
      height: 2px;
      background: var(--primary);
  }
  /* ========== Footer ========== */
  
  footer {
      border-top: 1px solid var(--border);
      color: var(--muted);
      max-width: 900px;
      margin: 90px auto;
      padding: 40px 40px 80px;
      background: #fff;
      border-radius: 16px;
      box-shadow: 0 4px 20px rgba(0, 0, 0, .08);
      line-height: 1.7;
  }
  
  footer .container {
      padding: 16px;
  }
  /* ========== Impressum ========== */
  
  .impressum {
      max-width: 900px;
      margin: 90px auto;
      padding: 40px 40px 80px;
      background: #fff;
      border-radius: 16px;
      box-shadow: 0 4px 20px rgba(0, 0, 0, .08);
      line-height: 1.7;
  }
  
  .impressum h1 {
      color: var(--primary);
      text-align: center;
      margin-bottom: 40px;
  }
  
  .impressum h2 {
      margin-top: 40px;
      color: var(--primary-700);
  }
  
  .impressum a {
      color: var(--primary);
      text-decoration: underline;
  }
  
  .impressum p {
      margin: 10px 0;
      color: var(--dark);
  }
  
  @media (max-width:700px) {
      .impressum {
          margin: 80px 20px;
          padding: 30px 20px 60px;
      }
  }
  /* === NAV-Logo sichtbar & sauber zentriert (ohne Leistenhöhe zu erhöhen) === */
  /* 1) Platzhalter bekommt Breite (horizontaler Slot), aber keine Höhe */
  
  .nav-neo .brand {
      position: relative;
      width: 140px;
      /* reserviert den Platz zwischen "Leistungen" & "Galerie" */
      height: 0;
      /* erhöht die Leiste NICHT */
      overflow: visible;
  }
  /* 2) Logo absolut im Slot zentrieren und über den Balken ziehen */
  
  .brand__badge {
      position: absolute;
      left: 50%;
      top: -40px;
      /* Überlappung nach unten: anpassen (+/-) */
      transform: translateX(-50%);
      pointer-events: none;
      z-index: 1100;
      /* sicher über allem */
  }
  /* 3) Logo-Größe + Schatten: überschreibt evtl. alte 1px-Regeln */
  
  .brand__badge img {
      width: 300px !important;
      /* erzwingt Größe, falls frühere Regel stört */
      height: auto;
      display: block;
      filter: drop-shadow(0 6px 12px rgba(0, 0, 0, .40));
      transition: transform .25s ease;
  }
  /* 4) Shrink-Verhalten bleibt dezent */
  
  .nav-neo.is-shrink .brand__badge img {
      transform: translateY(4px) scale(.90);
  }
  /* --- FINALER LOGO-OVERRIDE (immer gewinnt) --- */
  
  .nav-neo .brand .brand__badge img {
      width: 130px !important;
      /* <— HIER Größe ändern (z.B. 110/130/150/170) */
      height: auto !important;
      max-width: none !important;
      transform: none !important;
      filter: drop-shadow(0 6px 20px rgba(0, 0, 0, .40));
  }
  /* ========= NAVIGATION – Impressum ========= */
  
  .mnav {
      display: none;
  }
  
  @media (max-width: 820px) {
      .nav-neo li {
          display: none !important;
      }
      .nav-neo {
          height: 40px;
      }
      .mnav {
          position: fixed;
          place-items: center;
          z-index: 1200;
          top: 6px;
          left: 0;
          right: 0;
          display: grid;
      }
      .mnav-logo {
          pointer-events: auto;
          display: grid;
          place-items: center;
          width: 88px;
          height: 88px;
      }
      .mnav-logo img {
          width: 130px;
          height: auto;
          display: block;
          filter: drop-shadow(0 6px 12px rgba(0, 0, 0, .40));
          transition: transform .25s ease;
          display: block;
      }
      .mnav-toggle {
          pointer-events: auto;
          margin-top: 6px;
          background: #4b1c82;
          color: #fff;
          border: 0;
          border-radius: 12px;
          width: 44px;
          height: 30px;
          display: grid;
          place-items: center;
          box-shadow: 0 8px 18px rgba(0, 0, 0, .35), inset 0 2px 6px rgba(255, 255, 255, .2);
          cursor: pointer;
      }
      /* 3 Linien */
      .mnav-burger,
      .mnav-burger::before,
      .mnav-burger::after {
          content: "";
          display: block;
          width: 20px;
          height: 2px;
          background: #ffffff;
          border-radius: 2px;
          transition: transform .2s ease, opacity .2s ease;
          pointer-events: auto;
      }
      .mnav-burger::before {
          transform: translateY(-6px);
      }
      .mnav-burger::after {
          transform: translateY(4px);
      }
      /* Button-X-Animation wenn offen */
      .mnav.is-open .mnav-burger {
          opacity: 0;
      }
      .mnav.is-open .mnav-burger::before {
          transform: rotate(45deg);
          opacity: 1;
      }
      .mnav.is-open .mnav-burger::after {
          transform: rotate(-45deg);
          opacity: 1;
      }
      /* Dropdown-Menü: zentriert unter dem Button */
      .mnav-menu {
          pointer-events: auto;
          position: absolute;
          top: 134px;
          /* 88 Logo + 6 Gap + 30 Button + 10 Luft */
          left: 50%;
          transform: translateX(-50%) translateY(-6px) scale(.98);
          width: min(84vw, 280px);
          background: #54267f;
          border-radius: 18px;
          padding: 14px 0;
          box-shadow: 0 16px 36px rgba(0, 0, 0, .35);
          border: 1px solid rgba(255, 255, 255, .25);
          opacity: 0;
          visibility: hidden;
          transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
          cursor: pointer;
      }
      .mnav.is-open .mnav-menu {
          opacity: 1;
          visibility: visible;
          transform: translateX(-50%) translateY(0) scale(1);
      }
      .mnav-menu a {
          display: block;
          padding: 10px 18px;
          color: #fff;
          text-decoration: none;
          font-weight: 800;
          letter-spacing: .2px;
          text-align: center;
          text-shadow: 0 2px 5px rgba(0, 0, 0, .35);
          cursor: pointer;
      }
      .mnav-menu a+a {
          border-top: 1px solid rgba(255, 255, 255, .12);
      }
      .mnav-menu a:active,
      .mnav-menu a:hover {
          background: rgba(255, 255, 255, .12);
      }
      /* ausreichend Platz nach oben, damit nichts verdeckt */
      body {
          padding-top: 120px;
      }
  }