/**
 * LUTHFRAME custom cursor — kit.luthframe.com (base + link)
 */
@media (min-width: 1025px) and (hover: hover) and (pointer: fine) {
  * { cursor: none !important; }
}

#luthframe-cursor {
  position: fixed;
  top: 0;
  left: 0;
  width: 48px;
  height: 48px;
  pointer-events: none;
  z-index: 10050;
  will-change: transform;
  overflow: visible;
  mix-blend-mode: difference;
  contain: layout style;
}

#luthframe-cursor.is-hover {
  mix-blend-mode: normal;
  isolation: isolate;
}

#luthframe-cursor svg {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  overflow: visible;
}

#cursor-glass {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  width: 0;
  height: 0;
  opacity: 0;
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
  contain: layout style paint;
  background:
    radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.32) 0%, rgba(255, 255, 255, 0.08) 45%, rgba(255, 255, 255, 0.04) 100%),
    rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.28);
  box-shadow:
    0 8px 32px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.35),
    inset 0 -1px 0 rgba(255, 255, 255, 0.06);
  transition: background 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

#cursor-circle {
  fill: none;
  stroke: #ffffff;
  stroke-width: 1.5;
  opacity: 0;
  vector-effect: non-scaling-stroke;
}

.c-stroke {
  fill: none;
  stroke: #ffffff;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: stroke 0.25s ease;
}

.c-fill {
  fill: #ffffff;
  stroke: none;
  transition: fill 0.25s ease;
}

#cursor-dot {
  fill: #ffffff;
  opacity: 1;
  transition: opacity 0.2s ease;
}

#luthframe-cursor.is-hover #cursor-dot { opacity: 0; }

#luthframe-cursor.is-hover #cursor-glass {
  background:
    radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.14) 0%, rgba(20, 19, 18, 0.2) 42%, rgba(15, 14, 13, 0.88) 100%),
    rgba(15, 14, 13, 0.82);
  border-color: rgba(255, 255, 255, 0.14);
  box-shadow:
    0 8px 32px rgba(0, 0, 0, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

#luthframe-cursor.is-hover .c-stroke { stroke: #ffffff; }
#luthframe-cursor.is-hover .c-fill { fill: #ffffff; }

#video-ring { display: none; }

@media (hover: none), (pointer: coarse), (max-width: 1024px) {
  #luthframe-cursor,
  .cursor-shockwave {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}

.cursor-shockwave {
  position: fixed;
  width: 100px;
  height: 100px;
  border: 2px solid rgba(255, 255, 255, 0.75);
  border-radius: 50%;
  transform: translate3d(-50%, -50%, 0) scale(0.1);
  pointer-events: none;
  z-index: 10050;
  contain: strict;
  animation: shockwave-anim 0.55s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes shockwave-anim {
  0% {
    transform: translate3d(-50%, -50%, 0) scale(0.1);
    opacity: 1;
  }
  100% {
    transform: translate3d(-50%, -50%, 0) scale(0.92);
    opacity: 0;
  }
}