/* OnzonThai — custom styles (Tailwind utilities come from the CDN) */
/* Theme tokens: fallback = Theme 1 (Classic Gold). layouts/public.php injects the
   active theme's channels into :root (id="oz-theme") right after this file, so the
   whole site recolours by swapping these 8 RGB-channel variables. */
:root {
  --c-cream-rgb:250 246 241;
  --c-sand-rgb:239 230 218;
  --c-taupe-rgb:154 137 120;
  --c-cocoa-rgb:74 63 53;
  --c-ink-rgb:43 38 34;
  --c-gold-rgb:176 141 87;
  --c-gold-light-rgb:201 168 120;
  --c-gold-dark-rgb:138 109 63;
  --gold: rgb(var(--c-gold-rgb));
  --cocoa: rgb(var(--c-cocoa-rgb));
}

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:rgb(var(--c-cream-rgb) / .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:rgb(var(--c-ink-rgb)); }
#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, rgb(var(--c-ink-rgb) / .55) 0%, rgb(var(--c-ink-rgb) / .28) 45%, rgb(var(--c-cocoa-rgb) / .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:rgb(var(--c-sand-rgb)); color:rgb(var(--c-cocoa-rgb)); }
.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; }

/* ---- Gift cards carousel arrows (outside the swiper so they're never clipped) ---- */
.gift-carousel { position:relative; }
.swiper-nav-btn { position:absolute; top:44%; transform:translateY(-50%); z-index:20; width:44px; height:44px; border-radius:9999px; background:#fff; color:rgb(var(--c-cocoa-rgb)); box-shadow:0 12px 28px -12px rgb(var(--c-ink-rgb) / .45); cursor:pointer; transition:background .2s, color .2s; }
.swiper-nav-btn:hover { background:var(--gold); color:#fff; }
.gift-prev { left:-10px; } .gift-next { right:-10px; }
@media (min-width:1280px){ .gift-prev { left:-26px; } .gift-next { right:-26px; } }
.swiper-nav-btn.swiper-button-disabled { opacity:.3; pointer-events:none; }

/* ---- OverlayScrollbars custom theme (follows the active palette) ---- */
.os-theme-onz {
  --os-size:11px; --os-padding-perpendicular:2px; --os-padding-axis:2px;
  --os-handle-border-radius:8px;
  --os-handle-bg:rgb(var(--c-taupe-rgb) / .5); --os-handle-bg-hover:rgb(var(--c-gold-rgb) / .75); --os-handle-bg-active:rgb(var(--c-gold-dark-rgb) / .9);
}