/* Custom Cursor Styles */
.custom-cursor-outer {
  position: fixed;
  top: 0;
  left: 0;
  width: 22px;
  height: 22px;
  border: 1.5px solid var(--accent);
  border-radius: 50%;
  pointer-events: none;
  z-index: 9999;
  transform: translate(-50%, -50%);
  transition: width 0.2s ease, height 0.2s ease, background-color 0.2s ease, opacity 0.2s ease, border-color 0.2s ease;
  mix-blend-mode: difference;
}

.custom-cursor-inner {
  position: fixed;
  top: 0;
  left: 0;
  width: 4px;
  height: 4px;
  background-color: var(--accent);
  border-radius: 50%;
  pointer-events: none;
  z-index: 10000;
  transform: translate(-50%, -50%);
  transition: width 0.15s ease, height 0.15s ease, opacity 0.15s ease;
}

/* Hover effect on clickable elements */
body.custom-cursor-hover .custom-cursor-outer {
  background-color: rgba(184, 74, 47, 0.15);
  border-color: var(--accent);
}

body.custom-cursor-hover .custom-cursor-inner {
  opacity: 0.5;
}

/* Active / Click effect */
body.custom-cursor-active .custom-cursor-outer {
  width: 16px;
  height: 16px;
  background-color: rgba(184, 74, 47, 0.3);
}

/* Note: Default system cursor (arrow / hand pointer) remains visible */
  }
}