/* Soft pointer spotlight — sits above geometric bg, below content */

.cursor-spotlight {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}

.cursor-spotlight__glow {
  position: absolute;
  top: 0;
  left: 0;
  width: min(90vw, 720px);
  height: min(90vw, 720px);
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: opacity 0.35s ease;
  will-change: transform;
  background: radial-gradient(
    circle at center,
    var(--spotlight-outer) 0%,
    var(--spotlight-mid) 24%,
    var(--spotlight-rose) 44%,
    transparent 70%
  );
  filter: blur(36px);
}

.cursor-spotlight__glow--core {
  width: min(50vw, 320px);
  height: min(50vw, 320px);
  filter: blur(20px);
  background: radial-gradient(
    circle at center,
    var(--spotlight-core) 0%,
    var(--spotlight-core-accent) 35%,
    transparent 65%
  );
}

body.is-cursor-spotlight-active .cursor-spotlight__glow {
  opacity: 1;
}

@media (hover: none), (pointer: coarse) {
  .cursor-spotlight {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cursor-spotlight__glow {
    transition: opacity 0.15s ease;
  }
}