/* OnzonThai — custom styles (Tailwind utilities come from the CDN) */
:root { --gold:#b08d57; --cocoa:#4a3f35; }

html.lenis, html.lenis body { height:auto; }
.lenis.lenis-smooth { scroll-behavior:auto !important; }
.lenis.lenis-stopped { overflow:hidden; }

body { -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }

/* ---- Navbar ---- */
#nav .nav-logo, #nav .nav-links a, #nav #navToggle { color:#fff; }
#nav.scrolled, #nav.solid {
  background:rgba(250,246,241,.95);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  box-shadow:0 4px 30px rgba(0,0,0,.06);
}
#nav.scrolled .nav-logo, #nav.scrolled .nav-links a, #nav.scrolled #navToggle,
#nav.solid .nav-logo, #nav.solid .nav-links a, #nav.solid #navToggle { color:#2b2622; }
#nav.scrolled .nav-links a.text-gold, #nav.solid .nav-links a.text-gold { color:var(--gold); }

/* ---- Reveal (only when motion allowed + JS active) ---- */
@media (prefers-reduced-motion: no-preference) {
  html.js [data-reveal] { opacity:0; transform:translateY(28px); will-change:opacity,transform; }
}

/* ---- Hero ---- */
.hero-overlay {
  background:linear-gradient(180deg, rgba(43,38,34,.55) 0%, rgba(43,38,34,.28) 45%, rgba(74,63,53,.72) 100%);
}

/* ---- Section title accent ---- */
.title-accent::after {
  content:''; display:block; width:64px; height:3px; background:var(--gold);
  margin:1.1rem auto 0; border-radius:2px;
}
.title-accent.left::after { margin-left:0; margin-right:auto; }

/* ---- Service / price ---- */
.price-pill { background:#efe6da; color:#4a3f35; }
.card-img { transition:transform .7s cubic-bezier(.2,.7,.2,1); }
.service-card:hover .card-img { transform:scale(1.06); }

/* ---- Rich text ---- */
.prose-spa p { margin-bottom:1rem; line-height:1.85; }
.prose-spa h2,.prose-spa h3 { font-family:"Cormorant Garamond",serif; margin:1.5rem 0 .6rem; }

/* ---- Swiper ---- */
.swiper-pagination-bullet { background:var(--gold) !important; opacity:.4; }
.swiper-pagination-bullet-active { opacity:1; }
.swiper-button-next, .swiper-button-prev { color:var(--gold) !important; }
.swiper-button-next:after, .swiper-button-prev:after { font-size:1.4rem !important; }

.text-balance { text-wrap:balance; }
