/* ===== LGA Modern – Frontend Styles (1.5.0) ===== */
:root{
  --font-brand: "Space Grotesk", Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --font-hero:  "Space Grotesk", Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  --fdp-yellow:#ffed00; --fdp-cyan:#00aeef; --fdp-magenta:#e6007e;

  /* >>> DEFAULT = LIGHT MODE <<< */
  --bg:#f7f8fb; 
  --surface:#ffffff; 
  --card:#ffffff; 
  --text:#0c1220; 
  --muted:#5c6676; 
  --border:#e6e9ef;

  --grad-1: linear-gradient(135deg, rgba(255,237,0,.35), rgba(0,174,239,.25));
  --grad-2: linear-gradient(135deg, rgba(230,0,126,.4), rgba(0,174,239,.25));
  --grad-3: linear-gradient(135deg, rgba(0,174,239,.35), rgba(255,237,0,.25));
  --glow-yellow: 0 0 40px 8px rgba(255,237,0,.12);
  --glow-cyan:   0 0 44px 10px rgba(0,174,239,.12);
  --glow-mag:    0 0 44px 10px rgba(230,0,126,.10);
  --radius-xl:18px; --radius-lg:14px; --radius-md:10px; --radius-sm:8px;
  --shadow-soft:0 10px 30px rgba(0,0,0,.08);
  --shadow-ring:0 0 0 1px var(--border), 0 8px 26px rgba(0,0,0,.10);
  --nav-height:70px;
}

/* DARK override via JS: <html data-theme="dark"> */
:root[data-theme="dark"]{
  --bg:#0e1116; --surface:#121722; --card:#161b26; --text:#e8ecf1; --muted:#a9b3c1; --border:#232a37;
  --shadow-soft:0 10px 30px rgba(0,0,0,.25);
  --shadow-ring:0 0 0 1px var(--border), 0 8px 30px rgba(0,0,0,.35);
}

/* optional, nicht zwingend – sorgt für explizite Light-Werte bei data-theme */
:root[data-theme="light"]{
  --bg:#f7f8fb; --surface:#ffffff; --card:#ffffff; --text:#0c1220; --muted:#5c6676; --border:#e6e9ef;
  --shadow-soft:0 10px 30px rgba(0,0,0,.08);
  --shadow-ring:0 0 0 1px var(--border), 0 8px 26px rgba(0,0,0,.10);
}


*{box-sizing:border-box} html{scroll-behavior:smooth}
body{ margin:0; font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji";
  color:var(--text); background: radial-gradient(1200px 600px at 80% -10%, rgba(255,237,0,.05), transparent 60%),
  radial-gradient(900px 500px at -10% 10%, rgba(0,174,239,.06), transparent 60%),
  radial-gradient(900px 800px at 50% 120%, rgba(230,0,126,.05), transparent 60%), var(--bg);
  line-height:1.55; overflow-x:hidden; }
a{color:inherit;text-decoration:none} img{max-width:100%;display:block}

/* NAV */
.nav-wrap{position:sticky;top:0;z-index:1000;backdrop-filter:saturate(150%) blur(10px);background:color-mix(in srgb, var(--bg) 88%, transparent);border-bottom:1px solid var(--border)}
.nav{height:var(--nav-height);display:flex;align-items:center;justify-content:space-between;gap:20px;max-width:1200px;margin:0 auto;padding:0 20px}
.brand{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:.3px}
.brand-logo .custom-logo-link{display:inline-flex;align-items:center}

/* --- FIX: Logo niemals verzerren --- */
.brand-logo img{
  max-height:100px;
  height:auto !important;
  width:auto !important;
  aspect-ratio:auto;
  object-fit:contain;
  display:block;
}

