/*
  Kunde:   Marco Groß · Antreiber-Test
  Datei:   _preview/legal.css  (Impressum + Datenschutz)
  Version: v0.1 · 2026-06-02
  Design:  Brand-Tokens + Roboto/Montserrat (wie index/style.css)
*/
@font-face { font-family:'Roboto'; font-weight:700; font-display:swap; src:url('fonts/roboto-v51-latin-700.woff2') format('woff2'); }
@font-face { font-family:'Montserrat'; font-weight:400; font-display:swap; src:url('fonts/montserrat-v31-latin-regular.woff2') format('woff2'); }
@font-face { font-family:'Montserrat'; font-weight:600; font-display:swap; src:url('fonts/montserrat-v31-latin-600.woff2') format('woff2'); }

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

:root {
  --ws-primary:    #7FAEBD;
  --ws-secondary:  #FC8D29;
  --ws-text:       #374F57;
  --ws-text-muted: rgba(55,79,87,0.62);
  --ws-bg:         #FAF8F4;
  --ws-bg-deep:    #2F4853;
  --ws-border:     rgba(55,79,87,0.12);
  --ws-font-h:     'Roboto', system-ui, -apple-system, sans-serif;
  --ws-font-body:  'Montserrat', system-ui, -apple-system, sans-serif;
  --ws-max-w:      720px;
}
html { font-size: 16px; -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--ws-font-body); color: var(--ws-text); background: var(--ws-bg);
  line-height: 1.7; min-height: 100svh; display: flex; flex-direction: column;
}

.ws-imp-nav {
  position: sticky; top: 0; z-index: 10;
  background: rgba(250,247,242,0.85); backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--ws-border);
  padding: 12px 24px; display: flex; align-items: center; gap: 16px;
}
.ws-imp-nav__logo { height: 32px; width: auto; display: block; }
.ws-imp-nav__back {
  margin-left: auto; font-size: 14px; font-weight: 600; color: var(--ws-text-muted);
  text-decoration: none; transition: color 0.2s;
}
.ws-imp-nav__back:hover { color: var(--ws-secondary); }

.ws-imp-main { flex: 1; max-width: var(--ws-max-w); width: 100%; margin: 0 auto; padding: 52px 24px 80px; }
.ws-imp-main h1 {
  font-family: var(--ws-font-h); font-weight: 700; font-size: clamp(28px, 4vw, 40px);
  line-height: 1.15; letter-spacing: -0.01em; margin-bottom: 8px;
}
.ws-imp-sub {
  font-size: 14px; color: var(--ws-text-muted); margin-bottom: 44px;
  padding-bottom: 28px; border-bottom: 1px solid var(--ws-border);
}

.ws-imp-section { margin-bottom: 38px; }
.ws-imp-section h2 {
  font-family: var(--ws-font-h); font-weight: 700; font-size: 1.25rem;
  color: var(--ws-text); margin-bottom: 14px;
}
.ws-imp-section h3 {
  font-family: var(--ws-font-body); font-weight: 600; font-size: 1rem;
  color: var(--ws-text); margin: 18px 0 6px;
}
.ws-imp-section p, .ws-imp-section li { font-size: 15px; line-height: 1.7; color: var(--ws-text); }
.ws-imp-section p + p { margin-top: 8px; }
.ws-imp-section ul { margin: 8px 0 8px 22px; }
.ws-imp-section li { margin-bottom: 5px; }
.ws-imp-section a { color: var(--ws-secondary); text-decoration: underline; text-underline-offset: 3px; }
.ws-imp-section a:hover { color: var(--ws-text); }
.ws-imp-section code { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 0.92em; background: rgba(55,79,87,0.07); padding: 1px 5px; border-radius: 4px; }
.ws-imp-caps { font-size: 12px !important; letter-spacing: 0.02em; color: var(--ws-text-muted) !important; }

.ws-imp-footer {
  background: var(--ws-bg-deep); color: rgba(255,255,255,0.7);
  padding: 22px 24px; text-align: center; font-size: 13px;
}
.ws-imp-footer a { color: rgba(255,255,255,0.8); text-decoration: none; font-weight: 600; }
.ws-imp-footer a:hover { color: #fff; }

@media (max-width: 480px) { .ws-imp-main { padding: 36px 20px 64px; } }