.has-custom-cursor {
  cursor: none !important; /* hide default cursor */
}

.custom-cursor {
  position: fixed;
  top: 0;
  left: 0;
  width: 45px;      /* outer circle size */
  height: 45px;
  border: 2px solid #d4a12e; /* circle color */
  border-radius: 50%;
  pointer-events: none;
  transform: translate(-50%, -50%);
  z-index: 9999;
  opacity: 0; /* hidden until mouse moves */
  transition: opacity 0.25s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}

.custom-cursor .dot {
  width: 12px;
  height: 12px;
  background-color: #d4a12e;
  border-radius: 50%;
  position: absolute;
  transition: transform 0.15s ease-out;
}