/* ============================================================
   Impro Hamburg – Basis-Stylesheet
   Das Layout der Seiten steckt in den style-Attributen im HTML
   (so kam es aus Claude Design). Hier stehen nur die Dinge,
   die sich mit style-Attributen nicht abbilden lassen:
   Grundwerte, Hover, Fokus, mobile Navigation, Druck.
   ============================================================ */

html, body { margin:0; padding:0; }
body {
  background:#EDEEE8;
  color:#221D2B;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  -webkit-font-smoothing:antialiased;
}
* { box-sizing:border-box; }
a { color:#11506B; text-decoration:underline; text-underline-offset:3px; }
a:hover { color:#221D2B; }
h1,h2,h3,h4 { margin:0; font-family:"Helvetica Neue", Helvetica, Arial, sans-serif; }
p { margin:0; text-wrap:pretty; }
ul { margin:0; }
summary { cursor:pointer; }
summary::-webkit-details-marker { display:none; }
:focus-visible { outline:3px solid #F6A722; outline-offset:3px; }
img, video { max-width:100%; }

/* --- Hover in Header und Footer (ersetzt style-hover) --- */
header nav a:hover,
footer a:hover { color:#F6A722; }

/* --- Sprunglink für Tastatur und Screenreader --- */
.skip-link {
  position:absolute; left:-9999px; top:0; z-index:999;
  background:#191420; color:#F9F9F6;
  padding:12px 20px; font-weight:700; text-decoration:none;
}
.skip-link:focus { left:0; }

/* --- Navigation: ab 900px waagerecht, darunter aufklappbar --- */
#nav-toggle { display:none; }
#hauptnavigation { display:flex; flex-direction:row; align-items:center; width:auto; padding:0; }

@media (max-width: 899px) {
  #nav-toggle { display:inline-flex; }
  #hauptnavigation { display:none; flex-direction:column; align-items:flex-start; width:100%; padding:12px 0 6px; }
  #hauptnavigation.is-open { display:flex; }
}

/* --- Bewegung reduzieren, wenn das System es verlangt --- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration:0.01ms !important; transition-duration:0.01ms !important; }
}

/* --- Druck --- */
@media print {
  header, footer, .skip-link, video, iframe { display:none !important; }
  body { background:#fff; color:#000; }
}