html {
  background:#060614
}
body {
  overflow-x:hidden;
  isolation:isolate
}
.top,main,footer {
  position:relative;
  z-index:1
}
.ambient {
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  overflow:hidden;
  background:radial-gradient(ellipse 76% 46% at 50% -10%,#2b1a8466,transparent 68%)
}
.ambient:before {
  content:'';
  position:absolute;
  inset:0;
  background-image:linear-gradient(#a787ff0b 1px,transparent 1px),linear-gradient(90deg,#6eb2ff09 1px,transparent 1px);
  background-size:58px 58px;
  mask-image:linear-gradient(to bottom,#0008,transparent 58%);
  animation:grid-drift 20s linear infinite
}
.ambient:after {
  content:'';
  position:absolute;
  inset:-30%;
  background:conic-gradient(from 180deg at 50% 50%,transparent,#6246e82a,transparent 22%,#00a6ff21,transparent 43%,#a540ff29,transparent 66%);
  filter:blur(50px);
  animation:aurora-spin 24s linear infinite
}
.ambient span {
  position:absolute;
  border-radius:50%;
  filter:blur(1px);
  opacity:.56;
  mix-blend-mode:screen
}
.ambient span:nth-child(1) {
  width:360px;
  height:360px;
  left:-155px;
  top:18%;
  background:#5b32f14a;
  box-shadow:0 0 90px 34px #5b32f133;
  animation:orb-one 16s ease-in-out infinite alternate
}
.ambient span:nth-child(2) {
  width:280px;
  height:280px;
  right:-75px;
  top:42%;
  background:#087eff42;
  box-shadow:0 0 100px 28px #087eff28;
  animation:orb-two 19s ease-in-out infinite alternate
}
.ambient span:nth-child(3) {
  width:190px;
  height:190px;
  left:39%;
  bottom:-50px;
  background:#b94dff35;
  box-shadow:0 0 85px 22px #b94dff2b;
  animation:orb-three 14s ease-in-out infinite alternate
}
.top {
  transition:background .35s ease,border-color .35s ease
}
.top:hover {
  background:#0b0b22ed
}
.btn {
  position:relative;
  overflow:hidden;
  isolation:isolate;
  transition:transform .25s ease,box-shadow .25s ease
}
.btn:after {
  content:'';
  position:absolute;
  inset:-70% auto -70% -35%;
  width:28%;
  z-index:-1;
  transform:rotate(18deg);
  background:#fff8;
  filter:blur(8px);
  opacity:0;
  transition:transform .55s ease,opacity .35s ease
}
.btn:hover {
  box-shadow:0 14px 36px #6d46ff88
}
.btn:hover:after {
  opacity:.55;
  transform:translateX(560%) rotate(18deg)
}
.art:before {
  content:'';
  position:absolute;
  inset:7% -5% 7% 7%;
  border:1px solid #9b84ff49;
  border-radius:48px;
  transform:rotate(-4deg);
  box-shadow:inset 0 0 44px #5a45ff20,0 0 65px #4022c138;
  pointer-events:none
}
.art:after {
  content:'';
  position:absolute;
  z-index:2;
  inset:7% -4% 8% 0;
  border-radius:42px;
  background:linear-gradient(110deg,transparent 28%,#bde8ff23 43%,transparent 56%);
  mix-blend-mode:screen;
  pointer-events:none;
  animation:scan 7s ease-in-out infinite 2.5s
}
.hero-copy,.art,.top {
  opacity:0
}
.is-ready .top {
  animation:site-enter .75s cubic-bezier(.2,.8,.2,1) .1s forwards
}
.is-ready .hero-copy {
  animation:site-enter .9s cubic-bezier(.2,.8,.2,1) .28s forwards
}
.is-ready .art {
  animation:art-enter 1.1s cubic-bezier(.16,1,.3,1) .42s forwards
}
.is-ready .art img {
  animation:hero-breathe 8s ease-in-out 1.55s infinite
}
.reveal {
  opacity:0;
  transform:translateY(32px) scale(.985);
  filter:blur(7px);
  transition:opacity .72s cubic-bezier(.2,.8,.2,1),transform .72s cubic-bezier(.2,.8,.2,1),filter .72s ease;
  transition-delay:var(--reveal-delay,0ms)
}
.reveal.is-visible {
  opacity:1;
  transform:none;
  filter:none
}
.reveal.is-visible.card:hover {
  transform:translateY(-4px)
}
#intro {
  position:fixed;
  inset:0;
  z-index:50;
  display:grid;
  place-items:center;
  background:radial-gradient(circle at 50% 45%,#21116c,#09091d 48%,#03030b);
  transition:opacity .65s ease,visibility .65s ease
}
.is-ready #intro {
  opacity:0;
  visibility:hidden;
  pointer-events:none
}
.intro-content {
  text-align:center;
  animation:intro-pulse 1s ease-in-out infinite alternate
}
.intro-mark {
  width:76px;
  height:76px;
  margin:auto;
  display:grid;
  place-items:center;
  border-radius:25px;
  background:linear-gradient(135deg,#b574ff,#3233e7 54%,#36a9ff);
  box-shadow:0 0 0 9px #9672ff14,0 0 45px #8554ffb8;
  color:white;
  font-size:34px;
  font-weight:bold
}
.intro-content b {
  display:block;
  margin-top:20px;
  font-size:18px;
  letter-spacing:.02em
}
.intro-content small {
  display:block;
  margin-top:7px;
  color:#bdb8d8;
  font-size:11px;
  letter-spacing:.13em;
  text-transform:uppercase
}
.intro-line {
  width:115px;
  height:2px;
  margin:20px auto 0;
  overflow:hidden;
  border-radius:4px;
  background:#ffffff1e
}
.intro-line:after {
  content:'';
  display:block;
  width:42%;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,transparent,#d9c6ff,#5baaff,transparent);
  animation:loader 1.1s ease-in-out infinite
}
@keyframes site-enter {
  from {
    opacity:0;
    transform:translateY(20px)
  }
  to {
    opacity:1;
    transform:none
  }
}
@keyframes art-enter {
  from {
    opacity:0;
    transform:translate3d(30px,20px,0) scale(.94);
    filter:blur(10px)
  }
  to {
    opacity:1;
    transform:none;
    filter:none
  }
}
@keyframes hero-breathe {
  50% {
    transform:scale(1.025) translateY(-5px);
    filter:drop-shadow(0 26px 44px #000b) saturate(1.12)
  }
}
@keyframes scan {
  0%,18% {
    transform:translateX(-55%);
    opacity:0
  }
  35%,62% {
    opacity:1
  }
  84%,100% {
    transform:translateX(55%);
    opacity:0
  }
}
@keyframes grid-drift {
  to {
    background-position:58px 58px
  }
}
@keyframes aurora-spin {
  to {
    transform:rotate(360deg)
  }
}
@keyframes orb-one {
  to {
    transform:translate(130px,-70px) scale(1.2)
  }
}
@keyframes orb-two {
  to {
    transform:translate(-115px,90px) scale(.78)
  }
}
@keyframes orb-three {
  to {
    transform:translate(95px,-85px) scale(1.3)
  }
}
@keyframes intro-pulse {
  to {
    transform:scale(1.035)
  }
}
@keyframes loader {
  from {
    transform:translateX(-125%)
  }
  to {
    transform:translateX(300%)
  }
}
@media(prefers-reduced-motion:reduce) {
  *,*:before,*:after {
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    scroll-behavior:auto!important;
    transition-duration:.01ms!important
  }
  .hero-copy,.art,.top,.reveal {
    opacity:1;
    transform:none;
    filter:none
  }
}