:root{
  --black:#0b0b0c;
  --white:#f5f5f7;
  --gray:#a1a1aa;
  --purple:#7c3aed;
  --glow:0 0 24px rgba(124,58,237,.55),0 0 48px rgba(124,58,237,.25);
}

*{box-sizing:border-box}
html,body{height:100%;margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Helvetica Neue,Arial}
body{background:var(--black);color:var(--white)}

.no-scroll{overflow:hidden}

/* Visually hidden */
.sr-only{
  position:absolute !important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}

/* Focus */
:focus-visible{
  outline:2px solid rgba(124,58,237,.85);
  outline-offset:4px;
}

/* Layout */
.split{display:grid;grid-template-columns:1fr 1fr;min-height:100vh;position:relative}
@supports (height: 100svh){
  .split{min-height:100svh}
}

.divider{position:absolute;inset:0;pointer-events:none;display:flex;align-items:center;justify-content:center}
.divider::before{
  content:"";position:absolute;top:0;bottom:0;left:50%;width:1px;
  background:linear-gradient(to bottom,transparent,#3f3f46 15%,#52525b 50%,#3f3f46 85%,transparent)
}

.panel{position:relative;display:flex;align-items:center;justify-content:center;padding:6vw;min-height:100vh;overflow:hidden}
@supports (height: 100svh){
  .panel{min-height:100svh}
}

.hele{background:linear-gradient(180deg,#0c0c0d,#111113)}
.eleh{
  background:
    radial-gradient(1200px 800px at 70% 30%,rgba(124,58,237,.22),transparent 60%),
    linear-gradient(180deg,#0a0a0c,#0c0c10)
}

.pulse{
  position:absolute;inset:auto 12% 12% auto;width:180px;height:180px;border-radius:50%;
  filter:blur(30px);
  background:radial-gradient(circle,rgba(124,58,237,.45),rgba(124,58,237,.1) 60%,transparent 70%);
  opacity:.7;animation:pulse 4.5s ease-in-out infinite
}
@keyframes pulse{0%,100%{transform:scale(.95);opacity:.6}50%{transform:scale(1.05);opacity:.85}}

.content{max-width:720px;text-align:center}
.hero{font-weight:900;font-size:clamp(44px,7vw,82px);line-height:.95;margin:0 0 .22em}
p{margin:.2em 0 1.1em;color:#d4d4d8}

.cta-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* Buttons */
.btn{
  appearance:none;border:1px solid rgba(255,255,255,.14);
  background:rgba(0,0,0,.18);
  color:#e5e7eb;
  padding:.85rem 1.05rem;border-radius:999px;
  font-weight:900;letter-spacing:.06em;text-transform:uppercase;font-size:12px;
  cursor:pointer;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease, background .25s ease;
  text-decoration:none;display:inline-flex;align-items:center;justify-content:center;
}
.btn:hover{transform:translateY(-2px)}
.btn:disabled{opacity:.6;cursor:not-allowed;transform:none}

.btn-neon{
  border-color:rgba(124,58,237,.65);
  background:rgba(124,58,237,.14);
  box-shadow:var(--glow);
  color:#e9d5ff;
}

/* Footer */
.footer{
  padding:16px;
  text-align:center;
  opacity:.78;
  font-size:.82rem;
  letter-spacing:.05em;
}

/* Modal overlay */
.hidden{display:none !important;}
.cta-overlay{
  position:fixed;inset:0;z-index:9999;
  display:flex;align-items:center;justify-content:center;
  padding:18px;
  background:rgba(0,0,0,.65);
  pointer-events:auto;
}
@supports (backdrop-filter: blur(6px)){
  .cta-overlay{backdrop-filter:blur(6px)}
}

/* CTA card */
.cta{
  width:min(720px,92vw);
  border-radius:26px;
  padding:18px 18px 16px;
  background:rgba(20,20,24,.62);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 18px 70px rgba(0,0,0,.55);
  pointer-events:auto;
}
@supports (backdrop-filter: blur(12px)){
  .cta{backdrop-filter:blur(12px)}
}

.cta-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.cta-copy{flex:1}
.cta-title{margin:0;font-size:14px;letter-spacing:.24em;text-transform:uppercase;color:#d4d4d8}
.cta p{margin:6px 0 12px;color:#cfcfd6;font-size:14px;line-height:1.35}

.sigil{
  display:grid;place-items:center;width:54px;height:54px;border-radius:999px;
  background:rgba(0,0,0,.25);border:1px solid rgba(255,255,255,.10)
}
.sigil span{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:#d4d4d8;text-align:center;line-height:1.15}

.close{
  appearance:none;width:38px;height:38px;border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.18);
  color:#e5e7eb;
  cursor:pointer;font-weight:900;
  display:grid;place-items:center;
  transition:transform .2s ease, border-color .2s ease, background .2s ease;
  flex:0 0 auto;
}
.close:hover{
  transform:translateY(-1px);
  border-color:rgba(124,58,237,.55);
  background:rgba(124,58,237,.10);
}

.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:center}
.mt-10{margin-top:10px}

.field{flex:1;min-width:240px}
.field input[type=email]{
  width:100%;
  padding:.9rem 1rem;border-radius:999px;border:1px solid rgba(124,58,237,0.25);
  background:rgba(20,20,28,0.35);color:#f0f0f4;font-weight:600;
  transition:border-color .3s ease, box-shadow .3s ease;
}
.field input[type=email]::placeholder{color:#a1a1aa}
.field input[type=email]:focus{
  outline:none;border-color:rgba(124,58,237,0.65);
  box-shadow:0 0 12px rgba(124,58,237,0.25);
}

.chips{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.chip{
  cursor:pointer; user-select:none;
  display:inline-flex;align-items:center;justify-content:center;
  padding:.55rem .85rem;border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.20);
  color:#e5e7eb;font-weight:900;letter-spacing:.08em;text-transform:uppercase;
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease, background .2s ease;
  font-size:12px;
  min-width:70px;
  position:relative;
}
.chip:hover{transform:translateY(-1px)}
.chip[data-on="true"]{
  border-color:rgba(124,58,237,.7);
  background:rgba(124,58,237,.12);
  box-shadow:0 0 0 6px rgba(124,58,237,.08);
  color:#e9d5ff;
}
.chip input{
  position:absolute;
  opacity:0;
  pointer-events:none;
  width:1px;height:1px;
}

.consent{
  display:flex;gap:10px;align-items:flex-start;
  margin-top:10px;font-size:.72rem;letter-spacing:.12em;color:#a1a1aa;text-align:left
}
.consent input{margin-top:2px}
.consent a{color:#cfcfd6;text-decoration:none;border-bottom:1px solid rgba(207,207,214,.25)}
.consent a:hover{border-bottom-color:rgba(207,207,214,.55)}
.status{display:none;margin-top:10px}
.mini{letter-spacing:.24em;text-transform:uppercase;color:#a1a1aa;font-size:.75rem}
.tip{margin-top:10px;text-align:center}

/* Honeypot */
.hp{position:absolute;left:-9999px;opacity:0}

/* Mobile */
@media (max-width:900px){
  .split{grid-template-columns:1fr}
  .divider::before{left:0;top:50%;right:0;width:auto;height:1px}
  .panel{min-height:min(90vh,820px)}
}

/* Social */
.social{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:20;
  display:flex;
  gap:10px;
  padding:10px 12px;
  border-radius:999px;
  background:rgba(0,0,0,.22);
  border:1px solid rgba(255,255,255,.10);
}
@supports (backdrop-filter: blur(8px)){
  .social{backdrop-filter:blur(8px)}
}

.social a{
  width:36px;height:36px;
  display:grid;place-items:center;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.18);
  transition:transform .2s ease, border-color .2s ease, background .2s ease;
}
.social a:hover{
  transform:translateY(-2px);
  border-color:rgba(255,255,255,.22);
  background:rgba(124,58,237,.10);
}
.social svg{
  width:18px;height:18px;
  fill:none;
  stroke:#fff;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; }
}
