درست کردن افکت Cursor موس در المنتور و وردپرس

.rico-follow-cursor {
  position: fixed;
  top: 0;
  left: 0;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  pointer-events: none;
  transform: translate3d(-50%, -50%, 0) scale(1);
  transition: transform 0.15s cubic-bezier(.2,.9,.2,1), 
              background-color 0.25s ease, 
              mix-blend-mode 0.25s ease;
  z-index: 999999;
  mix-blend-mode: normal;
  display: block;
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  border: 1px solid #9c9e9b;
}

.rico-follow-cursor::after {
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.6);
}

.rico-follow-cursor.rico-cursor--hover {
  transform: translate3d(-50%, -50%, 0) scale(1.4);
  background: rgba(255, 255, 255, 0.9);
  mix-blend-mode: difference;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
    backdrop-filter: blur(0px);
      -webkit-backdrop-filter: blur(0px);


}

@media (pointer: coarse) {
  .rico-follow-cursor { display: none !important; }
}

<script>
(function(){
  const cursor = document.createElement('div');
  cursor.className = 'rico-follow-cursor';
  document.body.appendChild(cursor);

  let mouseX = window.innerWidth / 2;
  let mouseY = window.innerHeight / 2;
  let cursorX = mouseX;
  let cursorY = mouseY;
  const ease = 0.18;

  window.addEventListener('mousemove', (e) => {
    mouseX = e.clientX;
    mouseY = e.clientY;
    cursor.style.display = 'block';
  }, {passive: true});

  window.addEventListener('mouseleave', () => cursor.style.display = 'none');
  window.addEventListener('mouseenter', () => cursor.style.display = 'block');

  function animate() {
    cursorX += (mouseX - cursorX) * ease;
    cursorY += (mouseY - cursorY) * ease;
    cursor.style.transform = `translate3d(${cursorX}px, ${cursorY}px, 0) translate(-50%, -50%)`;
    requestAnimationFrame(animate);
  }
  requestAnimationFrame(animate);

  const interactiveSelector = 'a, button, input[type="submit"], img, .rico-clickable';
  document.addEventListener('mouseover', (e) => {
    if (e.target.closest(interactiveSelector)) {
      cursor.classList.add('rico-cursor--hover');
    }
  });
  document.addEventListener('mouseout', (e) => {
    if (e.target.closest(interactiveSelector)) {
      cursor.classList.remove('rico-cursor--hover');
    }
  });

  document.addEventListener('mousedown', () => {
    cursor.style.transform += ' scale(0.9)';
  });
  document.addEventListener('mouseup', () => {});

  const mq = window.matchMedia('(prefers-reduced-motion: reduce)');
  function handleReducedMotion() {
    if (mq.matches) cursor.style.display = 'none';
  }
  mq.addEventListener('change', handleReducedMotion);
  handleReducedMotion();
})();
</script>