@keyframes breathe-glow {
  0%,
  100% {
    filter: drop-shadow(0 0 18px #b865ff55) drop-shadow(0 0 36px #00eeff22);
    transform: scale(1);
  }
  50% {
    filter: drop-shadow(0 0 34px #b865ff99) drop-shadow(0 0 60px #00eeff44);
    transform: scale(1.035);
  }
}

@keyframes slow-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

@keyframes gradient-pan {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

@keyframes aurora-drift-a {
  0% {
    transform: translate3d(0, 0, 0) scale(1) rotate(0deg);
    opacity: 0.55;
  }
  33% {
    transform: translate3d(14%, 10%, 0) scale(1.3) rotate(6deg);
    opacity: 0.9;
  }
  66% {
    transform: translate3d(-8%, 14%, 0) scale(0.95) rotate(-5deg);
    opacity: 0.6;
  }
  100% {
    transform: translate3d(0, 0, 0) scale(1) rotate(0deg);
    opacity: 0.55;
  }
}

@keyframes aurora-drift-b {
  0% {
    transform: translate3d(0, 0, 0) scale(1.1) rotate(0deg);
    opacity: 0.75;
  }
  33% {
    transform: translate3d(-14%, -10%, 0) scale(0.85) rotate(-7deg);
    opacity: 0.4;
  }
  66% {
    transform: translate3d(10%, -6%, 0) scale(1.2) rotate(5deg);
    opacity: 0.85;
  }
  100% {
    transform: translate3d(0, 0, 0) scale(1.1) rotate(0deg);
    opacity: 0.75;
  }
}

@keyframes aurora-drift-c {
  0% {
    transform: translate3d(-6%, 8%, 0) scale(0.9) rotate(0deg);
    opacity: 0.45;
  }
  33% {
    transform: translate3d(10%, -12%, 0) scale(1.25) rotate(8deg);
    opacity: 0.8;
  }
  66% {
    transform: translate3d(-4%, -6%, 0) scale(1, 0.95) rotate(-6deg);
    opacity: 0.55;
  }
  100% {
    transform: translate3d(-6%, 8%, 0) scale(0.9) rotate(0deg);
    opacity: 0.45;
  }
}

.hero__mark {
  animation: breathe-glow 5.5s ease-in-out infinite;
}

.hero__mark-ring {
  animation: slow-spin 60s linear infinite;
  transform-origin: center;
}

.wordmark-gradient--pan {
  background-size: 200% auto;
  animation: gradient-pan 8s ease-in-out infinite;
}

.aurora-bg {
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  overflow: hidden;
}

.aurora-bg::before,
.aurora-bg::after,
.aurora-bg span {
  content: "";
  position: absolute;
  width: 70vw;
  height: 70vw;
  max-width: 900px;
  max-height: 900px;
  border-radius: 50%;
  filter: blur(95px);
  will-change: transform, opacity;
}

.aurora-bg::before {
  top: -15%;
  left: -15%;
  background: radial-gradient(circle, #00eeff5c, transparent 70%);
  animation: aurora-drift-a 16s ease-in-out infinite;
}

.aurora-bg::after {
  bottom: -20%;
  right: -15%;
  background: radial-gradient(circle, #b865ff5c, transparent 70%);
  animation: aurora-drift-b 20s ease-in-out infinite;
}

.aurora-bg span {
  top: 35%;
  left: 28%;
  width: 60vw;
  height: 60vw;
  max-width: 720px;
  max-height: 720px;
  background: radial-gradient(circle, #e85ce050, transparent 70%);
  animation: aurora-drift-c 24s ease-in-out infinite;
}

/* ---- Scroll reveal ---- */
[data-reveal] {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.7s var(--ease-out), transform 0.7s var(--ease-out);
}

[data-reveal].is-visible {
  opacity: 1;
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }

  [data-reveal] {
    opacity: 1;
    transform: none;
  }
}