/* ============================================================
   HIGHLEVEL AKROBATIK – Stylesheet für Rechtsseiten
   (Impressum, Datenschutz, AGB) – passend zum Redesign 2026
   ============================================================ */
:root{
  --pink:#FF4B8B;
  --blue:#4A9FFF;
  --purple:#9B4BFF;
  --orange:#FF8F3D;
  --green:#2ECF8E;
  --ink:#1E2330;
  --ink-soft:#5A6172;
  --lav:#F6F2FF;
  --sky:#F0F7FF;
  --radius:24px;
  --radius-sm:16px;
  --shadow:0 10px 40px -12px rgba(30,35,48,.18);
  --shadow-pink:0 14px 40px -12px rgba(255,75,139,.45);
  --font-display:"Baloo 2","Quicksand",sans-serif;
  --font-body:"Quicksand",sans-serif;
  --nav-h:68px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip}
body{font-family:var(--font-body);color:var(--ink);background:#fff;line-height:1.7;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:6px}
.container{width:min(1160px,100% - 2.5rem);margin-inline:auto}

h1,h2,h3,h4{font-family:var(--font-display);line-height:1.15;font-weight:800}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;font-weight:700;font-family:var(--font-display);font-size:1rem;padding:.85rem 1.7rem;border-radius:999px;transition:transform .25s cubic-bezier(.34,1.56,.64,1),box-shadow .25s ease}
.btn:active{transform:scale(.96)}
.btn-primary{background:linear-gradient(95deg,var(--pink),var(--purple));color:#fff;box-shadow:var(--shadow-pink)}
.btn-primary:hover{transform:translateY(-3px)}
.btn svg{width:1.1em;height:1.1em;flex:none}

/* ---------- Header ---------- */
.site-header{position:fixed;inset:0 0 auto;z-index:100;height:var(--nav-h);display:flex;align-items:center;background:rgba(255,255,255,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 6px 24px -12px rgba(30,35,48,.16)}
.nav-wrap{display:flex;align-items:center;justify-content:space-between;width:min(1160px,100% - 2.5rem);margin-inline:auto}
.brand{font-family:var(--font-display);font-weight:800;font-size:1.12rem;letter-spacing:-.01em;white-space:nowrap}
@media(min-width:480px){.brand{font-size:1.25rem}}
.brand em{font-style:normal;background:linear-gradient(95deg,var(--pink),var(--purple));-webkit-background-clip:text;background-clip:text;color:transparent}
.site-header .btn{padding:.6rem 1.3rem;font-size:.92rem}

/* ---------- Seiten-Hero ---------- */
.page-hero{padding:calc(var(--nav-h) + 4rem) 0 3.5rem;text-align:center;background:
  radial-gradient(58% 48% at 12% 8%,rgba(74,159,255,.30),transparent 60%),
  radial-gradient(52% 42% at 88% 14%,rgba(255,143,61,.26),transparent 60%),
  radial-gradient(60% 55% at 82% 88%,rgba(155,75,255,.24),transparent 62%),
  linear-gradient(160deg,#FFF3F7 0%,#F4F0FF 50%,#EEF6FF 100%)}
.page-hero h1{font-size:clamp(2.1rem,6vw,3.4rem);letter-spacing:-.01em}
.page-hero h1 span{background:linear-gradient(92deg,var(--pink),var(--purple) 55%,var(--blue));-webkit-background-clip:text;background-clip:text;color:transparent}
.page-hero p{color:var(--ink-soft);max-width:560px;margin:.8rem auto 0;font-size:1.05rem}

/* ---------- Inhalt ---------- */
.legal-main{padding:3.5rem 0 4.5rem}
.prose{max-width:820px;margin-inline:auto;background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:clamp(1.8rem,5vw,3.2rem)}
.prose h2{font-size:1.55rem;margin-bottom:1.4rem}
.prose h3{font-size:1.2rem;margin:2.1rem 0 .9rem;padding-left:.95rem;position:relative}
.prose h3::before{content:"";position:absolute;left:0;top:.28em;bottom:.28em;width:4px;border-radius:4px;background:linear-gradient(180deg,var(--pink),var(--purple))}
.prose h4{font-size:1.02rem;margin:1.4rem 0 .5rem}
.prose p{color:var(--ink-soft);font-size:.97rem;margin-bottom:.9rem}
.prose ul{list-style:none;margin:0 0 1rem;display:grid;gap:.45rem}
.prose ul li{color:var(--ink-soft);font-size:.97rem;padding-left:1.5rem;position:relative}
.prose ul li::before{content:"";position:absolute;left:.3rem;top:.55em;width:8px;height:8px;border-radius:50%;background:linear-gradient(135deg,var(--pink),var(--purple))}
.prose a{color:var(--pink);font-weight:600}
.prose a:hover{text-decoration:underline}
.prose .card-info{background:linear-gradient(120deg,var(--sky),var(--lav));border-radius:var(--radius-sm);padding:1.2rem 1.4rem;margin-bottom:1rem}
.prose .card-info p{margin-bottom:.15rem}
.prose .card-info b{color:var(--ink)}
.back-cta{text-align:center;margin-top:2.6rem}

/* ---------- Footer ---------- */
.site-footer{position:relative;background:#14161F;color:#fff;padding:3.6rem 0 1.8rem;overflow:hidden}
.site-footer::before{content:"";position:absolute;inset:0;background:
  radial-gradient(40% 55% at 10% 15%,rgba(255,75,139,.15),transparent 60%),
  radial-gradient(45% 60% at 90% 80%,rgba(74,159,255,.13),transparent 60%);pointer-events:none}
.site-footer::after{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--pink),var(--purple) 35%,var(--blue) 70%,var(--green))}
.footer-grid{position:relative;z-index:1;display:grid;gap:2.2rem}
.footer-brand .brand{font-size:1.35rem;color:#fff}
.footer-brand p{color:rgba(255,255,255,.6);font-size:.95rem;max-width:340px;margin-top:.7rem}
.fb-round{width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.1);display:grid;place-items:center;margin-top:1.1rem;color:#fff;transition:background .25s,transform .25s}
.fb-round:hover{background:#1877F2;transform:translateY(-3px)}
.footer-grid nav b,.footer-grid .footer-col b{font-family:var(--font-display);display:block;margin-bottom:.9rem;font-size:1.02rem}
.footer-grid ul{display:grid;gap:.55rem}
.footer-grid ul a,.footer-grid ul li{color:rgba(255,255,255,.62);font-size:.95rem}
.footer-grid ul a:hover{color:#fff}
.footer-bottom{position:relative;z-index:1;border-top:1px solid rgba(255,255,255,.1);margin-top:2.6rem;padding-top:1.4rem;display:flex;flex-wrap:wrap;gap:.9rem 1.6rem;justify-content:space-between;align-items:center;font-size:.85rem;color:rgba(255,255,255,.45)}
.footer-bottom nav{display:flex;flex-wrap:wrap;gap:1.2rem}
.footer-bottom a{color:rgba(255,255,255,.6);font-weight:600}
.footer-bottom a:hover{color:#fff}
.footer-word{position:relative;font-family:var(--font-display);font-weight:800;font-size:clamp(3.4rem,13vw,10rem);line-height:.85;text-align:center;letter-spacing:.05em;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.07);user-select:none;pointer-events:none;margin-top:2rem}
@media(min-width:760px){.footer-grid{grid-template-columns:1.4fr 1fr 1fr}}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important}
  html{scroll-behavior:auto}
}
