/* ConRules Startseite — Neon-Glas-Look (Stand 04.10.2026) */
[hidden]{display:none!important}
html{overflow-x:clip}
img{max-width:100%}
/* Layout: Glas-Navbar oben · Hero zweispaltig (Claim links, Kristallkuppel rechts) · drei Glas-Karten unten. Bewusst nur dunkel. */
:root{
  --bg:#001316; --bg2:#051a1f; --panel:rgba(10,27,34,.72); --line:rgba(94,234,200,.18);
  --neon:#3ee6c1; --neon-soft:#9decd6; --text:#d7ece7; --muted:#8fa9a3;
  --display:"Sora",ui-sans-serif,system-ui,sans-serif; --body:"Manrope",ui-sans-serif,system-ui,sans-serif;
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{min-height:100%}
body{margin:0;background:radial-gradient(1100px 650px at 55% 35%,var(--bg2) 0%,var(--bg) 65%) fixed,var(--bg);color:var(--text);font-family:var(--body);font-size:15px;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.35;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='97'%3E%3Cpath d='M28 0 56 16v32L28 64 0 48V16zM28 64v33' fill='none' stroke='%233ee6c1' stroke-opacity='.07'/%3E%3C/svg%3E");
  mask-image:radial-gradient(700px 500px at 65% 30%,#000 0%,transparent 75%)}
a{color:inherit}
.wrap{max-width:1240px;margin:0 auto;padding-inline:20px;position:relative}

/* NAV */
.nav{margin-top:18px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 18px;border-radius:16px;
  background:linear-gradient(90deg,rgba(16,48,56,.55),rgba(28,30,52,.45) 45%,rgba(10,26,31,.6));border:1px solid var(--line);backdrop-filter:blur(10px);position:sticky;top:calc(env(safe-area-inset-top,0px) + 10px);z-index:20}
.logo{display:flex;align-items:center;filter:drop-shadow(0 0 6px var(--neon))}
.nav ul{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:34px}
.nav ul a{text-decoration:none;color:var(--neon-soft);opacity:.85;font-size:15px;transition:opacity .2s,text-shadow .2s}
.nav ul a:hover,.nav ul a:focus-visible{opacity:1;text-shadow:0 0 12px var(--neon)}
.btn{font:500 15px var(--body);color:var(--neon-soft);background:rgba(62,230,193,.06);border:1.5px solid var(--neon);border-radius:12px;padding:11px 20px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:8px;
  box-shadow:0 0 14px rgba(62,230,193,.35),inset 0 0 12px rgba(62,230,193,.15);transition:box-shadow .25s,background .25s,transform .15s}
.btn:hover,.btn:focus-visible{background:rgba(62,230,193,.14);box-shadow:0 0 26px rgba(62,230,193,.65),inset 0 0 16px rgba(62,230,193,.25);outline:none}
.btn:active{transform:translateY(1px)}

/* HERO */
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);align-items:center;gap:50px;padding-block:40px 30px;position:relative}
#mesh{position:absolute;left:34%;width:calc(66% + 60px);top:150px;height:500px;pointer-events:none;-webkit-mask-image:linear-gradient(90deg,transparent,#000 24%,#000 72%,transparent),linear-gradient(180deg,transparent,#000 6%,#000 68%,transparent);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent,#000 24%,#000 72%,transparent),linear-gradient(180deg,transparent,#000 6%,#000 68%,transparent);mask-composite:intersect}
.claim{position:relative;z-index:2;padding-left:60px}
.claim h1{font:400 clamp(40px,5.6vw,66px)/1.12 var(--display);margin:0;color:var(--neon-soft);letter-spacing:-.01em;text-shadow:0 0 18px rgba(62,230,193,.45)}
.claim h1 span{display:block;opacity:0;transform:translateY(8px);animation:rise .8s forwards}
.claim h1 span:nth-child(2){padding-left:.3em;animation-delay:.25s}
.claim h1 span:nth-child(3){padding-left:1.15em;animation-delay:.5s}
@keyframes rise{to{opacity:1;transform:none}}
.claim p{color:var(--muted);font-size:18px;margin:40px 0 46px}
#arrows{position:absolute;left:-30px;top:-14px;width:520px;max-width:115%;height:260px;pointer-events:none;overflow:visible}
#arrows path{fill:none;stroke:var(--neon);stroke-width:1.6;stroke-linecap:round;filter:url(#glow);stroke-dasharray:400;stroke-dashoffset:400;animation:draw 1.6s ease-out forwards}
#arrows circle{fill:#bfffee;filter:url(#glow);animation:pulse 2.4s ease-in-out infinite}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes pulse{50%{opacity:.4}}

.domebox{position:relative;z-index:1;text-align:center}
#dome{display:block;width:100%;max-width:600px;height:auto;margin:0 auto;position:relative;transition:transform .4s ease-out;filter:drop-shadow(0 0 30px rgba(62,230,193,.18))}
.halo{position:absolute;left:50%;top:48%;width:70%;aspect-ratio:1;max-width:100%;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(62,230,193,.16),transparent 65%);animation:breathe 4s ease-in-out infinite}
.domebox .tag{position:relative;font:300 clamp(16px,2vw,24px) var(--display);letter-spacing:.32em;color:#a9c4be;margin-top:14px}
.breathe{animation:breathe 4s ease-in-out infinite}
@keyframes breathe{50%{opacity:.55}}

/* CARDS */
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;padding-block:20px 60px}
.card{display:flex;gap:20px;align-items:center;padding:26px 24px;border-radius:16px;background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(6px);transition:border-color .3s,box-shadow .3s,transform .3s}
.card:hover,.card.flash{border-color:rgba(62,230,193,.55);box-shadow:0 0 30px rgba(62,230,193,.18);transform:translateY(-3px)}
.card .ico{flex:none;width:110px;height:auto;max-width:30%;transition:filter .3s}
.card:hover .ico{filter:drop-shadow(0 0 10px rgba(62,230,193,.6)) brightness(1.15)}
.card svg *{fill:none;stroke:var(--neon);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.card h3{font:600 19px var(--display);margin:0 0 8px;color:#f0fbf8}
.card p{margin:0;color:#b6cbc6;line-height:1.5;min-width:0}


/* WERBEBANNER: rechts 2 %, Breite 8 %, oben 10 % unter Menü, unten 5 % über den Karten */
.herozone{position:relative}
.adbanner{position:absolute;right:2vw;width:var(--adw,8vw);top:10%;height:calc(85% * var(--adh,1));z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:10px;padding:14px 8px;border-radius:14px;text-align:center;
  background:linear-gradient(180deg,rgba(14,44,52,.96),rgba(6,22,28,.97));border:1px solid rgba(62,230,193,.3);box-shadow:0 0 24px rgba(62,230,193,.12);overflow:hidden}
.adbanner::before{content:"";position:absolute;inset:-40% -60%;background:linear-gradient(115deg,transparent 45%,rgba(157,236,214,.12) 50%,transparent 55%);animation:shine 6s ease-in-out infinite}
@keyframes shine{0%,60%{transform:translateY(-60%)}100%{transform:translateY(60%)}}
.ad-label{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.ad-body{display:flex;flex-direction:column;align-items:center;gap:10px;min-width:0}
.ad-chart{width:70%;height:auto}.ad-chart path{fill:none;stroke:var(--neon);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 4px var(--neon))}
.adbanner strong{font:600 clamp(14px,1.4vw,20px) var(--display);color:var(--neon-soft)}
.ad-text{font-size:clamp(11px,.9vw,13px);line-height:1.4;color:#c4d8d3;overflow-wrap:anywhere}
.ad-big{font:600 clamp(32px,3.4vw,48px)/1 var(--display);color:#f0fbf8;text-shadow:0 0 14px rgba(62,230,193,.6)}
.ad-small{font-size:clamp(10px,.85vw,12px);color:var(--muted);margin-top:-6px}
.ad-cta{position:relative;font:600 13px var(--body);text-decoration:none;color:#00211c;background:var(--neon);padding:8px 0;width:90%;border-radius:9px;box-shadow:0 0 14px rgba(62,230,193,.5)}
.ad-cta:hover,.ad-cta:focus-visible{background:var(--neon-soft);outline:none}
@media (min-width:1001px){.herozone .wrap{padding-right:calc(var(--adw,8vw) + 2vw + 16px);max-width:none;margin-left:max(0px,calc((100vw - 1240px)/2));
  padding-left:max(20px,calc(var(--adwl,0px) + 2vw + 16px - max(0px,calc((100vw - 1240px)/2))))}}
/* linker Banner: gespiegelt */
.adbanner.ad-left{right:auto;left:2vw}
@media (max-width:1000px){.adbanner{display:none}}
@media (prefers-reduced-motion:reduce){.adbanner::before{display:none}}


/* MENÜ: Burger rechts, Panel fährt unter der Leiste herunter */
.burger{width:46px;height:42px;border-radius:12px;border:1.5px solid var(--neon);background:rgba(62,230,193,.06);display:grid;place-content:center;gap:5px;cursor:pointer;box-shadow:0 0 14px rgba(62,230,193,.35);transition:box-shadow .25s,background .25s}
.burger:hover,.burger:focus-visible{background:rgba(62,230,193,.14);box-shadow:0 0 24px rgba(62,230,193,.6);outline:none}
.burger span{display:block;width:20px;height:2px;border-radius:2px;background:var(--neon-soft);transition:transform .3s,opacity .2s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.menu{position:absolute;left:0;right:0;top:calc(100% + 10px);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:0;border-radius:16px;
  background:linear-gradient(180deg,#082228,#03161a);border:1px solid var(--line);box-shadow:0 20px 50px rgba(0,0,0,.5),0 0 30px rgba(62,230,193,.1);
  clip-path:inset(0 0 100% 0 round 16px);opacity:0;visibility:hidden;transition:clip-path .45s cubic-bezier(.2,.8,.2,1),opacity .3s,visibility 0s .45s;max-height:calc(100vh - 120px);overflow:auto}
.menu.open{clip-path:inset(0 0 0 0 round 16px);opacity:1;visibility:visible;transition:clip-path .45s cubic-bezier(.2,.8,.2,1),opacity .3s}
.menu-col{padding:26px 28px;min-width:0}
.menu-col.links{border-left:1px solid var(--line);display:flex;flex-direction:column;gap:4px}
.menu h4{font:500 12px var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0 0 10px}
.menu-col.links>a{text-decoration:none;color:var(--text);font:400 17px var(--display);padding:8px 10px;border-radius:9px;transition:background .2s,color .2s}
.menu-col.links>a:hover,.menu-col.links>a:focus-visible{background:rgba(62,230,193,.08);color:var(--neon-soft);outline:none}
.legal{margin-top:auto;padding-top:18px;border-top:1px solid var(--line);display:flex;gap:20px}
.legal a{font-size:13px;color:var(--muted);text-decoration:none}.legal a:hover{color:var(--neon-soft)}
.tabs{display:flex;gap:6px;margin-bottom:14px;background:rgba(0,0,0,.25);padding:4px;border-radius:11px;width:max-content}
.tab{font:500 14px var(--body);color:var(--muted);background:none;border:none;padding:8px 16px;border-radius:8px;cursor:pointer}
.tab.on{background:rgba(62,230,193,.14);color:var(--neon-soft)}
.pane label{display:block;font-size:13px;color:var(--muted);margin:12px 0 6px}
.pane input[type=email],.pane input[type=password],.pane input[type=text]{width:100%;padding:11px 12px;border-radius:10px;border:1px solid var(--line);background:#031014;color:var(--text);font:15px var(--body)}
.pane input:focus{outline:none;border-color:var(--neon);box-shadow:0 0 0 3px rgba(62,230,193,.15)}
.pane .chk{display:flex;align-items:center;gap:8px;margin:14px 0 0}
.pane .chk input{accent-color:var(--neon)}
.pane .chk a{color:var(--neon-soft)}
.frow{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.linkbtn{background:none;border:none;color:var(--neon-soft);font:13px var(--body);cursor:pointer;padding:12px 0 0;text-decoration:underline;text-underline-offset:3px}
.btn.full{width:100%;justify-content:center;margin-top:18px}
.hint{color:var(--muted);margin:0 0 4px;line-height:1.5}
@media (max-width:700px){.menu{grid-template-columns:1fr}.menu-col.links{border-left:none;border-top:1px solid var(--line)}}

.foot{text-align:right;padding-block:0 28px;margin-top:-28px;font-size:14px;letter-spacing:.06em;color:var(--muted)}

/* MEHR ERFAHREN: Fenster fährt von unten hoch */
.sheet-bg{position:fixed;inset:0;background:rgba(0,8,10,.65);backdrop-filter:blur(4px);opacity:0;visibility:hidden;transition:opacity .35s,visibility 0s .35s;z-index:40}
.sheet-bg.open{opacity:1;visibility:visible;transition:opacity .35s}
.sheet{position:fixed;left:50%;bottom:0;width:min(1240px,100%);max-height:86vh;overflow:auto;z-index:41;transform:translate(-50%,105%);visibility:hidden;
  transition:transform .5s cubic-bezier(.2,.8,.2,1),visibility 0s .5s;background:linear-gradient(180deg,#082228,#021216);border:1px solid var(--line);border-bottom:none;border-radius:22px 22px 0 0;
  box-shadow:0 -20px 60px rgba(0,0,0,.55),0 -2px 30px rgba(62,230,193,.12);padding:14px 32px calc(32px + env(safe-area-inset-bottom,0px))}
.sheet.open{transform:translate(-50%,0);visibility:visible;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.grip{width:46px;height:5px;border-radius:3px;background:rgba(157,236,214,.3);margin:0 auto 18px}
.sheet-x{position:absolute;top:16px;right:18px;width:38px;height:38px;border-radius:10px;border:1px solid var(--line);background:rgba(62,230,193,.06);color:var(--neon-soft);font-size:16px;cursor:pointer}
.sheet-x:hover,.sheet-x:focus-visible{border-color:var(--neon);outline:none;box-shadow:0 0 14px rgba(62,230,193,.4)}
.sheet-head{max-width:720px;margin-bottom:28px}
.sheet-head h2{font:400 clamp(26px,3vw,36px) var(--display);margin:0 0 10px;color:var(--neon-soft);text-shadow:0 0 14px rgba(62,230,193,.35)}
.sheet-head p{margin:0;color:#b6cbc6;font-size:16px;line-height:1.55}
.shots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.shot{margin:0;display:flex;flex-direction:column;gap:14px}
.frame{position:relative;aspect-ratio:16/10;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:#031014;box-shadow:0 0 20px rgba(62,230,193,.08)}
.frame img{width:100%;height:100%;object-fit:cover;object-position:top left;display:block;position:relative;z-index:1}
.frame .ph{position:absolute;inset:0;display:grid;place-content:center;text-align:center;gap:6px;color:var(--muted);font-size:13px;
  background:repeating-linear-gradient(135deg,rgba(62,230,193,.04) 0 10px,transparent 10px 20px)}
.frame .ph code{color:var(--neon-soft);font-size:12px}
.shot h3{font:600 18px var(--display);margin:0 0 6px;color:#f0fbf8}
.shot p{margin:0;color:#b6cbc6;line-height:1.55}
@media (max-width:800px){.shots{grid-template-columns:1fr}.sheet{padding-inline:18px}}


/* LOGO-PLATZHALTER + PARTNER-ICONS */
.brandrow{display:flex;align-items:center;gap:clamp(18px,3vw,40px);min-width:0}
.logo-ph{flex:none;width:58px;height:42px;border-radius:10px;border:1.5px dashed rgba(62,230,193,.55);display:grid;place-items:center;font:500 11px var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--neon-soft);text-decoration:none;background:rgba(62,230,193,.05)}
.partners{display:flex;gap:10px;min-width:0}
.partner{display:flex;align-items:center;gap:8px;padding:5px;border-radius:11px;border:1px solid var(--line);background:rgba(255,255,255,.02);text-decoration:none;color:#c4d8d3;font-size:13px;transition:border-color .2s,box-shadow .2s,color .2s}
.partner:hover,.partner:focus-visible{border-color:var(--neon);color:var(--neon-soft);box-shadow:0 0 14px rgba(62,230,193,.3);outline:none}
.p-ico{width:32px;height:32px;border-radius:8px;display:grid;place-items:center;font:600 11px var(--display);color:var(--neon);background:rgba(62,230,193,.1);border:1px solid rgba(62,230,193,.25)}
@media (max-width:380px){.partners{gap:6px}.brandrow{gap:12px}}

/* TOAST */
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:#0d2222;border:1px solid var(--neon);color:var(--neon-soft);padding:10px 18px;border-radius:12px;z-index:60;box-shadow:0 0 18px rgba(62,230,193,.3);max-width:calc(100% - 32px)}

@media (max-width:900px){
  .hero{grid-template-columns:1fr;padding-top:30px}
  .claim{padding-left:20px}
  #mesh{left:0;width:100%;top:auto;bottom:60px;height:380px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 15%,#000 85%,transparent),linear-gradient(180deg,transparent,#000 6%,#000 68%,transparent);mask-image:linear-gradient(90deg,transparent,#000 15%,#000 85%,transparent),linear-gradient(180deg,transparent,#000 6%,#000 68%,transparent)}
  .cards{grid-template-columns:1fr}
}
@media (max-width:480px){.btn{padding:9px 14px}.claim p{margin:28px 0 32px}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.claim h1 span{opacity:1;transform:none}#arrows path{stroke-dashoffset:0}}
/* Hinweis-Banner (z.B. Konto gelöscht) */
.notice{margin:14px 0 0;padding:12px 18px;border-radius:12px;border:1px solid rgba(62,230,193,.4);background:rgba(62,230,193,.08);color:var(--neon-soft);font-size:14px}
/* Eingeloggt-Ansicht im Menü */
.me{display:flex;flex-direction:column;gap:12px}
.me p{margin:0;color:var(--muted)}
.me strong{color:var(--neon-soft);font:500 20px var(--display)}
.me .btn{justify-content:center}
.btn.ghost-btn{background:none;box-shadow:none;border-color:var(--line);color:var(--muted)}
.btn.ghost-btn:hover{color:var(--neon-soft);border-color:var(--neon)}
.partner img{width:32px;height:32px;object-fit:contain;border-radius:8px;display:block}
.menu-col.links>button.linklike{all:unset;cursor:pointer;color:var(--text);font:400 17px var(--display);padding:8px 10px;border-radius:9px}
.menu-col.links>button.linklike:hover,.menu-col.links>button.linklike:focus-visible{background:rgba(62,230,193,.08);color:var(--neon-soft)}

/* ============ UNTERSEITEN (Login, Registrieren, FAQ …) ============ */
.subnav{display:flex;align-items:center;gap:22px}
.subnav>a:not(.btn){color:var(--neon-soft);text-decoration:none;opacity:.85}
.subnav>a:not(.btn):hover{opacity:1;text-shadow:0 0 12px var(--neon)}
.submain{min-height:calc(100vh - 190px);display:flex;flex-direction:column;align-items:center;justify-content:center;padding-block:48px}
.authcard{width:min(420px,100%);padding:34px 32px;border-radius:18px;background:linear-gradient(180deg,#082228,#03161a);border:1px solid var(--line);box-shadow:0 20px 50px rgba(0,0,0,.45),0 0 30px rgba(62,230,193,.08)}
.authcard h1{font:400 28px var(--display);margin:0 0 6px;color:var(--neon-soft);text-shadow:0 0 14px rgba(62,230,193,.35)}
.authcard .sub{margin:0 0 22px;color:var(--muted)}
.authcard label{display:block;font-size:13px;color:var(--muted);margin:14px 0 6px}
.authcard input[type=email],.authcard input[type=password],.authcard input[type=text]{width:100%;padding:11px 12px;border-radius:10px;border:1px solid var(--line);background:#031014;color:var(--text);font:15px var(--body)}
.authcard input:focus{outline:none;border-color:var(--neon);box-shadow:0 0 0 3px rgba(62,230,193,.15)}
.authcard .links{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:22px}
.authcard .links a{color:var(--muted);font-size:14px;text-decoration:none}
.authcard .links a:hover{color:var(--neon-soft)}
.authcard.center{text-align:center}
.msg{border-radius:10px;padding:11px 14px;font-size:14px;margin:0 0 6px;line-height:1.45}
.msg.err{background:rgba(255,107,107,.08);border:1px solid rgba(255,107,107,.45);color:#ffb3b3}
.msg.ok{background:rgba(62,230,193,.08);border:1px solid rgba(62,230,193,.45);color:var(--neon-soft)}
.sub-foot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:0;padding-block:20px 28px}
.legal-inline{display:flex;gap:18px}.legal-inline a{color:var(--muted);text-decoration:none}.legal-inline a:hover{color:var(--neon-soft)}

/* FAQ */
.faq{width:min(820px,100%)}
.faq>h1{font:400 clamp(30px,4vw,44px) var(--display);margin:0 0 8px;color:var(--neon-soft);text-shadow:0 0 16px rgba(62,230,193,.4)}
.faq>.lead{color:#b6cbc6;margin:0 0 30px;font-size:17px}
.faq h2{font:500 13px var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:30px 0 12px}
.faq details{border:1px solid var(--line);border-radius:14px;background:var(--panel);margin-bottom:10px;transition:border-color .2s}
.faq details[open]{border-color:rgba(62,230,193,.45);box-shadow:0 0 20px rgba(62,230,193,.08)}
.faq summary{cursor:pointer;list-style:none;padding:16px 20px;font:500 17px var(--display);color:#f0fbf8;display:flex;justify-content:space-between;gap:16px;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--neon);font:300 24px var(--display);transition:transform .25s;flex:none}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq summary:focus-visible{outline:2px solid var(--neon);outline-offset:2px;border-radius:14px}
.faq .ans{padding:0 20px 18px;color:#c4d8d3;line-height:1.6}
.faq .ans p{margin:0 0 10px}.faq .ans p:last-child{margin:0}
.faq .ans a{color:var(--neon-soft)}
.faq .cta{margin-top:34px;padding:24px;border-radius:16px;border:1px solid var(--line);background:rgba(62,230,193,.05);display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.faq .cta p{margin:0;color:#c4d8d3}
@media (max-width:520px){.authcard{padding:26px 20px}.subnav{gap:12px}.subnav .btn{padding:9px 12px;font-size:14px}}

/* Logo */
.logo{display:flex;align-items:center;flex:none}
.logo img{height:42px;width:auto;filter:drop-shadow(0 0 6px rgba(62,230,193,.55));transition:filter .25s}
.logo:hover img{filter:drop-shadow(0 0 12px rgba(62,230,193,.85))}
/* Bild-Banner */
.adbanner.ad-image{padding:0;justify-content:flex-start;gap:0}
.adbanner.ad-image::before{display:none}
.adbanner.ad-image .ad-label{position:absolute;top:6px;left:0;right:0;z-index:2;text-shadow:0 1px 3px #000}
.adbanner.ad-image a,.adbanner.ad-image>img{display:block;width:100%;height:100%}
.adbanner.ad-image img{width:100%;height:100%;object-fit:cover;display:block}

/* Kein Banner -> Hero nutzt die volle Breite */
@media (min-width:1001px){.herozone[style*="--adw:0px"] .wrap{padding-right:20px}}

/* Rechtliches (Datenschutz, Impressum) — gleicher Rahmen wie FAQ, Text in Glas-Karten */
.lgpage .lg-toc{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 26px}
.lgpage .lg-toc a{font-size:13px;color:var(--neon-soft);text-decoration:none;padding:6px 12px;border:1px solid var(--line);border-radius:999px;background:var(--panel);transition:border-color .2s,box-shadow .2s}
.lgpage .lg-toc a:hover,.lgpage .lg-toc a:focus-visible{border-color:var(--neon);box-shadow:0 0 12px rgba(62,230,193,.25);outline:none}
.lgpage .lg-card{border:1px solid var(--line);border-radius:14px;background:var(--panel);padding:20px 24px;margin-bottom:14px;color:#c4d8d3;line-height:1.65;scroll-margin-top:120px;overflow-wrap:anywhere}
.lgpage .lg-card>h2{font:500 20px var(--display);letter-spacing:0;text-transform:none;color:#f0fbf8;margin:0 0 14px;display:flex;align-items:center;gap:12px}
.lgpage .lg-num{flex:none;width:30px;height:30px;border-radius:50%;border:1.5px solid var(--neon);color:var(--neon-soft);display:inline-flex;align-items:center;justify-content:center;font:500 14px var(--display);box-shadow:0 0 10px rgba(62,230,193,.3)}
.lgpage .lg-card h3{font:500 16px var(--display);color:var(--neon-soft);margin:22px 0 8px}
.lgpage .lg-card h4{font:600 14px var(--body);color:#e4f4f0;margin:16px 0 6px}
.lgpage .lg-card p{margin:0 0 10px}
.lgpage .lg-card ul{margin:0 0 10px;padding-left:20px}
.lgpage .lg-card li{margin-bottom:4px}
.lgpage .lg-card a,.lgpage .lg-src a{color:var(--neon-soft)}
.lgpage .lg-card strong{color:#eaf7f3}
.lgpage .lg-src{color:var(--muted);font-size:13px;margin-top:20px}
@media (max-width:600px){.lgpage .lg-card{padding:16px 16px}.lgpage .lg-card>h2{font-size:18px}}
/* Abo-Seite */
.abo-msg{padding:12px 16px;border-radius:12px;margin:0 0 16px;border:1px solid var(--line);background:var(--panel)}
.abo-msg.ok{border-color:rgba(62,230,193,.55);color:var(--neon-soft)}
.abo-msg.err{border-color:rgba(248,113,113,.55);color:#fca5a5}
.abo .abo-state{font:500 17px var(--display);color:#f0fbf8}
.abo-readonly{border-color:rgba(251,191,36,.45)!important}.abo-readonly .abo-state{color:#fcd34d}
.abo-locked{border-color:rgba(248,113,113,.5)!important}.abo-locked .abo-state{color:#fca5a5}
.abo-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}.abo-actions form{margin:0}
.btn-ghost{border-color:var(--line);box-shadow:none}
.btn-danger{border-color:#f87171;color:#fca5a5;box-shadow:none;background:rgba(248,113,113,.08)}
.btn[disabled]{opacity:.45;cursor:not-allowed;box-shadow:none}
.abo-form{margin:6px 0 14px}
.abo-plans{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:14px}
.abo-plan{position:relative;display:flex;flex-direction:column;gap:6px;padding:20px 22px;border:1px solid var(--line);border-radius:14px;background:var(--panel);cursor:pointer;transition:border-color .2s,box-shadow .2s}
.abo-plan input{position:absolute;opacity:0;pointer-events:none}
.abo-plan:has(input:checked){border-color:var(--neon);box-shadow:0 0 22px rgba(62,230,193,.22)}
.abo-plan:has(input:focus-visible){outline:2px solid var(--neon);outline-offset:2px}
.abo-plan-name{font:500 13px var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.abo-price{font:400 34px var(--display);color:var(--neon-soft);text-shadow:0 0 14px rgba(62,230,193,.35)}
.abo-price small{font-size:15px;color:var(--muted);text-shadow:none}
.abo-note{font-size:13px;color:#b6cbc6}
.abo-badge{position:absolute;top:14px;right:14px;font-size:11px;padding:3px 9px;border-radius:999px;border:1px solid var(--neon);color:var(--neon-soft)}
.abo-agree{display:flex;gap:10px;align-items:flex-start;color:#c4d8d3;line-height:1.55;margin:4px 0 16px;cursor:pointer}
.abo-agree input{margin-top:4px;accent-color:var(--neon);width:16px;height:16px;flex:none}
.abo-agree a,.abo-hint a{color:var(--neon-soft)}
.abo-hint{color:#c4d8d3;margin:0 0 14px}.abo-hint.warn{color:#fcd34d}
.abo-submit{width:100%;justify-content:center;font-size:16px;padding:14px 20px}
.abo-secure{color:var(--muted);font-size:13px;margin:12px 0 0;line-height:1.5}
.abo-delete{margin-top:24px}
.abo-input{width:100%;max-width:320px;padding:10px 12px;border-radius:10px;border:1px solid var(--line);background:rgba(0,0,0,.25);color:var(--text);margin:0 0 10px;font:inherit}
@media (max-width:600px){.abo-plans{grid-template-columns:1fr}}
/* Kündigungsbutton-Seite */
.kd-form label{display:block;color:#c4d8d3;margin:0 0 14px;font-size:14px}
.kd-form label .abo-input{display:block;max-width:100%;margin:6px 0 0}
.kd-form textarea.abo-input{resize:vertical;min-height:70px}
.kd-form fieldset{border:none;padding:0;margin:0 0 6px}
.kd-form legend{color:#c4d8d3;font-size:14px;margin-bottom:8px}
.kd-form .abo-agree{margin:0 0 8px}
.kd-back{background:none;border:none;color:var(--neon-soft);cursor:pointer;font:inherit;padding:0;text-decoration:underline}
@media print{.nav,.sub-foot,.abo-actions{display:none!important}body{background:#fff!important;color:#000!important}.lg-card{border-color:#999!important;background:#fff!important;color:#000!important}}
.legal-inline{flex-wrap:wrap;row-gap:6px}

/* Unterseiten: „Zum Cockpit“ für angemeldete Nutzer */
.subnav>a.subcockpit{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:12px;border:1.5px solid rgba(62,230,193,.55);background:rgba(62,230,193,.06);color:#9decd6;font-weight:600;text-decoration:none;opacity:1;white-space:nowrap;transition:box-shadow .2s,background .2s}
.subnav>a.subcockpit:hover{background:rgba(62,230,193,.14);box-shadow:0 0 18px rgba(62,230,193,.45);text-shadow:none}
.subnav .navdot{width:8px;height:8px;border-radius:50%;background:#3ee6c1;box-shadow:0 0 8px #3ee6c1;flex:none}
.subnav .sc-short{display:none}
@media (max-width:720px){.subnav{gap:12px;flex-wrap:wrap;justify-content:flex-end}.subnav .sc-long{display:none}.subnav .sc-short{display:inline}.subnav>a.subcockpit{padding:7px 10px}}
