/* Custom Cursor Base Styles */
.cs-cursor_lg,
.cs-cursor_sm {
  position: fixed;
  pointer-events: none;
  z-index: 9999;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  transition: width 0.3s ease, height 0.3s ease, background-color 0.3s ease, border 0.3s ease, opacity 0.3s ease;
  display: none;
  /* Hidden by default, shown via JS to avoid flickering at (0,0) */
}

/* Outer Circle */
.cs-cursor_lg {
  width: 40px;
  height: 40px;
  background-color: rgba(75, 31, 160, 0.4);
  border: 2px solid rgba(75, 31, 160, 0.4);
  /* Brand Purple #4B1FA0 */
}

/* Inner Dot */
.cs-cursor_sm {
  width: 8px;
  height: 8px;
  background-color: #4B1FA0;
}

/* Hover State */
.cs-cursor_lg.cs-is-hover {
  width: 60px;
  height: 60px;
  background-color: rgba(75, 31, 160, 0.1);
  border-color: #4B1FA0;
}

.cs-cursor_sm.cs-is-hover {
  opacity: 0;
}

/* Show default cursor on desktop */
@media (min-width: 992px) {

  .cs-cursor_lg,
  .cs-cursor_sm {
    display: block;
  }
}