/* ========== CUSTOM CURSOR ========== */
@media (hover: hover) and (pointer: fine) {
  body, a, button, .room-card, .suite-card, .arte-card,
  .nav-link-item, .menu-toggle, .lang-btn, .nav-lang-btn,
  .hero-dot, .faq-question, .booking-dates-input, .guests-btn,
  .booking-submit, .header-logo, .nav-logo-circle, .nav-close,
  input, textarea, select { cursor: none; }
}
#custom-cursor {
  position: fixed;
  top: 0; left: 0;
  width: 22px; height: 22px;
  border: 1.5px solid #FFFFE3;
  border-radius: 50%;
  pointer-events: none;
  z-index: 99998;
  transform: translate(-50%, -50%);
  transition: width 0.28s cubic-bezier(0.215, 0.61, 0.355, 1),
              height 0.28s cubic-bezier(0.215, 0.61, 0.355, 1),
              background 0.28s ease,
              border-color 0.28s ease,
              border-width 0.28s ease,
              opacity 0.18s ease;
  mix-blend-mode: difference;
  opacity: 0;
  will-change: transform, width, height;
}
#custom-cursor.visible { opacity: 1; }

/* Hover over interactive — filled with cream */
#custom-cursor.hover {
  width: 72px; height: 72px;
  background: rgba(255,255,227,0.92);
  border-color: rgba(255,255,227,0.95);
  border-width: 0;
}
/* Hover over images — translucent ring with subtle fill */
#custom-cursor.hover-image {
  width: 92px; height: 92px;
  background: rgba(255,255,227,0.14);
  border-color: rgba(255,255,227,0.65);
  border-width: 1px;
}
/* Hover over buttons — small but dense */
#custom-cursor.hover-button {
  width: 56px; height: 56px;
  background: rgba(255,255,227,0.96);
  border-width: 0;
}
/* Click — quick contraction */
#custom-cursor.click {
  width: 14px; height: 14px;
  background: #FFFFE3;
  border-width: 0;
  transition: width 0.12s ease, height 0.12s ease, background 0.12s ease;
}

/* Click ripple (separate element) */
.cursor-ripple {
  position: fixed;
  top: 0; left: 0;
  width: 20px; height: 20px;
  border: 1.5px solid rgba(255,255,227,0.9);
  border-radius: 50%;
  pointer-events: none;
  z-index: 99997;
  transform: translate(-50%, -50%) scale(1);
  mix-blend-mode: difference;
  animation: cursorRipple 0.65s cubic-bezier(0.215, 0.61, 0.355, 1) forwards;
}
@keyframes cursorRipple {
  0%   { transform: translate(-50%, -50%) scale(1);   opacity: 0.8; }
  100% { transform: translate(-50%, -50%) scale(4.2); opacity: 0;   }
}

@media (hover: none), (pointer: coarse) {
  #custom-cursor, .cursor-ripple { display: none; }
  body, a, button, .room-card, .suite-card, .arte-card,
  .nav-link-item, .menu-toggle, .lang-btn, .nav-lang-btn,
  .hero-dot, .faq-question, .booking-dates-input, .guests-btn,
  .booking-submit, .header-logo, .nav-logo-circle, .nav-close,
  input, textarea, select { cursor: auto; }
}
a { text-decoration: none; color: inherit; }
ul { list-style: none; }
img { display: block; max-width: 100%; }