:root{
  --bg:#020304;
  --panel:#080a0d;
  --text:#f4f4f3;
  --muted:#a4a6ab;
  --line:rgba(255,255,255,.22);
  --blue:#9fd8ff;
  --gold:#f2d27c;
}
*{box-sizing:border-box}
html{min-height:100%;background:var(--bg)}
body{
  margin:0;
  min-height:100vh;
  color:var(--text);
  background:
    radial-gradient(circle at 16% 62%,rgba(73,151,206,.07),transparent 24rem),
    radial-gradient(circle at 82% 66%,rgba(213,173,75,.07),transparent 24rem),
    linear-gradient(180deg,#020304 0%,#010203 100%);
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
button,input{font:inherit}
.page-shell{
  position:relative;
  min-height:100vh;
  overflow:hidden;
  display:grid;
  place-items:center;
  padding:clamp(28px,4vw,56px) 22px;
}
.page-shell:after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(0,0,0,.34),transparent 16%,transparent 84%,rgba(0,0,0,.34));
}
.hero{
  position:relative;
  z-index:3;
  width:min(880px,100%);
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}
.logo-wrap{
  position:relative;
  width:min(760px,94vw);
  margin:-5vh auto clamp(18px,2.4vw,34px);
}
.logo-wrap:after{
  content:"";
  position:absolute;
  left:16%;
  right:16%;
  bottom:9%;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);
  filter:blur(.3px);
}
.logo{
  width:100%;
  height:auto;
  display:block;
  mix-blend-mode:screen;
  filter:drop-shadow(0 0 12px rgba(255,255,255,.08));
}
.binary{
  position:absolute;
  z-index:1;
  width:min(760px,72vw);
  opacity:.14;
  pointer-events:none;
  filter:grayscale(1) contrast(1.1);
}
.binary--left{top:-70px;left:-230px;transform:rotate(-10deg)}
.binary--right{top:-60px;right:-230px;transform:scaleX(-1) rotate(-8deg)}
.ambient{
  position:absolute;
  z-index:1;
  width:420px;height:240px;
  border-radius:50%;
  filter:blur(75px);
  opacity:.09;
}
.ambient--blue{left:10%;bottom:10%;background:#64b9f6}
.ambient--gold{right:10%;bottom:10%;background:#d6a93c}
.eyebrow-row{
  width:min(570px,86vw);
  display:grid;
  grid-template-columns:1fr auto 1fr;
  gap:18px;
  align-items:center;
  margin-bottom:22px;
}
.eyebrow{
  font-family:Sora,Inter,sans-serif;
  text-transform:uppercase;
  letter-spacing:.48em;
  font-size:11px;
  white-space:nowrap;
  color:#f1f1f1;
}
.line{height:1px;position:relative;opacity:.9}
.line:after{
  content:"";
  width:4px;height:4px;
  border-radius:50%;
  position:absolute;top:50%;transform:translateY(-50%);
}
.line--blue{
  background:linear-gradient(90deg,transparent,rgba(159,216,255,.85));
}
.line--blue:after{right:0;background:var(--blue);box-shadow:0 0 10px var(--blue)}
.line--gold{
  background:linear-gradient(90deg,rgba(242,210,124,.85),transparent);
}
.line--gold:after{left:0;background:var(--gold);box-shadow:0 0 10px var(--gold)}
h1{
  margin:0;
  font-family:Sora,Inter,sans-serif;
  font-weight:400;
  letter-spacing:-.045em;
  font-size:clamp(52px,7vw,94px);
  line-height:.98;
}
.lede{
  margin:18px 0 30px;
  color:var(--muted);
  font-size:clamp(16px,1.65vw,20px);
  line-height:1.65;
}
.signup{
  width:min(700px,100%);
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  column-gap:14px;
  row-gap:12px;
  align-items:center;
}
.field-wrap{
  position:relative;
}
input[type="email"]{
  width:100%;
  height:68px;
  border-radius:9px;
  border:1px solid rgba(255,255,255,.28);
  background:rgba(6,8,10,.82);
  color:#fff;
  outline:none;
  padding:0 58px 0 22px;
  font-size:17px;
  box-shadow:0 10px 44px rgba(0,0,0,.34),0 0 0 1px rgba(255,255,255,.02) inset;
  transition:.2s ease;
}
input[type="email"]::placeholder{color:#92959c}
input[type="email"]:focus{
  border-color:rgba(159,216,255,.72);
  box-shadow:0 0 0 3px rgba(159,216,255,.08),0 12px 44px rgba(0,0,0,.36);
}
.mail-icon{
  position:absolute;
  width:25px;height:25px;
  top:50%;right:20px;transform:translateY(-50%);
  fill:none;stroke:#94979d;stroke-width:1.35;stroke-linejoin:round;stroke-linecap:round;
}
.notify-button{
  position:relative;
  min-width:186px;
  height:68px;
  border-radius:9px;
  padding:0 28px;
  color:#fff;
  border:1px solid transparent;
  background:
    linear-gradient(#080a0c,#080a0c) padding-box,
    linear-gradient(90deg,var(--blue),#d8d6cb 48%,var(--gold)) border-box;
  box-shadow:-10px 12px 28px rgba(90,171,229,.08),12px 12px 28px rgba(223,181,73,.09);
  font-family:Sora,Inter,sans-serif;
  font-size:17px;
  font-weight:600;
  letter-spacing:.01em;
  cursor:pointer;
  transition:transform .16s ease,box-shadow .16s ease,filter .16s ease;
}
.notify-button:hover{transform:translateY(-1px);filter:brightness(1.12)}
.notify-button:active{transform:translateY(0)}
.notify-button:disabled{cursor:wait;opacity:.65}
.consent{
  grid-column:1 / -1;
  justify-self:center;
  display:flex;
  align-items:flex-start;
  gap:9px;
  color:#8f9298;
  font-size:12px;
  line-height:1.45;
  text-align:left;
}
.consent input{margin-top:2px;accent-color:#d8d8d8}
.micro{
  margin:12px 0 0;
  color:#7f8288;
  font-size:12px;
  letter-spacing:.12em;
}
.status{
  min-height:22px;
  margin:10px 0 0;
  color:#d7d9dc;
  font-size:13px;
}
.status.success{color:#cce7d5}
.status.error{color:#f1b6b6}
.signal-divider{
  width:min(610px,78vw);
  display:grid;
  grid-template-columns:1fr minmax(160px,220px) 1fr;
  align-items:center;
  gap:12px;
  margin:25px 0 8px;
  opacity:.74;
}
.signal-divider img{width:100%;display:block;filter:grayscale(.3)}
.signal-line{
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);
}
.tagline{
  margin:0;
  color:#b9bbc0;
  font-family:Sora,Inter,sans-serif;
  text-transform:uppercase;
  letter-spacing:.34em;
  font-size:clamp(9px,1vw,11px);
  line-height:1.8;
}
.honeypot{
  position:absolute!important;
  left:-9999px!important;
  width:1px!important;
  height:1px!important;
  opacity:0!important;
  pointer-events:none!important;
}
.sr-only{
  position:absolute!important;
  width:1px!important;height:1px!important;
  padding:0!important;margin:-1px!important;
  overflow:hidden!important;clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;border:0!important;
}
@media (max-width:720px){
  .page-shell{padding:26px 18px 30px}
  .logo-wrap{margin-top:-2vh;width:min(690px,116vw)}
  .binary{width:900px;opacity:.1}
  .binary--left{left:-600px;top:-80px}
  .binary--right{right:-600px;top:-80px}
  .eyebrow-row{gap:10px;margin-bottom:18px}
  .eyebrow{font-size:9px;letter-spacing:.31em}
  .lede{margin-bottom:24px}
  .signup{grid-template-columns:1fr}
  .notify-button{width:100%}
  .consent{grid-column:1}
  .signal-divider{margin-top:22px}
  .tagline{letter-spacing:.2em}
}
@media (max-height:760px) and (min-width:721px){
  .page-shell{padding-top:16px;padding-bottom:18px}
  .logo-wrap{width:min(650px,75vw);margin-top:-8vh;margin-bottom:10px}
  .eyebrow-row{margin-bottom:14px}
  h1{font-size:clamp(48px,6vw,72px)}
  .lede{margin:12px 0 18px}
  input[type="email"],.notify-button{height:60px}
  .signal-divider{margin-top:12px}
}
@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{scroll-behavior:auto!important;transition:none!important}
}
