/* CSS Document */

/* Visually hidden (zugänglich, aber unsichtbar) */
.visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px;
  margin: -1px; padding: 0; border: 0;
  clip: rect(0 0 0 0); overflow: hidden; white-space: nowrap;
}

/* Skip-Link sichtbar beim Fokus */
.skip-link:focus {
  position: absolute; top: 0.5rem; left: 0.5rem; z-index: 1000;
  padding: 0.5rem 0.75rem; background: #fff; border: 2px solid currentColor;
}

/* Fokus klar sichtbar machen */
.site-nav a:focus-visible,
.site-nav button:focus-visible {
  outline: 3px solid currentColor;
  outline-offset: 2px;
}

/* Grundlayout */
.site-nav .main-menu { list-style: none; margin: 0; padding: 0; display: flex; gap: 1rem; }
.site-nav .main-menu > li { position: relative; }
.site-nav .menu-link { text-decoration: none; }

/* Toggle-Button neutral stylen (optisch ans Link-Label anpassbar) */
.submenu-toggle {
  background: transparent; border: 0; padding: 0 0 0 .25rem; cursor: pointer;
}

/* Chevron optional drehen, wenn geöffnet */
.submenu-toggle[aria-expanded="true"] .chevron { transform: rotate(180deg); }

/* Submenü-Panel 
.sub-menu {
  position: absolute; left: 0; top: 100%;
  list-style: none; margin: 0; padding: 0.5rem 0;
  min-width: 12rem; background: #fff; box-shadow: 0 8px 24px rgba(0,0,0,.12);
}*/

/* Wenn [hidden], bleibt es aus dem Flow und für Screenreader versteckt 
.sub-menu[hidden] { display: none;}*/