*{box-sizing:border-box}
html,body{margin:0}
:root{
  --bg:#0b0b0f;            /* dark base from non-functional */
  --fg:#ececf1;
  --muted:#b7b8c3;
  --accent:#cfd6ff;
  --ring:#222327;
}
html,body{height:100%}
body{
  font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,'SF Pro Text','Segoe UI',Roboto,Helvetica,Arial;
  color:var(--fg);
  background: radial-gradient(1200px 800px at 50% -10%, #0f0f14, transparent 60%), var(--bg);
  overflow-x:hidden;
}

/* Subtle texture overlay using noise.png */
body::after{
  content:"";
  position:fixed; inset:0;
  background-image:url('assets/noise.png');
  background-size:300px 300px;
  opacity:.06; pointer-events:none;
  mix-blend-mode:overlay;
}

/* Radial glows styled like the non-functional */
.bg{position:fixed; inset:0; overflow:hidden; pointer-events:none}
.glow{position:absolute;border-radius:50%;filter:blur(60px);opacity:.32;mix-blend-mode:screen}
.glow-a{width:520px;height:520px;left:10%;top:-10%;background:radial-gradient(circle at 30% 30%, #aab4ff, transparent 60%)}
.glow-b{width:360px;height:360px;right:6%;bottom:-8%;background:radial-gradient(circle at 30% 30%, #ffbfd8, transparent 60%)}

/* Layout */
.wrap{min-height:100svh;display:grid;place-items:center;text-align:center;padding:40px}
.card{ /* removed chrome */
  position:relative;
  padding:28px 28px 34px;
  border-radius:16px;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(6px);
  filter:drop-shadow(0 12px 24px rgba(0,0,0,.35));
}

.logo{width:min(360px,46vw);height:auto;display:block;margin:0 auto 10px; filter: drop-shadow(0 6px 16px rgba(0,0,0,.35));}

h1{margin:6px 0 4px;font-size:clamp(28px,6vw,54px);letter-spacing:-.01em}
.sub{margin:8px auto 18px;max-width:60ch;color:var(--muted);font-size:clamp(14px,1.6vw,18px)}

/* Form (functional Netlify) */
.notify{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.notify input[type=email]{
  min-width:260px;
  padding:14px 16px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);
  color:var(--fg);
  outline:none;
}
.notify input[type=email]::placeholder{color:#b9bbbf}
.notify button{
  padding:14px 18px;
  border-radius:999px;
  border:0;
  font-weight:600;
  cursor:pointer;
  background:linear-gradient(180deg,#f4f6ff,#cdd7ff);
  color:#0b0b0f;
  box-shadow:0 8px 20px rgba(175,183,255,.25);
}
.notify button:focus{outline:2px solid var(--ring); outline-offset:2px}

footer{margin-top:20px;color:#a5a7ac;font-size:14px}

/* Smooth fade-in from functional */
.reveal{opacity:0;transform:translateY(12px) scale(.98);transition:opacity 1.6s ease, transform 1.6s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}
.delay-1{transition-delay:.1s}.delay-2{transition-delay:.25s}.delay-3{transition-delay:.4s}
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}


/* Flow layout without boxed card */
.content{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:12px;
  padding: min(8vw, 48px);
}

/* Background video layer */
.bg-video{
  position:fixed; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  filter: blur(20px) saturate(120%) brightness(70%);
  opacity:.45;
  z-index:-2;
}

/* Ensure glows sit above video but below content */
.bg{z-index:-1}
body::after{z-index:0}
.wrap{position:relative; z-index:1}
.logo{margin-bottom:6px}