/* ==========================================================================
   Impressum, Datenschutz und Fehlerseiten (404/500)
   ========================================================================== */

/* ---------- gemeinsamer Fließtext ---------- */
.legal-section { padding-top: clamp(32px, 5vw, 56px); }
.legal-doc { min-width: 0; max-width: 72ch; }
.legal-doc h2 {
  font-size: clamp(1.45rem, 2.4vw, 1.85rem); margin-top: 0; padding-top: 0.2em;
  scroll-margin-top: calc(var(--header-h) + 24px);
}
.legal-doc > section { scroll-margin-top: calc(var(--header-h) + 24px); }
.legal-doc > section + section { margin-top: clamp(40px, 5vw, 56px); padding-top: clamp(28px, 4vw, 40px); border-top: 1px solid var(--line); }
.legal-doc > section > * + * { margin-top: 0.9em; }
.legal-doc h2 + * { margin-top: 0.7em; }
.legal-doc > h2:not(:first-child) { margin-top: 1.9em; }
.legal-doc ul:not([role='list']) { padding-left: 1.3em; }
.legal-doc ul[role='list'] { padding-left: 0; }
.legal-doc ul:not([role='list']) li + li { margin-top: 0.5em; }
.legal-address { font-style: normal; line-height: 1.7; color: var(--ink); }

.legal-cross {
  display: flex; gap: 12px; align-items: flex-start; margin-top: 2.2em !important; padding: 16px 18px; border-radius: var(--r);
  border: 1px solid rgba(108, 200, 255, 0.22); background: var(--frost-wash); color: var(--ink-2);
}
.legal-cross .icon { color: var(--frost); margin-top: 4px; flex-shrink: 0; }

/* ---------- Impressum ---------- */
.legal-imprint { display: grid; gap: clamp(36px, 5vw, 64px); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 980px) {
  .legal-imprint { grid-template-columns: minmax(0, 420px) minmax(0, 1fr); align-items: start; }
  .legal-paper { position: sticky; top: calc(var(--header-h) + 24px); }
}
.legal-paper {
  padding: clamp(30px, 4vw, 44px) clamp(26px, 4vw, 40px);
  font-size: 1rem; line-height: 1.65;
}
/* leicht schief abgelegt – erst ab Tablet, damit am Handy nichts über den Rand ragt */
@media (min-width: 720px) { .legal-paper { transform: rotate(-0.6deg); } }
.legal-paper > * + * { margin-top: 0.8em; }
.legal-paper-kicker {
  font: 400 0.76rem/1 var(--f-western); letter-spacing: 0.14em; text-transform: uppercase; color: var(--paper-red);
}
.legal-paper-title { font-size: clamp(1.5rem, 3vw, 1.9rem); color: var(--paper-ink); margin-top: 0.35em; }
.legal-paper-sub {
  margin-top: 1.6em !important; padding-top: 1em; border-top: 1px dashed rgba(90, 61, 32, 0.35);
  font: 700 0.8rem/1.4 var(--f-label); letter-spacing: 0.14em; text-transform: uppercase; color: var(--paper-ink-2);
}
.legal-paper .legal-address { color: var(--paper-ink); font-family: var(--f-type); font-size: 1.02rem; }
.legal-paper p { color: var(--paper-ink-2); }
.legal-paper a { color: var(--paper-red); text-decoration: underline; text-decoration-color: rgba(158, 42, 31, 0.4); }
.legal-paper a:hover { color: var(--paper-ink); }
.legal-paper-link { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; }
.legal-paper :focus-visible { outline-color: var(--paper-red); }
@media (prefers-reduced-motion: reduce) { .legal-paper { transform: none; } }

