/* ============================================================
   Gemeinsames Stylesheet für impressum.html und datenschutz.html.
   Bewusst schlank gehalten: Rechtstexte müssen auch dann lesbar
   sein, wenn JavaScript deaktiviert ist oder das Stylesheet fehlt.
   Schriften lokal aus /fonts – keine externe Verbindung.
   ============================================================ */
@font-face{font-family:'Poppins';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/poppins-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Poppins';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/poppins-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/poppins-600-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/poppins-700-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Poppins';font-style:normal;font-weight:800;font-display:swap;src:url(fonts/poppins-800-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

:root{
  --navy:#00193e;
  --cyan:#01bdff;
  --cyan-light:#7fe3ff;
  --purple:#ae51e7;
  --pink:#f062b8;
  --text:#e9f2ff;
  --text-muted:#9db2d4;
  --text-dim:#7189ac;
  --glass:rgba(255,255,255,.045);
  --glass-border:rgba(255,255,255,.12);
  --radius:18px;
  --radius-sm:12px;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%;}
body{
  margin:0;
  font-family:'Poppins',system-ui,-apple-system,'Segoe UI',sans-serif;
  font-weight:400;
  font-size:1rem;
  line-height:1.75;
  color:var(--text-muted);
  background:var(--navy);
  -webkit-font-smoothing:antialiased;
}
body::before{
  content:'';position:fixed;inset:0;z-index:-1;
  background:
    radial-gradient(760px 520px at 12% -5%,rgba(1,189,255,.13),transparent 60%),
    radial-gradient(640px 460px at 92% 6%,rgba(174,81,231,.12),transparent 62%),
    var(--navy);
}

.wrap{width:min(100% - 2.4rem,860px);margin-inline:auto;}
a{color:var(--cyan);}
a:hover{color:var(--cyan-light);}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;border-radius:6px;}

/* ---------- Kopfzeile ---------- */
.top{border-bottom:1px solid var(--glass-border);padding:1.1rem 0;background:rgba(0,13,33,.5);}
.top-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;}
.logo{display:inline-flex;align-items:center;gap:.65rem;font-weight:800;color:#fff;text-decoration:none;font-size:1.02rem;}
.logo svg{width:34px;height:34px;flex:none;}
.back{
  display:inline-flex;align-items:center;gap:.5rem;
  font-size:.88rem;font-weight:600;text-decoration:none;
  background:var(--glass);border:1px solid var(--glass-border);
  padding:.6rem 1.15rem;border-radius:999px;min-height:44px;
}
.back:hover{border-color:rgba(1,189,255,.5);}

/* ---------- Inhalt ---------- */
main{padding:clamp(2.4rem,6vw,4rem) 0 4rem;}
h1{
  font-size:clamp(1.9rem,4.5vw,2.7rem);font-weight:800;letter-spacing:-.02em;
  color:#fff;line-height:1.15;margin:0 0 .4rem;
}
.sub{color:var(--text-dim);font-size:.92rem;margin:0 0 2.4rem;}
h2{
  font-size:clamp(1.08rem,2vw,1.25rem);font-weight:700;color:#fff;
  margin:2.6rem 0 .7rem;line-height:1.3;letter-spacing:-.01em;
}
h2:first-of-type{margin-top:0;}
h3{font-size:.97rem;font-weight:600;color:var(--cyan-light);margin:1.5rem 0 .5rem;}
p{margin:0 0 1rem;}
ul{padding-left:1.2rem;margin:0 0 1rem;}
li{margin-bottom:.45rem;}
strong{color:var(--text);font-weight:600;}
address{font-style:normal;}

/* ---------- Hinweisboxen ---------- */
.note{
  background:rgba(240,98,184,.08);border:1px solid rgba(240,98,184,.28);
  border-radius:var(--radius-sm);padding:1rem 1.2rem;margin-bottom:2rem;
  font-size:.87rem;color:var(--pink);
}
.note strong{color:var(--pink);}

/* Art. 21 Abs. 4 DSGVO verlangt, dass das Widerspruchsrecht getrennt
   von anderen Informationen und deutlich hervorgehoben dargestellt wird. */
.widerspruch{
  background:rgba(1,189,255,.1);
  border:2px solid var(--cyan);
  border-radius:var(--radius-sm);
  padding:1.5rem 1.6rem;margin:1.8rem 0 2.2rem;
}
.widerspruch h2{
  color:var(--cyan);font-size:1.05rem;font-weight:800;
  text-transform:uppercase;letter-spacing:.04em;margin:0 0 .8rem;
}
.widerspruch p{color:var(--text);font-weight:500;}
.widerspruch p:last-child{margin-bottom:0;}
.widerspruch strong{color:#fff;font-weight:700;}

.provider{
  background:var(--glass);border:1px solid var(--glass-border);
  border-radius:var(--radius-sm);padding:.85rem 1.05rem;margin:0 0 1rem;
  font-size:.86rem;line-height:1.65;
}
.provider strong{display:block;color:var(--cyan-light);margin-bottom:.15rem;}

.fill-me{color:var(--pink);font-weight:600;background:rgba(240,98,184,.1);padding:.05rem .35rem;border-radius:4px;}

/* ---------- Inhaltsverzeichnis ---------- */
.toc{
  background:var(--glass);border:1px solid var(--glass-border);
  border-radius:var(--radius);padding:1.3rem 1.5rem;margin-bottom:2.8rem;
}
.toc h2{font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text-dim);margin:0 0 .9rem;}
.toc ol{margin:0;padding-left:1.3rem;columns:2;column-gap:2rem;}
.toc li{margin-bottom:.35rem;font-size:.88rem;}
.toc a{text-decoration:none;}
.toc a:hover{text-decoration:underline;}
@media(max-width:620px){.toc ol{columns:1;}}

/* ---------- Fußzeile ---------- */
footer{border-top:1px solid var(--glass-border);padding:2rem 0;font-size:.85rem;color:var(--text-dim);}
.foot-inner{display:flex;gap:.9rem 1.8rem;flex-wrap:wrap;align-items:center;justify-content:space-between;}
.foot-links{display:flex;gap:1.4rem;flex-wrap:wrap;}
footer a{text-decoration:none;}
footer a:hover{text-decoration:underline;}

@media(max-width:760px){
  .wrap{width:min(100% - 1.8rem,860px);}
  body{font-size:.97rem;}
  .widerspruch{padding:1.15rem 1.2rem;}
  main{padding-top:2rem;}

  /* Eigenständige Bedienelemente brauchen 44 px Höhe. Links im Fließtext
     sind davon ausgenommen (WCAG 2.5.8, Ausnahme "inline"). */
  .logo{min-height:44px;}
  .foot-links a{display:inline-flex;align-items:center;min-height:44px;}
  .foot-inner{gap:.4rem 1.8rem;}
  .top-inner{gap:.6rem;}
  .back{width:100%;justify-content:center;}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
}