/* ---------------------------------------------------------------------------
   Gemeinsames Blatt fuer die Rechtsseiten (Impressum, Datenschutz).
   Bewusst eigenstaendig statt Kopie aus agb.html: die dortige Fassung traegt
   viel Ballast der Startseite mit. Wer agb.html spaeter umstellt, kann diese
   Datei mitbenutzen.
   --------------------------------------------------------------------------- */
:root{
  --ink:#1A1A1A; --ink-soft:#5A5A5A; --ink-faint:#6E6E6E;
  --bg:#FFFFFF; --bg-soft:#F7F7F5; --bg-soft2:#F1F0EC; --border:#E6E5E0;
  --purple:#7C3AED; --purple-dark:#5B21B6; --purple-tint:#F3EEFE;
  --radius-lg:24px; --radius-md:16px; --radius-xl:32px;
  --ease-out:cubic-bezier(.25,1,.5,1); --ease-back:cubic-bezier(.34,1.56,.64,1);
  --dur-fast:180ms; --dur-base:300ms; --dur-slow:450ms;
  --z-header:100;
  --fs-2xs:0.75rem; --fs-xs:0.8125rem; --fs-sm:0.875rem; --fs-base:0.9375rem;
  --fs-md:1rem; --fs-lg:1.0625rem; --fs-xl:1.125rem; --fs-2xl:1.25rem; --fs-3xl:1.375rem;
}
@media(max-width:600px){ :root{ --fs-base:1rem; --fs-sm:0.9375rem; } }

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'Inter', sans-serif; color:var(--ink); background:var(--bg);
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img{display:block; max-width:100%;}
a{color:inherit; text-decoration:none;}
h1,h2,h3{text-wrap:balance;}
p,li{text-wrap:pretty;}
a:focus-visible,button:focus-visible{outline:3px solid var(--purple); outline-offset:3px; border-radius:6px;}
.wrap{max-width:1180px; margin:0 auto; padding:0 32px;}
.visually-hidden{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}

/* ---------- Header ---------- */
header{
  position:fixed; top:0; left:0; right:0; z-index:var(--z-header);
  background:rgba(255,255,255,0.82);
  backdrop-filter:saturate(180%) blur(16px); -webkit-backdrop-filter:saturate(180%) blur(16px);
  border-bottom:1px solid var(--border);
}
.nav{display:flex; align-items:center; justify-content:space-between; gap:24px;
  padding:14px 32px; max-width:1180px; margin:0 auto;}
.logo{display:flex; align-items:center; gap:12px; flex-shrink:0;
  font-family:'Manrope', sans-serif; font-weight:800; font-size:1.42rem;
  letter-spacing:-.02em; color:var(--ink);}
.logo-mark{height:38px; width:auto;}
.logo .logo-accent{color:var(--purple);}
.logo-text{white-space:nowrap;}
.nav-links{display:flex; gap:26px; align-items:center;}
.nav-links a{color:var(--ink); font-size:var(--fs-sm); font-weight:500; opacity:.75;
  white-space:nowrap; transition:opacity var(--dur-fast) var(--ease-out);}
.nav-links a:hover{opacity:1;}
.nav-actions{display:flex; align-items:center; gap:12px; flex-shrink:0;}
.nav-cta{
  background:var(--purple); color:#fff !important; padding:12px 20px; border-radius:999px;
  font-weight:600; font-size:var(--fs-sm); min-height:44px;
  display:inline-flex; align-items:center; white-space:nowrap;
  box-shadow:0 4px 14px rgba(124,58,237,0.28);
  transition:background var(--dur-fast) var(--ease-out);
}
.nav-cta:hover{background:var(--purple-dark);}

/* Menueknopf & Schublade – gleiche Loesung wie auf den uebrigen Seiten. */
.nav-burger{display:none; width:44px; height:44px; border:0; padding:0; cursor:pointer;
  background:transparent; border-radius:12px; flex-direction:column;
  align-items:center; justify-content:center; gap:5px;}
.nav-burger span{display:block; width:20px; height:2px; border-radius:2px; background:var(--ink);
  transition:transform var(--dur-base) var(--ease-out), opacity var(--dur-fast) var(--ease-out);}
.nav-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-burger[aria-expanded="true"] span:nth-child(2){opacity:0;}
.nav-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.nav-backdrop{position:fixed; inset:0; z-index:calc(var(--z-header) - 1);
  background:rgba(12,10,18,.46); opacity:0; transition:opacity var(--dur-base) var(--ease-out);}
