/* Energieexperte NRW: main menu with grouped landing pages (start page and all landing pages) */
html { scroll-padding-top: 96px; }
.nav { position: sticky; top: 0; z-index: 40; background: #ffffff; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-block: 14px; transition: box-shadow 200ms ease; }
.nav.scrolled { box-shadow: 0 6px 24px rgba(15, 39, 71, 0.08); } /* taste-skill-ignore: sticky bar */
.nav-mark { display: inline-flex; align-items: center; gap: 12px; font-weight: 600; text-decoration: none; letter-spacing: -0.01em; color: #0f2747; white-space: nowrap; }
.nav-mark img { width: 44px; height: auto; }
.nav-menu { display: flex; align-items: center; gap: 22px; }
.nav-list { display: flex; align-items: center; gap: 2px; list-style: none; margin: 0; padding: 0; }
.nav-list > li > a, .sub-toggle { display: inline-flex; align-items: center; gap: 8px; padding: 10px 12px; font: inherit; font-size: 0.9375rem; font-weight: 500; color: #0f2747; text-decoration: none; background: none; border: 0; cursor: pointer; transition: background-color 160ms ease; }
.nav-list > li > a:hover, .sub-toggle:hover, .has-sub.open > .sub-toggle { background: #eef2f7; }
.nav-list a[aria-current="page"], .has-sub.current > .sub-toggle { text-decoration: underline; text-decoration-thickness: 2px; text-decoration-color: #f6b40e; text-underline-offset: 0.45em; }
.sub-toggle::after { content: ""; width: 6px; height: 6px; margin-top: -3px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform 200ms ease; }
.has-sub.open > .sub-toggle::after { transform: translateY(3px) rotate(225deg); }
.has-sub { position: relative; }
.sub { position: absolute; top: calc(100% + 6px); left: 0; z-index: 41; display: none; list-style: none; margin: 0; padding: 10px; min-width: 330px; background: #ffffff; box-shadow: 0 18px 50px rgba(15, 39, 71, 0.18); } /* taste-skill-ignore: dropdown menu */
.sub.wide { width: 620px; grid-template-columns: 1fr 1fr; }
.has-sub.open > .sub { display: grid; }
.sub a { display: grid; gap: 2px; padding: 11px 12px; text-decoration: none; color: #0f2747; transition: background-color 160ms ease; }
.sub a:hover, .sub a:focus-visible { background: #eef2f7; }
.sub a b { font-size: 0.9375rem; font-weight: 600; }
.sub a span { font-size: 0.8125rem; color: #4a5d78; line-height: 1.35; }
.sub a[aria-current="page"] b { text-decoration: underline; text-decoration-color: #f6b40e; text-decoration-thickness: 2px; text-underline-offset: 0.3em; }
.sub .sub-all { grid-column: 1 / -1; background: #eef2f7; }
.nav-tel { font-weight: 600; font-size: 0.9375rem; text-decoration: none; color: #0f2747; white-space: nowrap; }
.nav-tel:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.nav .button { min-height: 2.5rem; padding: 0 1rem; font-size: 0.9375rem; }
.nav-toggle { display: none; align-items: center; gap: 10px; min-height: 2.75rem; padding: 0 14px; font: inherit; font-weight: 600; color: #0f2747; background: #eef2f7; border: 0; cursor: pointer; }
.nav-toggle i { position: relative; width: 18px; height: 2px; background: currentColor; transition: background-color 200ms ease; }
.nav-toggle i::before, .nav-toggle i::after { content: ""; position: absolute; left: 0; width: 18px; height: 2px; background: currentColor; transition: transform 200ms ease; }
.nav-toggle i::before { top: -6px; } .nav-toggle i::after { top: 6px; }
.nav-toggle[aria-expanded="true"] i { background: transparent; }
.nav-toggle[aria-expanded="true"] i::before { transform: translateY(6px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] i::after { transform: translateY(-6px) rotate(-45deg); }

@media (max-width: 1180px) and (min-width: 1081px) { .nav-tel { display: none; } }
@media (max-width: 1080px) {
  .nav-toggle { display: inline-flex; }
  .nav-menu { display: none; position: fixed; inset: 72px 0 0 0; z-index: 39; background: #ffffff; overflow-y: auto; flex-direction: column; align-items: stretch; gap: 20px; padding: 12px max(20px, env(safe-area-inset-right, 0px)) 40px max(20px, env(safe-area-inset-left, 0px)); }
  .menu-open .nav-menu { display: flex; }
  .menu-open, .menu-open body { overflow: hidden; }
  .nav-list { flex-direction: column; align-items: stretch; gap: 4px; }
  .nav-list > li > a, .sub-toggle { width: 100%; justify-content: space-between; padding: 14px 4px; font-size: 1.125rem; }
  .sub-toggle { cursor: default; pointer-events: none; font-weight: 700; }
  .sub-toggle::after { display: none; }
  .sub, .sub.wide { position: static; display: grid; width: auto; min-width: 0; grid-template-columns: 1fr; padding: 0 0 8px; background: #f6f8fb; filter: none; }
  .nav-menu .sub { box-shadow: 0 0 0 0 transparent; } /* taste-skill-ignore: reset of the dropdown overlay */
  .nav-menu .nav-tel { font-size: 1.125rem; }
  .nav-menu .button { min-height: 3rem; font-size: 1rem; }
}
@media (max-width: 420px) { .nav-mark span { display: none; } }