/* ============================================================
   KINOVO — Unterseiten (Impressum, Datenschutz, AGB, SEO-Seiten)
   Warmes Design, passend zur neuen Landing (kinovo.css v6+).
   Stylt das bestehende Markup (.nav-bar/.legal-hero/.legal-card/.footer),
   damit kein HTML pro Seite umgebaut werden muss.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,400..800&family=Inter+Tight:wght@400;500;600;700&display=swap');

:root{
  --navy:#0A1424; --orange:#F6890C; --orange-d:#b9650a; --orange-ink:#1a1100;
  --green:#0DA45A; --blue:#2f86c9;
  --ink:#0A1424; --ink-2:#243149; --slate:#5d6f88; --slate-2:#93a4bd; --slate-3:#c0cad8;
  --cream:#FBF5EC; --cream-2:#F6ECDD; --cream-3:#FFFDF9;
  --line-l:#E6EBF1; --line-l2:#D7DEE8; --warm-line:rgba(28,18,4,.08);
  --maxw:1080px; --ease:cubic-bezier(.2,.7,.3,1);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{font-family:'Inter Tight',sans-serif;background:
  radial-gradient(120% 70% at 50% -8%,var(--cream-3),var(--cream) 48%,var(--cream-2) 100%) fixed;
  color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;font-size:17px;min-height:100vh}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,h5{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;line-height:1.08;letter-spacing:-0.02em}

.skip-link{position:absolute;left:-999px;top:0;background:var(--orange);color:var(--orange-ink);padding:10px 16px;border-radius:10px;z-index:200;font-weight:700}
.skip-link:focus{left:16px;top:16px}

/* ---------- warm ambient glow (reuses .aurora markup) ---------- */
.aurora{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.aurora .orb{position:absolute;border-radius:50%;filter:blur(90px);opacity:.5}
.aurora .orb-orange{width:520px;height:420px;top:-120px;right:-60px;background:radial-gradient(closest-side,rgba(246,137,12,.5),transparent 70%)}
.aurora .orb-green{width:520px;height:460px;bottom:-160px;left:-80px;background:radial-gradient(closest-side,rgba(13,164,90,.42),transparent 70%)}
.aurora .orb-blue{width:420px;height:360px;top:40%;left:60%;background:radial-gradient(closest-side,rgba(47,134,201,.3),transparent 70%);opacity:.35}
.aurora .grid-overlay{position:absolute;inset:0;background-image:linear-gradient(var(--warm-line) 1px,transparent 1px),linear-gradient(90deg,var(--warm-line) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(ellipse 80% 60% at 50% 20%,#000,transparent 75%)}

/* ---------- header ---------- */
.nav-bar{position:sticky;top:0;z-index:60;background:rgba(251,245,236,.8);backdrop-filter:blur(16px);border-bottom:1px solid var(--warm-line)}
.nav-bar .nav{max-width:1200px;margin:0 auto;padding:0 28px;height:78px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.nav-logo{display:flex;align-items:center;gap:11px;font-family:'Bricolage Grotesque';font-weight:700;font-size:21px;letter-spacing:-.02em;color:var(--navy)}
.nav-logo img{height:50px;width:auto}
.nav-links{display:flex;gap:4px}
.nav-links a{font-size:15px;font-weight:500;color:var(--slate);padding:9px 14px;border-radius:9px;transition:.18s}
.nav-links a:hover{color:var(--ink);background:#fff}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:15px;padding:13px 22px;border-radius:11px;transition:all .22s var(--ease);cursor:pointer;border:1px solid transparent;font-family:'Inter Tight'}
.btn svg{width:16px;height:16px}
.btn-primary{background:var(--orange);color:var(--orange-ink)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 30px -8px rgba(246,137,12,.5);filter:brightness(1.04)}
.btn-ghost{background:#fff;color:var(--ink);border-color:var(--line-l2)}
.btn-ghost:hover{transform:translateY(-2px);box-shadow:0 16px 36px -20px rgba(28,18,4,.4);border-color:transparent}

/* ---------- page hero ---------- */
main{display:block}
.legal-hero{max-width:var(--maxw);margin:0 auto;padding:64px 28px 36px;text-align:left}
.legal-back{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--slate);margin-bottom:26px;transition:.18s}
.legal-back:hover{color:var(--orange)}
.legal-back svg{width:14px;height:14px}
.eyebrow-pill{display:inline-flex;align-items:center;gap:9px;background:rgba(255,255,255,.7);border:1px solid var(--warm-line);padding:7px 16px;border-radius:999px;font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);box-shadow:0 10px 30px -18px rgba(28,18,4,.3)}
.eyebrow-pill .dot{width:8px;height:8px;border-radius:50%;background:var(--orange)}
.legal-hero h1{font-size:clamp(34px,5vw,58px);font-weight:800;letter-spacing:-.03em;margin:22px 0 18px;max-width:18ch}
.legal-hero .subtitle{font-size:19px;color:var(--ink-2);max-width:62ch;line-height:1.55}
.legal-version-pill{display:inline-flex;align-items:center;gap:8px;margin-top:22px;font-size:13px;font-weight:600;color:var(--slate);background:#fff;border:1px solid var(--line-l);padding:8px 14px;border-radius:999px}
.legal-version-pill svg{width:13px;height:13px}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap}

/* ---------- content card ---------- */
.legal-wrap{max-width:var(--maxw);margin:0 auto 80px;padding:0 28px}
.legal-card{background:#fff;border:1px solid var(--line-l);border-radius:22px;padding:clamp(28px,4vw,56px);box-shadow:0 40px 90px -50px rgba(28,18,4,.35)}
.legal-card h2{font-size:clamp(22px,2.6vw,30px);margin:38px 0 14px;color:var(--ink)}
.legal-card h2:first-child{margin-top:0}
.legal-card h3{font-size:20px;margin:26px 0 10px}
.legal-card p{color:var(--ink-2);margin-bottom:16px;font-size:16.5px;line-height:1.7}
.legal-card a{color:var(--green);font-weight:600;border-bottom:1px solid rgba(13,164,90,.3);transition:.15s}
.legal-card a:hover{color:var(--green);border-bottom-color:var(--green)}
.legal-card strong{color:var(--ink);font-weight:700}
.legal-card ul,.legal-card ol{margin:0 0 18px 22px;color:var(--ink-2)}
.legal-card li{margin-bottom:9px;font-size:16.5px;line-height:1.6}
.legal-card hr{border:0;border-top:1px solid var(--line-l);margin:32px 0}

/* meta table (Impressum) */
.legal-meta-table{width:100%;border-collapse:collapse;margin:6px 0 8px}
.legal-meta-table td{padding:13px 16px;border:1px solid var(--line-l);vertical-align:top;font-size:15.5px;color:var(--ink-2)}
.legal-meta-table tr td:first-child{width:34%;font-weight:700;color:var(--ink);background:var(--cream);white-space:nowrap}
.legal-meta-table a{color:var(--green)}

/* callout box */
.legal-callout{margin-top:30px;background:linear-gradient(165deg,#fff6ea,#ffe8c9);border:1px solid rgba(246,137,12,.28);border-radius:16px;padding:22px 26px;font-size:16.5px;color:var(--ink-2);line-height:1.6}
.legal-callout strong{color:var(--ink)}
.legal-callout a{color:var(--orange-d);border-bottom-color:rgba(246,137,12,.4)}

/* ---------- footer (dark, matches landing) ---------- */
.footer{background:#060d18;color:var(--slate-2);padding:72px 0 40px;margin-top:40px}
.foot-cols{max-width:1200px;margin:0 auto;padding:0 28px 56px;display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px;border-bottom:1px solid rgba(255,255,255,.09)}
.foot-brand{display:flex;align-items:flex-start;gap:13px}
.foot-brand img{height:42px;width:auto;background:#fff;border-radius:10px;padding:7px 10px;box-shadow:0 8px 22px -12px rgba(0,0,0,.5)}
.foot-brand strong{display:block;color:#fff;font-family:'Bricolage Grotesque';font-size:18px}
.foot-brand small{display:block;color:var(--slate-2);font-size:13.5px;margin-top:4px;max-width:24ch}
.foot-col h5{color:#fff;font-family:'Bricolage Grotesque';font-weight:700;font-size:14px;margin-bottom:16px}
.foot-col a{display:block;font-size:15px;margin-bottom:11px;color:var(--slate-2);transition:color .18s}
.foot-col a:hover{color:#fff}
.foot-bottom{max-width:1200px;margin:0 auto;padding:26px 28px 0;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:14px}

/* ---------- responsive ---------- */
@media(max-width:900px){
  .nav-links{display:none}
  .foot-cols{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){
  .nav-bar .nav{height:64px;padding:0 18px}
  .nav-logo img{height:40px}
  .legal-hero{padding:40px 18px 28px}
  .legal-wrap{padding:0 18px}
  .foot-cols{grid-template-columns:1fr;gap:30px}
  .legal-meta-table tr td:first-child{width:42%}
}