.brand-title{font-family:var(--font-brand);font-size:1.05rem}
.nav-items{display:flex;align-items:center;gap:10px}
.theme-icon-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:12px;border:1px solid var(--border);background:color-mix(in srgb, var(--surface) 75%, transparent);margin-right:6px;cursor:pointer}
.theme-icon-btn:focus-visible{outline:2px solid color-mix(in srgb, var(--fdp-cyan) 55%, transparent);outline-offset:2px}
.menu{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:6px}
.menu > li{position:relative}
.menu > li > a{padding:10px 12px;border-radius:10px;border:1px solid transparent;font-weight:600;letter-spacing:.2px;transition:transform .2s ease, background .2s ease, border-color .2s ease}
.menu > li > a:hover{background:color-mix(in srgb, var(--surface) 70%, transparent);border-color:var(--border)}
.submenu{position:absolute;left:0;top:100%;min-width:240px;padding:10px;margin-top:10px;border-radius:var(--radius-lg);background:color-mix(in srgb, var(--surface) 94%, transparent);border:1px solid var(--border);box-shadow:var(--shadow-ring);opacity:0;transform:translateY(6px) scale(.98);visibility:hidden;pointer-events:none;transition:opacity .18s ease, transform .18s ease, visibility 0s linear .18s}
.submenu::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
.menu > li.opening > .submenu,.menu > li.showing > .submenu{opacity:1;transform:translateY(0) scale(1);visibility:visible;pointer-events:auto;transition-delay:40ms}
.menu > li.closing > .submenu{opacity:0;transform:translateY(6px) scale(.98);transition-delay:0ms}
.sub-menu{list-style:none;margin:0;padding:0}
.sub-menu a{display:block;padding:10px 12px;border-radius:10px;color:var(--text);border:1px solid transparent}
.sub-menu a:hover{background:color-mix(in srgb, var(--card) 85%, transparent);border-color:var(--border)}
.nav-toggle{display:none;background:none;border:1px solid var(--border);padding:10px 12px;border-radius:12px}

/* --- FIX: Mobile Menu als Drawer mit Scroll & gestapelten Links --- */
@media (max-width:980px){
  .nav{height:auto;padding:12px 16px;align-items:center}
  .nav-items{width:100%;justify-content:flex-end}
  .nav-toggle{display:inline-flex}

  .menu{
    position:fixed;
    /* oberhalb Content, innerhalb des Viewports */
    top:calc(var(--nav-height) + 6px);
    left:16px; right:16px;
    /* volle Breite abzüglich Rand */
    width:calc(100vw - 32px);
    max-height:calc(100dvh - 120px);
    overflow:auto;
    -webkit-overflow-scrolling:touch;
    flex-direction:column;
    gap:0;
    background:color-mix(in srgb, var(--surface) 92%, transparent);
    border:1px solid var(--border);
    border-radius:var(--radius-lg);
    padding:12px;
    display:none;
    box-shadow:var(--shadow-ring);
  }
  .menu.open{display:flex}

  .menu > li{width:100%}
  .menu > li > a{
    display:flex;
    align-items:center;
    width:100%;
    padding:14px 16px !important;
    border-radius:12px;
  }

  /* Submenu als Card innerhalb des Drawers */
  .submenu{
    position:relative;
    inset:auto;
    width:100%;
    margin:10px 0 6px 0;
    background:color-mix(in srgb, var(--card) 94%, transparent);
    border-radius:12px;
    border:1px solid var(--border);
    opacity:1; visibility:visible; transform:none; pointer-events:auto;
    box-shadow:none;
  }
  .submenu .sub-menu a{padding:12px 14px}
}
.scrolled .nav-wrap{border-bottom-color:color-mix(in srgb, var(--border) 70%, transparent);background:color-mix(in srgb, var(--bg) 92%, transparent)}

