@font-face{font-family:Grenze;src:url(fonts/GrenzeGotisch-Black.ttf);font-weight:900;font-display:swap}
@font-face{font-family:SpaceMono;src:url(fonts/SpaceMono-Regular.ttf);font-display:swap}
@font-face{font-family:SpaceMono;src:url(fonts/SpaceMono-Bold.ttf);font-weight:700;font-display:swap}
@font-face{font-family:Inter;src:url(fonts/Inter-Regular.ttf);font-display:swap}
@font-face{font-family:Inter;src:url(fonts/Inter-SemiBold.ttf);font-weight:600;font-display:swap}
:root{--void:#0B0B0F;--cream:#F4EFE6;--pink:#E2457A;--butter:#FCEFB4;--green:#7CFF6B;--white:#FFFDF9;--blush:#F7D6E1;--ink:#2A2530}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{background:var(--void);color:var(--cream);font:17px/1.6 Inter,system-ui,sans-serif;overflow-x:hidden}
a{color:inherit}
.sky{position:fixed;inset:0;z-index:-1;background:radial-gradient(ellipse at 75% 20%,#2a0f1d 0,transparent 55%),radial-gradient(ellipse at 10% 90%,#141024 0,transparent 50%),var(--void)}
#stars{position:absolute;inset:0;width:100%;height:100%}
.layer{position:absolute;inset:-50%;background-repeat:repeat;animation:drift linear infinite}
.l1{background-image:radial-gradient(1px 1px at 20px 30px,#F4EFE6aa,transparent),radial-gradient(1px 1px at 140px 90px,#F4EFE680,transparent),radial-gradient(1.5px 1.5px at 90px 160px,#FCEFB4aa,transparent);background-size:200px 200px;animation-duration:240s}
.l2{background-image:radial-gradient(1.5px 1.5px at 60px 80px,#F4EFE6cc,transparent),radial-gradient(1px 1px at 250px 210px,#E2457Aaa,transparent);background-size:320px 320px;animation-duration:160s}
.l3{background-image:radial-gradient(2px 2px at 100px 120px,#FCEFB4,transparent);background-size:520px 520px;animation-duration:100s;opacity:.7}
@keyframes drift{to{transform:translate(25%,12%)}}
.nav{position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;align-items:center;padding:14px 5vw;background:#0B0B0Fcc;backdrop-filter:blur(8px);border-bottom:1px solid #ffffff14}
.brand{font:900 30px Grenze,serif;text-decoration:none}
.nav nav{display:flex;gap:22px;align-items:center;font:700 12px SpaceMono,monospace;letter-spacing:.12em;text-transform:uppercase}
.nav nav a{text-decoration:none}.nav nav a:hover{color:var(--pink)}
.btn{display:inline-block;background:var(--pink);color:var(--void);font:700 14px SpaceMono,monospace;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;padding:14px 26px;border-radius:999px;border:2px solid var(--pink);cursor:pointer;transition:transform .2s}
.btn:hover{transform:translateY(-2px)}
.btn.ghost{background:transparent;color:var(--cream);border-color:var(--cream)}
.btn.sm{padding:9px 16px;font-size:11px}
.lab{font:700 12px SpaceMono,monospace;letter-spacing:.2em;color:var(--pink)}
.hero{min-height:min(88vh,860px);display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:4vw;padding:60px 6vw}
.wm{font:900 clamp(64px,9.5vw,150px)/.95 Grenze,serif;white-space:nowrap;margin-top:14px}
.rule{width:min(60%,420px);height:3px;background:var(--pink);margin:14px 0 10px}
.sub{font:700 clamp(18px,2vw,26px) SpaceMono,monospace;letter-spacing:.32em;color:var(--pink)}
.tag{font:400 16px SpaceMono,monospace;color:var(--butter);margin-top:10px}
.lede{max-width:34em;margin:26px 0 30px;color:#F4EFE6dd;font-size:19px}
.btns{display:flex;gap:14px;flex-wrap:wrap}
.hr{display:flex;justify-content:center}
.lid{width:min(100%,520px);filter:drop-shadow(0 0 60px #E2457A55)}
.spin{animation:spin 90s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.checker{height:28px;background:url(assets/checker-strip.svg) repeat-x;background-size:auto 28px}
.sec{padding:100px 6vw;max-width:1280px;margin:auto}
h2{font:900 clamp(44px,6vw,80px)/1 Grenze,serif;margin:10px 0 24px}
.note{display:inline-block;font:400 12px SpaceMono,monospace;color:var(--butter);border:1px dashed #FCEFB488;padding:8px 12px;border-radius:8px;margin-bottom:34px}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.card{background:#14141bcc;border:1px solid #ffffff1a;border-radius:18px;padding:18px;text-align:center;transition:border-color .2s,transform .2s}
.card:hover{border-color:var(--pink);transform:translateY(-4px)}
.card img{width:100%;height:230px;object-fit:contain}
.card h3{font:700 14px SpaceMono,monospace;letter-spacing:.1em;margin:12px 0 4px}
.ph{font:400 12px SpaceMono,monospace;color:#F4EFE688;margin-bottom:12px}
.ghostc{opacity:.55;border-style:dashed}
.steps{list-style:none;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.steps li{border-top:3px solid var(--pink);padding-top:16px}
.steps b{font:700 14px SpaceMono,monospace;color:var(--green)}
.steps h3{font:900 30px Grenze,serif;margin:6px 0}
.steps p{color:#F4EFE6cc;font-size:15px}
.events{background:var(--white);color:var(--ink);padding:100px 6vw;text-align:center}
.evin{max-width:980px;margin:auto}
.mono{width:110px;margin-bottom:14px}
.evlab{font:700 12px SpaceMono,monospace;letter-spacing:.2em;color:var(--pink)}
.events h2{color:var(--ink)}
.evrule{width:160px;height:2px;background:var(--pink);margin:0 auto 34px}
.evgrid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-bottom:36px}
.evc{background:var(--cream);border:1px solid var(--blush);border-radius:18px;padding:32px;text-align:left}
.evc h3{font:600 24px Inter,sans-serif;color:var(--pink);margin-bottom:6px}
.evbtn{color:var(--white)}
.signup{text-align:center}
.signup form{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:10px 0 22px}
.signup input{min-width:min(340px,100%);padding:14px 20px;border-radius:999px;border:2px solid var(--cream);background:transparent;color:var(--cream);font:16px SpaceMono,monospace}
.msg{width:100%;color:var(--butter);font:13px SpaceMono,monospace}
.foot{background:#0B0B0Fee}
.fin{text-align:center;padding:50px 6vw 40px}
.fin .brand{font-size:48px}
.soc{margin:16px 0;font:700 13px SpaceMono,monospace;letter-spacing:.12em;text-transform:uppercase}
.soc a:hover{color:var(--pink)}
.fine{font:12px SpaceMono,monospace;color:#F4EFE677}
@media (max-width:900px){
 .hero{grid-template-columns:1fr;text-align:center;min-height:auto;padding-top:30px}
 .sec,.events{padding:64px 6vw}
 .hero .rule{margin:14px auto 10px}.btns{justify-content:center}.lede{margin-inline:auto}
 .hr{order:-1}.lid{width:min(72vw,360px)}
 .grid{grid-template-columns:repeat(2,1fr);gap:14px}.card img{height:170px}
 .steps,.evgrid{grid-template-columns:1fr}
 .nav nav a:not(.btn){display:none}
}
@media (prefers-reduced-motion:reduce){.layer,.spin{animation:none}}