/* ---------- Datenschutz: Inhaltsverzeichnis + Text ---------- */
.legal-layout { display: grid; gap: clamp(32px, 5vw, 64px); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1020px) {
  .legal-layout { grid-template-columns: 260px minmax(0, 1fr); align-items: start; }
  .legal-toc { position: sticky; top: calc(var(--header-h) + 24px); max-height: calc(100vh - var(--header-h) - 48px); overflow-y: auto; }
}
.legal-toc {
  padding: 18px; border-radius: var(--r); border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(24, 35, 49, 0.7), rgba(13, 20, 29, 0.7));
}
.legal-toc-title { font: 700 0.8rem/1 var(--f-label); letter-spacing: 0.22em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 12px; }
.legal-toc ol { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2px; margin: 0; }
@media (min-width: 600px) and (max-width: 1019px) { .legal-toc ol { grid-template-columns: 1fr 1fr; column-gap: 16px; } }
.legal-toc a {
  display: flex; align-items: baseline; gap: 10px; padding: 7px 8px; border-radius: 6px; color: var(--ink-2); font-size: 0.95rem; line-height: 1.35;
  transition: background-color 0.2s, color 0.2s;
}
.legal-toc a:hover { background: var(--frost-wash); color: var(--ink); }
.legal-toc-num { font: 700 0.78rem/1 var(--f-label); color: var(--frost); font-variant-numeric: tabular-nums; flex-shrink: 0; }

.legal-facts { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); margin-top: 1.2em !important; }
.legal-fact {
  display: flex; gap: 12px; align-items: flex-start; padding: 16px; border-radius: var(--r);
  background: linear-gradient(180deg, rgba(24, 35, 49, 0.85), rgba(13, 20, 29, 0.85)); border: 1px solid var(--line);
}
.legal-fact-icon {
  display: grid; place-items: center; flex-shrink: 0; width: 40px; height: 40px; border-radius: 11px;
  color: var(--ok); background: var(--ok-wash); border: 1px solid rgba(79, 220, 155, 0.25);
}
.legal-fact strong { display: block; color: var(--ink); font-size: 1rem; line-height: 1.3; }
.legal-fact span > span { display: block; margin-top: 3px; font-size: 0.92rem; line-height: 1.5; color: var(--ink-3); }

.legal-table-wrap { overflow-x: auto; border-radius: var(--r); border: 1px solid var(--line); background: rgba(7, 11, 17, 0.45); }
.legal-table { font-size: 0.94rem; min-width: 480px; }
.legal-table td { vertical-align: top; line-height: 1.55; }
.legal-table td:first-child { color: var(--ink); white-space: nowrap; }
.legal-table td:last-child { min-width: 170px; }
@media (max-width: 640px) {
  /* auf schmalen Bildschirmen als gestapelte Karten statt Querscrollen */
  .legal-table-wrap { overflow: visible; border: 0; background: none; }
  .legal-table { min-width: 0; }
  .legal-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); }
  .legal-table, .legal-table tbody, .legal-table tr, .legal-table td { display: block; width: 100%; }
  .legal-table tr { padding: 14px 16px; border-radius: var(--r); border: 1px solid var(--line); background: rgba(7, 11, 17, 0.45); }
  .legal-table tr + tr { margin-top: 10px; }
  .legal-table td { padding: 0; border: 0; white-space: normal !important; }
  .legal-table td + td { margin-top: 6px; }
  .legal-table td:first-child { font-weight: 600; }
  .legal-table td:last-child { color: var(--frost-hi); font: 600 0.86rem/1.4 var(--f-label); letter-spacing: 0.08em; text-transform: uppercase; }
}

.legal-rights { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; margin-top: 0.8em; }
.legal-rights li { position: relative; padding-left: 26px; }
.legal-rights li::before {
  content: ''; position: absolute; left: 4px; top: 0.62em; width: 8px; height: 8px; border-radius: 2px; transform: rotate(45deg);
  background: var(--frost); box-shadow: 0 0 10px var(--frost-glow);
}