/* HERO */
.hero{position:relative;max-width:1200px;margin:0 auto;padding:80px 20px 40px;display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:center}
.hero h1{font-family:var(--font-hero);font-weight:800;font-size:clamp(2.2rem, 4vw, 3.4rem);margin:0 0 14px;letter-spacing:.2px}
.hero p{font-size:1.1rem;color:var(--muted);margin:0 0 22px}
.hero .actions{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:10px;padding:12px 16px;border-radius:12px;border:1px solid var(--border);background:var(--card);box-shadow:var(--shadow-soft);font-weight:700}
.btn.primary{background:var(--grad-2);box-shadow:var(--glow-mag)}
.btn.ghost{background:color-mix(in srgb, var(--card) 75%, transparent)}
.hero-art{position:relative;aspect-ratio:1/1;border-radius:var(--radius-xl);background:var(--card);border:1px solid var(--border);overflow:hidden;box-shadow:var(--shadow-ring);display:grid;place-items:center}
.orb{position:absolute;filter:blur(12px);opacity:.9}
.orb.yellow{width:280px;height:280px;border-radius:999px;background:radial-gradient(circle at 30% 30%, rgba(255,237,0,.6), rgba(255,237,0,.0) 60%);box-shadow:var(--glow-yellow);top:-30px;right:-10px}
.orb.cyan{width:320px;height:320px;border-radius:999px;background:radial-gradient(circle at 60% 40%, rgba(0,174,239,.5), rgba(0,174,239,.0) 60%);box-shadow:var(--glow-cyan);bottom:-30px;left:-40px}
.orb.mag{width:220px;height:220px;border-radius:999px;background:radial-gradient(circle at 50% 50%, rgba(230,0,126,.55), rgba(230,0,126,.0) 60%);box-shadow:var(--glow-mag);bottom:40px;right:40px}
.badge-row{display:flex;gap:10px;flex-wrap:wrap}
.badge{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;border:1px solid var(--border);background:color-mix(in srgb, var(--card) 85%, transparent);font-size:.9rem;color:var(--muted)}
.badge i{width:8px;height:8px;border-radius:50%;display:inline-block}
.i-yellow{background:var(--fdp-yellow)} .i-cyan{background:var(--fdp-cyan)} .i-mag{background:var(--fdp-magenta)}
@media (max-width:980px){.hero{grid-template-columns:1fr;padding-top:40px}.hero-art{order:-1}}

/* ===========================
   LGA Button Micro-Interactions
   =========================== */

/* Baseline: smooth transitions */
.btn{
  position:relative;
  overflow:hidden; /* für Shine/Ripple-Schutz */
  transition:
    transform .15s ease,
    box-shadow .25s ease,
    border-color .2s ease,
    background-color .2s ease,
    opacity .2s ease;
}

/* Hover: leichtes Anheben */
.btn:hover{
  transform: translateY(-2px);
  box-shadow: var(--shadow-strong, 0 10px 24px rgba(0,0,0,.25));
}

/* Active: „Klick“-Feedback */
.btn:active{
  transform: translateY(0);
  box-shadow: var(--shadow-soft);
}

/* Tastatur-Fokus – klare, thematische Focus-Ring */
.btn:focus-visible{
  outline: none;
  box-shadow:
    0 0 0 3px color-mix(in srgb, var(--fdp-cyan) 35%, transparent),
    0 6px 18px rgba(0,0,0,.25);
  border-color: color-mix(in srgb, var(--fdp-cyan) 50%, var(--border));
}

/* Disabled (native + aria) */
.btn:disabled,
.btn[aria-disabled="true"],
.btn.is-disabled{
  opacity:.55;
  pointer-events:none;
  transform:none;
  box-shadow:none;
}

/* ---------- Primary: lebendiger Gradient + Glow ---------- */
.btn.primary{
  background: var(--grad-2);
  background-size: 200% 200%;
  transition: background-position .6s ease, transform .15s ease, box-shadow .25s ease;
  box-shadow: var(--glow-mag, 0 0 0 rgba(0,0,0,0)); /* Fallback */
}

/* Gradient „fährt“ leicht beim Hover */
.btn.primary:hover{
  background-position: 100% 0;
  box-shadow:
    0 0 24px color-mix(in srgb, var(--fdp-cyan) 30%, transparent),
    0 14px 36px rgba(0,0,0,.35);
}

