/* Plus Jakarta Sans & Tactile Spa Design (NO GLASSY / NO BACKDROP BLUR) */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,400;1,600&display=swap');

html, body, button, input, select, textarea, h1, h2, h3, h4, h5, h6, p, span, a, div {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  scroll-behavior: smooth;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ABSOLUTELY NO GLASSY BACKDROP BLUR EFFECTS */
*, *::before, *::after {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-track {
  background: #fbf9f8;
}
::-webkit-scrollbar-thumb {
  background: #7C948A;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #3D5248;
}

/* ==========================================================================
   HERO IMAGE SLIDER / CAROUSEL
   ========================================================================== */
.hero-slider-container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  overflow: hidden;
}

.hero-slide {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 1.2s ease-in-out, transform 1.2s ease-in-out;
  transform: scale(1.04);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.hero-slide.active {
  opacity: 0.85;
  transform: scale(1);
}

.hero-slider-dots {
  display: flex;
  gap: 0.5rem;
  justify-content: center;
  margin-top: 1.5rem;
}

.hero-dot {
  width: 28px;
  height: 4px;
  border-radius: 2px;
  background: rgba(255, 255, 255, 0.5);
  cursor: pointer;
  transition: all 0.3s ease;
}

.hero-dot.active {
  background: #ffffff;
  width: 42px;
}

/* Solid Spa Frame Card & Arched Image */
.spa-frame-card {
  border: 1px solid rgba(61, 82, 72, 0.25);
  background: #ffffff !important;
  position: relative;
}

.spa-frame-card::before {
  content: '';
  position: absolute;
  top: 4px; left: 4px; right: 4px; bottom: 4px;
  border: 1px solid rgba(61, 82, 72, 0.12);
  pointer-events: none;
  border-radius: inherit;
}

.spa-arched-frame {
  border-radius: 120px 120px 16px 16px;
  overflow: hidden;
  border: 1px solid rgba(61, 82, 72, 0.2);
}

/* Graphic Line Divider */
.spa-divider-graphic {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin: 1.2rem 0;
  color: #3D5248;
}

.spa-divider-graphic::before,
.spa-divider-graphic::after {
  content: '';
  height: 1px;
  width: 70px;
  background: linear-gradient(90deg, transparent, #3D5248, transparent);
  opacity: 0.4;
}