*,*::before,*::after{box-sizing:border-box}
html,body{height:100%;margin:0}
body{
  min-height:100vh;display:flex;flex-direction:column;
  background:#0b0d14;color:#e6e8f0;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
.bg{
  position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(60vmax 60vmax at 15% 10%,rgba(124,92,255,.18),transparent 60%),
    radial-gradient(50vmax 50vmax at 85% 90%,rgba(34,211,238,.14),transparent 60%);
}
.bg::after{
  content:"";position:absolute;inset:0;
  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:radial-gradient(ellipse at center,#000 30%,transparent 75%);
  -webkit-mask-image:radial-gradient(ellipse at center,#000 30%,transparent 75%);
}
main{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:2rem 1.5rem}
.wordmark{
  margin:0;font-size:clamp(4.5rem,18vw,11rem);font-weight:800;letter-spacing:-.05em;line-height:1;
  background:linear-gradient(120deg,#a78bfa 0%,#7c5cff 40%,#22d3ee 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  animation:rise .9s ease-out both;
}
.tagline{
  margin:1.5rem 0 0;font-size:clamp(1rem,2.6vw,1.35rem);color:#9aa1b5;letter-spacing:.02em;
  animation:rise .9s .15s ease-out both;
}
footer{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap;padding:1.5rem;font-size:.85rem;color:#6b7186}
footer a{color:#9aa1b5;text-decoration:none;border-bottom:1px solid rgba(154,161,181,.3);transition:color .2s,border-color .2s}
footer a:hover,footer a:focus-visible{color:#22d3ee;border-color:#22d3ee;outline:none}
@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.wordmark,.tagline{animation:none}}