/* Subtiler Shine-Effekt auf Hover */
.btn.primary::before{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(120deg, transparent 35%,
      color-mix(in srgb, #fff 35%, transparent) 50%,
      transparent 65%);
  transform: translateX(-120%) skewX(-20deg);
  transition: transform .7s ease;
  pointer-events:none;
  mix-blend-mode: screen;
}
.btn.primary:hover::before{ transform: translateX(120%) skewX(-20deg); }

/* ---------- Ghost: mehr Kontrast + Border-Reveal ---------- */
.btn.ghost{
  backdrop-filter: saturate(120%) blur(2px);
  transition: background-color .25s ease, border-color .2s ease, transform .15s ease, box-shadow .25s ease;
}
.btn.ghost:hover{
  background: color-mix(in srgb, var(--card) 90%, transparent);
  border-color: color-mix(in srgb, var(--fdp-cyan) 35%, var(--border));
  box-shadow: 0 8px 22px rgba(0,0,0,.25);
}

/* ---------- Default .btn (neutral) – zarter Shine ---------- */
.btn::after{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(120px 60px at var(--mx, -40px) var(--my, -40px),
      color-mix(in srgb, #fff 10%, transparent), transparent 60%);
  opacity:0; transition: opacity .2s ease;
  pointer-events:none;
}
.btn:hover::after{ opacity:.7; }

/* Mausposition (nur für Browser mit :has Unterstützung fallback via JS optional) */
@supports(selector(:has(*))){
  .btn:hover{ --mx: var(--_mx); --my: var(--_my); }
}

/* Bewegungs-Reduktion respektieren */
@media (prefers-reduced-motion: reduce){
  .btn,
  .btn.primary{ transition:none; }
  .btn.primary::before,
  .btn::after{ display:none; }
}


/* === Events inside hero-art ================================================= */
.hero .hero-art {
  position: relative;
  display: grid;
  place-items: center;
  overflow: hidden;
}

.hero .hero-art .events-in-hero {
  position: relative;
  width: min(560px, 92%);
  margin: 18px auto;
  border-radius: var(--radius-xl);
  background: color-mix(in srgb, var(--surface) 80%, transparent);
  border: 1px solid var(--border);
  box-shadow: var(--shadow-ring);
  padding: 16px;
  box-sizing: border-box; /* --- FIX: keine Überläufe --- */
}

.hero .hero-art .events-in-hero.with-orbs { position: relative; z-index: 1; }
.hero .hero-art .events-head{ display:flex; align-items:center; gap:10px; font-weight:700; letter-spacing:.2px; margin-bottom:10px; }
.hero .hero-art .events-head .emoji{font-size:1.15rem}

.hero .hero-art .events-list{
  border-radius: 12px;
  background: color-mix(in srgb, var(--card) 88%, transparent);
  border: 1px solid var(--border);
  padding: 10px 12px;
  margin-bottom: 12px;
  overflow: visible; /* --- FIX --- */
}
.hero .hero-art .events-actions{ display:flex; justify-content:flex-start; }
.hero .hero-art .events-actions .btn{ padding:10px 14px; }

.hero .hero-art .events-list .simcal-calendar-list .simcal-event-details p{ margin: 0 0 10px; }
.hero .hero-art .events-list .simcal-event-details p strong{ display:block; margin-bottom:2px; }
.hero .hero-art .events-list .simcal-align-right{ display:none; } /* "Kalender bearbeiten" */

.hero .hero-art .orb { filter: blur(14px); opacity: .85; }


/* SECTIONS */
section{padding:70px 20px}
.section-inner{max-width:1200px;margin:0 auto}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:26px}
.section-head h2{font-family:var(--font-hero);font-size:clamp(1.6rem, 2.4vw, 2.2rem);margin:0}
.section-head p{color:var(--muted);margin:0}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.col-4{grid-column:span 4} .col-6{grid-column:span 6} .col-12{grid-column:span 12}
@media (max-width:980px){.col-4,.col-6{grid-column:span 12}}
.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow-soft);padding:20px;position:relative;overflow:hidden}
.card::after{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;background:linear-gradient(180deg, color-mix(in srgb, var(--fdp-yellow) 15%, transparent), transparent 40%, color-mix(in srgb, var(--fdp-magenta) 12%, transparent) 70%, transparent 100%);opacity:.35;mask:linear-gradient(#000, transparent 60%)}
.card .title{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:.2px}
.card .emoji{font-size:1.15rem}
.card p{color:var(--muted);margin:10px 0 0}
.feature-accent-yellow { height: 4px; border-radius: 999px; background: var(--grad-1); margin: 12px 0 4px; box-shadow: var(--glow-yellow); }
.feature-accent-mag   { height: 4px; border-radius: 999px; background: var(--grad-2); margin: 12px 0 4px; box-shadow: var(--glow-mag); }
.feature-accent-cyan  { height: 4px; border-radius: 999px; background: var(--grad-3); margin: 12px 0 4px; box-shadow: var(--glow-cyan); }

/* Events (Termine) */
.events-wrap{margin-top:24px}
.events-box{position:relative;border-radius:var(--radius-xl);border:1px solid var(--border);overflow:hidden;background:var(--card);box-shadow:var(--shadow-ring)}
.events-box.with-orbs{background:var(--grad-1)}
.events-box .events-bg{position:absolute;inset:0;filter:saturate(110%);opacity:.7}
.events-box .events-content{position:relative;padding:20px}
.events-head{display:flex;align-items:center;gap:10px;font-weight:800;margin-bottom:12px;color:var(--text)}
.events-head .emoji{font-size:1.1rem}
.events-list{background:color-mix(in srgb, var(--surface) 80%, transparent);border:1px solid var(--border);border-radius:12px;padding:12px}
.events-actions{margin-top:12px}

/* --- FIX: Event-/Calendar-Widgets nicht abschneiden (auch mobil) --- */
@media (max-width:980px){
  .events-box,
  .events-box .events-content,
  .events-list,
  .simcal-default-calendar,
  .simcal-default-calendar .simcal-calendar,
  .simcal-default-calendar .simcal-events{
    width:100% !important;
    max-width:100% !important;
    margin-inline:0 !important;
    padding-inline:clamp(12px, 4vw, 16px) !important;
    box-sizing:border-box !important;
  }
  .events-box,
  .simcal-default-calendar{ overflow:visible !important; }
}

/* News */
.news{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.news article{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:14px;transition:transform .2s ease, box-shadow .2s ease}
.news article:hover{transform:translateY(-4px);box-shadow:var(--shadow-ring)}
.news h3{font-size:1rem;margin:6px 0 6px}
.news p{color:var(--muted);margin:0;font-size:.95rem}
@media (max-width:980px){.news{grid-template-columns:1fr}}

/* CTA */
.cta-band{margin-top:24px;padding:24px;border-radius:var(--radius-xl);border:1px solid var(--border);background:var(--grad-1);display:flex;align-items:center;justify-content:space-between;gap:16px;box-shadow:var(--glow-yellow)}
.cta-band p{margin:0;color:color-mix(in srgb, var(--text) 90%, transparent)}

/* FOOTER */
.lga-footer{border-top:1px solid var(--border);background:color-mix(in srgb, var(--surface) 88%, transparent)}
.lga-footer .footer-inner{max-width:1200px;margin:0 auto;padding:28px 20px;display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:20px}
.lga-footer h4{margin:0 0 10px;font-size:1rem}
.lga-footer a{display:inline-flex;align-items:center;gap:8px;padding:6px 0;color:var(--muted)}
.lga-footer .socials-list{display:flex;gap:10px;flex-wrap:wrap;padding:0;margin:4px 0;list-style:none}
.lga-footer .socials-list .icon{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:999px;border:1px solid var(--border);background:var(--card);box-shadow:var(--shadow-soft)}
.lga-footer .socials-list .icon svg{width:18px;height:18px}
.copyright{border-top:1px solid var(--border);color:var(--muted);font-size:.95rem;padding:16px 20px;text-align:center}
@media (max-width:900px){.lga-footer .footer-inner{grid-template-columns:1fr 1fr}}

/* Reveal */
.reveal-on-scroll{opacity:0;transform:translateY(16px);will-change:opacity, transform}
.reveal-on-scroll.revealed{opacity:1;transform:translateY(0);transition:opacity .7s ease, transform .7s ease}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto}.reveal-on-scroll{opacity:1 !important;transform:none !important}.orb,.hero-parallax{display:none}}

/* Theme Transition */
html.transitioning, html.transitioning *{ transition: background-color .35s ease, color .35s ease, border-color .35s ease, box-shadow .35s ease, opacity .35s ease; }
body.transition-overlay::before{ content:""; position:fixed; inset:0; pointer-events:none; opacity:0; background: var(--bg); mix-blend-mode:multiply; z-index:2147483647; animation: themeOverlay .35s ease; }
@keyframes themeOverlay{ 0%{opacity:.35} 100%{opacity:0} }

/* Post/Page hero – blur edges + contained image */
.post-hero{position:relative;min-height:260px;border-bottom:1px solid var(--border);overflow:hidden}
.post-hero::before{content:""; position:absolute; inset:0; background-image:var(--hero-url); background-size:cover; background-position:center; filter:blur(22px) saturate(1.15); transform:scale(1.08); opacity:.6;}
.post-hero-overlay{position:absolute;inset:0;background:radial-gradient(60% 60% at 50% 10%, rgba(0,0,0,.0), rgba(0,0,0,.45));mix-blend-mode:multiply}
.post-hero-content{position:relative;z-index:2;padding:24px 20px 28px}
.post-hero-img{ position:relative; z-index:2; display:block; max-height:460px; width:auto; max-width:min(1100px, 92vw); margin:0 auto; object-fit:contain; border-radius:16px; box-shadow:var(--shadow-ring); background:var(--card); }
.post-title{font-family:var(--font-hero);font-size:clamp(1.8rem,3vw,2.6rem);margin:0}
.post-meta{color:var(--muted);margin-top:6px}
.post-content p{margin:1em 0;color:var(--text)}
.post-content img{border-radius:12px}
.post-content figure{margin:1.2em 0}
.post-content blockquote{margin:1.2em 0;padding:10px 12px;border-left:3px solid color-mix(in srgb, var(--fdp-cyan) 50%, transparent);background:color-mix(in srgb, var(--surface) 70%, transparent);border-radius:10px}
.comments-area{padding-bottom:60px}
.comment-list{list-style:none;padding:0;margin:0}
.comment-list li{margin-bottom:18px;padding:12px;border:1px solid var(--border);border-radius:12px;background:color-mix(in srgb, var(--card) 90%, transparent)}
.comment-form textarea,.comment-form input[type="text"],.comment-form input[type="email"],.comment-form input[type="url"]{width:100%;border:1px solid var(--border);border-radius:10px;padding:10px;background:var(--surface);color:var(--text)}
.comment-form input[type="submit"]{padding:10px 16px;border-radius:10px;border:1px solid var(--border);background:var(--grad-2);box-shadow:var(--glow-mag);font-weight:700;cursor:pointer}


/* --- FIX: generische Mobile-Padding/Overflow-Schutz für enge Layouts --- */
@media (max-width:980px){
  .section-inner,
  .post-content,
  .container,
  .wrapper{
    padding-inline:16px;
    box-sizing:border-box;
  }
}

/* --- Optional: Scrolling des Body verhindern, wenn Menü offen (wo unterstützt) --- */
@supports(selector(html:has(.menu.open))){
  html:has(.menu.open){ overflow:hidden; }
}

/* === MOBILE MENU: Submenüs einklappbar =============================== */
@media (max-width:980px){
  /* Submenü standardmäßig zu */
  .menu .submenu{
    display:none;
    position:relative;
    inset:auto;
    width:100%;
    margin:8px 0 0 0;
    background:color-mix(in srgb, var(--card) 94%, transparent);
    border:1px solid var(--border);
    border-radius:12px;
    padding:8px;
    box-shadow:none;
  }
  /* wenn Eltern-<li> geöffnet ist -> zeigen */
  .menu li.is-open > .submenu,
  .menu li[aria-expanded="true"] > .submenu{ display:block; }

  /* Parent-Links full-width Button */
  .menu > li > a{
    display:flex; align-items:center; justify-content:space-between;
    width:100%; padding:14px 16px;
    border-radius:12px;
  }

  /* kleiner Caret-Indicator rechts */
  .menu > li.menu-item-has-children > a::after{
    content:"▾";
    font-size:14px; opacity:.7; margin-left:10px;
    transition:transform .2s ease;
  }
  .menu li.is-open > a::after,
  .menu li[aria-expanded="true"] > a::after{ transform:rotate(180deg); }
}

/* === LOGO: niemals verzerren ======================================== */
.custom-logo,
.brand-logo img,
.brand .custom-logo{
  height:auto !important;
  width:auto !important;
  max-height:100px;          /* gleiche optische Höhe wie bisher */
  object-fit:contain !important;
  aspect-ratio:auto !important;
}
img.custom-logo[width][height]{ height:auto !important; } /* falls WP feste height setzt */

/* === EVENTS: in der Hero-Kachel nie abgeschnitten ==================== */
/* Ursache war die feste Quadrat-Höhe durch aspect-ratio. */
@media (max-width:980px){
  .hero-art{ aspect-ratio:auto !important; }
}
/* Sicherheit: Events-Container darf wachsen */
.hero .hero-art .events-in-hero{
  height:auto; max-height:none; overflow:visible;
}
