/* Stylesheet der Website-Datenschutzerklaerung (views/datenschutz/datenschutz-website.ejs).
 *
 * Warum es diese Datei gibt (2026-08-19): Die Seite liess ihre Klassen bis
 * dahin von cdn.tailwindcss.com im Browser erzeugen. Damit ging die IP jedes
 * Besuchers an einen Dritten, bevor irgendetwas gefragt wurde — ausgerechnet
 * auf der Seite, die den Datenschutz erklaert. Derselbe Grund, aus dem in #126
 * die Google Fonts rausgeflogen sind (LG Muenchen I, 3 O 17493/20).
 *
 * Warum von Hand und nicht gebaut: Die Seite benutzt 25 Klassen und aendert
 * sich zweimal im Jahr. Auf main gibt es keine Tailwind-Kette — kein
 * tailwind.config.js, kein build:css, keine devDependencies. Die kommt erst
 * mit dem Website-Relaunch (#71). Eine Build-Kette samt Abhaengigkeit nur fuer
 * dieses eine Dokument einzufuehren waere mehr Apparat als Inhalt, und die
 * Datei waere ohne sie nicht mehr nachvollziehbar.
 *
 * Die Werte sind die von Tailwind 3, damit die Seite aussieht wie vorher.
 * Wer hier eine Klasse ergaenzt, traegt sie unten nach; steht sie nicht drin,
 * wirkt sie nicht mehr stillschweigend, sondern gar nicht.
 *
 * Sobald #71 gemergt ist, kann die Seite auf /css/site.css umgestellt werden
 * und diese Datei entfallen.
 */

/* ── Grundlagen ──────────────────────────────────────────────────────────
   Der Teil von Tailwinds Preflight, den die Seite wirklich braucht. Ohne ihn
   traegt der Browser seine Standardgroessen fuer Ueberschriften und Listen
   bei, und das Layout stimmt nicht mehr: Die Klassen setzen Groessen in der
   Annahme, dass vorher nichts gesetzt war. */

*,
::before,
::after { box-sizing: border-box; }

html {
    -webkit-text-size-adjust: 100%;
    /* Ohne diese Zeile faellt der Browser auf seine Serifenschrift zurueck. */
    font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto,
                 "Helvetica Neue", Arial, "Noto Sans", sans-serif;
    line-height: 1.5;
}

body { margin: 0; line-height: inherit; }

h1, h2, h3 { font-size: inherit; font-weight: inherit; margin: 0; }
p, ul, ol { margin: 0; }
ul, ol { list-style: none; padding: 0; }

a { color: inherit; text-decoration: inherit; }
strong { font-weight: bolder; }

/* ── Klassen, alphabetisch ───────────────────────────────────────────── */

.bg-white       { background-color: #fff; }
.font-bold      { font-weight: 700; }
.font-semibold  { font-weight: 600; }
.font-mono      { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco,
                               Consolas, "Liberation Mono", "Courier New", monospace; }
.leading-7      { line-height: 1.75rem; }
.list-disc      { list-style-type: disc; }
.max-w-3xl      { max-width: 48rem; }
.mb-8           { margin-bottom: 2rem; }
.mt-2           { margin-top: 0.5rem; }
.mx-auto        { margin-left: auto; margin-right: auto; }
.pl-6           { padding-left: 1.5rem; }
.px-4           { padding-left: 1rem; padding-right: 1rem; }
.py-10          { padding-top: 2.5rem; padding-bottom: 2.5rem; }
.text-3xl       { font-size: 1.875rem; line-height: 2.25rem; }
.text-sm        { font-size: 0.875rem; line-height: 1.25rem; }
.text-xl        { font-size: 1.25rem; line-height: 1.75rem; }
.text-\[15px\]  { font-size: 15px; }
.tracking-tight { letter-spacing: -0.025em; }

/* Farben: slate aus Tailwind, primary-700 aus der Projekt-Palette
   (tailwind.config.js auf dem Relaunch-Branch, brand/primary 700). */
.text-slate-500   { color: #64748b; }
.text-slate-800   { color: #1e293b; }
.text-primary-700 { color: #0b57b4; }

/* space-y-6 setzt den Abstand zwischen Geschwistern, nicht am Element selbst.
   Deshalb der Nachbar-Selektor und nicht schlicht margin-top. */
.space-y-6 > :not([hidden]) ~ :not([hidden]) { margin-top: 1.5rem; }

/* ── Ab 640 px ───────────────────────────────────────────────────────── */
@media (min-width: 640px) {
    .sm\:px-6     { padding-left: 1.5rem; padding-right: 1.5rem; }
    .sm\:text-4xl { font-size: 2.25rem; line-height: 2.5rem; }
}

/* ── Ab 1024 px ──────────────────────────────────────────────────────── */
@media (min-width: 1024px) {
    .lg\:px-8 { padding-left: 2rem; padding-right: 2rem; }
}