/* ---------- Fehlerseiten ---------- */
.errpage {
  position: relative; isolation: isolate; overflow: hidden;
  min-height: 100vh; min-height: 100svh; display: grid; align-items: center;
  padding: calc(var(--header-h) + 48px) 0 clamp(96px, 14vw, 150px);
  background: var(--night-0);
}
.errpage-bg { position: absolute; inset: 0; z-index: -2; }
.errpage-bg picture, .errpage-bg img { width: 100%; height: 100%; }
.errpage-bg img { object-fit: cover; object-position: 70% 50%; opacity: 0.6; }
.errpage::after {
  content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background:
    linear-gradient(90deg, rgba(4, 7, 11, 0.92) 0%, rgba(4, 7, 11, 0.7) 45%, rgba(4, 7, 11, 0.2) 100%),
    linear-gradient(180deg, rgba(4, 7, 11, 0.5) 0%, transparent 30%, transparent 70%, var(--night-1) 100%);
}
.errpage-inner { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); justify-items: start; gap: 18px; }
.errpage-inner > * { max-width: 640px; }
.errpage-inner h1 { font-size: clamp(2.6rem, 7vw, 5rem); }
.errpage-inner .lead { color: var(--ink-2); }
.errpage-emblem img { width: 84px; height: 84px; filter: drop-shadow(0 8px 26px rgba(108, 200, 255, 0.35)); }
.errpage-code {
  position: absolute; z-index: -1; right: 0; top: 50%; transform: translateY(-50%) rotate(-4deg);
  font: 400 clamp(7rem, 26vw, 20rem)/0.8 var(--f-western); letter-spacing: 0.02em;
  color: transparent; -webkit-text-stroke: 2px rgba(234, 168, 85, 0.28);
  pointer-events: none; user-select: none; max-width: none !important;
}
@media (max-width: 760px) {
  .errpage-code { top: -8px; right: -10px; transform: rotate(-6deg); font-size: clamp(6rem, 34vw, 10rem); -webkit-text-stroke-width: 1.5px; opacity: 0.8; }
  .errpage::after { background: linear-gradient(180deg, rgba(4, 7, 11, 0.75) 0%, rgba(4, 7, 11, 0.8) 60%, var(--night-1) 100%); }
}
.errpage-links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
@media (max-width: 479px) { .errpage-links .btn { width: 100%; } }

/* rollender Steppenläufer */
.errpage-tumble {
  position: absolute; left: 0; bottom: clamp(18px, 4vw, 40px); z-index: 0; width: 120px; height: 120px;
  color: var(--paper-edge); opacity: 0.8; pointer-events: none;
  transform: translateX(-40vw);
  animation: errpage-roll 13s linear 1.2s infinite;
}
.errpage-tumble-hop { width: 100%; height: 100%; animation: errpage-hop 1.3s cubic-bezier(0.5, 0, 0.5, 1) infinite; }
.errpage-tumble svg { width: 100%; height: 100%; animation: errpage-spin 1.6s linear infinite; filter: drop-shadow(0 6px 6px rgba(0, 0, 0, 0.45)); }
@media (max-width: 760px) { .errpage-tumble { width: 76px; height: 76px; } }
@keyframes errpage-roll {
  0% { transform: translateX(-30vw); }
  100% { transform: translateX(130vw); }
}
@keyframes errpage-hop {
  0%, 100% { transform: translateY(0); }
  45% { transform: translateY(-38px); }
  55% { transform: translateY(-36px); }
}
@keyframes errpage-spin { to { transform: rotate(360deg); } }

/* 500: ruhiger, ohne Bewegung */
.errpage.is-quiet::after {
  background:
    radial-gradient(80% 90% at 20% 50%, rgba(4, 7, 11, 0.9), rgba(4, 7, 11, 0.45) 70%),
    linear-gradient(180deg, rgba(4, 7, 11, 0.5) 0%, transparent 30%, transparent 70%, var(--night-1) 100%);
}
.errpage.is-quiet .errpage-bg img { object-position: center 60%; opacity: 0.55; }

@media (prefers-reduced-motion: reduce) {
  .errpage-tumble { display: none; }
}
@media print {
  .errpage-tumble, .errpage-bg, .errpage-code { display: none !important; }
  .legal-toc { display: none; }
  .legal-paper { transform: none; box-shadow: none; }
}