/* =============================================================================
   PP-MG.DE (Karriere) · Hüllen-Basis (nur wenn Theme ppmg-huelle aktiv)
   Datei:   ppmg-huelle.css      Version: 0.1.0 (2026-09-28)

   ZWECK: die wenigen Regeln, die bisher das Theme mitgebracht hat —
   Bildschirmleser-Text, Skip-Link, Grund-Anker, 404-Baustein. Die Optik
   der Seiten kommt aus deren eigenem Markup/CSS; der Fuss aus
   huelle/fuss.html (traegt sein CSS inline mit).

   CHANGELOG (neueste zuerst · historische Einträge NIE umschreiben)
   --------------------------------------------------------------------------
   0.1.0 · 2026-09-28 — Erste Fassung.
   ============================================================================= */

.screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%);
  border: 0; word-wrap: normal !important;
}
.skip-link:focus, .screen-reader-text:focus {
  clip: auto !important; clip-path: none;
  width: auto; height: auto; margin: 0;
  display: block; padding: 8px 12px; z-index: 100000;
  background: #fff; color: #000; font-weight: 600;
}

html { -webkit-text-size-adjust: 100%; }
body { margin: 0; }
img { max-width: 100%; height: auto; }
main#content { display: block; }
main#content:focus { outline: none; }

/* 404-Baustein (huelle/404.html) */
.ppmg-404 { max-width: 720px; margin: 0 auto; padding: 72px 24px 88px; text-align: center; }
.ppmg-404-kicker { text-transform: uppercase; letter-spacing: 0.08em; font-size: 13px; color: #4d797c; font-weight: 700; margin: 0 0 10px; }
.ppmg-404-titel { margin: 0 0 14px; font-size: 2rem; line-height: 1.2; }
.ppmg-404-text { margin: 0 0 26px; font-size: 1.05rem; line-height: 1.55; }
.ppmg-404-links { display: flex; gap: 18px; justify-content: center; align-items: center; flex-wrap: wrap; }
.ppmg-404-button { display: inline-block; padding: 13px 26px; background: #4d797c; color: #fff; text-decoration: none; border-radius: 8px; font-weight: 700; }
.ppmg-404-button:hover, .ppmg-404-button:focus { background: #3f6467; color: #fff; }
.ppmg-404-link { color: #4d797c; font-weight: 600; }

@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }