/* ------------------------------
    BASE CURSOR
------------------------------ */
.sv-cursor {
  pointer-events: none;
  position: fixed;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  mix-blend-mode: difference;
  background: white;
  z-index: 9999;
  opacity: 1;
  transition: opacity 0.2s ease, transform 0.25s ease;
}

/* Double Layer Cursor (Outer ring) */
.sv-cursor::before {
  content: "";
  position: absolute;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 2px solid white;
  opacity: 0.3;
  transform: translate(-50%, -50%);
  pointer-events: none;
  transition: transform 0.35s ease, opacity 0.35s ease;
}

/* ------------------------------
    TITLE ONLY - START HIDDEN
------------------------------ */
.sv-cursor.title-only {
  opacity: 0;
}

/* ------------------------------
    Hover grow inside title
------------------------------ */
.sv-title-cursor:hover ~ .sv-cursor {
  transform: translate(-50%, -50%) scale(10);
}

.sv-title-cursor ~ .sv-cursor::before {
  opacity: 0;
}

/* ------------------------------
    Click ripple effect
------------------------------ */
.sv-cursor.ripple::after {
  content: "";
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: white;
  opacity: 0.7;
  animation: sv-cursor-ripple 0.5s ease-out forwards;
}

@keyframes sv-cursor-ripple {
  from {
    transform: scale(1);
    opacity: 0.6;
  }
  to {
    transform: scale(14);
    opacity: 0;
  }
}/*# sourceMappingURL=sv-cursor.css.map */