/* Moderne, responsive Joomla-Navigation – bewusst auf .modern-* begrenzt */
:root {
  --nav-bg: #ffffff;
  --nav-text: #243a45;
  --nav-muted: #657680;
  --nav-accent: #147d82;
  --nav-accent-soft: #e9f5f3;
  --nav-border: #e6ecec;
  --nav-shadow: 0 12px 34px rgba(16, 40, 48, .10);
  --nav-height: 86px;
}
.modern-header, .modern-header * { box-sizing: border-box; }
.modern-header { position: relative; z-index: 1000; width: 100%; background: var(--nav-bg); border-bottom: 1px solid var(--nav-border); color: var(--nav-text); font-family: Arial, Helvetica, sans-serif; }
.modern-header__inner { width: min(100% - 40px, 1200px); min-height: var(--nav-height); margin: 0 auto; display: flex; align-items: center; gap: clamp(16px, 3vw, 44px); }
.modern-brand { flex: 0 1 auto; min-width: 0; }
.modern-brand__link { display: inline-flex; flex-direction: column; justify-content: center; text-decoration: none !important; }
.modern-brand__link img { max-width: min(260px, 35vw); max-height: 65px; width: auto; height: auto; object-fit: contain; }
.modern-brand__name { color: #203944; font-weight: 750; font-size: clamp(17px, 1.5vw, 23px); letter-spacing: -.035em; line-height: 1.12; }
.modern-brand__subtitle { margin-top: 3px; color: var(--nav-muted); font-size: 12px; letter-spacing: .045em; }
.modern-nav { margin-left: auto; min-width: 0; }
.modern-nav__scroll { display: flex; justify-content: flex-end; }
/* Joomla rendert häufig div.moduletable > ul.nav. */
.modern-nav .moduletable, .modern-nav .moduletable_menu, .modern-nav .moduletable-menu { margin: 0; padding: 0; }
.modern-nav .moduletable > h3, .modern-nav .moduletable_menu > h3 { display: none; }
.modern-nav ul { list-style: none; margin: 0; padding: 0; }
.modern-nav > .modern-nav__scroll > ul,
.modern-nav > .modern-nav__scroll > [class*="moduletable"] > ul { display: flex; align-items: center; gap: 4px; }
.modern-nav li { position: relative; margin: 0; padding: 0; list-style: none; }
.modern-nav a { display: block; padding: 12px 15px; border-radius: 12px; color: var(--nav-text) !important; background: transparent; font-size: 14px; font-weight: 600; line-height: 1.4; white-space: nowrap; text-decoration: none !important; transition: background-color .2s, color .2s; }
.modern-nav a:hover, .modern-nav li.active > a, .modern-nav li.current > a, .modern-nav li.alias-parent-active > a { color: var(--nav-accent) !important; background: var(--nav-accent-soft); }
.modern-nav li.parent > a, .modern-nav li:has(> ul) > a { padding-right: 32px; }
.modern-nav li > ul { position: absolute; top: calc(100% + 6px); left: 0; z-index: 20; min-width: 225px; padding: 8px; border: 1px solid var(--nav-border); border-radius: 16px; background: white; box-shadow: var(--nav-shadow); opacity: 0; visibility: hidden; transform: translateY(7px); transition: opacity .18s, transform .18s, visibility .18s; }
.modern-nav li > ul li > ul { top: -9px; left: calc(100% + 9px); }
.modern-nav li:hover > ul, .modern-nav li:focus-within > ul, .modern-nav li.is-submenu-open > ul { opacity: 1; visibility: visible; transform: translateY(0); }
.modern-nav li > ul a { padding: 11px 13px; font-size: 13px; white-space: normal; }
.modern-submenu-toggle { position: absolute; top: 9px; right: 6px; display: grid; place-items: center; width: 28px; height: 28px; padding: 0; border: 0; border-radius: 7px; background: transparent; color: var(--nav-muted); cursor: pointer; }
.modern-submenu-toggle::after { content: ""; width: 7px; height: 7px; border-right: 1.8px solid currentColor; border-bottom: 1.8px solid currentColor; transform: rotate(45deg) translateY(-2px); }
.modern-submenu-toggle[aria-expanded="true"]::after { transform: rotate(225deg) translate(-2px, -2px); }
.modern-nav li > ul .modern-submenu-toggle { top: 7px; }
.modern-menu-toggle { display: none; align-items: center; gap: 10px; padding: 10px 13px; border: 1px solid var(--nav-border); border-radius: 12px; background: #fff; color: var(--nav-text); font-weight: 700; cursor: pointer; }
.modern-menu-toggle__lines { display: flex; width: 21px; flex-direction: column; gap: 4px; }
.modern-menu-toggle__lines span { display: block; width: 100%; height: 2px; background: currentColor; border-radius: 3px; transition: transform .2s, opacity .2s; }
.modern-nav-backdrop { display: none; }
.modern-subnav { border-top: 1px solid #eff2f3; background: #f7faf9; }
.modern-subnav__inner { width: min(100% - 40px, 1200px); margin: auto; display: flex; align-items: center; gap: 20px; padding: 10px 0; }
.modern-subnav__label { font-weight: 700; font-size: 13px; }
.modern-subnav__links { margin-left: auto; }
.modern-subnav__links ul { list-style: none; display: flex; flex-wrap: wrap; gap: 8px 20px; padding: 0; margin: 0; }
.modern-subnav a { color: var(--nav-text); text-decoration: none; font-size: 13px; }
.modern-subnav a:hover { color: var(--nav-accent); }
.modern-header a:focus-visible, .modern-header button:focus-visible { outline: 3px solid var(--nav-accent); outline-offset: 3px; }
@media (max-width: 1020px) {
  .modern-header__inner { width: min(100% - 30px, 1200px); min-height: 74px; }
  .modern-brand__link img { max-width: min(225px, 56vw); max-height: 56px; }
  .modern-menu-toggle { display: inline-flex; margin-left: auto; }
  .modern-nav { position: fixed; z-index: 1003; top: 0; right: 0; bottom: 0; width: min(88vw, 385px); margin: 0; padding: 82px 20px 24px; overflow-y: auto; background: #fff; box-shadow: -18px 0 40px rgba(0,0,0,.12); transform: translateX(105%); visibility: hidden; transition: transform .25s ease, visibility .25s; overscroll-behavior: contain; }
  .modern-header.is-menu-open .modern-nav { transform: translateX(0); visibility: visible; }
  .modern-header.is-menu-open .modern-menu-toggle { position: fixed; top: 17px; right: 18px; z-index: 1004; }
  .modern-header.is-menu-open .modern-menu-toggle__lines span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
  .modern-header.is-menu-open .modern-menu-toggle__lines span:nth-child(2) { opacity: 0; }
  .modern-header.is-menu-open .modern-menu-toggle__lines span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
  .modern-nav__scroll, .modern-nav > .modern-nav__scroll > ul, .modern-nav > .modern-nav__scroll > [class*="moduletable"] > ul { display: block; width: 100%; }
  .modern-nav li { width: 100%; }
  .modern-nav a { padding: 15px 44px 15px 14px; font-size: 16px; white-space: normal; }
  .modern-nav li > ul, .modern-nav li > ul li > ul { display: none; position: static; min-width: 0; width: 100%; margin: 2px 0 8px 9px; padding: 3px 0 3px 10px; border: 0; border-left: 2px solid var(--nav-border); border-radius: 0; box-shadow: none; opacity: 1; visibility: visible; transform: none; transition: none; }
  .modern-nav li:hover > ul, .modern-nav li:focus-within > ul { display: none; }
  .modern-nav li.is-submenu-open > ul, .modern-nav li.is-submenu-open:hover > ul, .modern-nav li.is-submenu-open:focus-within > ul { display: block; }
  .modern-submenu-toggle, .modern-nav li > ul .modern-submenu-toggle { top: 8px; right: 6px; width: 38px; height: 38px; }
  .modern-nav-backdrop { position: fixed; z-index: 999; inset: 0; background: rgba(14, 34, 42, .46); }
  body.modern-menu-active { overflow: hidden; }
  body.modern-menu-active .modern-nav-backdrop { display: block; }
  .modern-subnav__inner { width: min(100% - 30px, 1200px); flex-wrap: wrap; gap: 8px 20px; }
  .modern-subnav__links { margin-left: 0; }
}
@media (max-width: 480px) {
  .modern-brand__name { font-size: 17px; }
  .modern-brand__subtitle { font-size: 11px; }
  .modern-menu-toggle__label { display: none; }
  .modern-menu-toggle { padding: 12px; }
}
@media (prefers-reduced-motion: reduce) { .modern-header *, .modern-nav-backdrop { transition: none !important; scroll-behavior: auto !important; } }
