.cursor-glow {
  position: fixed;
  top: 0;
  left: 0;
  /* Size chota kar diya hai (pehle 400px tha) */
  width: 250px;
  height: 250px;
  border-radius: 50%;
  pointer-events: none;
  background: radial-gradient(
    circle,
    var(--atf-semi-b) 0%,
    /* Center slightly brighter */ var(--atf-semi-b-1) 35%,
    /* Mid spread */ var(--atf-semi-b-2) 65% /* Fades out smoothly */
  );
  /* GPU Acceleration Boost */
  transform: translate3d(0, 0, 0);
  will-change: transform, opacity;
  z-index: 9999;
}

/* Water Ripple Effect CSS (Click karne par) */
.ripple {
  position: fixed;
  border-radius: 50%;
  border: 2px solid var(--atf-cursor-ripple-border);
  background-color: var(--atf-cursor-ripple-bg);
  pointer-events: none;
  transform: translate(-50%, -50%);
  animation: ripple-effect 0.6s ease-out forwards;
  z-index: 9998;
}

@keyframes ripple-effect {
  0% {
    width: 0px;
    height: 0px;
    opacity: 1;
  }
  100% {
    width: 180px; /* Ripple kitna bada spread hoga */
    height: 180px;
    opacity: 0;
  }
}