/* ============================================================
   DATENSCHUTZ — nur was diese Seite allein braucht

   Herausgelöst aus dem <style>-Block der Seite. Was hier steht und auch
   anderswo gebraucht wird, gehört nach bausteine.css; was Farbe, Abstand
   oder Dauer festlegt, gehört an ein Token in stil.css.
   ============================================================ */


main{max-width:760px;margin:0 auto;padding:64px 28px 96px}
main h1{font-size:clamp(30px,5vw,46px);letter-spacing:-.02em;margin-bottom:12px}
main h2{font-size:22px;margin:44px 0 12px}
main h3{font-size:17px;margin:26px 0 8px}
main p,main li{color:var(--text-mute);font-size:16px}
main ul{padding-left:22px}
main li{margin-bottom:8px}
main table{width:100%;border-collapse:collapse;margin:16px 0;font-size:15px}
main th,main td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--linie);vertical-align:top}
main th{font-family:var(--ff-display);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-leise)}

/* Eine vierspaltige Tabelle passt auf kein Telefon. Sie zu Karten
   umzubrechen wäre möglich, würde aber den Spaltenvergleich zerstören —
   und genau darum geht es hier: Daten gegen Rechtsgrundlage gegen
   Speicherdauer. Also rollt die Tabelle für sich, nicht die Seite.
   `-webkit-overflow-scrolling` sorgt auf iOS für den gewohnten Schwung. */
.tabelle-rollt{
  overflow-x:auto; -webkit-overflow-scrolling:touch;
  margin:16px -4px; padding:0 4px;
}
.tabelle-rollt table{margin:0;min-width:520px}
.tabelle-rollt + .rollhinweis{
  font-size:12.5px;color:var(--text-leise);margin:-8px 0 20px;display:none;
}
@media (max-width:640px){
  main{padding:44px 20px 72px}
  .tabelle-rollt + .rollhinweis{display:block}
}
/* `.platzhalter` und `.marke-luecke` sind entfallen. Sie gehörten zu den
   eckigen Klammern und dem Hinweiskasten „Noch unvollständig" — beides
   war ein Zustand, kein Bauteil. Der Zustand ist vorbei, also gehen die
   Regeln mit. Eine CSS-Regel ohne Element im HTML ist genau die tote
   Masse, aus der die Unordnung entsteht, die hier gerade aufgeräumt
   wurde. */
.stand{font-size:14px;color:var(--text-leise);margin-bottom:36px}
