[data-ambient-halo],
[data-luminous-hover],
[data-reveal] {
  position: relative;
}

[data-ambient-halo] {
  isolation: isolate;
}

[data-ambient-halo]::before {
  content: '';
  position: absolute;
  inset: -12px;
  border-radius: inherit;
  pointer-events: none;
  background:
    radial-gradient(circle at 30% 30%, rgba(41, 98, 217, 0.24), transparent 48%),
    radial-gradient(circle at 70% 70%, rgba(22, 163, 74, 0.18), transparent 56%);
  filter: blur(16px);
  opacity: 0.9;
  animation: hero-drift 16s ease-in-out infinite;
  z-index: -1;
}

html[data-theme='dark'] [data-ambient-halo]::before {
  background:
    radial-gradient(circle at 30% 30%, rgba(30, 139, 255, 0.32), transparent 48%),
    radial-gradient(circle at 70% 70%, rgba(30, 201, 143, 0.22), transparent 56%);
}

[data-reveal] {
  opacity: 0;
  transform: translateY(18px);
  filter: blur(4px);
  transition:
    opacity 620ms cubic-bezier(0.2, 0.8, 0.2, 1),
    transform 620ms cubic-bezier(0.2, 0.8, 0.2, 1),
    filter 620ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

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

[data-luminous-hover] {
  transition:
    transform 220ms ease,
    box-shadow 220ms ease,
    border-color 220ms ease,
    background-color 220ms ease;
}

[data-luminous-hover]:hover,
[data-luminous-hover]:focus-visible {
  transform: translateY(-1px);
  box-shadow:
    0 0 0 1px rgba(41, 98, 217, 0.18),
    0 18px 36px rgba(16, 31, 54, 0.12),
    0 0 32px rgba(22, 163, 74, 0.12);
}

html[data-theme='dark'] [data-luminous-hover]:hover,
html[data-theme='dark'] [data-luminous-hover]:focus-visible {
  box-shadow:
    0 0 0 1px rgba(30, 139, 255, 0.26),
    0 18px 36px rgba(5, 14, 18, 0.18),
    0 0 34px rgba(30, 201, 143, 0.16);
}

@keyframes hero-drift {
  0%,
  100% {
    transform: translate3d(0, 0, 0) scale(1);
  }

  50% {
    transform: translate3d(0, -10px, 0) scale(1.04);
  }
}

@media (prefers-reduced-motion: reduce) {
  [data-ambient-halo]::before,
  [data-luminous-hover],
  [data-reveal] {
    animation: none !important;
    transition: none !important;
  }

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