/* app.css — Projekt-Ergaenzungen VOR dem Mockup-CSS (site.css).
   Enthaelt nur: self-hosted Inter (@font-face), A11y-Skip-Link und einen
   sichtbaren Tastatur-Fokus. Keine Design-Aenderungen am Mockup. */

/* Inter Variable, self-hosted -> kein Google-Fonts-Request (DSGVO), 1 Datei
   deckt alle Schnitte 100..900 ab. swap = kein FOIT, Text sofort sichtbar. */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url('/fonts/inter-variable.woff2') format('woff2');
}

/* Skip-Link: erst bei Tastatur-Fokus sichtbar (WCAG 2.4.1 Bypass Blocks). */
.skip-link {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100000;
  margin: 10px;
  padding: 12px 18px;
  border-radius: 12px;
  background: #ffb86b;
  color: #050505;
  font-weight: 700;
  text-decoration: none;
  transform: translateY(-160%);
  transition: transform 0.18s ease;
}
.skip-link:focus {
  transform: translateY(0);
  outline: 2px solid #050505;
  outline-offset: 2px;
}

/* Sichtbarer Tastatur-Fokus ohne Maus-Fokus-Ringe zu erzwingen. */
:focus-visible {
  outline: 2px solid #ffb86b;
  outline-offset: 3px;
  border-radius: 6px;
}