/* Custom Animated Cursor for Pure Monk — Neo-Victorian Futurism (Dark & Copper)
   - Primary orb cursor + hover ring
   - Optional lightweight trailing particle
   - Performance: transform + will-change, rAF for movement
*/
:root{
  --pm-copper: #CD7F32;
  --pm-dark: #1A1A1A;
  --pm-light: #E6E6E6;
  --cursor-size: 10px; /* default orb size */
  --cursor-hover-size: 22px; /* ring size */
}

/* hide native cursor when custom cursor active */
html.custom-cursor-active, html.custom-cursor-active * {
  cursor: none !important;
}

.pm-cursor-root{
  position: fixed;
  top: 0;
  left: 0;
  pointer-events: none; /* allow interaction through cursor */
  z-index: 99999; /* high but below modal overlays if needed */
  mix-blend-mode: screen;
}

.pm-cursor-orb{
  position: absolute;
  width: var(--cursor-size);
  height: var(--cursor-size);
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, rgba(255,240,220,0.98) 0%, var(--pm-copper) 35%, rgba(205,127,50,0.95) 60%);
  box-shadow: 0 0 10px rgba(205,127,50,0.10), 0 0 20px rgba(205,127,50,0.04) inset;
  transform: translate3d(-50%, -50%, 0) scale(1);
  transition: transform 220ms cubic-bezier(.22,.9,.3,1), width 220ms, height 220ms, box-shadow 250ms;
  will-change: transform, width, height;
  display: block;
}

/* subtle inner shimmer — pseudo element */
.pm-cursor-orb::before{
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: radial-gradient(circle at 40% 35%, rgba(255,255,255,0.22), transparent 40%);
  mix-blend-mode: overlay;
  pointer-events: none;
}

/* faint pulsing glow */
@keyframes pm-orb-pulse {
  0% { filter: drop-shadow(0 0 3px rgba(205,127,50,0.06)); }
  50% { filter: drop-shadow(0 0 6px rgba(205,127,50,0.09)); }
  100% { filter: drop-shadow(0 0 3px rgba(205,127,50,0.06)); }
}

.pm-cursor-orb {
  animation: pm-orb-pulse 2500ms ease-in-out infinite;
}

/* Ensure cursor parts are promoted to their own layer */
.pm-cursor-orb, .pm-cursor-ring, .pm-cursor-hint, .pm-cursor-trail {
  will-change: transform, opacity;
  backface-visibility: hidden;
}

/* hover ring that expands around the orb */
.pm-cursor-ring{
  position: absolute;
  width: var(--cursor-hover-size);
  height: var(--cursor-hover-size);
  left: 50%; top: 50%;
  transform: translate3d(-50%, -50%, 0) scale(0.6);
  border-radius: 50%;
  border: 1.6px solid rgba(205,127,50,0.18);
  box-shadow: 0 0 20px rgba(205,127,50,0.08), 0 0 40px rgba(205,127,50,0.04) inset;
  transition: transform 240ms cubic-bezier(.22,.9,.3,1), opacity 180ms;
  opacity: 0;
  pointer-events: none;
  will-change: transform, opacity;
}

/* active hover state */
.pm-cursor-root.hover .pm-cursor-ring{
  transform: translate3d(-50%, -50%, 0) scale(1);
  opacity: 1;
}

.pm-cursor-root.hover .pm-cursor-orb{
  transform: translate3d(-50%, -50%, 0) scale(0.48);
  box-shadow: 0 0 18px rgba(205,127,50,0.16), 0 0 36px rgba(205,127,50,0.08) inset;
}

/* optional tiny trail particle */
.pm-cursor-trail{
  position: absolute;
  width: 6px; height: 6px;
  border-radius: 6px;
  background: rgba(205,127,50,0.12);
  transform: translate3d(-50%, -50%, 0) scale(1);
  transition: transform 300ms linear, opacity 300ms;
  opacity: 0.9;
  will-change: transform, opacity;
}

/* when hovering interactive elements, add slight text hint (non-intrusive) */
.pm-cursor-hint{
  position: absolute;
  transform: translate3d(12px, -8px, 0);
  color: var(--pm-light);
  font-size: 11px;
  font-family: 'Lato', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
  opacity: 0;
  transition: opacity 180ms;
  pointer-events: none;
  text-shadow: 0 1px 0 rgba(0,0,0,0.6);
}

.pm-cursor-root.hover .pm-cursor-hint{
  opacity: 0.92;
}

/* Hide custom cursor on small screens and touch devices — we will also detect in JS */
@media (hover: none) and (pointer: coarse) {
  .pm-cursor-root { display: none !important; }
  html { cursor: auto !important; }
}

/* small accessibility consideration: respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .pm-cursor-orb{ animation: none; transition: none; }
  .pm-cursor-ring{ transition: none; }
}