/* Subtle heart cursor trail — desktop / fine pointer only. */
.heart-cursor-particle {
  position: fixed;
  top: 0;
  left: 0;
  width: 12px;
  height: 12px;
  margin: 0;
  padding: 0;
  border: 0;
  pointer-events: none;
  z-index: 9998;
  color: rgba(217, 45, 39, 0.4);
  opacity: 0;
  transform: translate3d(0, 0, 0) translate(-50%, -50%) scale(0.9);
  animation-name: handy-heart-float;
  animation-timing-function: ease-out;
  animation-fill-mode: forwards;
  will-change: transform, opacity;
}

.heart-cursor-particle svg {
  display: block;
  width: 100%;
  height: 100%;
}

@keyframes handy-heart-float {
  0% {
    opacity: 0.42;
    transform: translate3d(0, 0, 0) translate(-50%, -50%) rotate(var(--heart-rot, 0deg)) scale(var(--heart-scale-start, 0.9));
  }
  100% {
    opacity: 0;
    transform: translate3d(var(--heart-x, 0px), var(--heart-y, -30px), 0)
      translate(-50%, -50%)
      rotate(var(--heart-rot, 0deg))
      scale(var(--heart-scale-end, 0.7));
  }
}

@media (prefers-reduced-motion: reduce) {
  .heart-cursor-particle {
    display: none !important;
    animation: none !important;
  }
}