/* LightCore Client: gleiche Familie wie Store und Studio, eigener Charakter durch HUD-Rahmen und Mono-Beschriftung */
:root{--grund:#080616;--flaeche:#0e0b23;--flaeche2:#141038;--linie:rgba(214,190,255,.2);--text:#fbf6ee;--text2:#cfc8ea;--text3:#a39cc9;--gold:#ffc46b;--lila:#b46ef0;--schrift:'Manrope','Segoe UI',system-ui,sans-serif;--mono:'DM Mono',ui-monospace,monospace}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:128px;scrollbar-color:#1b1850 var(--grund)}
body{margin:0;background:var(--grund);color:var(--text);font:400 17px/1.65 var(--schrift);-webkit-font-smoothing:antialiased;overflow-wrap:break-word}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
[hidden]{display:none!important}
::selection{background:var(--gold);color:#1a1238}
h1,h2,h3{margin:0;font-weight:800;line-height:1.08;letter-spacing:-.03em;text-wrap:balance}
h1{font-size:clamp(44px,6.4vw,84px)}
h1 em{font-style:normal;color:var(--gold)}
h2{font-size:clamp(32px,4.4vw,54px);margin-bottom:28px}
h3{font-size:20px;letter-spacing:-.015em}
.rahmen{width:min(1320px,calc(100% - 32px));margin-inline:auto}
.sprung{position:absolute;left:16px;top:-70px;z-index:60;padding:8px 14px;background:var(--gold);color:#1a1238;font-weight:700}
.sprung:focus{top:12px}
.marker{display:flex;align-items:center;gap:9px;margin:0 0 14px;font:500 13px var(--mono);letter-spacing:.12em;color:var(--gold)}
.marker i{width:8px;height:8px;background:#26d991;box-shadow:0 0 10px #26d99188}
.intro{margin:22px 0 30px;max-width:56ch;color:var(--text2);font-size:clamp(18px,1.6vw,20px)}
.intro.klein{margin-top:-14px;font-size:17px}
.knoepfe{display:flex;flex-wrap:wrap;gap:12px}
.knopf{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;background:var(--gold);color:#1a1238;font-weight:800;font-size:16px;text-decoration:none;transition:transform .2s,filter .2s}
.knopf:hover{filter:brightness(1.08);transform:translateY(-2px)}
.knopf.zweit{background:transparent;color:var(--text);box-shadow:inset 0 0 0 1px rgba(214,190,255,.4)}
.knopf.zweit:hover{box-shadow:inset 0 0 0 1px var(--gold)}
.held{padding:clamp(40px,6vw,88px) 0;background:radial-gradient(ellipse at 80% 10%,rgba(180,110,240,.2),transparent 45%),linear-gradient(140deg,#0d0a26,#080616 65%);border-bottom:1px solid var(--linie)}
.held-raster{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:clamp(28px,5vw,72px);align-items:center}
/* HUD-Ecken: das Erkennungszeichen der Client-Seite */
.hud-rahmen{position:relative;margin:0;padding:8px;background:var(--flaeche);border:1px solid var(--linie)}
.hud-rahmen::before,.hud-rahmen::after{content:"";position:absolute;width:22px;height:22px;border:2px solid var(--gold);pointer-events:none}
.hud-rahmen::before{top:-1px;left:-1px;border-right:0;border-bottom:0}
.hud-rahmen::after{right:-1px;bottom:-1px;border-left:0;border-top:0}
.hud-rahmen img{width:100%;aspect-ratio:16/9;object-fit:cover}
.hud-rahmen figcaption{padding:9px 4px 3px;font:400 13px var(--mono);color:var(--text3)}
.sprungleiste{position:sticky;top:68px;z-index:40;background:rgba(8,6,22,.94);border-bottom:1px solid var(--linie)}
.sprungleiste .rahmen{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none}
.sprungleiste .rahmen::-webkit-scrollbar{display:none}
.sprungleiste a{flex:none;display:flex;align-items:center;min-height:46px;padding:0 12px;font:500 14px var(--mono);color:var(--text2);text-decoration:none}
.sprungleiste a:hover{color:var(--gold)}
.block{padding:clamp(60px,8vw,104px) 0;border-bottom:1px solid var(--linie)}
.stand-kopf{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:18px}
.stand-kopf h2{margin:0}
.stand-kopf strong{font-size:clamp(56px,8vw,96px);line-height:1;font-weight:800;color:var(--gold);font-variant-numeric:tabular-nums}
.stand-kopf strong span{font-size:.5em}
.balken{height:18px;background:rgba(214,190,255,.12);margin-bottom:36px}
.balken i{display:block;height:100%;background:var(--gold)}
.schritte{list-style:none;counter-reset:s;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));margin:0 0 36px;padding:0}
.schritte li{counter-increment:s;position:relative;padding:58px 10px 0 0;color:var(--text3)}
.schritte li::before{content:"";position:absolute;top:19px;left:0;right:0;height:4px;background:rgba(214,190,255,.16)}
.schritte li::after{content:counter(s);position:absolute;top:0;left:0;display:grid;place-items:center;width:42px;height:42px;background:var(--flaeche2);border:1px solid var(--linie);font:500 15px var(--mono);color:var(--text2)}
.schritte li.fertig::before,.schritte li.jetzt::before{background:var(--gold)}
.schritte li.fertig::after{content:"✓";background:var(--gold);border-color:var(--gold);color:#1a1238}
.schritte li.jetzt::after{background:#fff;border-color:#fff;color:#1a1238;box-shadow:0 0 0 5px rgba(255,196,107,.45)}
.schritte b{display:block;color:var(--text2);font-size:17px}
.schritte li.jetzt b,.schritte li.fertig b{color:var(--text)}
.schritte span{display:block;margin-top:3px;font-size:14px;line-height:1.4}
.hud{padding:22px;background:var(--flaeche);border:1px solid var(--linie);border-top:2px solid rgba(255,196,107,.55)}
.hud p{margin:8px 0 0;color:var(--text2);font-size:16px}
.hud ul{list-style:none;margin:12px 0 0;padding:0}
.hud li{padding:8px 0;color:var(--text2);font-size:15.5px;border-top:1px solid rgba(214,190,255,.12)}
.stand-raster,.grund{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.grund{grid-template-columns:repeat(4,minmax(0,1fr))}
.stand-notiz{margin:18px 0 0;font-size:14.5px;color:var(--text3)}
.bilder{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.phasen{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:0;padding:0}
.phasen small{display:block;margin-bottom:12px;font:500 12.5px var(--mono);letter-spacing:.08em;color:var(--text3)}
.phasen .jetzt{background:var(--flaeche2);border-top-color:var(--gold)}
.phasen .jetzt small{color:var(--gold)}
.suche{display:grid;gap:7px;max-width:560px;margin-bottom:28px}
.suche span{font:500 13px var(--mono);color:var(--text3)}
.suche input{width:100%;min-height:50px;padding:0 15px;background:var(--flaeche);border:1px solid var(--linie);color:var(--text);font:400 16px var(--schrift)}
.suche input:focus{border-color:var(--gold);outline:0}
.phase-gruppe{margin-top:34px}
.phase-gruppe h3{margin-bottom:12px;color:var(--gold)}
.modul{border:1px solid var(--linie);background:var(--flaeche);margin-top:-1px}
.modul summary{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:58px;padding:12px 18px;cursor:pointer}
.modul summary:hover b{color:var(--gold)}
.modul summary b{font-size:17px}
.modul summary small{flex:none;font:400 13px var(--mono);color:var(--text3)}
.modul>p{margin:0;padding:0 18px 12px;color:var(--text2);max-width:70ch}
.modul ul{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 28px;margin:0;padding:0 18px 14px}
.modul li{padding:10px 0;border-top:1px solid rgba(214,190,255,.12)}
.modul li b{display:block;font-size:15.5px}
.modul li em{display:inline-block;margin-left:8px;padding:1px 7px;font:400 12px var(--mono);color:var(--gold);box-shadow:inset 0 0 0 1px rgba(255,196,107,.45)}
.modul li span{display:block;font-size:14.5px;color:var(--text2);line-height:1.5}
.leer{color:var(--text2)}
.fragen{max-width:860px}
.fragen details{border-top:1px solid var(--linie)}
.fragen details:last-child{border-bottom:1px solid var(--linie)}
.fragen summary{padding:18px 0;font-weight:700;font-size:18px;cursor:pointer}
.fragen summary:hover{color:var(--gold)}
.fragen p{margin:0 0 20px;color:var(--text2);max-width:70ch}
.fuss{padding:44px 0 22px;background:#070513}
.fuss-raster{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:28px}
.fuss-raster p{margin:12px 0 0;color:var(--text3);font-size:15px}
.fuss nav{display:grid;gap:8px;align-content:start;font-size:15px}
.fuss nav b{color:var(--text)}
.fuss nav a{color:var(--text2);text-decoration:none;overflow-wrap:anywhere}
.fuss nav a:hover{color:var(--gold)}
.fuss .hinweis{margin-top:30px;font:400 12px/1.6 var(--mono);color:var(--text3)}
@media(max-width:1000px){.grund,.phasen{grid-template-columns:repeat(2,minmax(0,1fr))}.schritte{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:26px}.schritte li::before{display:none}}
@media(max-width:860px){
  html{scroll-padding-top:118px}
  .sprungleiste{top:62px}
  .held-raster,.stand-raster,.bilder{grid-template-columns:minmax(0,1fr)}
  .fuss-raster{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fuss-raster>div{grid-column:1/-1}
  .modul ul{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:560px){
  .grund,.phasen{grid-template-columns:minmax(0,1fr)}
  .schritte{grid-template-columns:minmax(0,1fr);row-gap:0}
  .schritte li{padding:0 0 20px 58px;min-height:62px}
  .schritte li::before{display:block;top:0;bottom:0;left:19px;right:auto;width:4px;height:auto}
  .schritte li:last-child::before{display:none}
  .fuss-raster{grid-template-columns:minmax(0,1fr)}
  .knoepfe .knopf{flex:1 1 100%}
  .modul summary{padding:12px 14px}.modul>p{padding:0 14px 12px}.modul ul{padding:0 14px 12px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}