/* ============================================================
   Polaris1 — Unterseiten (Impressum, Datenschutz, AGB).
   Gleiche Variablen, gleiche Typo wie die Startseite, nur ohne
   Hero und Animationen. Light ist Default, Dark folgt der Wahl,
   die auf der Startseite gespeichert wurde.
   ============================================================ */
:root {
  --bg: #ffffff; --panel: #fafbfc; --ink: #0c1524; --muted: #55606d;
  --faint: #7c8794; --line: #e5e9ee; --accent: #2f86c9; --red: #c2313b;
  --wide: 880px; --e: cubic-bezier(.22,.7,.2,1);
}
html.dark {
  --bg: #000000; --panel: #0a0b0e; --ink: #ffffff; --muted: rgba(255,255,255,.56);
  --faint: rgba(255,255,255,.34); --line: rgba(255,255,255,.11); --accent: #6cb6ec; --red: #ff6b6b;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
html { background: var(--bg); scroll-behavior: smooth; }
body {
  background: var(--bg); color: var(--ink);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased;
}
a { color: var(--accent); }
a:hover { color: #1d6ba8; }
html.dark a:hover { color: #9ed2f5; }
.wide { max-width: var(--wide); margin: 0 auto; padding: 0 clamp(1.25rem, 5vw, 2.5rem); }

header { border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 10;
  background: color-mix(in oklab, var(--bg) 92%, transparent);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
.hbar { max-width: var(--wide); margin: 0 auto; padding: 1rem clamp(1.25rem, 5vw, 2.5rem);
  display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.logo {
  font-family: 'Orbitron', ui-monospace, monospace; font-weight: 700; font-size: 1.05rem;
  line-height: 1; text-transform: uppercase; color: var(--ink); text-decoration: none;
  display: flex; align-items: baseline;
}
.logo:hover { color: var(--ink); }
.logo .ostar { display: block; width: 1.28cap; height: 1cap; margin: 0 .09em; fill: currentColor; }
.back {
  font-family: ui-monospace, Menlo, monospace; font-size: .68rem; letter-spacing: .13em;
  text-transform: uppercase; text-decoration: none; color: var(--muted);
}
.back:hover { color: var(--ink); }

main { padding: clamp(3rem, 8vw, 6rem) 0 clamp(4rem, 10vw, 7rem); }
.ulabel { font-family: ui-monospace, Menlo, monospace; font-size: .66rem; letter-spacing: .2em;
  text-transform: uppercase; color: var(--faint); }
h1 { margin-top: 1.1rem; font-size: clamp(2rem, 5vw, 3rem); font-weight: 640;
  letter-spacing: -.035em; line-height: 1.06; }
.lede { margin-top: 1.2rem; color: var(--muted); font-size: 1.02rem; max-width: 40em; }
h2 { margin-top: clamp(2.5rem, 5vw, 3.5rem); font-size: 1.25rem; font-weight: 640; letter-spacing: -.02em; }
h3 { margin-top: 1.8rem; font-size: 1rem; font-weight: 620; }
p, ul, ol, dl { margin-top: .9rem; max-width: 42em; }
ul, ol { padding-left: 1.3rem; }
li { margin-top: .35rem; }
dl { display: grid; grid-template-columns: 13rem minmax(0, 1fr); gap: .5rem 1.5rem; }
@media (max-width: 620px) { dl { grid-template-columns: minmax(0, 1fr); gap: .1rem 0; } }
dt { font-family: ui-monospace, Menlo, monospace; font-size: .64rem; letter-spacing: .13em;
  text-transform: uppercase; color: var(--faint); padding-top: .25rem; }
dd { margin: 0; }

/* Technische Namen im Fliesstext -- Cookie-Namen, Speicherschluessel.
   Sie muessen als Zeichenkette lesbar sein, nicht als Wort. */
code {
  font-family: ui-monospace, Menlo, monospace; font-size: .88em;
  padding: .1em .35em; border-radius: 3px;
  background: rgba(12, 21, 36, .06); color: inherit;
}
@media (max-width: 620px) { dd { margin-bottom: .8rem; } }
hr { border: 0; border-top: 1px solid var(--line); margin: clamp(2.5rem, 5vw, 3.5rem) 0 0; }

/* Auszufuellende Stellen — im Browser sofort sichtbar, damit nichts
   uebersehen wird. Nach dem Ausfuellen verschwinden sie von selbst. */
.fill {
  background: color-mix(in oklab, var(--red) 12%, transparent);
  border-bottom: 1px dashed var(--red); color: var(--red);
  font-family: ui-monospace, Menlo, monospace; font-size: .88em; padding: 0 .25em;
}
.notice {
  margin-top: 2rem; border: 1px solid var(--red); border-radius: 6px;
  background: color-mix(in oklab, var(--red) 7%, transparent);
  padding: 1.1rem 1.3rem; font-size: .92rem; color: var(--ink); max-width: 42em;
}
.notice b { font-family: ui-monospace, Menlo, monospace; font-size: .7rem;
  letter-spacing: .14em; text-transform: uppercase; color: var(--red); display: block; margin-bottom: .5rem; }

footer { border-top: 1px solid var(--line); padding: 2rem 0 2.6rem; }
.fbottom { max-width: var(--wide); margin: 0 auto; padding: 0 clamp(1.25rem, 5vw, 2.5rem);
  display: flex; justify-content: space-between; flex-wrap: wrap; gap: .8rem 1.5rem;
  font-family: ui-monospace, Menlo, monospace; font-size: .62rem; letter-spacing: .13em;
  text-transform: uppercase; color: var(--faint); }
.fbottom a { color: var(--faint); text-decoration: none; }
.fbottom a:hover { color: var(--ink); }

/* Die Fussnote am Ende der Rechtstexte -- Versionsdatum und Hinweise. */
.fine {
  margin-top: 2.6rem; padding-top: 1.4rem; border-top: 1px solid var(--line);
  font-size: .82rem; color: var(--faint);
}