:root {
  --nata-blue: #56a6ff;
  --nata-cyan: #9be9ff;
  --nata-violet: #7658ff;
}

.nata-page {
  background: #07090c;
}

.nata-hero {
  isolation: isolate;
  background:
    radial-gradient(circle at 72% 34%, rgba(86, 166, 255, .22), transparent 25%),
    radial-gradient(circle at 28% 72%, rgba(118, 88, 255, .18), transparent 32%),
    linear-gradient(145deg, #111725 0%, #090b0f 48%, #040507 100%);
}

.nata-hero::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 14% 7% 9%;
  border: 1px solid rgba(155, 233, 255, .16);
  background:
    linear-gradient(115deg, transparent 0 49.8%, rgba(155, 233, 255, .11) 50%, transparent 50.2%),
    linear-gradient(25deg, transparent 0 49.8%, rgba(86, 166, 255, .09) 50%, transparent 50.2%);
  transform: skewY(-3deg);
}

.nata-grid {
  position: absolute;
  z-index: 0;
  inset: 0;
  opacity: .42;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(to bottom, transparent, #000 24%, #000 78%, transparent);
}

.nata-orbit {
  position: absolute;
  z-index: 0;
  border: 1px solid rgba(155, 233, 255, .22);
  border-radius: 50%;
  box-shadow: 0 0 80px rgba(86, 166, 255, .08), inset 0 0 80px rgba(118, 88, 255, .05);
}

.nata-orbit-one {
  width: min(54vw, 720px);
  height: min(54vw, 720px);
  right: -22%;
  top: 14%;
}

.nata-orbit-two {
  width: min(27vw, 360px);
  height: min(27vw, 360px);
  right: 3%;
  top: 31%;
  border-style: dashed;
}

.nata-hero .hero-shade {
  background:
    linear-gradient(180deg, rgba(4,5,7,.7), transparent 30%, transparent 64%, rgba(4,5,7,.84)),
    linear-gradient(90deg, transparent 44%, rgba(4,5,7,.45) 100%);
}

.nata-hero .eyebrow,
.nata-hero .prize-strip p strong,
.nata-page .form-kicker,
.nata-page .modal-eyebrow {
  color: var(--nata-cyan);
}

.nata-hero .eyebrow span {
  background: var(--nata-blue);
}

.nata-hero .hero-copy {
  max-width: 760px;
}

.nata-hero .hero-copy h1 {
  font-size: clamp(74px, 7.7vw, 146px);
  line-height: .78;
}

.nata-hero .hero-copy h1 strong {
  -webkit-text-stroke-color: rgba(155, 233, 255, .9);
}

.nata-stamp {
  position: absolute;
  z-index: 2;
  top: 18%;
  right: 7%;
  width: 112px;
  height: 112px;
  display: grid;
  place-content: center;
  border: 1px solid rgba(155, 233, 255, .45);
  border-radius: 50%;
  color: var(--nata-cyan);
  text-align: center;
  transform: rotate(8deg);
  box-shadow: 0 0 35px rgba(86, 166, 255, .13);
}

.nata-stamp::before,
.nata-stamp::after {
  content: "";
  position: absolute;
  inset: 8px;
  border: 1px dashed rgba(155, 233, 255, .24);
  border-radius: inherit;
}

.nata-stamp span,
.nata-stamp b {
  display: block;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: .15em;
}

.nata-stamp span { font-size: 10px; }
.nata-stamp b { margin-top: 4px; font-size: 18px; }

.nata-page .form-panel {
  background:
    radial-gradient(circle at 82% 8%, rgba(86, 166, 255, .11), transparent 33%),
    linear-gradient(145deg, #10141c, #07090c 70%);
}

.nata-page .form-frame {
  background: rgba(10, 13, 18, .94);
}

.nata-page .field input:focus,
.nata-page .field select:focus {
  border-color: var(--nata-blue);
  background-color: rgba(86, 166, 255, .06);
}

.nata-page .field select {
  background-image:
    linear-gradient(45deg, transparent 50%, var(--nata-blue) 50%),
    linear-gradient(135deg, var(--nata-blue) 50%, transparent 50%);
}

.email-builder {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(150px, .72fr);
  align-items: center;
}

.email-builder > input,
.email-builder > select {
  min-width: 0;
}

.email-builder > span {
  height: 46px;
  display: grid;
  place-items: center;
  padding: 0 11px;
  border-top: 1px solid rgba(255,255,255,.2);
  border-bottom: 1px solid rgba(255,255,255,.2);
  background: rgba(86,166,255,.08);
  color: var(--nata-cyan);
  font-weight: 800;
}

.email-builder input { border-right: 0; }
.email-builder select { border-left: 0; }

.field small {
  color: #727d8c;
  font: 8px ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.nata-checks {
  margin-top: 17px;
}

.nata-page .checks button,
.nata-page .text-link {
  color: var(--nata-cyan);
}

.nata-page .submit-button,
.nata-page .modal-action {
  background: linear-gradient(100deg, #286fca, var(--nata-violet));
}

.nata-page .success-number {
  border-color: var(--nata-blue);
  color: var(--nata-cyan);
}

.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: 900px) {
  .nata-hero .hero-copy h1 { font-size: clamp(78px, 15vw, 130px); }
  .nata-stamp { top: 17%; right: 6%; width: 94px; height: 94px; }
}

@media (max-width: 580px) {
  .nata-hero .hero-copy h1 { font-size: clamp(61px, 18vw, 88px); }
  .nata-stamp { top: 15%; right: 20px; width: 76px; height: 76px; }
  .nata-stamp b { font-size: 14px; }
  .nata-stamp span { font-size: 8px; }
  .email-builder { grid-template-columns: minmax(0, 1fr) auto minmax(123px, .78fr); }
  .email-builder > span { padding: 0 8px; }
}