/* ════════════════════════════════════════════════
   LM AGENCY — Custom Magnetic Cursor
   ════════════════════════════════════════════════ */

@media (pointer: fine) {
  *, *::before, *::after { cursor: none !important; }
}

.lm-cursor {
  position: fixed;
  top: 0; left: 0;
  width: 40px; height: 40px;
  pointer-events: none;
  z-index: 99999;
  mix-blend-mode: normal;
}

.lm-cursor__dot {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 10px; height: 10px;
  border-radius: 50%;
  background: #6c63ff;
  transition:
    width  200ms cubic-bezier(0.34, 1.56, 0.64, 1),
    height 200ms cubic-bezier(0.34, 1.56, 0.64, 1),
    background 200ms ease,
    border-radius 200ms ease,
    transform 200ms ease;
}

.lm-cursor__ring {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 40px; height: 40px;
  border-radius: 50%;
  border: 1.5px solid rgba(108, 99, 255, 0.6);
  opacity: 0;
  transition:
    width   400ms cubic-bezier(0.16, 1, 0.3, 1),
    height  400ms cubic-bezier(0.16, 1, 0.3, 1),
    opacity 200ms ease;
}

/* ── State: hover links/buttons ── */
.lm-cursor--hover .lm-cursor__dot  { width: 6px;  height: 6px; background: #fff; }
.lm-cursor--hover .lm-cursor__ring { opacity: 1; width: 44px; height: 44px; }

/* ── State: hover cards ── */
.lm-cursor--card  .lm-cursor__dot  {
  width: 60px; height: 60px;
  background: rgba(108, 99, 255, 0.15);
  mix-blend-mode: difference;
}

/* ── State: hover text ── */
.lm-cursor--text  .lm-cursor__dot  { width: 2px; height: 24px; border-radius: 2px; }

/* ── State: click ── */
.lm-cursor--click .lm-cursor__dot  { transform: translate(-50%, -50%) scale(0.6); }