.nav-backdrop.offen{opacity:1;}
@media(max-width:900px){
  .nav-burger{display:flex;}
  .nav-links{
    position:fixed; top:0; right:0; bottom:0; width:min(320px, 86vw); z-index:var(--z-header);
    flex-direction:column; align-items:stretch; justify-content:flex-start;
    gap:4px; padding:96px 24px 32px;
    background:linear-gradient(165deg, #232323 0%, var(--ink) 46%, #111 100%);
    box-shadow:-24px 0 60px -20px rgba(0,0,0,.6);
    transform:translateX(100%); transition:transform var(--dur-slow) var(--ease-out);
    overflow-y:auto; overscroll-behavior:contain;
  }
  .nav-links.offen{transform:translateX(0);}
  .nav-links a{display:flex; align-items:center; min-height:56px; padding:0 8px;
    font-size:var(--fs-xl); font-weight:600; color:#fff; opacity:.88;
    border-bottom:1px solid rgba(255,255,255,.10);}
  .nav-links a:hover{opacity:1; color:#C4A9FF;}
}
@media(max-width:560px){ .nav-cta{font-size:var(--fs-xs); padding:11px 14px;} }
@media(max-width:420px){ .logo-text{display:none;} }
body.menu-offen{overflow:hidden;}
/* backdrop-filter macht den Header sonst zum Bezugsrahmen und beschneidet die
   Schublade auf Header-Hoehe. */
body.menu-offen header{backdrop-filter:none; -webkit-backdrop-filter:none;}
@media(prefers-reduced-motion:reduce){ .nav-links{transition:none;} html{scroll-behavior:auto;} }

/* ---------- Inhalt ---------- */
.legal-hero{padding:150px 0 40px;}
.eyebrow{font-size:var(--fs-xs); font-weight:700; color:var(--purple);
  letter-spacing:.09em; text-transform:uppercase; margin-bottom:14px;}
.legal-hero h1{font-family:'Manrope', sans-serif; font-weight:800;
  font-size:clamp(2rem, 4vw, 2.8rem); letter-spacing:-.02em;}
.legal-hero .updated{margin-top:14px; color:var(--ink-faint); font-size:var(--fs-base);}
.legal-back{display:inline-flex; align-items:center; min-height:44px; margin-top:20px;
  color:var(--ink-soft); font-size:var(--fs-base); font-weight:600;}
.legal-back:hover{color:var(--purple);}

.legal-content{padding:0 0 90px;}
/* Lesespalte bewusst schmal: Rechtstexte werden sonst unlesbar breit. */
.legal-content .wrap{max-width:760px;}
.legal-section{margin-top:44px; padding-top:44px; border-top:1px solid var(--border);}
.legal-section:first-child{margin-top:0; padding-top:0; border-top:none;}
.legal-section h2{font-family:'Manrope', sans-serif; font-weight:700;
  font-size:var(--fs-2xl); letter-spacing:-.01em; margin-bottom:14px;}
.legal-section h3{font-family:'Manrope', sans-serif; font-weight:700;
  font-size:var(--fs-md); margin-top:22px; margin-bottom:6px;}
.legal-section p{color:var(--ink-soft); font-size:var(--fs-md); line-height:1.75; margin-top:12px;}
.legal-section p:first-of-type{margin-top:0;}
.legal-section ul{margin:12px 0 0 20px; color:var(--ink-soft); font-size:var(--fs-md); line-height:1.75;}
.legal-section li{margin-bottom:6px;}
.legal-section strong{color:var(--ink); font-weight:700;}
.legal-section a{color:var(--purple); text-decoration:underline; text-underline-offset:3px;}
.adresse{font-style:normal; color:var(--ink-soft); font-size:var(--fs-md); line-height:1.85;}

/* ---------- TODO-Kasten ----------
   Bewusst auffaellig und NICHT dezent: fehlende Pflichtangaben sollen vor
   dem Live-Gang niemandem durchrutschen. Vor der Veroeffentlichung muessen
   alle diese Kaesten verschwunden sein. */
.todo{
  margin-top:16px; padding:16px 18px; border-radius:var(--radius-md);
  background:#FFF7E6; border:1px solid #F0C36D; border-left:4px solid #E0A11B;
}
.todo strong{display:block; color:#7A5200; font-size:var(--fs-sm);
  letter-spacing:.06em; text-transform:uppercase; margin-bottom:6px;}
.todo p{color:#5C4200 !important; font-size:var(--fs-base) !important; margin-top:4px !important;}

/* ---------- Footer ---------- */
footer{padding:52px 32px 40px; text-align:center; color:var(--ink-faint); font-size:var(--fs-sm);
  border-top:1px solid var(--border);}
.footer-inner{display:flex; flex-direction:column; align-items:center; gap:12px;}
.footer-brand{display:inline-flex; align-items:center; gap:11px;
  font-family:'Manrope',sans-serif; font-weight:800; font-size:var(--fs-xl);
  color:var(--ink); letter-spacing:-.02em;}
.footer-brand img{height:32px; width:auto;}
.footer-brand .logo-accent{color:var(--purple);}
.footer-links{display:flex; gap:18px; flex-wrap:wrap; justify-content:center;}
.footer-link{
  color:var(--ink-faint); text-decoration:underline; text-underline-offset:3px;
  font-weight:600; font-size:var(--fs-sm); background:none; border:0; cursor:pointer;
  font-family:inherit;
  padding:12px 6px; margin:-12px 0; display:inline-flex; align-items:center; min-height:44px;
}
.footer-link:hover{color:var(--purple);}

/* Social-Icons: offizielle IG-/FB-Glyphen, unveraendert & einfarbig, nur als
   Verlinkung auf die eigenen Profile. Kein Social-Plugin, keine Datenuebertragung.
   Glyph 30px (IG-Mindestmass 29px), Klickflaeche 44px. */
.footer-social{display:flex; align-items:center; justify-content:center; gap:6px; flex-wrap:wrap;}
.footer-social__label{
  font-size:var(--fs-xs); font-weight:600; letter-spacing:.08em; text-transform:uppercase;
  color:var(--ink-faint); margin-right:10px;
}
.footer-social__link{
  display:inline-flex; align-items:center; justify-content:center;
  width:44px; height:44px; color:var(--ink); opacity:.55;
  transition:opacity var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out);
}
.footer-social__link:hover,
.footer-social__link:focus-visible{opacity:1; transform:translateY(-2px);}
@media(prefers-reduced-motion:reduce){
  .footer-social__link:hover,.footer-social__link:focus-visible{transform:none;}
}
@media(max-width:374px){
  .footer-social__label{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; margin:0;}
}