/* AU-3: die **Seite** um den Inhalt der Über-Seite — nur auf der öffentlichen Seite `/about`,
   nicht in der Anwendung. Hintergrund, Seitenränder und Breite wie `legal.css`, dazu die Verweise
   auf Hilfe und Rechtstexte. Den Inhalt selbst (Karten, Schrift) gestaltet `about-content.css`.
   Liegt außerhalb von `/assets/*` und ist für Sammler freigegeben (Punkt 4a). */
body.about-document {
  min-height: 100vh;
  margin: 0;
  background:
    radial-gradient(circle at top right, rgba(244, 144, 6, 0.13), transparent 34rem),
    linear-gradient(180deg, #fff1e8 0, #fff8f5 24rem);
}

/* Dieselben Maße wie `main` in `legal.css`. */
.about-main {
  box-sizing: border-box;
  width: min(100%, 980px);
  margin: 0 auto;
  padding: 40px 20px 56px;
}

/* Punkt 1: Verweise auf Hilfe und Rechtstexte — in der Anwendung überflüssig. */
.about-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px 18px;
  padding: 20px 12px 0;
  font-family: system-ui, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  font-size: 0.95rem;
}
.about-links a { color: #8c5000; text-underline-offset: 0.2em; }
.about-links a:hover { color: #6a3b00; }
.about-links a:focus-visible {
  border-radius: 4px;
  outline: 3px solid #006591;
  outline-offset: 3px;
}

@media (max-width: 600px) {
  .about-main { padding: 20px 12px 36px; }
}

@media print {
  body.about-document { background: none; }
  .about-links { display: none; }
}