/*
Theme Name: Swarna Mandapa Theme
Theme URI: 
Author: 
Author URI: 
Description: A custom Elementor theme for Swarna Mandapa
Version: 1.0
Text Domain: swarnamandapa
*/
/* ============ TOKENS (Figma: rCmDJfoZYTdJ2XPLgOPUOa / FINAL / HOME 58:21) ============ */
:root{
  --gold:        #b7914f;
  --gold-accent: #ba9351;
  --gold-bright: #e8b867;
  --brown-dark:  #3e2f16;
  --brown-card:  #4c412f;
  --footer-bg:   #374150;
  --ink:         #1e1e1e;
  --hero-scrim:  rgba(31,28,21,.64);
  --scrim:       rgba(30,29,29,.75);

  --serif: 'Cormorant Garamond', serif;
  --sans:  'Poppins', sans-serif;
  --ui:    'Nunito Sans', sans-serif;

  /* 1248 - 24px padding either side = the design's 1200px content column */
  --shell: 1248px;
  --pad: 40px;
  --radius: 4px;

  /* pulls a shell child out to the right viewport edge, at any screen width */
  --bleed-right: calc(min(0px, (var(--shell) - 100vw) / 2) - var(--pad));
  /* same math, mirrored for a shell child bleeding out to the left edge instead */
  --bleed-left: calc(min(0px, (var(--shell) - 100vw) / 2) - var(--pad));

  /* ── Palette: Collected & Quiet ────────────────────────────────────────────
     The palette should feel collected, not edited.
     Avoid high saturation and tropical filters.
     ────────────────────────────────────────────────────────────────────── */
  --warm-ivory:   #F5EFD6; /* Warm Ivory   — primary background, journey CTA */
  --burnt-teak:   #3e2f16; /* Burnt Teak   — primary dark text on ivory       */
  --stone-grey:   #7c7872; /* Stone Grey   — secondary/muted text             */
  --muted-green:  #5FA052; /* Muted Green  — sparse accent, divider, detail   */
  --antique-gold: #b7914f; /* Antique Gold — links, highlights (= --gold)     */
  --soft-cream:   #F5EFD6; /* Soft Cream   — elevated panels on ivory fields  */
  --rich-walnut:  #4c412f; /* Rich Walnut  — card backgrounds (= --brown-card)*/
  --cta-bg:       #E8B867; /* every CTA band (default + journey)               */
}

/* ==========================================================================
   1. DESKTOP & BASE STYLES
   ========================================================================== */

*{margin:0;padding:0;box-sizing:border-box;}

html{
  scroll-behavior:smooth;
  /* also on html: a fixed element parked off-screen is not clipped by body alone */
  overflow-x:hidden;
  -webkit-text-size-adjust:100%;
}

body{
  position:relative;
  width:100%;
  font-family:var(--sans);
  color:var(--ink);
  background:#fff;
  overflow-x:hidden;
  /* clip, where supported, trims the sideways overflow without turning body into a
     scroll container, which would stop the sticky homepage hero from sticking */
  overflow-x:clip;
  /* grayscale AA, so light weights render as thin as they do in Figma */
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

img{display:block;max-width:100%;}
.e-image-base,.elementor-widget-image img{width:100%;height:auto;}

/* author img{display:block} above otherwise beats the UA [hidden]{display:none}
   rule, so a toggled-off <img hidden> would stay visible */
img[hidden]{display:none;}

a{text-decoration:none;color:inherit;}

ul{list-style:none;}

button{font:inherit;background:none;border:none;cursor:pointer;color:inherit;}

.shell{
  width:100%;
  max-width:var(--shell);
  margin:0 auto;
  padding:0 var(--pad);
}

h1,h2,h3{font-weight:200;line-height:1.19;letter-spacing:1px;}

h2{
  font-family:var(--sans);
  font-weight:200;
  font-size:46px;
  letter-spacing:1px;
  line-height:1.19;
  color:#BA9351;
}

h2.light{color:#fff;}

h2.center{text-align:center;}

.light{color:#fff;}

/* ============ BUTTONS ============ */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  white-space:nowrap;
  font-family:var(--sans);
  font-weight:400;
  text-transform:uppercase;
  border-radius:var(--radius);
  border:1px solid transparent;
  transition:background-color .3s ease,color .3s ease,border-color .3s ease;
  text-align:center;
}

.btn-gold{
  background:var(--gold);
  color:#fff;
  font-size:15px;
  letter-spacing:1px;
  padding:0 22px;
  height:49px;
}

.btn-gold:hover{background:#a37f42;}

.btn-gold.btn-lg{min-width:179px;}

.btn-outline-gold,
.btn-outline-white,
.btn-outline-accent{
  font-size:18px;
  letter-spacing:3px;
  width: 450px;
  height:61px;
  padding:0 30px;
  background:rgba(217,217,217,0);
}

.btn-outline-gold{border-color:var(--gold);color:var(--gold);}

.btn-outline-gold:hover{background:var(--gold);color:#fff;}

.btn-outline-white{border-color:#fff;color:#3e2f16;}

.btn-outline-white:hover{background:#fff;color:var(--brown-dark);}

.btn-outline-accent{border-color:var(--gold-accent);color:var(--gold-bright);}

.btn-outline-accent:hover{background:white;color:var(--brown-dark);}

.btn-white{
  background:#fff;
  color:var(--gold-bright);
  font-size:18px;
  letter-spacing:3px;
  height:61px;
  padding:0 30px;
}

.btn-white:hover{background:#f6e8cd;}

/* widths straight from the design */
/*.btn-story{width:349px;}
.btn-eternal{width:432px;}
.btn-experience{width:504px;}
.btn-check{width:309px;}
.btn-contact{width:213px;}*/
.btn-suite{width:260px;height:61px;font-size:18px;letter-spacing:3px;padding:0 12px;}

.btn-suite-explore{width:280px;height:54px;font-size:15px;letter-spacing:2px;}

/* ============ HEADER ============ */
.site-header{
  position:fixed;
  inset:0 0 auto 0;
  z-index:120;
  padding:15px;
  transition:background-color .35s ease,padding .35s ease;
}

/* every page except the homepage (whose video hero sits behind the header) starts on a
   light background, where the white menu would vanish: give the header its dark band from the top */
body:not(.home) .site-header::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:rgba(27,20,12,.94);
}

.site-header.stuck{
  background:rgba(27,20,12,.94);
  backdrop-filter:blur(8px);
  padding:8px 0;
}

.header-inner{
  display:flex;
  align-items:center;
  justify-content: center;
  gap:32px;
}

/* without this, .brand flex-shrinks under the nav and img's max-width:100%
   squeezes its width while height stays fixed — the logo looks letterboxed */
.brand{flex:none;}

.brand img{height:120px;width:auto;object-fit:contain;}

.site-header.stuck .brand img{height:86px;}

/* logo, nav and actions sit together as one centred group (no auto margins,
   which spread the spare width into wide gaps either side of the nav) */
.main-nav{
  display:flex;
  align-items:center;
  gap:clamp(14px,1.5vw,24px);
  margin:0;
}

.main-nav a{
  font-family:var(--ui);
  font-weight:500;
  font-size:11px;
  letter-spacing:1px;
  color:#fff;
  white-space:nowrap;
  padding-bottom:3px;
  border-bottom:1px solid transparent;
  transition:border-color .25s ease,color .25s ease;
}

.main-nav a:hover{border-bottom-color:var(--gold-bright);color:var(--gold-bright);}

/* no auto margin here either: the whole header stays one tight centred group */
.header-actions{display:flex;align-items:center;gap:24px;flex:none;}

.header-actions .btn-gold{flex:none;}

.sm-stack-copy {padding: 50px 0}

.sm-stack .sm-stack-copy p{
  font-weight:200;
  font-size:20px;
  line-height:1.25;
  letter-spacing:1px;
  margin-bottom:.8em;
}

/* laptops (1101-1500px): the full menu plus the 120px logo is wider than the screen,
   so logo, gaps and menu text shrink a little to keep everything on screen */
@media (min-width:1101px) and (max-width:1500px){
  .header-inner{gap:20px;}
  .brand img{height:84px;}
  .site-header.stuck .brand img{height:70px;}
  .main-nav{gap:14px;}
  .main-nav a{font-size:10.5px;letter-spacing:.5px;}
}

.burger{
  width:55px;height:24px;
  display:none;
  flex-direction:column;
  justify-content:space-between;
  flex:none;
}

.burger span{display:block;height:4px;width:100%;background:#a7a3a3;border-radius:6px;transition:transform .3s ease,opacity .3s ease;}

.burger.open span:nth-child(1){transform:translateY(10px) rotate(45deg);}

.burger.open span:nth-child(2){opacity:0;}

.burger.open span:nth-child(3){transform:translateY(-10px) rotate(-45deg);}

.nav-panel{
  position:fixed;
  inset:0 0 0 auto;
  width:100%; /* full screen when open, no strip of page left showing */
  background:#1b140d; /* solid, so the header underneath doesn't ghost through */
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:22px;
  padding:0 48px;
  transform:translateX(100%);
  transition:transform .4s cubic-bezier(.77,0,.175,1);
  /* above the fixed header (120), so the open panel covers it top to bottom */
  z-index:130;
}

.nav-panel.open{transform:translateX(0);}

/* the header's burger sits under the panel, so the panel carries its own close (main.js adds it) */
.nav-close{
  position:absolute;
  top:calc(28px + env(safe-area-inset-top, 0px));
  right:24px;
  width:40px;height:40px;
  font-size:40px;line-height:40px;
  color:#fff;
  transition:color .25s ease;
}

.nav-close:hover{color:var(--gold-bright);}

.nav-panel a{
  color:#fff;
  font-family:var(--ui);
  font-size:16px;
  letter-spacing:3px;
  text-transform:uppercase;
}

.nav-panel a:hover{color:var(--gold-bright);}

/* ============ HERO VIDEO (the real hero — full-bleed footage, no copy) ============ */
.hero-video{
  position:relative;
  min-height:100vh;
  min-height:100svh;
  overflow:hidden;
}

.hero-video-media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}

.hero-video-scrim{position:absolute;inset:0;}

/* base .play-btn (top:35%) stays as .eternal-band designed it; scoping the
   override to its parent section lets this one sit at true vertical centre
   without moving every other .play-btn on the site */
.hero-video .play-btn{top:50%;}

/* ============ INTRO (formerly .hero — "A Private Residence…", now the section below the video) ============ */
.intro{
  position:relative;
  min-height:100vh;
  min-height:100svh;
  display:flex;
  align-items:center;
  color:#fff;
  overflow:hidden;
}

.intro-media{position:absolute;inset:0;}

.intro-media img{width:100%;height:100%;object-fit:cover;}

.intro-scrim{position:absolute;inset:0;background:var(--hero-scrim);}

.intro-inner{
  position:relative;
  z-index:2;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:40px;
  padding-top:75px;
  padding-bottom:50px;
}

.intro-copy{max-width:996px;}

.intro h1{
  font-weight:500;
  font-size:clamp(30px,3.6vw,45px);
  margin-bottom:15px;
}

.intro-tagline{
  font-size:clamp(18px,1.9vw,24px);
  font-weight:400;
  letter-spacing:1px;
  margin-bottom:15px;
}

.intro-body{
  font-weight:300;
  font-size:clamp(15px,1.6vw,20px);
  line-height:1.19;
  letter-spacing:1px;
  margin-bottom:14px;
}

.intro-copy .btn{margin-top:28px;}

/* ============ WELCOME ============ */
.welcome{padding:75px 0 75px;}

.welcome-grid{
  display:grid;
  grid-template-columns:510px minmax(0,1fr);
  gap:57px;
  align-items:start;
}

/* 1fr defaults to a min of auto, which lets a track outgrow the screen */
.welcome-copy,.welcome-gallery{min-width:0;}

.welcome-copy p{overflow-wrap:break-word;}

.welcome-copy h2{margin-bottom:22px;}

.welcome-copy p{
  font-weight:200;
  font-size:clamp(16px,1.8vw,23px);
  line-height:1.25;
  letter-spacing:1px;
  margin-bottom:40px;
}

/* right column bleeds past the shell to the viewport edge, as in the design */
.welcome-gallery{margin-right:var(--bleed-right);}

.welcome-viewport{overflow:hidden;cursor:grab;}

.welcome-viewport:active{cursor:grabbing;}

.welcome-track{display:flex;gap:30px;transition:transform .6s cubic-bezier(.16,1,.3,1);}

.welcome-slide{flex:0 0 657px;max-width:86vw;}

.welcome-slide .shot{height:551px;border-radius:var(--radius);overflow:hidden;}

.welcome-slide .shot > img{width:100%;height:100%;object-fit:cover;}

.welcome-slide figcaption{
  margin-top:18px;
  font-size:20px;
  letter-spacing:1px;
  color:#000;
}

.round-nav{display:flex;justify-content:flex-end;margin-top:30px; margin-right: 30px;}

.round-arrow{width:50px;height:50px;transition:opacity .25s ease;}

.round-arrow img{width:100%;height:100%;object-fit:contain;}

.round-arrow.prev img{transform:rotate(90deg);}

.round-arrow.next img{transform:rotate(-90deg);}

.round-arrow:hover{opacity:.6;}

/* ============ ETERNAL LIFE ============ */
.eternal-band{position:relative;line-height:0;}

.eternal-band>img,
.eternal-band>video{width:100%;height:465px;object-fit:cover;}

.play-btn{
  position:absolute;
  left:50%;
  top:35%;
  transform:translateX(-50%);
  width:123px;height:123px;
  display:grid;
  place-items:center;
  transition:transform .3s ease,opacity .3s ease;
}

.play-btn img{width:76px;height:96px;filter:drop-shadow(0 2px 12px rgba(0,0,0,.45));}

.play-btn:hover{transform:translateX(-50%) scale(1.08);}

/* auto-hidden 1s after the last click/hover — see armIdleFade() in main.js / script.js */
.play-btn.is-idle{opacity:0;pointer-events:none;}

.medallion{
  position:absolute;
  left:50%;
  bottom:-75px;
  transform:translateX(-50%);
  width:150px;height:150px;
  display:grid;place-items:center;
}

.medallion-ring{position:absolute;inset:0;width:150px;height:150px;}

.medallion-mark{position:relative;z-index:1;width:124px;height:124px;object-fit:contain;}

.eternal-copy{
  text-align:center;
  padding:134px 24px 90px;
}

.eternal-copy h2{margin-bottom:28px;}

.eternal-copy p{
  font-weight:200;
  font-size:clamp(16px,1.9vw,24px);
  line-height:1.19;
  letter-spacing:1px;
  margin:0 auto 42px;
}

/* ============ RESIDENCE ============ */
/* body copy, quote and captions inherit the muted grey; the heading stays white */
.residence{background:var(--brown-dark);color:#c3c3c3;padding:75px 0;}

.residence h2{margin-bottom:28px; color: #BA9351; font-size:36px;}

.residence-body{
  font-weight:200;
  font-size:20px;
  line-height:1.19;
  letter-spacing:1px;
  max-width:1098px;
  margin-bottom:36px;
}

.residence-quote{
  font-weight:200;
  font-size:20px;
  line-height:1.19;
  letter-spacing:1px;
  margin-bottom:48px;
}

/* the track bleeds past the shell to the viewport edge, as in the design */
.residence-slider{margin-right:var(--bleed-right);}

.residence-viewport{overflow:hidden;cursor:grab;}

.residence-viewport:active{cursor:grabbing;}

.residence-track{display:flex;gap:34px;transition:transform .6s cubic-bezier(.16,1,.3,1);}

.residence-slide{flex:0 0 583px;max-width:86vw;}

.residence-slide .shot{
  position:relative;
  height:350px;
  border-radius:var(--radius);
  overflow:hidden;
}

.residence-slide .shot{background:#2a2014;}

.residence-slide .photo-viewport{height:100%;}
.residence-slide .photo-track{height:100%;align-items:center;}
.residence-slide .photo-slide{flex:0 0 100%;height:auto;}
.residence-slide .photo-slide img{width:100%;height:auto;min-height:100%;object-fit:cover;object-position:center;}

.zoom{position:absolute;top:20px;right:24px;width:28px;height:28px;}

.zoom img{width:100%;height:100%;object-fit:contain;}

.residence-slide figcaption{
  font-weight:200;
  margin-top:20px;
  font-size:20px;
  letter-spacing:1px;
  text-transform:capitalize;
}

.thin-nav{display:flex;align-items:center;gap:22px;}

.thin-arrow{width:11px;height:24px;display:grid;place-items:center;transition:opacity .25s ease;}

.thin-arrow img{width:24px;height:11px;object-fit:contain;}

.thin-arrow.prev img{transform:rotate(90deg);}

.thin-arrow.next img{transform:rotate(-90deg);}

.thin-arrow:hover{opacity:.55;}

/* pager dots: active one large and solid, neighbours stepping down — as drawn in Figma */
.dots{display:flex;align-items:center;justify-content:center;gap:4px;}

.dot{
  width:3px;height:3px;
  border-radius:50%;
  background:rgba(255,255,255,.58);
  padding:0;
  flex:none;
  transition:width .3s ease,height .3s ease,background-color .3s ease;
}

.dot.is-near{width:5px;height:5px;}

.dot.is-active{width:9px;height:9px;background:#fff;}

.thin-dots{height:9px;}

/* slider controls sit over the bottom of each photo */
.slide-nav{
  position:absolute;
  left:50%;
  bottom:21px;
  transform:translateX(-50%);
  width:291px;
  max-width:84%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  filter:drop-shadow(0 1px 6px rgba(0,0,0,.55));
}

.residence-actions{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  flex-wrap:wrap;
  margin-top:56px;
}

.residence-actions .btn-residence{
  margin-top:0;
}

.btn-residence{
  margin-top:56px;
  width:420px;
  height:61px;
  font-size:18px;
  letter-spacing:3px;
  padding:0 30px;
  background:rgba(217,217,217,0);
  border-color:#fff;
  color:var(--gold);
}

.btn-residence:hover{background:#fff;color:var(--brown-dark);}

/* ============ SUITES ============ */
.suites{padding:110px 0 120px;}

.suites h2.ruled{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:37px;
  margin-bottom:38px;
}

.suites h2.ruled .rule{width:68px;height:1px;flex:none;}

.suites-body{
  font-weight:200;
  font-size:20px;
  line-height:24px;
  letter-spacing:1px;
  text-align:center;
  max-width:1098px;
  margin:0 auto 60px;
}

/* the card track bleeds past the shell to the viewport edge */
.suite-slider{margin-right:var(--bleed-right);}

.suite-viewport{overflow:hidden;cursor:grab;}

.suite-viewport:active{cursor:grabbing;}

.suite-track{display:flex;gap:64px;transition:transform .6s cubic-bezier(.16,1,.3,1);}

.suite-card{
  flex:0 0 860px;
  max-width:92vw;
  position:relative;
  display:grid;
  grid-template-columns:350px minmax(0,1fr);
  min-height:370px;
  background:var(--brown-card);
  border-radius:var(--radius);
  overflow:hidden;
}

.suite-panel{
  position:relative;
  padding:36px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
}

.suite-ornament{
  position:absolute;
  left:178px;top:91px;
  width:86px;height:171px;
  opacity:.13;
  object-fit:contain;
  pointer-events:none;
}

.suite-name{
  position:relative;
  font-weight:200;
  font-size:clamp(24px,3.2vw,36px);
  line-height:1.1;
  letter-spacing:1px;
  text-transform:uppercase;
  color:var(--gold-bright);
  max-width:280px;
  margin-bottom:50px;
}

.suite-panel .btn{position:relative;}

/* the whole card links to the suite (main.js) */
.suite-card{cursor:pointer;}

.suite-card .suite-name{transition:color .25s ease;}

.suite-card:hover .suite-name{color:#fff;}

/* bottom-left of the panel: switches suite */
.suite-nav{
  position:absolute;
  left:24px;
  bottom:22px;
  display:flex;
  align-items:center;
  gap:10px;
}

.suite-arrow{width:22px;height:34px;display:grid;place-items:center;transition:opacity .25s ease;}

.suite-arrow img{width:34px;height:16px;object-fit:contain;}

.suite-arrow.prev img{transform:rotate(90deg);}

.suite-arrow.next img{transform:rotate(-90deg);}

.suite-arrow:hover{opacity:.55;}

/* over the photo: switches the photo of the current suite */
.suite-shot{position:relative;overflow:hidden;}

.photo-viewport{height:650px;overflow:hidden;}

.photo-track{display:flex;height:100%;transition:transform .6s cubic-bezier(.16,1,.3,1);}

.photo-slide{flex:0 0 100%;height:100%;}

.photo-slide img{width:100%;
  height:100%;
  object-fit:cover;
  object-position:right bottom;}

.suite-shot .photo-viewport,
.suite-shot .photo-track,
.suite-shot .photo-slide{height:100%;}
.suite-shot .photo-slide img{width:100%;height:100%;min-height:510px;object-fit:cover;}

.photo-nav{
  position:absolute;
  left:50%;
  bottom:17px;
  transform:translateX(-50%);
  width:351px;
  max-width:72%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  filter:drop-shadow(0 1px 6px rgba(0,0,0,.55));
}

.photo-arrow{width:13px;height:29px;display:grid;place-items:center;transition:opacity .25s ease;}

.photo-arrow img{width:29px;height:13px;object-fit:contain;}

.photo-arrow.prev img{transform:rotate(90deg);}

.photo-arrow.next img{transform:rotate(-90deg);}

.photo-arrow:hover{opacity:.55;}

.photo-dots{height:11px;gap:5px;}

/* ============ EXPERIENCE ============ */
.experience{
  position:relative;
  min-height:961px;
  display:flex;
  align-items:center;
  overflow:hidden;
}

.experience-media{position:absolute;inset:0;}

.experience-media img{width:100%;height:100%;object-fit:cover;}

.experience-scrim{position:absolute;inset:0;background:var(--scrim);}

.experience-copy{
  position:relative;
  z-index:2;
  text-align:center;
  padding:80px 24px;
}

.experience-copy h2{text-transform:uppercase;margin-bottom:26px;font-weight:200;}

.experience-copy p{
  text-transform:capitalize;
  font-weight:200;
  font-size:clamp(16px,1.9vw,24px);
  line-height:1.19;
  letter-spacing:1px;
  color:#fff;
  max-width:1199px;
  margin:0 auto 44px;
}

/* ============ GALLERY ============ */
.gallery{padding:110px 0 200px;}

.gallery h2{margin-bottom:50px;text-transform:uppercase;}

.gallery-filter{margin-bottom:56px;}

.select{position:relative;display:inline-block;}

.select-trigger{
  position:relative;
  display:inline-flex;
  align-items:center;
  width:282px;height:37px;
  border:2px solid var(--gold-bright);
  border-radius:var(--radius);
  background:transparent;
  cursor:pointer;
}

.select-label{
  width:204px;
  text-align:center;
  font-family:var(--ui);
  font-weight:800;
  font-size:16px;
  letter-spacing:3px;
  text-transform:uppercase;
  color:var(--gold-bright);
  pointer-events:none;
}

.select-divider{
  position:absolute;
  left:204px;
  top:50%;
  width:37px;height:2px;
  transform:translate(-50%,-50%) rotate(90deg);
  pointer-events:none;
}

.select-arrow{
  width:37px;
  height:37px;
  object-fit:contain;
  margin-left:21px;
  pointer-events:none;
  transition:transform .3s ease;
}

.select.is-open .select-arrow{transform:rotate(180deg);}

.select-menu{
  position:absolute;
  top:calc(100% + 6px);
  left:0;
  z-index:20;
  width:282px;
  background:#fff;
  border:2px solid var(--gold-bright);
  border-radius:var(--radius);
  padding:4px 0;
  opacity:0;
  visibility:hidden;
  transform:translateY(-6px);
  transition:opacity .25s ease,transform .25s ease,visibility .25s;
}

.select.is-open .select-menu{opacity:1;visibility:visible;transform:translateY(0);}

.select-option{
  padding:10px 20px;
  font-family:var(--ui);
  font-weight:700;
  font-size:14px;
  letter-spacing:3px;
  text-transform:uppercase;
  color:var(--gold);
  cursor:pointer;
  transition:background-color .2s ease,color .2s ease;
}

.select-option:hover{background:var(--gold-bright);color:#fff;}

.select-option.is-selected{background:rgba(232,184,103,.18);color:var(--gold);}

.gallery-grid{display:grid;gap:27px;}

.gallery-top{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:27px;}

.g-col{display:flex;flex-direction:column;gap:27px;}

.gallery-bottom{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:27px;}

.gallery-bottom .g8{grid-column:span 2;}

.g-item{overflow:hidden;border-radius:2px;cursor:zoom-in;}

.g-item img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.16,1,.3,1);}

.g-item:hover img{transform:scale(1.05);}

.g-item.hidden{display:none;}

.g1{height:254px;}

.g2{height:414px;}

.g3{height:264px;}

.g4{height:414px;}

.g5{height:264px;}

.g6{height:414px;}

.g7{height:264px;}

.g8{height:264px;}

/* ============ GALLERY — COLLECTIONS ============ */
/* intro band, then a stack of alternating .feature sliders (same
   component the-residence.html uses), closed by a video band */
.gallery-intro{padding:75px 0;}

.gallery-intro .story-body p{max-width:1200px;}

.collections{padding:0 0 40px;}

.collections .feature:first-child{padding-top:0;}

/* Video Gallery: centred intro-next heading, then a 2-up video band */
.video-gallery{padding:0 0 96px;}

.video-gallery .story-label{margin-bottom:10px;}

/* .video-gallery p:not(.story-label){max-width:700px;margin-left:auto;margin-right:auto;} */

.collection-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:22px;
  margin-top:44px;
  text-align:left;
}

.g-video{
  position:relative;
  aspect-ratio:4/3;
  overflow:hidden;
  border-radius:var(--radius);
  background:#000;
}

.g-video video{width:100%;height:100%;object-fit:cover;display:block;}

/* Gallery video block: title, copy and dropdown on top; media (video grid / photo masonry) with See more below */
.video-gallery.vg{padding:0 0 96px;text-align:left;}

.vg-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:44px;
  align-items:start;
}

.vg-copy{min-width:0;max-width:760px;}

.vg-media{min-width:0;}

.vg-title{
  font-weight:200;
  font-size:36px;
  letter-spacing:1px;
  line-height:1.19;
  color:var(--gold-bright);
  text-transform:uppercase;
  margin-bottom:22px;
}

.vg-text p{
  font-weight:200;
  font-size:21px;
  line-height:1.15;
  letter-spacing:1px;
  max-width:none;
  margin:0 0 1.2em;
  text-align:left;
}

.vg-text p:last-child{margin-bottom:0;}

/* Videos / Photos dropdown */
.vg-select{position:relative;display:inline-block;margin-top:30px;}

.vg-select-btn{
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  min-width:190px;padding:12px 20px;
  border:1px solid var(--gold);border-radius:var(--radius);
  background:transparent;color:var(--gold);
  font:inherit;font-weight:300;letter-spacing:1px;cursor:pointer;
}

.vg-select-btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s;}

.vg-select.is-open .vg-select-btn svg{transform:rotate(180deg);}

.vg-select-menu{
  position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:5;
  margin:0;padding:6px 0;list-style:none;
  background:#fff;border:1px solid var(--gold);border-radius:var(--radius);
  box-shadow:0 10px 24px rgba(0,0,0,.12);
}

.vg-select-menu[hidden]{display:none;}

.vg-select-menu li{padding:10px 20px;cursor:pointer;font-weight:300;letter-spacing:1px;}

.vg-select-menu li:hover,.vg-select-menu li[aria-selected="true"]{background:#f6efe1;color:var(--gold);}

/* media: videos and photos share the same 2-column grid (4 shown first, See more adds 4) */
.vg-panel[hidden]{display:none;}

.vg-items--videos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;}

.vg-items--videos .vg-item{aspect-ratio:16/10;margin:0;}

.vg-item.is-extra{display:none;}

.vg-item.is-extra.is-shown{display:block;}

.g-photo img{width:100%;height:100%;object-fit:cover;display:block;}

.vg-more{display:block;margin:36px auto 0;}

.vg-more[hidden]{display:none;}

.vg-empty{font-weight:200;letter-spacing:1px;font-size:18px;color:var(--gold);padding:40px 0;text-align:center;}

/* ============ CTA ============ */
/* All .cta bands: gold (--cta-bg) background, Burnt Teak text */
.cta{
  position:relative;
  background:var(--cta-bg);
  min-height:493px;
  display:flex;
  align-items:center;
  /* not clipped: the ornament is meant to break out above the band */
}

.cta-ornament{
  position:absolute;
  left:calc(60% - 720px + 872px);
  bottom:0;
  width:569px;
  height:598px;
  object-fit:contain;
  pointer-events:none;
}

.cta-inner{position:relative;z-index:2;padding:40px;}

/* thin Muted Green rule above every CTA heading */
.cta-inner::before{
  content:'';
  display:block;
  width:36px;
  height:2px;
  background:var(--muted-green);
  margin-bottom:18px;
  border-radius:1px;
}

.cta h2{
  font-weight:200;
  font-size:clamp(26px,3vw,36px);
  line-height:1.19;
  letter-spacing:3px;
  text-transform:uppercase;
  color:var(--burnt-teak);
  max-width:585px;
  margin-bottom:22px;
}

.cta p{
  font-weight:300;
  font-size:20px;
  line-height:1.15;
  letter-spacing:1px;
  color:var(--burnt-teak);
  max-width:709px;
  margin-bottom:46px;
}

.cta-actions{display:flex;gap:34px;flex-wrap:wrap;}

/* ── Button overrides inside every .cta ───────────────────────────────
   btn-outline-white was designed for dark bg; on cream bg swap it to
   Muted Green. btn-white also gets an on-cream override.              */
.cta .btn-outline-white{
  border-color:var(--muted-green);
  background:white;
}

.cta .btn-outline-white:hover{
  background:var(--muted-green);
  border-color:var(--muted-green);
  color:#3e2f16;
}

.cta .btn-white{
  background:transparent;
  border:1px solid var(--burnt-teak);
  color:var(--burnt-teak);
}

.cta .btn-white:hover{
  background:var(--burnt-teak);
  color:var(--soft-cream);
}

/* ============ FOOTER ============ */
.site-footer{background:var(--rich-walnut);color:#fff;padding:74px 0;border: solid var(--muted-green);}

.footer-grid{
  display:grid;
  grid-template-columns:279px minmax(0,1fr) 300px 190px;
  gap:clamp(24px,4vw,60px);
}

.footer-brand p{
  font-family:var(--serif);
  font-weight:400;
  font-size:20px;
  line-height:1.19;
  letter-spacing:1px;
  margin-bottom:24px;
}

.footer-brand em{font-style:normal;color:var(--warm-ivory);}

.footer-col h4{
  font-family:var(--ui);
  font-weight:800;
  font-size:16px;
  letter-spacing:3px;
  text-transform:uppercase;
  margin-bottom:26px;
}

.link-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;}

.link-cols a{
  font-family:var(--ui);
  font-size:16px;
  letter-spacing:1px;
  line-height:2.18;
  transition:color .25s ease;
}

.link-cols a:hover{color:var(--warm-ivory);}

.f-label{
  font-family:var(--sans);
  font-size:16px;
  color:var(--gold-bright);
  opacity:.80;
  line-height:1.19;
  margin-bottom:6px;
}

.f-value{
  font-family:var(--sans);
  font-weight:200;
  font-size:16px;
  line-height:1.19;
  margin-bottom:20px;
}

.socials{display:flex;align-items:center;gap:18px;}

.socials img{height:31px;width:auto;object-fit:contain;transition:opacity .25s ease;}

.socials a:hover img{opacity:.7;}

/* ============ LIGHTBOX ============ */
.lightbox{
  position:fixed;inset:0;z-index:200;
  background:rgba(12,9,6,.92);
  display:flex;align-items:center;justify-content:center;
  padding:40px;
}

.lightbox[hidden]{display:none;}

.lightbox img{max-width:92vw;max-height:88vh;object-fit:contain;border-radius:var(--radius);}

.lightbox-close{position:absolute;top:24px;right:34px;font-size:44px;line-height:1;color:#fff;}

/* photo sets (homepage residence): arrows either side, swipe on the photo */
.lightbox-arrow{
  display:none;
  position:absolute;top:50%;transform:translateY(-50%);
  width:56px;height:56px;border-radius:50%;
  font-size:44px;line-height:52px;text-align:center;color:#fff;
  background:rgba(255,255,255,.08);
  transition:background-color .25s ease;
}

.lightbox-arrow:hover{background:rgba(255,255,255,.2);}

.lightbox-prev{left:24px;}

.lightbox-next{right:24px;}

.lightbox.has-set .lightbox-arrow{display:block;}

.lightbox.has-set img{touch-action:none;cursor:grab;user-select:none;}

/* any content photo that opens in the lightbox (main.js marks it on hover) */
img.sm-zoomable{cursor:zoom-in;}

/* homepage residence: the whole photo opens the lightbox */
.sm-home .residence-slide .shot--open{cursor:zoom-in;}

.sm-home .residence-slide .shot--open:focus-visible{outline:2px solid var(--gold-bright);outline-offset:3px;}

/* ============ INNER PAGE HERO ============ */
.page-hero{
  position:relative;
  min-height:960px;
  display:flex;
  align-items:center;
  overflow:hidden;
  color:#fff;
}

.page-hero-media{position:absolute;inset:0;}

.page-hero-media img{width:100%;height:100%;object-fit:cover;}

.page-hero-scrim{position:absolute;inset:0;background:var(--hero-scrim);}

/* clears the fixed header (132px logo + 17px*2 padding) */
.page-hero-inner{position:relative;z-index:2;padding-top:75px;}

.page-hero h1{
  font-weight:500;
  font-size:clamp(38px,6.7vw,96px);
  line-height:1.19;
  letter-spacing:1px;
  text-transform:uppercase;
}

/* ============ STORY (Our Story) ============ */
.story-heading {
  font-family: var(--sans);
  font-weight: 200;
  font-size: 46px;
  color: var(--gold-accent);
  text-align: center;
  margin-bottom: 50px;
}

.story-subheading {
  font-family: var(--sans);
  font-weight: 300;
  font-size: clamp(24px, 3.5vw, 42px);
  color: var(--gold-accent);
  text-align: left;
  margin-bottom: 20px;
}

.story{padding:75px 0;}

.story-label{
  font-weight:200;
  font-size:46px;
  letter-spacing:1px;
  text-transform:uppercase;
  margin-bottom:10px;
}

.story-lead{
  font-weight:200;
  font-size:46px;
  line-height:1.15;
  letter-spacing:1px;
  text-align:center;
  margin-bottom:50px;
  color: #CEB282;
}

.story-body p{
  font-weight:200;
  font-size:20px;
  line-height:1.15;
  letter-spacing:1px;
  margin-bottom:20px;
}

.story-body p:last-child{margin-bottom:0;}

/* SM Story Text: optional full-width photo slider under the lead, like the home page's
   Swarna Experience band; split arrows float over the photo, centred on its height */
.story .band-slider,.gallery-intro .band-slider{position:relative;margin-bottom:56px;}

.story .band-viewport,.gallery-intro .band-viewport{overflow:hidden;cursor:grab;}

.story .band-viewport:active,.gallery-intro .band-viewport:active{cursor:grabbing;}

.story .band-track,.gallery-intro .band-track{display:flex;transition:transform .6s cubic-bezier(.16,1,.3,1);}

.story .band-slide,.gallery-intro .band-slide{flex:0 0 100%;height:700px;margin:0;}

.story .band-slide img,.gallery-intro .band-slide img{width:100%;height:100%;object-fit:cover;}

.story .band-slider .round-nav--split,.gallery-intro .band-slider .round-nav--split{
  position:absolute;
  top:350px; /* half of .band-slide (700px) */
  left:20px;
  right:20px;
  height:0;
  margin:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  pointer-events:none;
  z-index:2;
}

.story .band-slider .round-nav--split .round-arrow,.gallery-intro .band-slider .round-nav--split .round-arrow{pointer-events:auto;}

/* Introduction text beside a photo slider (The Suites) */
.story-intro-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:62px;
  align-items:start;
}

.story-intro-copy .story-lead,
.story-intro-copy .story-body{margin-bottom:0;}

.story-intro-copy .story-label{margin-bottom:14px;}

.story-intro-copy .story-lead{margin-bottom:20px;}

/* beige band behind a story-block, with a medallion straddling its bottom edge */
/* .story-block is declared later in this file, so the pairing needs the extra class to win */
.story-block.philosophy-band{
  position:relative;
  background:rgba(183,145,79,.32);
  /* the medallion reaches 75px up into the band, so the copy stops well short of it */
  padding:96px 0 133px;
  margin-bottom:150px;
}

.philosophy-band h2.no-caps{text-transform:none;}

.philosophy-band .story-block-body p{margin-bottom:1.19em;}

.philosophy-band .story-block-body p:last-child{margin-bottom:0;}

.story-compare{padding:75px 0;}

.compare-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:34px;
}

.compare-grid figure {
  display: flex;
  flex-direction: column;
}

.compare-grid figcaption{
  flex-grow: 1;
  font-weight: 200;
  font-size:20px;
  letter-spacing:1px;
  margin-bottom:22px;
}

.compare-grid .shot{
  position:relative;
  height:348px;
  border-radius:var(--radius);
  overflow:hidden;
}

.compare-grid .shot > img{width:100%;height:100%;object-fit:cover;}

.compare-subheading {
  font-size: 46px;
  font-family: var(--sans);
  color: var(--gold);
  text-align: center;
  margin-bottom: 50px;
  font-weight: 200;
  line-height: 1.15;
}

.compare-line{
  font-weight:200;
  font-size:20px;
  line-height:1.15;
  letter-spacing:1px;
  text-align:center;
  margin:72px auto 60px;
  max-width:1200px;
}

.story-wide{height:449px;border-radius:var(--radius);overflow:hidden;}

.story-wide img{width:100%;height:100%;object-fit:cover;}

/* ============ THE ETERNAL LIFE ============ */
.page-hero-sub{
  font-weight:300;
  font-size:clamp(15px,1.6vw,20px);
  line-height:1.19;
  letter-spacing:1px;
  max-width:996px;
  margin-top:26px;
}

/* a standalone medallion sitting between two sections */
.medallion-solo{
  display:flex;
  justify-content:center;
  padding:80px 0;
}

.medallion-solo .medallion{
  position:static;
  transform:none;
}

.crafted-body{
  font-weight:200;
  font-size:clamp(16px,1.9vw,24px);
  line-height:1.19;
  letter-spacing:1px;
  max-width:1098px;
  margin-bottom:46px;
}

.crafted-body p{margin-bottom:.6em;}

.crafted-body p:last-child{margin-bottom:0;}

.crafted-body em{
  font-style:italic;
  font-weight:400;
  font-size:clamp(20px,2.5vw,32px);
  line-height:1.19;
}

.replicate{padding:110px 0 120px;}

.replicate h2{
  font-weight:200;
  font-size:clamp(26px,3vw,36px);
  letter-spacing:1px;
  text-transform:uppercase;
  color:var(--gold-bright);
  margin-bottom:22px;
}

.replicate-lead{
  font-weight:200;
  font-size:20px;
  line-height:1.25;
  letter-spacing:1px;
  margin-bottom:44px;
}

.replicate-body p{
  text-transform:capitalize;
  font-weight:200;
  font-size:clamp(16px,1.9vw,24px);
  line-height:1.24;
  letter-spacing:1px;
}

/* CTA variant: ornament on the right, copy on the left */
/* the ornament needs white space above, so a CTA following a full-bleed
   or dark band gets a gap the page background shows through */
.video-band + .cta{margin-top:110px;}

.personal + .cta{margin-top:127px;}

/* ── cta--journey: Soft Cream palette ────────────────────────────────    */
/* Background: Soft Cream. Text: Burnt Teak (dark). Muted Green accent only
   on the thin rule and button border — kept sparse so it reads collected.   */
.cta--journey{
  background:var(--cta-bg);
}

/* thin Muted Green rule above the heading — the only saturated accent */
.cta--journey .cta-inner::before{
  content:'';
  display:block;
  width:36px;
  height:2px;
  background: var(--muted-green);
  margin-bottom:18px;
  border-radius:1px;
}

/* base pinned to the band, height overshoots it, so the crown pokes out the top */
.cta--journey .cta-ornament{
  left:calc(60% - 700px + 882px);
  right:auto;
  top:auto;
  bottom:-20px;
  width:569px;
  height:596px;
}

.cta--journey .cta p,
.cta--journey p{max-width:585px;}

.cta--journey .cta-inner p{
  font-weight:200;
  font-size:20px;
}

.btn-journey{width:500px;}

/* btn-outline-white inside cta--journey: swap white → Muted Green */
.cta--journey .btn-outline-white{
  border-color: var(--muted-green);
  color: var(--burnt-teak);
}

.cta--journey .btn-outline-white:hover{
  background: var(--muted-green);
  border-color: var(--muted-green);
  color: #fff;
}

/* ============ OUR STORY — philosophy band ============ */
.philosophy{
  background:rgba(183,145,79,.32);
  padding:100px 0 110px;
}

.philosophy-grid{
  display:grid;
  grid-template-columns:510px minmax(0,1fr);
  gap:99px;
  align-items:start;
}

.philosophy-copy,.philosophy .welcome-gallery{min-width:0;}

.philosophy h2{
  font-weight:200;
  font-size:36px;
  letter-spacing:1px;
  margin-bottom:26px;
}

.philosophy-body p{
  font-weight:200;
  font-size:20px;
  line-height:1.19;
  letter-spacing:1px;
  margin-bottom:1.15em;
}

.philosophy-body p:last-child{margin-bottom:0;}

.philosophy .welcome-slide{flex:0 0 519px;max-width:86vw;}

.philosophy .welcome-slide .shot{height:538px;}

/* .philosophy .round-nav{padding-right:calc(-1 * var(--bleed-right));} */

/* a plain heading + body block on white */
.story-block{padding:75px 0;}

.story-block h2{
  font-weight:200;
  font-size:36;
  letter-spacing:1px;
  text-align:center;
  margin-bottom:26px;
}

.story-block-body p{
  font-weight:200;
  font-size:20px;
  line-height:1.19;
  letter-spacing:1px;
  margin-bottom:.4em;
}

/* centred lead-in to another page */
.intro-next{padding:110px 0 120px;text-align:center;}

.intro-next h2{margin-bottom:28px;}

.intro-next p{
  font-weight:200;
  font-size:46px;
  line-height:1.19;
  letter-spacing:1px;
  max-width:1200px;
  margin:0 auto 40px;
}

/* the dark band carries the medallion at its foot, like the home page */
.experience.has-medallion{overflow:visible;}

.experience.has-medallion .medallion{
  position:absolute;
  left:50%;
  bottom:-75px;
  transform:translateX(-50%);
  z-index:3;
}

/* ============ THE RESIDENCE — alternating feature blocks ============ */
.feature{padding:0 0 75px;}

.feature-grid{
  display:grid;
  grid-template-columns:565px minmax(0,1fr);
  gap:49px;
  align-items:center;
}

.feature-shot{
  position:relative;
  /* height:100%; */
  border-radius:var(--radius);
  overflow:hidden;
  background:#efeae1;
}

.sm-suites-page .feature-shot-label,
.feature-shot-label{
  position:absolute;
  right:28px;
  bottom:24px;
  z-index:2;
  color:var(--gold-bright);
  font-family:var(--sans);
  font-weight:200;
  font-size:36px;
  line-height:1.2;
  letter-spacing:0.5px;
  pointer-events:none;
  text-shadow:0 1px 3px rgba(0,0,0,0.45);
}

@media (max-width:767px){
  .sm-suites-page .feature-shot-label,
  .feature-shot-label{
    right:18px;
    bottom:16px;
    font-size:18px;
  }
}

.feature-copy{position:relative;min-width:0;}

/* image right, copy left */
.feature--flip .feature-grid{grid-template-columns:minmax(0,1fr) 665px;}

.feature--flip .feature-shot{order:2;}

.feature--flip .feature-copy{order:1;}

/* SM Feature Block widget only: the photo runs out to the screen edge on its own side
   (left by default, right when flipped); the edge it touches loses its rounded corners */
@media (min-width:1101px){
  .feature--bleed .feature-shot{margin-left:var(--bleed-left);border-radius:0 var(--radius) var(--radius) 0;}
  .feature--bleed.feature--flip .feature-shot{margin-left:0;margin-right:var(--bleed-right);border-radius:var(--radius) 0 0 var(--radius);}
}

.feature-copy h2{
  font-weight:200;
  font-size:36px;
  letter-spacing:1px;
  line-height:1.19;
  color:var(--gold-bright);
  text-transform:uppercase;
  margin-bottom:22px;
}

.feature-copy p{
  position:relative;
  font-weight:200;
  font-size:20px;
  line-height:1.4;
  letter-spacing:1px;
  /* max-width:auto; */
  margin-bottom:1.4em;
}

.feature-copy p:last-child{margin-bottom:0;}

.feature-ornament{
  position:absolute;
  left:-110px;
  top:-40px;
  width:147px;
  height:299px;
  opacity:.05;
  object-fit:contain;
  pointer-events:none;
}

/* ============ LIFESTYLE GALLERY (peeks on both sides) ============ */
.lifestyle{padding: 0 0 30px 0 ;}

.lifestyle h2{
  font-weight:200;
  font-size:46px;
  letter-spacing:1px;
  text-align:center;
  margin-bottom:50px;
}

.lifestyle-slider{width:100vw;margin-left:calc(50% - 50vw);}

.lifestyle-viewport{overflow:hidden;cursor:grab;}

.lifestyle-viewport:active{cursor:grabbing;}

.lifestyle-track{
  display:flex;
  gap:24px;
  /* the leading pad centres the active slide, so neighbours peek either side */
  padding-left:calc((100vw - min(1174px, 82vw)) / 2);
  transition:transform .6s cubic-bezier(.16,1,.3,1);
}

.lifestyle-slide{flex:0 0 min(1174px,82vw);}

.lifestyle-slide .shot{height:600px;border-radius:var(--radius);overflow:hidden;}

.lifestyle-slide .shot img{width:100%;height:100%;object-fit:cover;}

.lifestyle-slider{position:relative;}

.lifestyle-nav{
  position:absolute;
  left:50%;
  bottom:28px;
  transform:translateX(-50%);
  width:719px;
  max-width:84%;
  /* display:flex; */
  align-items:center;
  justify-content:space-between;
  filter:drop-shadow(0 1px 8px rgba(0,0,0,.55));
}

.lifestyle-arrow{width:27px;height:59px;display:grid;place-items:center;transition:opacity .25s ease;}

.lifestyle-arrow img{width:59px;height:27px;object-fit:contain;}

.lifestyle-arrow.prev img{transform:rotate(90deg);}

.lifestyle-arrow.next img{transform:rotate(-90deg);}

.lifestyle-arrow:hover{opacity:.6;}

.dots--dark .dot{background:rgba(30,30,30,.35);}

.dots--dark .dot.is-active{background:var(--gold);}

/* ============ DID YOU KNOW band ============ */
.didyouknow{
  position:relative;
  background:rgba(232,184,103,.1);
  margin-top:120px;
  padding:110px 0 96px;
}

.didyouknow .medallion{
  position:absolute;
  left:50%;
  top:-75px;
  transform:translateX(-50%);
}

.didyouknow h2{
  font-weight:200;
  font-size:36px;
  letter-spacing:1px;
  margin-bottom:26px;
  color:var(--burnt-teak);
}

.didyouknow p{
  font-weight:200;
  font-size:20px;
  line-height:1.15;
  letter-spacing:1px;
  max-width:1106px;
  color:var(--burnt-teak);
  margin-bottom:.7em;
}

.didyouknow p:last-child{margin-bottom:0;}

/* ============ THE SWARNA EXPERIENCE ============ */
.exp{padding:110px 0 0;}

.exp h2{
  font-weight:200;
  font-size:36px;
  letter-spacing:1px;
  text-transform:uppercase;
  margin-bottom:40px;
}

.exp-slider{margin-right:var(--bleed-right);}

.exp-viewport{overflow:hidden;cursor:grab;}

.exp-viewport:active{cursor:grabbing;}

.exp-track{display:flex;gap:32px;transition:transform .6s cubic-bezier(.16,1,.3,1);}

.exp-card{flex:0 0 583px;max-width:82vw;}

.exp-card .shot{
  position:relative;
  height:348px;
  border-radius:var(--radius);
  overflow:hidden;
  margin-bottom:26px;
}

.exp-card .shot > img{width:100%;height:100%;object-fit:cover;}

.exp-card h3{
  font-weight:200;
  font-size:36px;
  letter-spacing:1px;
  margin-bottom:14px;
}

.exp-card p{
  font-weight:200;
  font-size:20px;
  line-height:1.15;
  letter-spacing:1px;
}

.exp-nav{display:flex;align-items:center;gap:26px;margin-top:34px;}

/* SM Experience Slider (both styles): split arrows float over the photos, centred on the
   photo height; on mobile they drop under the slider, on the left */
.exp-slider{position:relative;}

.exp-slider .round-nav--split{
  position:absolute;
  top:174px; /* half of .exp-card .shot (348px) */
  left:20px;
  width: 95%;
  right:calc(20px - var(--bleed-right));
  height:0;
  margin:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  pointer-events:none;
  z-index:2;
}

.exp-slider .round-nav--split .round-arrow{pointer-events:auto;}

/* the ritual block: copy left, bleeding photo track right */
.ritual{padding:50px 0;}

.ritual-grid{
  display:grid;
  grid-template-columns:560px minmax(0,1fr);
  gap:62px;
  align-items:center;
}

.ritual-copy,
.ritual .welcome-gallery{min-width:0;}

.ritual-copy h2{
  font-weight:200;
  font-size:46px;
  letter-spacing:1px;
  margin-bottom:22px;
}

.ritual-copy p{
  font-weight:200;
  font-size:20px;
  line-height:1.15;
  letter-spacing:1px;
}

/* personal experiences, on the dark brown band */
.personal{background:var(--brown-dark);color:#c3c3c3;padding:110px 0 120px;}

.personal h2{color:var(--gold-bright);margin-bottom:18px;}

.personal-lead{
  font-weight:200;
  font-size:20px;
  letter-spacing:1px;
  margin-bottom:12px;
}

.personal-body{
  font-weight:200;
  font-size:clamp(16px,1.9vw,24px);
  line-height:1.15;
  letter-spacing:1px;
  max-width:1098px;
  margin-bottom:48px;
}

.personal .exp-card figcaption{margin-top:22px;}

.tag-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:170px;
  height:61px;
  border:1px solid var(--gold-accent);
  border-radius:var(--radius);
  font-family:var(--ui);
  font-weight:200;
  font-size:16px;
  letter-spacing:3px;
  text-transform:uppercase;
  color:var(--gold-bright);
  transition:background-color .3s ease,color .3s ease;
}

.tag-btn:hover{background:var(--gold-accent);color:#fff;}

.personal .btn-residence{margin-top:48px;}

/* ============ THE SUITES ============ */
.suite-block{padding:0 0 150px;}

/* the shot column stays wider than the copy, matching the design's 665:486 split */
.suite-block-grid{
  display:grid;
  grid-template-columns:665fr 486fr;
  gap:62px;
  align-items:center;
}

.suite-block--flip .suite-block-grid{grid-template-columns:486fr 665fr;}

.suite-block--flip .suite-block-shot{order:2;}

.suite-block--flip .suite-block-copy{order:1;}

.suite-block-shot{
  position:relative;
  /* taller than the copy beside it, as in the design */
  height:650px;
  border-radius:var(--radius);
  overflow:hidden;
  /* bleeds to whichever viewport edge it sits against */
  margin-left:var(--bleed-left);
}

.suite-block-shot .photo-viewport{height:100%;}

.suite-block--flip .suite-block-shot{margin-left:0;margin-right:var(--bleed-right);}

.suite-block-copy{min-width:0;}

.suite-block-copy h2{
  font-weight:500;
  font-size:clamp(24px,3vw,36px);
  letter-spacing:1px;
  color:var(--gold-bright);
  margin-bottom:20px;
}

.suite-block-copy > p{
  font-weight:200;
  font-size:clamp(15px,1.6vw,18px);
  line-height:1.5;
  letter-spacing:1px;
  max-width:486px;
  margin-bottom:26px;
}

.features-label{
  font-family:var(--sans);
  font-weight:200;
  font-size:26px;
  letter-spacing:2px;
  text-transform:uppercase;
  margin-bottom:14px;
}

.features{
  display:grid;
  grid-auto-flow:column;
  grid-template-rows:repeat(3,auto);
  grid-template-columns:repeat(3,minmax(0,1fr));
  /* gap:8px 26px; */
  /* margin-bottom:30px; */
}

.features li{
  font-weight:200;
  font-size:20px;
  line-height:1.6;
  letter-spacing:1px;
  padding-left:16px;
  position:relative;
}

.features li::before{
  content:"\2022";
  position:absolute;
  left:0;
  color:var(--gold);
}

/* a single suite page's own feature list — small left label, bulleted columns */
/* .suite-features{padding:80px 0;} */

/* .suite-features .features{max-width:640px;} */

/* amenities shared by every suite */
.included{padding:96px 0;text-align:center;}

.included h2{
  font-weight:500;
  font-size:clamp(22px,2.6vw,30px);
  letter-spacing:3px;
  text-transform:uppercase;
  margin-bottom:46px;
}

.included-cols{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:40px;
  text-align:left;
  max-width:1100px;
  margin:0 auto;
}

.included-cols li{
  display:flex;
  align-items:center;
  gap:14px;
  font-weight:200;
  font-size:clamp(15px,1.6vw,18px);
  line-height:2;
  letter-spacing:1px;
}

.included-cols li img{
  width:27px;
  height:27px;
  object-fit:contain;
  flex:none;
}

/* guest-count to suite allocation */
.allocation{background:rgba(232,184,103,.1);padding:96px 0;}

.allocation h2{
  font-weight:500;
  font-size:clamp(22px,2.6vw,30px);
  letter-spacing:1px;
  text-align:center;
  margin-bottom:20px;
}

.allocation-lead{
  font-weight:200;
  font-size:clamp(16px,1.8vw,22px);
  letter-spacing:1px;
  text-align:center;
  margin-bottom:52px;
}

.allocation-table{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:0 40px;
  max-width:1100px;
  margin:0 auto;
}

.allocation-row{
  display:contents;
}

.allocation-row > *{
  padding:24px 0;
  border-bottom:1px solid rgba(183,145,79,.35);
  /* justify-self: center; */
}

.allocation-info{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.allocation-guests{
  font-weight:400;
  font-size:clamp(17px,1.9vw,22px);
  letter-spacing:1px;
}

.guest-icons{
  display:flex;
  flex-wrap:nowrap;
  gap:3px;
}

.guest-icons img{
  width:51px;
  height:51px;
  object-fit:contain;
  flex:none;
}

.allocation-suites li{
  font-weight:400;
  font-size:clamp(17px,1.9vw,22px);
  line-height:1.8;
  letter-spacing:1px;
}

.allocation-note{
  text-align:center;
  margin-top:48px;
  font-weight:200;
  font-size:clamp(16px,1.8vw,22px);
  line-height:1.6;
  letter-spacing:1px;
}

/* ============ BOOK YOUR STAY ============ */
.booking{padding:0 0 96px;}

.booking h2{margin-bottom:26px;}

/* plain .story-block has no top padding (it's meant to trail a .story section);
   chaining several of them in a row on this page needs it added back so they
   don't crowd each other */
.book-section{padding-top:96px;}

/* simple single-column bulleted list — reused for payment terms, inclusions and confirmation steps */
.copy-list{max-width:740px;}

.copy-list li{
  font-weight:200;
  font-size:clamp(16px,1.8vw,20px);
  line-height:1.9;
  letter-spacing:1px;
  padding-left:22px;
  position:relative;
}

.copy-list li::before{
  content:"\2022";
  position:absolute;
  left:0;
  color:var(--gold);
}

.copy-list a{color:var(--gold-accent);text-decoration:underline;text-underline-offset:3px;}

.copy-list a:hover{color:var(--gold-bright);}

.booking-form{max-width:640px;margin-top:44px;}

.booking-select-note{
  font-weight:200;
  font-size:16px;
  letter-spacing:1px;
  margin:6px 0 24px;
}

.booking-row{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:24px;}

.booking-field{margin-bottom:24px;}

.booking-row .booking-field{margin-bottom:0;}

.booking-field label{
  display:block;
  font-family:var(--ui);
  font-weight:700;
  font-size:13px;
  letter-spacing:2px;
  text-transform:uppercase;
  margin-bottom:10px;
  color:var(--burnt-teak);
}

.booking-field input,
.booking-field select{
  width:100%;
  height:54px;
  padding:0 18px;
  border:1px solid rgba(183,145,79,.4);
  border-radius:var(--radius);
  font-family:var(--sans);
  font-size:16px;
  color:var(--ink);
  background:#fff;
}

.booking-field input:focus,
.booking-field select:focus{outline:none;border-color:var(--gold);}

.booking-hint{
  font-weight:200;
  font-size:15px;
  letter-spacing:1px;
  color:var(--stone-grey);
  margin-bottom:28px;
}

.booking-note{
  margin-top:20px;
  font-weight:400;
  font-size:15px;
  line-height:1.6;
  letter-spacing:1px;
  max-width:520px;
  color:var(--burnt-teak);
}

.booking-contact{
  display:flex;
  gap:64px;
  flex-wrap:wrap;
  margin-top:32px;
}

.f-value--dark{color:var(--burnt-teak);}

/* bulleted "did you know" variant */
.didyouknow ul{max-width:1106px;}

.didyouknow li{
  font-weight:200;
  font-size:clamp(16px,1.9vw,22px);
  line-height:1.9;
  letter-spacing:1px;
  padding-left:22px;
  position:relative;
  color:var(--burnt-teak);
}

.didyouknow li::before{
  content:"\2022";
  position:absolute;
  left:0;
  color:var(--gold);
}

/* .didyouknow's photo carousel now reuses .lifestyle-slider directly (see the-suites.html) */
.didyouknow .lifestyle-slider{margin-top:64px;}

/* ============ VIDEO BAND (full-bleed still with a play button) ============ */
.video-band{
  position:relative;
  min-height:760px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}

.video-band-media{position:absolute;inset:0;}

.video-band-media img{width:100%;height:100%;object-fit:cover;}

.video-band-scrim{position:absolute;inset:0;background:var(--scrim);}

.video-band .play-btn{
  position:relative;
  z-index:2;
  top:auto;
  left:auto;
  transform:none;
  width:152px;
  height:152px;
}

.video-band .play-btn img{width:94px;height:119px;}

.video-band .play-btn:hover{transform:scale(1.08);}

/* ============ SM HOME PAGE (NEW HOMEPAGE — Figma FINAL → frame 2004:50) ============
   Used by the "SM Home Page (New)" widget. Everything is scoped to .sm-home,
   so the older single-section widgets keep their original look. */

/* short hero, the video toggle tucked into the bottom-right corner */
.sm-home .hero-video--short{min-height:0;height:100vh;}

/* sticky hero: it stays put while the sections below slide up over it.
   :where() keeps these at zero specificity, so every section's own background still wins
   and only the ones without a background get the white page colour */
.sm-home .hero-video--short{position:sticky;top:0;z-index:0;}

:where(.sm-home > .hero-video ~ *){position:relative;z-index:1;background-color:#fff;}

/* darkens as it is covered; main.js sets --cover from 0 to 1 */
.sm-home .hero-video--short::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:#000;opacity:calc(var(--cover, 0) * .55);
}

/* once fully covered it is hidden, so gaps between later sections show the page, not the video */
.sm-home .hero-video--short.is-covered{visibility:hidden;}

/* in the Elementor editor it scrolls normally */
.elementor-editor-active .sm-home .hero-video--short{position:relative;}

.sm-home .hero-video .video-toggle--corner{
  top:auto;
  left:auto;
  right:max(var(--pad), calc((100vw - 1440px) / 2 + 117px));
  bottom:89px;
  transform:none;
  width:51px;height:51px;
}

.sm-home .video-toggle--corner img{width:32px;height:40px;}

.sm-home .hero-video .video-toggle--corner:hover{transform:scale(1.08);}

.sm-home .home-title{padding:75px 0;text-align:center;}

.sm-home .home-title h1{
  font-family:var(--sans);
  font-weight:200;
  color:#BA9351;
  font-size:63px;
  line-height:1.19;
  max-width:789px;
  margin:0 auto;
}

/* full-width photo bands */
.sm-home .full-shot{height:673px;overflow:hidden;}

.sm-home .full-shot img{width:100%;height:100%;object-fit:cover;}

.sm-home .full-shot--mid{height:80vh;}

.sm-home .full-shot--tall{height:960px;}

.sm-home .home-copy{
  font-weight:100;
  font-size:20px;
  line-height:1.25;
  letter-spacing:1px;
}

.sm-home .home-copy--wide{max-width:1200px;}

.sm-home .home-intro{padding:40px 0 0;}

.sm-home .home-intro .home-copy{margin:0 0 50px;}

.sm-home .home-actions{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;}

.sm-home .home-actions--end{justify-content:flex-end;}

.sm-home .home-actions:empty{display:none;}

.sm-home .home-block{padding-top:75px;}

/* section H2s share the H1 gold; the CTA heading stays Burnt Teak on its gold band */
.sm-home .home-heading{margin-bottom:60px;color:#BA9351;}

.sm-home .home-heading--tight{margin-bottom:46px;}

.sm-home .home-block-copy{padding-top:50px;}

.sm-home .home-block-copy .home-copy{margin-bottom:50px;}

/* residence band: slider first, copy and buttons after */
.sm-home .residence--v2{padding:125px 0 92px;}

.sm-home .residence--v2 .residence-body{margin-top:50px;}

.sm-home .residence--v2 .residence-quote{margin-bottom:40px;}

.sm-home .residence--v2 .btn-residence{margin-top:0;}

/* suites: 1200 x 595 cards, suite arrows moved out under the slider */
.sm-home .suites--v2{padding:75px 0 0;}

/* fixed height: portrait Room photos are cropped to fit instead of stretching the card */
.sm-home .suite-card{
  flex:0 0 1200px;
  max-width:92vw;
  grid-template-columns:367px minmax(0,1fr);
  height:595px;
  min-height:0;
}

.sm-home .suite-shot{height:595px;}

/* The Swarna Experience: full-bleed photo slider */
.sm-home .band-slider{position:relative;}

.sm-home .band-viewport{overflow:hidden;cursor:grab;}

.sm-home .band-viewport:active{cursor:grabbing;}

.sm-home .band-track{display:flex;transition:transform .6s cubic-bezier(.16,1,.3,1);}

.sm-home .band-slide{flex:0 0 100%;height:700px;margin:0;}

.sm-home .band-slide img{width:100%;height:100%;object-fit:cover;}

.sm-home .home-exp{padding-top:90px;}

.sm-home .home-exp .home-block-copy{padding-top:50px;}

/* round arrows sit under the photos (Residence + Suites + Swarna Experience) */
.sm-home .residence--v2 .round-nav,
.sm-home .suites--v2 .round-nav,
.sm-home .home-exp .round-nav,
.sm-home .band-slider .round-nav{margin-top:30px;margin-right:0;justify-content:flex-end;}

/* Residence: arrows float over the photos, centred on their height — prev at the shell's
   left edge, next at its right edge (the slider itself bleeds past it, hence the bleed offset) */
.sm-home .residence--v2 .residence-slider{position:relative;}

.sm-home .residence--v2 .round-nav--split{
  position:absolute;
  top:174px; /* half of .residence-slide .shot height */
  left:20px;
  right:calc(20px - var(--bleed-right));
  height:0;
  margin:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  pointer-events:none;
  z-index:2;
}

.sm-home .residence--v2 .round-nav--split .round-arrow{pointer-events:auto;}

.round-arrow--line{color:white;display:grid;place-items:center;border-radius:50%;background:#3e2f16;border:solid;border-width:thin;border-radius:99px}

.round-arrow--line svg{width:100%;height:100%;fill:none;stroke:white;stroke-width:1;stroke-linecap:round;stroke-linejoin:round;}

.round-arrow--line svg polyline{vector-effect:non-scaling-stroke;}

/* Residence: prev at the left, next at the right; thin line chevrons to match the light type */
.sm-home .residence--v2 .round-nav--split{justify-content:space-between;}

.round-arrow--line{color:white;display:grid;place-items:center;}

.round-arrow--line svg{width:70%;height:70%;fill:none;stroke:white;stroke-width:1;stroke-linecap:round;stroke-linejoin:round;}

.round-arrow--line svg polyline{vector-effect:non-scaling-stroke;}

/* Suites + Swarna Experience + Full-width Bands: same floating arrows as the Residence, centred on the photo
   height and lined up with the shell's left / right edges */
.sm-home .suite-slider{position:relative;}

.sm-home .suites--v2 .round-nav--split,
.sm-home .home-exp .round-nav--split,
.sm-home .band-slider .round-nav--split{
  position:absolute;
  left:calc(20px - var(--bleed-right));
  right:calc(20px - var(--bleed-right));
  height:0;
  margin:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  pointer-events:none;
  z-index:2;
}

.sm-home .suites--v2 .round-nav--split{top:50%;left:20px;}

/* half of .band-slide (700px) */
.sm-home .home-exp .round-nav--split,
.sm-home .band-slider .round-nav--split{top:350px; left:20px; right:20px;}

.sm-home .suites--v2 .round-nav--split .round-arrow,
.sm-home .home-exp .round-nav--split .round-arrow,
.sm-home .band-slider .round-nav--split .round-arrow{pointer-events:auto;}

.sm-home .btn-watch{letter-spacing:2px;}

.sm-home .btn-exp-v2{letter-spacing:2px;}

.sm-home .cta--home{margin-top:186px;}

.sm-home .cta--home p{margin-bottom:0;}

.sm-home .cta--home .cta-actions{margin-top:46px;}

/* video popup inside the shared lightbox (created by main.js) */
.lightbox video{max-width:92vw;max-height:88vh;border-radius:var(--radius);background:#000;}

.lightbox video[hidden]{display:none;}

/* SM Residence + SM Philosophy widgets: same floating arrows as the home page, centred on the
   photo height; on mobile they drop under the slider, on the left */
.residence:not(.residence--v2) .residence-slider,
.philosophy .welcome-gallery{position:relative;}

.residence:not(.residence--v2) .round-nav--split,
.philosophy .round-nav--split{
  position:absolute;
  left:20px;
  right:calc(20px - var(--bleed-right));
  height:0;
  margin:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  pointer-events:none;
  z-index:2;
}

.philosophy .round-nav--split,.residence:not(.residence--v2) .round-nav--split{
  width:95%;
}

.residence:not(.residence--v2) .round-nav--split{top:174px;}

/* half of .residence-slide .shot (348px) */
.philosophy .round-nav--split{top:50%;}

/* half of .philosophy .welcome-slide .shot (538px) */
.residence:not(.residence--v2) .round-nav--split .round-arrow,
.philosophy .round-nav--split .round-arrow{pointer-events:auto;}

/* SM Ritual widget: same floating arrows, centred on the photo height; under the slider on mobile.
   (SM Image Slider is a .residence section, so the Residence rules above already cover it.) */
.ritual .welcome-gallery{position:relative;}

.ritual .round-nav--split{
  position:absolute;
  top:275px; /* half of .welcome-slide .shot (551px) */
  left:20px;
  right:calc(20px - var(--bleed-right));
  width:95%;
  height:0;
  margin:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  pointer-events:none;
  z-index:2;
}

.ritual .round-nav--split .round-arrow{pointer-events:auto;}

/* SM Lifestyle Slider: full-bleed track with the active slide centred, so the arrows sit on the
   edges of that centred slide; the dots stay at the bottom of the photo, centred */
.lifestyle .lifestyle-nav{justify-content:center;}

.lifestyle .round-nav--split,
.story-compare .round-nav--split{
  position:absolute;
  top:50%; /* half of .lifestyle-slide .shot (583px) */
  left:calc((100vw - min(1174px, 82vw)) / 2 + 20px);
  right:calc((100vw - min(1174px, 82vw)) / 2 + 20px);
  height:0;
  margin:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  pointer-events:none;
  z-index:2;
}

.lifestyle .round-nav--split .round-arrow,
.story-compare .round-nav--split .round-arrow {pointer-events:auto;}

/* SM Feature Block & The Suites feature photo slider: floating round arrows centred on the photo */
.feature-shot .round-nav--split{
  position:absolute;
  top:50%;
  left:20px;
  right:20px;
  height:0;
  margin:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  pointer-events:none;
  z-index:2;
}

.feature-shot .round-nav--split .round-arrow{pointer-events:auto;}

.round-nav--split .round-arrow,
.round-nav--split .round-arrow.thin-arrow{
  width:50px;
  height:50px;
  pointer-events:auto;
}

/* ============ SM SUITES PAGE (NEW THE SUITES — Figma FINAL → frame 58:644) ============
   Used by the "SM Suites Page (New)" widget. Everything is scoped to .sm-suites-page,
   so the older single-section widgets keep their original look. */

/* the page opens on white, so the fixed header needs its dark band from the start */
body:has(.sm-suites-page) .site-header{background:rgba(27,20,12,.94);}

.sm-suites-page .sp-heading{color:#BA9351;}

/* title + full-width photo */
.sm-suites-page .sp-hero{padding:150px 0 0;}

.sm-suites-page .sp-title{
  font-family:var(--sans);
  font-weight:200;
  font-size:63px;
  line-height:1.19;
  letter-spacing:1px;
  text-align:center;
  margin-bottom:50px;
}

.sm-suites-page .sp-hero-shot{height:753px;overflow:hidden;}

.sm-suites-page .sp-hero-shot img{width:100%;height:100%;object-fit:cover;}

/* introduction: tagline, lead, then copy beside a photo slider that bleeds right */
.sm-suites-page .sp-intro{padding-top:75px;}

.sm-suites-page .sp-tagline{
  font-weight:400;
  font-size:clamp(17px,1.9vw,24px);
  letter-spacing:1px;
  margin-bottom:150px;
}

.sm-suites-page .sp-lead{
  font-weight:200;
  font-size:46px;
  line-height:1.19;
  letter-spacing:1px;
  text-align:center;
  color:#BA9351;
  margin-bottom:53px;
}

.sm-suites-page .sp-intro-grid{
  display:grid;
  grid-template-columns:minmax(0,525px) minmax(0,1fr);
  gap:65px;
  align-items:start;
}

.sm-suites-page .sp-intro-copy p{
  font-weight:200;
  font-size:20px;
  line-height:1.3;
  letter-spacing:1px;
  margin-bottom:1.3em;
}

.sm-suites-page .sp-intro-copy p:last-child{margin-bottom:0;}

.sm-suites-page .sp-intro-media{min-width:0;margin-right:var(--bleed-right);}

.sm-suites-page .sp-gallery-viewport{overflow:hidden;cursor:grab;border-radius:var(--radius) 0 0 var(--radius);}

.sm-suites-page .sp-gallery-viewport:active{cursor:grabbing;}

.sm-suites-page .sp-gallery-track{display:flex;transition:transform .6s cubic-bezier(.16,1,.3,1);}

.sm-suites-page .sp-gallery-slide{flex:0 0 100%;height:600px;margin:0;}

.sm-suites-page .sp-gallery-slide img{width:100%;height:100%;object-fit:cover;cursor:zoom-in;}

.sm-suites-page .sp-intro-media .round-nav{margin-top:30px;margin-right:max(var(--pad), calc((100vw - 1440px) / 2 + 71px));justify-content:flex-end;}

/* intro photos laid out like SM Ritual: rounded 657 x 551 cards, 30px apart, the next one
   peeking at the right (sizes follow .welcome-slide at every breakpoint) */
.sm-suites-page .sp-intro .sp-gallery-viewport{border-radius:0;}

.sm-suites-page .sp-intro .sp-gallery-track{gap:30px;}

.sm-suites-page .sp-intro .sp-gallery-slide{
  flex:0 0 657px;
  max-width:86vw;
  /* height:551px; */
  border-radius:var(--radius);
  overflow:hidden;
}

/* intro photos: split arrows float over the photo, centred on its height; under it on mobile.
   Same placement as SM Ritual. */
.sm-suites-page .sp-intro-media{position:relative;}

.sm-suites-page .sp-intro .sp-intro-media .round-nav--split{
  position:absolute;
  top:275px; /* half of the 551px card */
  left:20px;
  right:calc(20px - var(--bleed-right));
  width:95%;
  height:0;
  margin:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  pointer-events:none;
  z-index:2;
}

.sm-suites-page .sp-intro .sp-intro-media .round-nav--split .round-arrow{pointer-events:auto;}

/* included throughout every suite */
.sm-suites-page .sp-included{padding-top:75px;}

.sm-suites-page .sp-included-heading{
  font-weight:200;
  font-size:clamp(22px,2.6vw,36px);
  letter-spacing:3px;
  text-transform:uppercase;
  text-align:center;
  margin-bottom:48px;
}

.sm-suites-page .sp-included-cols{
  display:flex;
  justify-content:space-between;
  gap:40px;
  max-width:1186px;
  margin:0 auto;
}

.sm-suites-page .sp-included-cols li{
  display:flex;
  align-items:center;
  gap:14px;
  font-weight:200;
  font-size:clamp(15px,1.6vw,20px);
  line-height:2;
  letter-spacing:1px;
}

.sm-suites-page .sp-included-cols li img{width:27px;height:27px;object-fit:contain;flex:none;}

/* accommodation allocation: 2 x 2 grid on a light gold band */
.sm-suites-page .sp-alloc{padding:75px 0;text-align:center;}

.sm-suites-page .sp-alloc-heading{
  font-weight:200;
  font-size:clamp(24px,3vw,36px);
  letter-spacing:1px;
  margin-bottom:12px;
}

.sm-suites-page .sp-alloc-lead{
  font-weight:200;
  font: size 23px;;
  letter-spacing:1px;
  margin-bottom:51px;
}

.sm-suites-page .sp-alloc-band{background:#E8B867;color:var(--ink);padding:38px 0 45px;text-align:left;}

.sm-suites-page .sp-alloc-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:40px 60px;
  max-width:1200px;
}

.sm-suites-page .sp-alloc-row{display:grid;grid-template-columns:220px minmax(0,1fr);gap:10px;align-items:start;}

.sm-suites-page .sp-alloc-guests{
  font-weight:200;
  font-size:20px;
  letter-spacing:1px;
  line-height:1.4;
}

.sm-suites-page .sp-alloc-suites li{
  font-weight:200;
  font-size:20px;
  line-height:1.6;
  letter-spacing:1px;
}

.sm-suites-page .sp-alloc-note{
  padding:30px 0 0;
  font-weight:200;
  font-size:20px;
  line-height:1.6;
  letter-spacing:1px;
}

/* suites: one suite at a time — name, full-width photo, description, features */
.sm-suites-page .sp-suites{padding-top:130px;}

.sm-suites-page .sp-suites-viewport{overflow:hidden;}

.sm-suites-page .sp-suites-track{display:flex;align-items:flex-start;transition:transform .6s cubic-bezier(.16,1,.3,1);}

.sm-suites-page .sp-suite{flex:0 0 100%;min-width:0;}

.sm-suites-page .sp-suite-name{
  font-weight:300;
  text-transform:uppercase;
  font-size:clamp(28px,4.4vw,60px);
  line-height:1.19;
  letter-spacing:1px;
  text-align:center;
  margin-bottom:36px;
}

.sm-suites-page .sp-suite-shot{position:relative;height:578px;overflow:hidden;background:#2a2014;}

.sm-suites-page .sp-suite-shot .photo-nav{
  left:max(var(--pad), calc((100vw - 1440px) / 2 + 144px));
  bottom:94px;
  transform:none;
}

.sm-suites-page .sp-suite-body{padding-top:50px;}

/* suite copy: 20px floor, 32px ceiling */
.sm-suites-page .sp-suite-desc p{
  font-weight:300;
  font-size:clamp(20px,2.2vw,32px);
  line-height:1.3;
  letter-spacing:1px;
  margin-bottom:1.1em;
}

.sm-suites-page .sp-suite-desc{margin-bottom:8px;}

.sm-suites-page .sp-suite-body .features-label{
  font-family:var(--sans);
  font-weight:400;
  font-size:20px;
  letter-spacing:.5px;
  text-transform:none;
  margin-bottom:10px;
}

.sm-suites-page .features{grid-template-columns:repeat(2,minmax(0,320px));gap:2px 40px;margin-bottom:36px;}

.sm-suites-page .features li{font-weight:300;font-size:20px;line-height:1.15;letter-spacing:.5px;padding-left:18px;}

.sm-suites-page .sp-suite-btn{
  max-width:100%;
  font-family:var(--sans); 
  letter-spacing:1px;
  border-color:#E8B867;
  color:#E8B867;
}

.sm-suites-page .sp-suite-btn:hover{background:var(--gold);color:#fff;}

.sm-suites-page .sp-suites .round-nav{margin-right:0;}

.sm-suites-page .sp-cta{margin-top:160px;}

.sm-suites-page .sp-cta .cta-inner::before{display:none;}

/* door sits fully inside the band on the right, crown poking out the top (as in the PDF) */
.sm-suites-page .sp-cta .cta-ornament{left:auto;right:max(var(--pad), calc((100vw - 1440px) / 2 + 100px));bottom:0;width:408px;height:600px;object-fit:contain;object-position:bottom;}

.sm-suites-page .sp-cta h2,
.sm-suites-page .sp-cta p{color:#fff;}

.sm-suites-page .sp-cta .sp-cta-btn{border-color:#fff;color:#fff;}

.sm-suites-page .sp-cta .sp-cta-btn:hover{background:#fff;border-color:#fff;color:var(--burnt-teak);}

/* ============ SM ROOM HERO (single Room page — Figma FINAL → The Swarna Suite / PADMA SUITES) ============
   Full-bleed photo, dark overlay, room name top-left. Used by the "SM Room Hero" widget. */
.sm-room-hero{
  position:relative;
  height:90vh;
  overflow:hidden;
  background:#2a2014;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
}

.sm-room-hero .rh-media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}

.sm-room-hero .rh-scrim{position:absolute;inset:0;}

/* Posisikan teks di kanan bawah */
.sm-room-hero .rh-inner{
  position:relative;
  z-index:2;
  padding-top:0;
  padding-bottom:clamp(32px, 5vw, 64px);
  padding-right:max(var(--pad), calc((100vw - 1440px) / 2 + 69px));
  padding-left:var(--pad);
  text-align:right;
}

.sm-room-hero .rh-title{
  font-family:var(--sans);
  font-weight:300;
  font-size:36px;
  line-height:1.2;
  letter-spacing:2px;
  text-transform:uppercase;
  color:var(--gold-bright, #e8b867);
  text-shadow:0 2px 10px rgba(0,0,0,.5);
}

/* SM Story Text — optional "Watch video" button, bottom-right */
.story-actions{display:flex;justify-content:start;margin-top:50px;}

/* ============ SM BOOK PAGE (Book Your Stay — owner's copy, plugin form) ============
   Used by the "SM Book Page (New)" widget. The form comes from a form plugin
   (Contact Form 7 now, a booking engine later); its fields are styled here.
   Everything is scoped to .sm-book-page; the .bp-form field rules also style
   the review form of the "SM Reviews" widget (.sm-reviews). */
.sm-book-page .bp-heading{color:#BA9351;}

.sm-book-page .bp-band{background:#E8B867;}

.sm-book-page .bp-copy p{
  font-weight:300;
  font-size:clamp(18px,1.6vw,22px);
  line-height:1.15;
  letter-spacing:1px;
  margin-bottom:1em;
}

.sm-book-page .bp-copy p:last-child{margin-bottom:0;}

/* headings: page heading, its sub line, and the section sub headings */
.sm-book-page .bp-title{
  font-family:var(--sans);
  font-weight:300;
  font-size:clamp(34px,4.4vw,64px);
  line-height:1.19;
  letter-spacing:1px;
  text-transform:uppercase;
  margin-bottom:12px;
}

.sm-book-page .bp-lead{
  font-weight:300;
  font-size:clamp(22px,2.4vw,32px);
  line-height:1.3;
  letter-spacing:1px;
  margin-bottom:36px;
}

.sm-book-page .bp-sub{
  font-weight:400;
  font-size:clamp(24px,2.4vw,32px);
  line-height:1.25;
  letter-spacing:1px;
  margin-bottom:18px;
}

.sm-book-page .bp-intro{padding:110px 0 0;}

.sm-book-page .bp-intro .bp-copy{max-width:900px;}

/* booking: copy, then the form on a soft panel */
.sm-book-page .bp-booking{padding:96px 0 0;scroll-margin-top:120px;}

.sm-book-page .bp-booking-head{max-width:900px;margin-bottom:40px;}

:is(.sm-book-page,.sm-reviews) .bp-form{
  max-width:860px;
  padding:48px;
  border:1px solid rgba(183,145,79,.3);
  border-radius:var(--radius);
  background:#fdf8ee;
}

:is(.sm-book-page,.sm-reviews) .bp-form-note{
  margin-top:20px;
  font-weight:300;
  font-size:15px;
  line-height:1.6;
  letter-spacing:.5px;
  color:var(--stone-grey);
}

:is(.sm-book-page,.sm-reviews) .bp-form-missing{
  padding:18px 20px;
  border:1px dashed var(--gold);
  border-radius:var(--radius);
  font-size:15px;
  color:var(--burnt-teak);
  background:rgba(232,184,103,.12);
}

/* --- plugin form fields (plugin-agnostic, plus Contact Form 7 details) --- */
:is(.sm-book-page,.sm-reviews) .bp-form form p{margin:0 0 22px;}

:is(.sm-book-page,.sm-reviews) .bp-form label{
  display:block;
  font-family:var(--ui);
  font-weight:700;
  font-size:13px;
  letter-spacing:2px;
  text-transform:uppercase;
  color:var(--burnt-teak);
}

:is(.sm-book-page,.sm-reviews) .bp-form .wpcf7-form-control-wrap{display:block;margin-top:10px;}

:is(.sm-book-page,.sm-reviews) .bp-form input[type="text"],
:is(.sm-book-page,.sm-reviews) .bp-form input[type="email"],
:is(.sm-book-page,.sm-reviews) .bp-form input[type="tel"],
:is(.sm-book-page,.sm-reviews) .bp-form input[type="date"],
:is(.sm-book-page,.sm-reviews) .bp-form input[type="number"],
:is(.sm-book-page,.sm-reviews) .bp-form select,
:is(.sm-book-page,.sm-reviews) .bp-form textarea{
  display:block;
  width:100%;
  height:54px;
  padding:0 18px;
  border:1px solid rgba(183,145,79,.45);
  border-radius:var(--radius);
  background:#fff;
  font-family:var(--sans);
  font-weight:300;
  font-size:16px;
  letter-spacing:.5px;
  text-transform:none;
  color:var(--ink);
  transition:border-color .2s ease,box-shadow .2s ease;
}

:is(.sm-book-page,.sm-reviews) .bp-form textarea{height:auto;min-height:130px;padding:14px 18px;resize:vertical;}

:is(.sm-book-page,.sm-reviews) .bp-form input:focus,
:is(.sm-book-page,.sm-reviews) .bp-form select:focus,
:is(.sm-book-page,.sm-reviews) .bp-form textarea:focus{
  outline:none;
  border-color:var(--gold);
  box-shadow:0 0 0 3px rgba(183,145,79,.15);
}

/* two fields side by side (the form template wraps them in <div class="bp-row">) */
:is(.sm-book-page,.sm-reviews) .bp-form .bp-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;}

/* terms checkbox: normal-case sentence, not a field label */
:is(.sm-book-page,.sm-reviews) .bp-form .wpcf7-acceptance label,
:is(.sm-book-page,.sm-reviews) .bp-form .wpcf7-acceptance .wpcf7-list-item-label{
  font-family:var(--sans);
  font-weight:300;
  font-size:15px;
  letter-spacing:.5px;
  text-transform:none;
}

:is(.sm-book-page,.sm-reviews) .bp-form .wpcf7-acceptance .wpcf7-list-item{margin:0;}

:is(.sm-book-page,.sm-reviews) .bp-form .wpcf7-acceptance input{width:18px;height:18px;margin-right:10px;vertical-align:-3px;accent-color:var(--gold);}

:is(.sm-book-page,.sm-reviews) .bp-form a{color:var(--gold);text-decoration:underline;text-underline-offset:3px;}

:is(.sm-book-page,.sm-reviews) .bp-form input[type="submit"],
:is(.sm-book-page,.sm-reviews) .bp-form button[type="submit"]{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:320px;
  max-width:100%;
  height:60px;
  margin-top:6px;
  border:1px solid var(--gold);
  border-radius:var(--radius);
  background:var(--gold);
  color:#fff;
  font-family:var(--ui);
  font-weight:700;
  font-size:16px;
  letter-spacing:2px;
  text-transform:uppercase;
  cursor:pointer;
  transition:background-color .3s ease;
}

:is(.sm-book-page,.sm-reviews) .bp-form input[type="submit"]:hover,
:is(.sm-book-page,.sm-reviews) .bp-form button[type="submit"]:hover{background:#a37f42;}

:is(.sm-book-page,.sm-reviews) .bp-form input[type="submit"]:disabled{opacity:.5;cursor:not-allowed;}

:is(.sm-book-page,.sm-reviews) .bp-form .wpcf7-spinner{vertical-align:middle;}

:is(.sm-book-page,.sm-reviews) .bp-form .wpcf7-not-valid{border-color:#c0392b;}

:is(.sm-book-page,.sm-reviews) .bp-form .wpcf7-not-valid-tip{
  margin-top:6px;
  font-family:var(--sans);
  font-weight:400;
  font-size:13px;
  letter-spacing:.5px;
  text-transform:none;
  color:#c0392b;
}

:is(.sm-book-page,.sm-reviews) .bp-form .wpcf7 form .wpcf7-response-output{
  margin:20px 0 0;
  padding:14px 18px;
  border-radius:var(--radius);
  font-size:15px;
  line-height:1.5;
}

/* allocation: heading on white, rows on the gold band */
.sm-book-page .bp-alloc{padding:110px 0 0;}

.sm-book-page .bp-alloc-head{margin-bottom:36px;}

.sm-book-page .bp-alloc .bp-band{padding:40px 0;}

.sm-book-page .bp-alloc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 60px;}

.sm-book-page .bp-alloc-row{display:grid;grid-template-columns:180px minmax(0,1fr);gap:16px;align-items:start;}

.sm-book-page .bp-alloc-guests{font-weight:500;font-size:clamp(18px,1.8vw,22px);letter-spacing:1px;}

.sm-book-page .bp-alloc-suites{font-weight:400;font-size:clamp(17px,1.6vw,20px);line-height:1.5;letter-spacing:.5px;}

.sm-book-page .bp-alloc-note{
  margin-top:28px;
  font-weight:400;
  font-size:clamp(17px,1.6vw,20px);
  line-height:1.5;
  letter-spacing:.5px;
}

/* two-column detail blocks with gold bullet lists */
.sm-book-page .bp-details{padding:96px 0 0;}

.sm-book-page .bp-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 80px;align-items:start;}

.sm-book-page .bp-block + .bp-block{margin-top:48px;}

/* side-by-side columns line up at the top; only stacked blocks get the gap */
.sm-book-page .bp-two > .bp-block + .bp-block{margin-top:0;}

.sm-book-page .bp-list-intro{font-weight:400;font-size:clamp(17px,1.6vw,20px);line-height:1.5;letter-spacing:.5px;margin-bottom:14px;}

.sm-book-page .bp-list li{
  position:relative;
  padding-left:22px;
  font-weight:300;
  font-size:clamp(17px,1.6vw,20px);
  line-height:1.6;
  letter-spacing:.5px;
  margin-bottom:6px;
}

.sm-book-page .bp-list li::before{content:"\2022";position:absolute;left:0;color:var(--gold);}

.sm-book-page .bp-links a{color:var(--gold);text-decoration:underline;text-underline-offset:3px;}

.sm-book-page .bp-links a:hover{color:var(--burnt-teak);}

.sm-book-page .bp-block-note{
  margin-top:16px;
  font-weight:300;
  font-size:16px;
  line-height:1.6;
  letter-spacing:.5px;
  color:var(--stone-grey);
}

/* need assistance: copy + contact details */
.sm-book-page .bp-help{padding:110px 0 120px;}

.sm-book-page .bp-help-grid{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:60px;align-items:start;}

.sm-book-page .bp-contact{
  border-left:2px solid #E8B867;
  padding:6px 0 6px 32px;
}

.sm-book-page .bp-contact dt{font-family:var(--ui);font-size:14px;letter-spacing:1px;color:var(--stone-grey);margin-bottom:4px;}

.sm-book-page .bp-contact dd{
  font-family:var(--ui);
  font-weight:700;
  font-size:17px;
  line-height:1.4;
  color:var(--burnt-teak);
  margin:0 0 22px;
  overflow-wrap:anywhere;
}

.sm-book-page .bp-contact dd:last-child{margin-bottom:0;}

.sm-book-page .bp-contact a{text-decoration:underline;text-underline-offset:3px;}

.sm-book-page .bp-contact a:hover{color:var(--gold);}

/* closing call to action on the gold band, white copy */
.sm-book-page .bp-closing{padding:100px 0;text-align:center;color:#fff;}

.sm-book-page .bp-closing-heading{
  font-weight:500;
  font-size:clamp(26px,3vw,40px);
  letter-spacing:3px;
  text-transform:uppercase;
  margin-bottom:28px;
}

.sm-book-page .bp-closing-body{max-width:760px;margin:0 auto 40px;}

.sm-book-page .bp-closing-body p{
  font-weight:300;
  font-size:clamp(18px,1.8vw,24px);
  line-height:1.15;
  letter-spacing:1px;
  margin-bottom:1em;
}

.sm-book-page .bp-closing-body p:last-child{margin-bottom:0;}

.sm-book-page .bp-closing-btn{
  width:320px;
  max-width:100%;
  height:60px;
  border:1px solid #fff;
  color:#fff;
  font-size:16px;
  letter-spacing:2px;
}

.sm-book-page .bp-closing-btn:hover{background:#fff;color:var(--burnt-teak);}

/* ============ SM LEGAL PAGE (Terms of Rental, Privacy Policy) ============
   Used by the "SM Legal Page" widget: title block, a sticky contents list and
   numbered clauses. Everything is scoped to .sm-legal-page. */

/* the page opens on white, so the fixed header needs its dark band from the start */
body:has(.sm-legal-page) .site-header{background:rgba(27,20,12,.94);}

.sm-legal-page{padding:200px 0 120px;}

.sm-legal-page .lg-heading{color:#BA9351;}

.sm-legal-page .lg-head{margin-bottom:72px;padding-bottom:40px;border-bottom:1px solid rgba(183,145,79,.3);}

.sm-legal-page .lg-eyebrow{
  font-family:var(--ui);
  font-weight:700;
  font-size:14px;
  letter-spacing:3px;
  text-transform:uppercase;
  color:var(--burnt-teak);
  margin-bottom:12px;
}

.sm-legal-page .lg-title{
  font-family:var(--sans);
  font-weight:300;
  font-size:clamp(34px,4.4vw,64px);
  line-height:1.19;
  letter-spacing:1px;
  text-transform:uppercase;
}

.sm-legal-page .lg-meta{margin-top:14px;font-weight:300;font-size:17px;letter-spacing:1px;color:var(--stone-grey);}

.sm-legal-page .lg-grid{display:grid;grid-template-columns:280px minmax(0,1fr);gap:80px;align-items:start;}

.sm-legal-page .lg-grid--solo{grid-template-columns:minmax(0,1fr);}

.sm-legal-page .lg-grid--solo .lg-body{max-width:860px;}

/* contents: stays in view beside the clauses on wide screens */
.sm-legal-page .lg-toc{position:sticky;top:130px;max-height:calc(100vh - 160px);overflow:auto;padding-right:8px;}

.sm-legal-page .lg-toc-label{
  font-family:var(--ui);
  font-weight:700;
  font-size:13px;
  letter-spacing:2px;
  text-transform:uppercase;
  color:var(--burnt-teak);
  margin-bottom:14px;
}

.sm-legal-page .lg-toc ol{list-style:none;padding:0;margin:0;border-left:1px solid rgba(183,145,79,.35);}

.sm-legal-page .lg-toc a{
  display:block;
  padding:5px 0 5px 16px;
  font-weight:300;
  font-size:15px;
  line-height:1.4;
  letter-spacing:.3px;
  color:var(--ink);
  transition:color .2s ease;
}

.sm-legal-page .lg-toc a:hover{color:var(--gold);}

.sm-legal-page .lg-body{max-width:820px;}

.sm-legal-page .lg-clause,
.sm-legal-page .lg-contact{padding-bottom:36px;margin-bottom:36px;border-bottom:1px solid rgba(183,145,79,.18);}

.sm-legal-page .lg-clause-title{
  font-weight:400;
  font-size:clamp(20px,2vw,26px);
  line-height:1.3;
  letter-spacing:.5px;
  margin-bottom:16px;
}

.sm-legal-page .lg-text p,
.sm-legal-page .lg-contact p,
.sm-legal-page .lg-text li{
  font-weight:300;
  font-size:clamp(16px,1.4vw,18px);
  line-height:1.65;
  letter-spacing:.3px;
}

.sm-legal-page .lg-text p,
.sm-legal-page .lg-contact p{margin-bottom:.8em;}

.sm-legal-page .lg-text p:last-child,
.sm-legal-page .lg-contact p:last-child{margin-bottom:0;}

.sm-legal-page .lg-text ul,
.sm-legal-page .lg-text ol{margin:0 0 .8em;padding:0;list-style:none;}

.sm-legal-page .lg-text ul:last-child{margin-bottom:0;}

.sm-legal-page .lg-text li{position:relative;padding-left:22px;margin-bottom:2px;}

.sm-legal-page .lg-text li::before{content:"\2022";position:absolute;left:0;color:var(--gold);}

.sm-legal-page .lg-text a,
.sm-legal-page .lg-contact a{color:var(--gold);text-decoration:underline;text-underline-offset:3px;}

.sm-legal-page .lg-foot p{font-weight:300;font-size:15px;line-height:1.6;letter-spacing:.3px;color:var(--stone-grey);}

.sm-legal-page .lg-foot-meta{font-weight:500 !important;color:var(--burnt-teak) !important;margin-bottom:4px;}

/* ============ SM ARRIVE PAGE (Before You Arrive) ============
   Used by the "SM Arrive Page" widget: short copy, quick-action buttons,
   "Your Stay" filled from the email link. Scoped to .sm-arrive-page. */
body:has(.sm-arrive-page) .site-header{background:rgba(27,20,12,.94);}

.sm-arrive-page .ap-heading{color:#BA9351;}

.sm-arrive-page .ap-band{background:#E8B867;}

.sm-arrive-page .ap-copy p,
.sm-arrive-page .ap-text p,
.sm-arrive-page p.ap-text{font-weight:300;font-size:clamp(17px,1.5vw,20px);line-height:1.55;letter-spacing:.5px;margin-bottom:.8em;}

.sm-arrive-page .ap-copy p:last-child,.sm-arrive-page .ap-text p:last-child{margin-bottom:0;}

.sm-arrive-page .ap-copy{max-width:860px;}

.sm-arrive-page .ap-intro-sec{padding:200px 0 80px;}

.sm-arrive-page .ap-title{font-family:var(--sans);font-weight:300;font-size:clamp(34px,4.4vw,64px);line-height:1.19;letter-spacing:1px;text-transform:uppercase;margin-bottom:10px;}

.sm-arrive-page .ap-lead{font-weight:300;font-size:clamp(22px,2.4vw,32px);line-height:1.3;letter-spacing:1px;margin-bottom:34px;}

.sm-arrive-page .ap-sub{font-weight:400;font-size:clamp(22px,2.2vw,30px);line-height:1.25;letter-spacing:.5px;margin-bottom:16px;}

/* quick actions */
.sm-arrive-page .ap-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:56px;}

.sm-arrive-page .ap-action{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;
  min-height:130px;padding:20px 16px;
  border:1px solid rgba(183,145,79,.45);border-radius:var(--radius);background:#fdf8ee;
  font-family:var(--ui);font-weight:700;font-size:14px;letter-spacing:1.5px;text-transform:uppercase;text-align:center;
  color:var(--burnt-teak);transition:background-color .25s ease,color .25s ease,border-color .25s ease;
}

.sm-arrive-page .ap-action svg{color:var(--gold);transition:color .25s ease;}

.sm-arrive-page .ap-action:hover{background:var(--gold);border-color:var(--gold);color:#fff;}

.sm-arrive-page .ap-action:hover svg{color:#fff;}

/* your stay */
.sm-arrive-page .ap-stay{padding:56px 0;color:var(--burnt-teak);}

.sm-arrive-page .ap-stay[hidden]{display:none;}

.sm-arrive-page .ap-stay-heading{color:#fff;}

.sm-arrive-page .ap-stay-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:24px 0;}

.sm-arrive-page .ap-stay-grid div[hidden]{display:none;}

.sm-arrive-page .ap-stay-grid dt{font-family:var(--ui);font-size:14px;letter-spacing:2px;text-transform:uppercase;opacity:.8;margin-bottom:6px;}

.sm-arrive-page .ap-stay-grid dd{margin:0;font-weight:400;font-size:clamp(20px,2vw,26px);letter-spacing:.5px;}

.sm-arrive-page .ap-stay-note{font-weight:300;font-size:18px;letter-spacing:.5px;}

.sm-arrive-page .ap-sec{padding:0 0 96px;}

/* breathing room after the gold Your Stay band */
.sm-arrive-page .ap-stay + .ap-sec{padding-top:80px;}

.sm-arrive-page .ap-stay[hidden] + .ap-sec{padding-top:0;}

.sm-arrive-page .ap-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 80px;align-items:start;}

.sm-arrive-page .ap-intro{font-weight:400;font-size:clamp(17px,1.5vw,20px);line-height:1.5;margin-bottom:14px;}

.sm-arrive-page .ap-note{margin-top:16px;font-weight:300;font-size:16px;line-height:1.6;letter-spacing:.5px;color:var(--stone-grey);}

.sm-arrive-page .ap-address{margin:20px 0 0;font-style:normal;font-family:var(--ui);font-weight:700;font-size:17px;line-height:1.6;color:var(--burnt-teak);border-left:2px solid #E8B867;padding-left:20px;}

.sm-arrive-page .ap-btn{margin-top:28px;width:320px;max-width:100%;height:60px;font-size:15px;letter-spacing:2px;}

.sm-arrive-page .ap-map{border-radius:var(--radius);overflow:hidden;aspect-ratio:4/3;background:#efeae1;}

.sm-arrive-page .ap-map iframe{width:100%;height:100%;border:0;display:block;}

.sm-arrive-page .ap-list li{position:relative;padding-left:22px;font-weight:300;font-size:clamp(17px,1.5vw,20px);line-height:1.6;letter-spacing:.5px;margin-bottom:4px;}

.sm-arrive-page .ap-list li::before{content:"\2022";position:absolute;left:0;color:var(--gold);}

.sm-arrive-page .ap-block{scroll-margin-top:130px;}

/* check-in / check-out cards */
.sm-arrive-page .ap-times{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;}

.sm-arrive-page .ap-time{padding:36px;border:1px solid rgba(183,145,79,.35);border-radius:var(--radius);}

.sm-arrive-page .ap-time-value{font-weight:300;font-size:clamp(28px,3vw,40px);letter-spacing:1px;color:var(--burnt-teak);margin:-4px 0 18px;}

.sm-arrive-page .ap-phones div{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid rgba(183,145,79,.25);}

.sm-arrive-page .ap-phones dt{font-weight:300;font-size:18px;}

.sm-arrive-page .ap-phones dd{margin:0;font-family:var(--ui);font-weight:700;font-size:18px;}

.sm-arrive-page .ap-phones a{color:var(--gold);}

.sm-arrive-page .ap-copy--small p{font-size:clamp(17px,1.5vw,20px);}

.sm-arrive-page .ap-help{max-width:860px;}

.sm-arrive-page .ap-help-mail{margin-top:18px;display:flex;flex-direction:column;gap:4px;}

.sm-arrive-page .ap-help-mail span{font-family:var(--ui);font-size:14px;letter-spacing:1px;color:var(--stone-grey);}

.sm-arrive-page .ap-help-mail a{font-family:var(--ui);font-weight:700;font-size:18px;color:var(--burnt-teak);text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere;}

/* closing CTA — same as the other pages' journey CTA: gold band, door, white copy */
.sm-arrive-page .ap-cta{margin-top:160px;}

.sm-arrive-page .ap-cta .cta-inner::before{display:none;}

.sm-arrive-page .ap-cta h2,
.sm-arrive-page .ap-cta h3,
.sm-arrive-page .ap-cta p{color:#fff;}

/* the farewell copy sits on white above the short CTA */
.sm-arrive-page .ap-farewell .shell{max-width:860px;text-align:center;}

.sm-arrive-page .ap-farewell .ap-text p{font-size:clamp(18px,1.7vw,22px);}

.sm-arrive-page .ap-cta .cta-ornament{left:auto;right:max(var(--pad), calc((100vw - 1440px) / 2 + 100px));bottom:0;width:408px;height:600px;object-fit:contain;object-position:bottom;}

.sm-arrive-page .ap-cta .ap-cta-btn{border-color:#fff;color:#fff;width:320px;max-width:100%;}

.sm-arrive-page .ap-cta .ap-cta-btn:hover{background:#fff;border-color:#fff;color:var(--burnt-teak);}

/* ============ SM REVIEWS (guest reviews: platform scores, hand-picked reviews, review form) ============
   Used by the "SM Reviews" widget. Platform cards double as filters for the review
   cards; the form panel reuses the Book Your Stay form styles (.bp-form).
   Everything is scoped to .sm-reviews. */
.sm-reviews{padding:75px 0;scroll-margin-top:120px;}

.sm-reviews .rv-heading{color:#BA9351;}

.sm-reviews .rv-head{max-width:860px;margin:0 auto 56px;text-align:center;}

.sm-reviews .rv-head h2{margin-bottom:24px;}

.sm-reviews .rv-intro{
  font-weight:300;
  font-size:clamp(18px,1.6vw,22px);
  line-height:1.15;
  letter-spacing:1px;
}

.sm-reviews .rv-sub{
  font-weight:400;
  font-size:clamp(24px,2.4vw,32px);
  line-height:1.25;
  letter-spacing:1px;
  margin-bottom:28px;
  text-align:center;
}

.sm-reviews .rv-platforms{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:24px;
  margin-bottom:56px;
}

.sm-reviews .rv-platform{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  padding:32px 24px;
  border:1px solid rgba(183,145,79,.35);
  border-radius:var(--radius);
  background:#fdf8ee;
  text-align:center;
  transition:border-color .2s ease,box-shadow .2s ease;
}

.sm-reviews .rv-platform.is-filter{cursor:pointer;}

.sm-reviews .rv-platform.is-filter:hover{border-color:var(--gold);}

.sm-reviews .rv-platform.is-active{border-color:var(--gold);box-shadow:0 0 0 3px rgba(183,145,79,.15);}

.sm-reviews .rv-platform-name{
  font-family:var(--ui);
  font-weight:700;
  font-size:13px;
  letter-spacing:2px;
  text-transform:uppercase;
  color:var(--burnt-teak);
}

.sm-reviews .rv-score{
  font-weight:300;
  font-size:clamp(36px,3.6vw,48px);
  line-height:1.1;
  letter-spacing:1px;
  color:var(--gold);
}

.sm-reviews .rv-score span{font-size:.45em;color:var(--stone-grey);letter-spacing:.5px;}

.sm-reviews .rv-count{font-weight:300;font-size:15px;letter-spacing:.5px;color:var(--stone-grey);}

.sm-reviews .rv-platform-link{
  margin-top:8px;
  font-size:15px;
  letter-spacing:.5px;
  color:var(--gold);
  text-decoration:underline;
  text-underline-offset:3px;
}

.sm-reviews .rv-platform-link:hover{color:var(--burnt-teak);}

/* filter tabs */
.sm-reviews .rv-tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-bottom:36px;}

.sm-reviews .rv-tab{
  height:40px;
  padding:0 18px;
  border:1px solid rgba(183,145,79,.45);
  border-radius:20px;
  font-family:var(--ui);
  font-weight:700;
  font-size:13px;
  letter-spacing:1px;
  text-transform:uppercase;
  color:var(--burnt-teak);
  transition:background-color .2s ease,color .2s ease,border-color .2s ease;
}

.sm-reviews .rv-tab:hover{border-color:var(--gold);}

.sm-reviews .rv-tab.is-active{background:var(--gold);border-color:var(--gold);color:#fff;}

/* review cards */
/* review cards: a sideways slider at every width (3 cards in view on desktop, 2 on tablet,
   1 on phones); main.js adds the arrows under it and levels the card heights */
.sm-reviews .rv-grid{
  display:flex;
  align-items:flex-start;
  gap:24px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  scrollbar-width:none;
}

.sm-reviews .rv-grid::-webkit-scrollbar{display:none;}

.sm-reviews .rv-grid > .rv-card{flex:0 0 calc((100% - 48px) / 3);scroll-snap-align:start;}

.sm-reviews .rv-nav{display:flex;justify-content:start;gap:12px;margin-top:24px;}

.sm-reviews .rv-nav[hidden]{display:none;}

.sm-reviews .rv-nav .round-arrow:disabled{opacity:.3;cursor:default;}

.sm-reviews .rv-card{
  display:flex;
  flex-direction:column;
  padding:32px;
  border:1px solid rgba(183,145,79,.3);
  border-radius:var(--radius);
  background:#fff;
}

.sm-reviews .rv-card[hidden]{display:none;}

.sm-reviews .rv-stars{margin-bottom:16px;font-size:18px;letter-spacing:3px;color:rgba(183,145,79,.3);}

.sm-reviews .rv-stars .on{color:var(--gold);}

.sm-reviews .rv-text p{
  font-weight:300;
  font-size:17px;
  line-height:1.6;
  letter-spacing:.3px;
}

/* long reviews are clamped until "Read more" is pressed (main.js shows the button only when needed) */
.sm-reviews .rv-text{max-height:calc(17px * 1.6 * 7);overflow:hidden;margin-bottom:24px;}

.sm-reviews .rv-card.is-open .rv-text{max-height:none;}

.sm-reviews .rv-more{
  align-self:flex-start;
  margin:-14px 0 24px;
  font-size:15px;
  letter-spacing:.5px;
  color:var(--gold);
  text-decoration:underline;
  text-underline-offset:3px;
}

.sm-reviews .rv-more[hidden]{display:none;}

.sm-reviews .rv-guest{margin-top:auto;padding-top:18px;border-top:1px solid rgba(183,145,79,.25);}

.sm-reviews .rv-name{font-family:var(--ui);font-weight:700;font-size:16px;color:var(--burnt-teak);}

.sm-reviews .rv-meta{margin-top:2px;font-size:14px;letter-spacing:.5px;color:var(--stone-grey);}

/* live Google widget (Trustindex) */
.sm-reviews .rv-live{margin-top:80px;}

/* buttons + form panel */
.sm-reviews .rv-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;margin-top:56px;}

.sm-reviews .rv-btn{min-width:280px;height:56px;font-size:15px;letter-spacing:2px;}

.sm-reviews .rv-btn-outline{border-color:var(--gold);color:var(--gold);}

.sm-reviews .rv-btn-outline:hover,
.sm-reviews .rv-btn-outline[aria-expanded="true"]{background:var(--gold);color:#fff;}

.sm-reviews .rv-write{margin:40px auto 0;scroll-margin-top:120px;}

.sm-reviews .rv-write[hidden]{display:none;}

.sm-reviews .rv-form-intro{
  margin-bottom:28px;
  font-weight:300;
  font-size:clamp(17px,1.5vw,20px);
  line-height:1.5;
  letter-spacing:.5px;
}

.sm-reviews .bp-form-missing{margin-top:24px;}

/* --- SM Reviews: overall score above the platform cards --- */
.sm-reviews .rv-overall{display:flex;align-items:center;justify-content:center;gap:18px;margin:-16px 0 40px;}

.sm-reviews .rv-overall-score{font-weight:300;font-size:clamp(48px,5vw,64px);line-height:1;letter-spacing:1px;color:var(--gold);}

.sm-reviews .rv-overall-score span{font-size:.4em;color:var(--stone-grey);}

.sm-reviews .rv-overall-label{font-family:var(--ui);font-weight:700;font-size:20px;color:var(--burnt-teak);}

.sm-reviews .rv-overall-count{font-size:15px;letter-spacing:.5px;color:var(--stone-grey);}

.sm-reviews .rv-title{margin-bottom:10px;font-family:var(--ui);font-weight:700;font-size:17px;line-height:1.4;color:var(--burnt-teak);}

/* --- SM Reviews: floating rating panel (bottom-left card; a bottom sheet on phones) ---
   main.js moves it to <body>, so it is not scoped to .sm-reviews. */
.rv-panel{
  position:fixed;
  left:24px;
  bottom:24px;
  z-index:900;
  display:flex;
  flex-direction:column;
  width:380px;
  max-width:calc(100vw - 48px);
  max-height:min(640px, calc(100vh - 48px));
  border-top:3px solid var(--gold);
  border-radius:8px;
  background:#fff;
  box-shadow:0 18px 50px rgba(30,29,29,.25);
  font-family:var(--sans);
  color:var(--ink);
  opacity:0;
  transform:translateY(24px);
  transition:opacity .35s ease,transform .35s ease;
}

.rv-panel.is-in{opacity:1;transform:none;}

.rv-panel[hidden],.rv-panel-view[hidden],.rv-badge[hidden]{display:none;}

.rv-panel-view{position:relative;display:flex;flex-direction:column;min-height:0;}

.rv-panel-view[data-view="summary"]{padding:28px 28px 20px;}

.rv-panel-view[data-view="reviews"]{flex:1;}

.rv-panel-close,.rv-panel-back{
  display:inline-flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:50%;
  font-size:28px;line-height:1;color:var(--stone-grey);
  transition:background-color .2s ease,color .2s ease;
}

.rv-panel-close:hover,.rv-panel-back:hover{background:rgba(183,145,79,.12);color:var(--burnt-teak);}

.rv-panel-view[data-view="summary"] > .rv-panel-close{position:absolute;top:12px;right:12px;}

.rv-panel-overall{text-align:center;padding-bottom:18px;border-bottom:1px solid rgba(183,145,79,.25);}

.rv-panel-score{font-weight:300;font-size:48px;line-height:1.05;letter-spacing:1px;color:var(--gold);}

.rv-panel-score span{font-size:.45em;color:var(--stone-grey);}

.rv-panel-label{font-family:var(--ui);font-weight:700;font-size:19px;color:var(--burnt-teak);}

.rv-panel-count{font-size:14px;letter-spacing:.3px;color:var(--stone-grey);}

.rv-panel-list{margin:6px 0 4px;}

.rv-panel-row{
  display:flex;justify-content:space-between;align-items:baseline;gap:16px;
  width:100%;padding:11px 4px;
  font-size:17px;font-weight:300;text-align:left;color:var(--ink);
}

button.rv-panel-row,a.rv-panel-row{cursor:pointer;transition:color .2s ease;}

button.rv-panel-row:hover,a.rv-panel-row:hover{color:var(--gold);}

button.rv-panel-row .rv-panel-name::after{content:" \203A";color:var(--gold);}

.rv-panel-val{color:var(--stone-grey);white-space:nowrap;}

.rv-panel-val b{font-weight:500;color:var(--burnt-teak);}

.rv-panel-read{
  display:flex;align-items:center;justify-content:center;gap:8px;
  width:100%;height:48px;margin-top:10px;
  border:1px solid var(--gold);border-radius:var(--radius);
  font-family:var(--ui);font-weight:700;font-size:14px;letter-spacing:2px;text-transform:uppercase;
  color:var(--gold);
  transition:background-color .2s ease,color .2s ease;
}

.rv-panel-read span{font-size:20px;line-height:1;}

.rv-panel-read:hover{background:var(--gold);color:#fff;}

/* reviews view: fixed top bar, scrolling list */
.rv-panel-top{
  display:flex;align-items:center;gap:12px;
  padding:14px 14px 14px 10px;
  border-bottom:1px solid rgba(183,145,79,.25);
}

.rv-panel-top .rv-panel-score{font-size:36px;}

.rv-panel-top-text{flex:1;min-width:0;}

.rv-panel-top .rv-panel-label{font-size:16px;}

.rv-panel-top .rv-panel-count{font-size:13px;}

.rv-panel-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:20px 28px 24px;}

.rv-panel-heading{margin-bottom:16px;font-family:var(--ui);font-weight:700;font-size:20px;letter-spacing:0;color:var(--burnt-teak);}

.rv-panel-filter{
  display:block;width:100%;height:46px;margin-bottom:8px;padding:0 14px;
  border:1px solid rgba(183,145,79,.45);border-radius:var(--radius);
  background:#fdf8ee;font-family:var(--sans);font-weight:300;font-size:16px;color:var(--ink);
}

.rv-panel-filter:focus{outline:none;border-color:var(--gold);}

.rv-panel-item{padding:18px 0;border-bottom:1px solid rgba(183,145,79,.25);}

.rv-panel-item:last-child{border-bottom:0;}

.rv-panel-item[hidden]{display:none;}

.rv-panel-item-title{margin-bottom:6px;font-family:var(--ui);font-weight:700;font-size:16px;line-height:1.4;color:var(--burnt-teak);}

.rv-panel-item-text{font-weight:300;font-size:16px;line-height:1.6;}

.rv-panel-item-src{margin-top:10px;font-size:14px;color:var(--stone-grey);}

.rv-panel-item-src b{font-weight:500;color:var(--burnt-teak);}

/* minimised badge, shown after the panel is closed */
.rv-badge{
  position:fixed;left:24px;bottom:24px;z-index:900;
  display:inline-flex;align-items:center;gap:6px;
  height:44px;padding:0 18px;border-radius:22px;
  background:#fff;box-shadow:0 8px 24px rgba(30,29,29,.2);
  font-family:var(--sans);font-size:15px;color:var(--stone-grey);
  transition:transform .2s ease;
}

.rv-badge:hover{transform:translateY(-2px);}

.rv-badge b{font-weight:500;font-size:17px;color:var(--burnt-teak);}

.rv-badge-star{color:var(--gold);font-size:17px;}

@media (prefers-reduced-motion:reduce){
  .rv-panel{transition:none;}
}

/* "Phones only" setting: desktop keeps just the section */
@media (min-width:761px){
  .rv-panel.rv-mobile-only,.rv-badge.rv-mobile-only{display:none !important;}
}

/* the floating "★ 4.9/5" badge is not shown on phones either (kept in the markup
   because main.js needs it to run the ratings panel) */
.rv-badge.rv-mobile-only{display:none !important;}

/* --- SM Reviews: where a review comes from (top right of each card) --- */
.sm-reviews .rv-card-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px;}

.sm-reviews .rv-card-top .rv-stars{margin-bottom:0;}

.sm-reviews .rv-source{
  display:inline-flex;align-items:center;gap:8px;margin-left:auto;
  font-family:var(--ui);font-weight:700;font-size:13px;letter-spacing:.3px;color:var(--burnt-teak);
  white-space:nowrap;
}

.sm-reviews .rv-source-mark{
  display:inline-flex;align-items:center;justify-content:center;
  width:24px;height:24px;border-radius:5px;
  font-family:var(--ui);font-weight:800;font-size:13px;line-height:1;color:#fff;
  background:var(--gold);
}

.sm-reviews .rv-source--booking .rv-source-mark{background:#003580;}

.sm-reviews .rv-source--airbnb .rv-source-mark{background:#FF385C;border-radius:50%;font-size:15px;padding-bottom:2px;}

.sm-reviews .rv-source--google .rv-source-mark{background:#fff;color:#4285F4;border:1px solid #dadce0;}

.sm-reviews .rv-source--direct .rv-source-mark{background:var(--gold);font-family:var(--serif);font-weight:400;font-size:16px;}

/* --- SM Reviews review form: star rating + "what impressed you" choices ---
   Both are Contact Form 7 fields (radio / checkbox with use_label_element),
   restyled here; the inputs stay in the page for keyboard and screen readers. */
.sm-reviews .bp-form .rv-field{margin:0 0 22px;}

.sm-reviews .bp-form .rv-field-label{
  margin:0 0 10px;
  font-family:var(--ui);font-weight:700;font-size:13px;letter-spacing:2px;text-transform:uppercase;color:var(--burnt-teak);
}

.sm-reviews .bp-form .rv-field-label span{font-weight:400;letter-spacing:1px;text-transform:none;color:var(--stone-grey);}

.sm-reviews .bp-form .rv-field .wpcf7-form-control-wrap{margin-top:0;}

.sm-reviews .bp-form .rv-field p{margin:0;}

/* stars: options are 5 → 1 in the form, shown 1 → 5 left to right (row-reverse),
   so "this star and every star after it in the source" = this star and the ones to its left */
.sm-reviews .rv-star-input .wpcf7-radio{display:inline-flex;flex-direction:row-reverse;justify-content:flex-end;gap:4px;}

.sm-reviews .rv-star-input .wpcf7-list-item{margin:0;}

.sm-reviews .rv-star-input label{position:relative;display:block;cursor:pointer;letter-spacing:0;}

.sm-reviews .rv-star-input input{position:absolute;opacity:0;width:1px;height:1px;}

.sm-reviews .rv-star-input .wpcf7-list-item-label{
  display:block;width:44px;height:44px;overflow:hidden;
  font-size:0;color:transparent; /* the "5 stars" text stays for screen readers */
}

.sm-reviews .rv-star-input .wpcf7-list-item-label::before{
  content:"\2605";display:block;
  font-size:40px;line-height:44px;text-align:center;
  color:rgba(183,145,79,.28);
  transition:color .15s ease,transform .15s ease;
}

.sm-reviews .rv-star-input .wpcf7-list-item:has(input:checked) .wpcf7-list-item-label::before,
.sm-reviews .rv-star-input .wpcf7-list-item:has(input:checked) ~ .wpcf7-list-item .wpcf7-list-item-label::before{color:var(--gold);}

/* hover preview wins over the current choice */
/* (.wpcf7-radio doubled: these must beat the :has(input:checked) rules above) */
.sm-reviews .rv-star-input .wpcf7-radio.wpcf7-radio:hover .wpcf7-list-item .wpcf7-list-item-label::before{color:rgba(183,145,79,.28);}

.sm-reviews .rv-star-input .wpcf7-radio.wpcf7-radio .wpcf7-list-item:hover .wpcf7-list-item-label::before,
.sm-reviews .rv-star-input .wpcf7-radio.wpcf7-radio .wpcf7-list-item:hover ~ .wpcf7-list-item .wpcf7-list-item-label::before{color:var(--gold);}

.sm-reviews .rv-star-input .wpcf7-list-item:hover .wpcf7-list-item-label::before{transform:scale(1.12);}

.sm-reviews .rv-star-input input:focus-visible + .wpcf7-list-item-label{outline:2px solid var(--gold);outline-offset:2px;border-radius:4px;}

/* choices as tappable pills */
.sm-reviews .rv-chips .wpcf7-checkbox{display:flex;flex-wrap:wrap;gap:10px;}

.sm-reviews .rv-chips .wpcf7-list-item{margin:0;}

.sm-reviews .rv-chips label{position:relative;display:block;cursor:pointer;letter-spacing:0;text-transform:none;}

.sm-reviews .rv-chips input{position:absolute;opacity:0;width:1px;height:1px;}

.sm-reviews .rv-chips .wpcf7-list-item-label{
  display:inline-flex;align-items:center;height:42px;padding:0 18px;
  border:1px solid rgba(183,145,79,.45);border-radius:21px;background:#fff;
  font-family:var(--sans);font-weight:300;font-size:15px;letter-spacing:.3px;color:var(--ink);
  transition:background-color .2s ease,border-color .2s ease,color .2s ease;
}

.sm-reviews .rv-chips label:hover .wpcf7-list-item-label{border-color:var(--gold);}

.sm-reviews .rv-chips input:checked + .wpcf7-list-item-label{background:var(--gold);border-color:var(--gold);color:#fff;font-weight:400;}

.sm-reviews .rv-chips input:checked + .wpcf7-list-item-label::before{content:"\2713";margin-right:8px;}

.sm-reviews .rv-chips input:focus-visible + .wpcf7-list-item-label{outline:2px solid var(--gold);outline-offset:2px;}

/* --- SM Reviews: form always open under the reviews (Reviews page) --- */
.sm-reviews .rv-write.is-open{margin-top:64px;}

.sm-reviews .rv-form-heading{
  margin-bottom:12px;
  font-weight:400;
  font-size:clamp(24px,2.4vw,32px);
  line-height:1.25;
  letter-spacing:1px;
}

/* ============ SM PAGE HERO: "Heading above the image" layout ============
   Same look as the top of The Suites page: gold heading centred on white,
   the photo full width underneath. */
/* the page opens on white, so the fixed header needs its dark band from the start */
body:has(.page-hero--stacked) .site-header{background:rgba(27,20,12,.94);}

.page-hero--stacked{padding-top:200px;}

.page-hero--stacked .page-hero-head{text-align:center;margin-bottom:39px;}

.page-hero--stacked h1{
  font-family:var(--sans);
  font-weight:200;
  font-size:63px;
  line-height:1.19;
  letter-spacing:1px;
  text-transform:uppercase;
  color:#BA9351;
}

.page-hero--stacked .page-hero-sub{
  max-width:860px;
  margin:18px auto 0;
  font-weight:300;
  font-size:clamp(18px,1.8vw,24px);
  line-height:1.15;
  letter-spacing:1px;
  color:var(--ink);
}

.page-hero--stacked .page-hero-shot{height:753px;overflow:hidden;}

.page-hero--stacked .page-hero-shot img{width:100%;height:100%;object-fit:cover;}

/* =====================================================================
   LOADING SCREEN — Carved Balinese double door (Swarna Mandapa)
   Markup + SVG defs: inc/door-loader.php · open/remove logic: main.js
   ===================================================================== */
body.is-loading{overflow:hidden}

.sm-loader{
  position:fixed;inset:0;z-index:10000;
  /* failsafe: if main.js never runs, get out of the way after 10s */
  animation:smLoaderFailsafe 0s linear 10s forwards;
  perspective:1800px;
  display:flex;align-items:center;justify-content:center;
  --sm-wood:#4a3020;
  --sm-wood-deep:#22150b;
  --sm-medal:clamp(96px,17vmin,190px);
  --sm-crest:clamp(150px,28vmin,320px);
}

/* ── Door leaves ── */
.sm-door{
  position:absolute;top:0;bottom:0;width:50%;
  overflow:hidden;
  display:flex;align-items:center;justify-content:center;
  background:
    repeating-linear-gradient(90deg,rgba(0,0,0,.07) 0 2px,transparent 2px 9px),
    linear-gradient(90deg,var(--sm-wood-deep),var(--sm-wood) 18%,#5a3d27 50%,var(--sm-wood) 82%,var(--sm-wood-deep));
  will-change:transform;
  transition:transform 4s cubic-bezier(.23,1,.32,1);
  backface-visibility:hidden;
}

.sm-door-left {left:0; transform-origin:left center; border-right:2px solid #c9973f}

.sm-door-right{right:0;transform-origin:right center;border-left:2px solid #c9973f}

/* Mas-masan (tumpal triangles) carved into the leftover wood */
.sm-door::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath d='M0 16L8 3L16 16L24 3L32 16M0 32L8 19L16 32L24 19L32 32' fill='none' stroke='%23d4a24c' stroke-opacity='.3' stroke-width='1.1'/%3E%3Cg fill='%23d4a24c' fill-opacity='.38'%3E%3Cpath d='M8 8L11.5 14H4.5ZM24 8L27.5 14H20.5ZM8 24L11.5 30H4.5ZM24 24L27.5 30H20.5Z'/%3E%3Ccircle cx='16' cy='8' r='1.3'/%3E%3Ccircle cx='0' cy='8' r='1.3'/%3E%3Ccircle cx='32' cy='8' r='1.3'/%3E%3Ccircle cx='16' cy='24' r='1.3'/%3E%3Ccircle cx='0' cy='24' r='1.3'/%3E%3Ccircle cx='32' cy='24' r='1.3'/%3E%3C/g%3E%3C/svg%3E");
  background-position:center;
}

/* Shading that deepens as each leaf swings away from the light */
.sm-door::after{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:0;z-index:4;
  transition:opacity 2.4s ease;
}

.sm-door-left::after {background:linear-gradient(90deg,rgba(0,0,0,.15),rgba(0,0,0,.7))}

.sm-door-right::after{background:linear-gradient(270deg,rgba(0,0,0,.15),rgba(0,0,0,.7))}

/* Main carved panel — keeps its proportions, centred in the leaf */
.sm-door-panel{
  position:relative;z-index:1;
  height:calc(100% - 5vh);
  aspect-ratio:400/900;
  max-width:calc(100% - 5vw);
  filter:drop-shadow(0 3px 2px rgba(0,0,0,.6)) drop-shadow(0 -1px 0 rgba(255,232,170,.18));
}

.sm-door-panel svg{display:block;width:100%;height:100%}

/* Mirror the right leaf so the carvings sit symmetric across the seam */
.sm-door-right .sm-door-panel svg{transform:scaleX(-1)}

/* Half of the patra crest and of the lotus medallion on each leaf —
   the halves meet at the seam and split apart as the doors swing */
.sm-door-crest,
.sm-door-medal{
  position:absolute;z-index:2;
  filter:drop-shadow(0 3px 3px rgba(0,0,0,.65));
}

.sm-door-crest{
  top:1.5vh;
  width:var(--sm-crest);height:calc(var(--sm-crest) * 2 / 3);
}

.sm-door-left  .sm-door-crest{right:calc(var(--sm-crest) / -2)}

.sm-door-right .sm-door-crest{left:calc(var(--sm-crest) / -2)}

.sm-door-medal{
  top:50%;
  width:var(--sm-medal);height:var(--sm-medal);
  margin-top:calc(var(--sm-medal) / -2);
}

.sm-door-left  .sm-door-medal{right:calc(var(--sm-medal) / -2)}

.sm-door-right .sm-door-medal{left:calc(var(--sm-medal) / -2)}

.sm-door-crest svg,
.sm-door-medal svg{display:block;width:100%;height:100%}

/* ── Centre branding (fades before the doors swing) ── */
.sm-loader-brand{
  position:absolute;z-index:3;left:0;right:0;margin:0 auto;width:max-content;
  top:calc(50% + var(--sm-medal) / 2 + 18px);
  display:flex;flex-direction:column;align-items:center;gap:10px;
  padding:18px 32px 22px;max-width:100vw;
  background:radial-gradient(ellipse at center,rgba(24,15,8,.88) 0,rgba(24,15,8,.6) 55%,rgba(24,15,8,0) 75%);
  pointer-events:none;
  transition:opacity .8s ease .2s;
}

.sm-loader-name{
  font-family:'Cormorant Garamond',serif;font-weight:300;
  font-size:clamp(1.1rem,4.6vw,2.7rem);
  letter-spacing:clamp(.14em,1vw,.28em);margin-right:calc(-1 * clamp(.14em,1vw,.28em));
  text-transform:uppercase;white-space:nowrap;
  color:#F5EFD6;
}

.sm-loader-line{display:block;width:48px;height:1px;background:#e8b867}

.sm-loader-tag{
  font-family:'Poppins',sans-serif;font-weight:300;font-size:.75rem;
  letter-spacing:.3em;margin-right:-.3em;text-transform:uppercase;
  color:#e8b867;
}

/* ── Open state ── */
.sm-loader.is-open .sm-door-left {transform:rotateY(-92deg)}

.sm-loader.is-open .sm-door-right{transform:rotateY(92deg)}

.sm-loader.is-open .sm-door::after{opacity:1}

.sm-loader.is-open .sm-loader-brand{opacity:0}

/* Reduced motion: no swing, just a quick fade */
@media (prefers-reduced-motion: reduce){
  .sm-door{transition:none}
  .sm-loader{transition:opacity .5s ease}
  .sm-loader.is-open{opacity:0}
  .sm-loader.is-open .sm-door-left,
  .sm-loader.is-open .sm-door-right{transform:none}
}

@keyframes smLoaderFailsafe{to{visibility:hidden;pointer-events:none}}

/* ===== Smooth scroll (Lenis, from scroll-fx.js) =====
   Lenis does the easing itself, so the browser's own smooth scrolling is turned off while it runs */
html.lenis,html.lenis body{height:auto;}

html.lenis{scroll-behavior:auto;}

.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain;}

.lenis.lenis-stopped{overflow:clip;}

.lenis.lenis-scrolling iframe{pointer-events:none;}

/* ===== Text fill on scroll (scroll-fx.js) =====
   scroll-fx.js wraps the text in this span and sets both colours from the text's own colour;
   only the paint changes, never the font, size or spacing */
.sm-fill-text{
  -webkit-background-clip:text;
  background-clip:text;
  background-color:var(--fill-muted);
  background-image:linear-gradient(135deg,var(--fill-fg) 50%,var(--fill-muted) 60%);
  background-position:0 0;
  background-repeat:no-repeat;
  background-size:0% 200%;
  color:transparent;
  display:inline;
  will-change:background-size;
}

.sm-fill-text *{color:transparent;}

/* ===== Home Page copy master layout (SM Home Page widget) ===== */
.sm-home .home-title .home-tagline{
  margin:18px auto 0;
  font-family:var(--sans);
  font-weight:300;
  font-size:clamp(16px,1.6vw,22px);
  letter-spacing:1px;
  color:#BA9351;
}

.sm-home .home-copy--note{font-style:italic;}

/* ===== The Suites: suites stacked down the page, photo and copy alternating sides =====
   Reuses The Residence .feature blocks; these rules size the suite copy to that narrower column */
.sm-suites-page .sp-suite-feature .sp-suite-desc p{
  font-weight:200;
  font-size:20px;
  line-height:1.15;
  letter-spacing:1px;
  /* max-width:auto; */
  margin-bottom:1.4em;
}

.sm-suites-page .sp-suite-feature .features-label{
  font-family:var(--sans);
  font-weight:200;
  font-size:20px;
  letter-spacing:.5px;
  text-transform:none;
  margin-bottom:8px;
}

.sm-suites-page .sp-suite-feature .features{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 26px;max-width:486px;margin-bottom:30px;}

.sm-suites-page .sp-suite-feature .features li{font-weight:200;font-size:20px;line-height:1.15;letter-spacing:1px;padding-left:16px;}

/* ===== SM Experience + SM Story Block: homepage layout =====
   heading centred, full-width photo, text (and button) below — sizes match .sm-home */
.sm-stack--experience{padding:75px 0 0;}

.sm-stack .sm-stack-heading{
  font-family:var(--sans);
  font-weight:200;
  font-size:46px;
  line-height:1.15;
  letter-spacing:1px;
  text-transform:none;
  text-align:center;
  color:#BA9351;
  /* max-width:auto; */
  margin:0 auto 50px;
}

.sm-stack .sm-stack-shot{height:clamp(260px,40vw,673px);overflow:hidden;}

.sm-stack .sm-stack-shot img{width:100%;height:100%;object-fit:cover;}

.sm-stack .sm-stack-copy{
  /* max-width:996px; */
  margin:0 auto;}

.sm-stack .sm-stack-copy--tight{padding-top:0;}

.sm-stack .sm-stack-subheading{
  font-family:var(--sans);
  font-size:36px;
  line-height:1.15;
  color:var(--gold);
  text-align:left;
  margin:0 0 24px;
}

.sm-stack .sm-stack-copy .btn{margin-top:24px;}

/* ==========================================================================
   DESKTOP RESPONSIVE BREAKPOINTS (1200px - 1400px & 1400px+)
   ========================================================================== */

/* Standard Desktop / Laptop (1200px - 1399px) */
@media (min-width: 1200px) and (max-width: 1399px) {
  .photo-viewport {
    height: 650px;
    overflow: hidden;
  }
  .suite-block-shot {
    height: 650px;
  }
  .suite-block-shot .photo-viewport {
    height: 100%;
  }
  .suite-block-grid {
    grid-template-columns: 665fr 486fr;
    gap: 48px;
  }
  .photo-slide img {
    object-position: right bottom !important;
  }
}

/* Large Desktop / High Resolution (1400px ke atas) */
@media (min-width: 1400px) {
  .photo-viewport {
    height: 650px;
    overflow: hidden;
  }
  .suite-block-shot {
    height: 650px;
  }
  .suite-block-shot .photo-viewport {
    height: 100%;
  }
  .suite-block-grid {
    grid-template-columns: 665fr 486fr;
    gap: 62px;
  }
  .photo-slide img {
    object-position: right bottom !important;
  }
}

/* ==========================================================================
   2. TABLET & LAPTOP (max-width: 1100px)
   ========================================================================== */

/* small laptops/tablets (761-1100px): shrink even more so the desktop header fits */
@media ((min-width:761px) and (max-width:1100px)) {
  .header-inner{gap:10px;}
    .brand img{height:80px;}
    .site-header.stuck .brand img{height:70px;}
    .main-nav{gap:15px;}
    .main-nav a{font-size:9px;letter-spacing:0;}
    .header-actions{gap:10px;}
    .header-actions .btn-gold{padding:0 10px; font-size:10px; height:38px;}
}

@media (max-width: 1100px) {
  .btn-outline-accent{
      font-size: 13px;
      letter-spacing: 3px;
      width: 210px;
    }
    .btn-outline-gold, .btn-outline-white{
      font-size: 13px;
      width: max-content;
    }

  .cta {
      min-height: 350px;
    }
    .cta p{
    font-weight:300;
    font-size:16px;
    line-height:1.15;
    letter-spacing:1px;
    color:var(--burnt-teak);
    max-width:400px;
    margin-bottom:46px;
  }

  .story .band-slide,.gallery-intro .band-slide{height:560px;}
    .story .band-slider .round-nav--split,.gallery-intro .band-slider .round-nav--split{top:280px;}

  .exp-slider .round-nav--split{top:150px;} /* photo 300px */

  .ritual-copy h2{font-size:36px;}
    .ritual-copy p{font-size:16px;}

  /* tablet down: stacked layouts. The tracks keep bleeding — the peek is the point. */

  .welcome{padding:75px 0 70px;}
    .welcome-grid,.story-intro-grid{grid-template-columns:minmax(0,1fr);gap:44px;}
    .welcome-slide{flex:0 0 min(450px,76vw);max-width:none;}
    .welcome-slide .shot{height:420px;}
    .round-nav{justify-content:flex-start;}

    .residence{padding:75px 0 75px 40px;}
    .residence-slide{flex:0 0 min(583px,76vw);max-width:none;}
    .residence-slide figcaption{font-size:16px;}

    .suites{padding:75px 0 75px;}
    .suite-track{gap:24px;}
    /* same width as the welcome/residence slides once stacked */
    .suite-card{
      grid-template-columns:minmax(0,1fr);
      flex:0 0 min(860px,76vw);
      max-width:none;
      min-height:0;
    }
    /* photo first, then the title and button */
    .suite-shot{grid-row:1;height:300px;}
    .suite-panel{grid-row:2;padding:32px 32px 36px;}
    /* .suite-shot .photo-slide img{min-height:0;} */
    .suite-ornament{display:none;}
    .suite-nav{position:static;margin-top:28px;}

    /* buttons size to their label instead of stretching the column */
    /* .btn-story,.btn-eternal,.btn-residence,.btn-experience,.btn-check,.btn-contact{
      width:auto;
      max-width:100%;
      padding:0 26px;
    } */

    .footer-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);row-gap:48px;}

    .page-hero{min-height:680px;}
    /* .story{padding:80px 0 80px;} */
    .story-compare{padding:75px 0;}
    .compare-grid{grid-template-columns:repeat(2, minmax(0, 1fr));gap:40px;}
    .compare-grid .shot{height:300px;}
    .suite-block{padding:0 0 64px;}
    .suite-block-grid,.suite-block--flip .suite-block-grid{grid-template-columns:minmax(0,1fr);gap:32px;}
    .suite-block--flip .suite-block-shot,.suite-block--flip .suite-block-copy{order:0;}
    .suite-block-shot{height:360px;}
    .included{padding:72px 0;}
    .included-cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;}
    .allocation{padding:72px 0;}
    .exp{padding:80px 0 0;}
    .exp-card{flex:0 0 min(583px,76vw);max-width:none;}
    .exp-card .shot{height:300px;}
    /* .ritual{padding:72px 0;} */
    .ritual-grid{grid-template-columns: 400px minmax(0, 1fr);;gap:40px;}
    .personal{padding:75px 0 75px;}
    .personal-body{margin-bottom:34px;}
    .feature{padding:0 0 90px;}
    .feature-grid{grid-template-columns: 520px minmax(0, 1fr);gap:28px;}
    .feature--flip .feature-grid{grid-template-columns: minmax(0, 1fr) 520px;gap:28px;}
    /* .photo-track{height:auto;} */
    .feature--flip .feature-shot{order:2;}
    .feature--flip .feature-copy{order:1;}
    .features li {font-size:16px;}
    .sm-suites-page .sp-suite-feature .features li {font-size:16px !important;}
    .feature-shot{height:380px;}
    .feature-ornament{display:none;}
    .didyouknow p{font-size:16px;}
    /* .lifestyle-slide .shot{height:420px;} */
    .video-band{min-height:440px;}
    .video-band + .cta{margin-top:80px;}
    .personal + .cta{margin-top:75px;}
    .video-band .play-btn{width:110px;height:110px;}
    .video-band .play-btn img{width:68px;height:86px;}
    .lifestyle-nav{max-width:90%;bottom:20px;}
    .didyouknow{margin-top:75px;padding:75px 0 72px;}
    .story-block.philosophy-band{padding:72px 0 133px;margin-bottom:76px;}
    .philosophy{padding:70px 0 80px;}
    .philosophy-grid{grid-template-columns: 400px minmax(0, 1fr);;gap:40px;align-items:center;}
    .philosophy .welcome-slide{flex:0 0 min(519px,76vw);max-width:none;}
    .philosophy .welcome-slide .shot{height:450px;}
    .story-block{padding:50px 0 0;}
    .intro-next{padding:80px 0 90px;}
    .medallion-solo{padding:60px 0;}
    .replicate{padding:80px 0 90px;}
    .cta--journey .cta-ornament{left: auto;
        right: -70px;
        top: auto;
        bottom: -20px;
        width: 330px;
        height: 460px;
    }
    .btn-journey{width:100%;max-width:500px;}
    .compare-line{margin:56px auto 48px;}
    .story-wide{height:340px;}
    .cta-ornament{left:auto;right:-20px;width:400px;height:auto;bottom:0;opacity:.9;}
    .suites-body{font-size:16px;}
    .feature-copy p{font-size:16px;}

  .sm-home .home-exp .round-nav--split,
  .sm-home .band-slider .round-nav--split{top:280px;}   /* band 560px */
    .sm-home .home-copy{font-size:16px;}

  .sm-home .hero-video--short{height:100vh;}
    .sm-home .full-shot{height:480px;}
    .sm-home .full-shot--mid{height:420px;}
    .sm-home .full-shot--tall{height:560px;}
    .sm-home .band-slide{height:560px;}
    .sm-home .home-block{padding-top:75px;}
    .sm-home .home-heading{margin-bottom:50px;}
    .sm-home .home-block-copy{padding-top:50px;}
    .sm-home .residence--v2{padding:75px 0 80px;}
    /* .sm-home .suites--v2{padding-top:75px;} */
    .sm-home .suite-card{
      grid-template-columns:300px minmax(0,1fr);
      flex:0 0 min(900px,86vw);
      max-width:none;
      height:460px;
    }
    /* reset global grid-row rules that stack photo above text at this breakpoint */
    .sm-home .suite-shot{grid-row:auto;height:460px;}
    .sm-home .suite-panel{grid-row:auto;padding:36px;}
    .photo-viewport{height:100%;overflow:hidden;}
    .sm-home .suite-shot .photo-viewport{height:100%;}
    /* .sm-home .suite-shot .photo-slide img{min-height:0;} */
    .sm-home .home-exp{padding-top:75px;}
    .sm-home .cta--home{margin-top:75px;}

  .ritual .round-nav--split{top:210px;} /* shot 420px */

  .story-compare .round-nav--split {top:210px;} /* shot 420px */

  .sm-suites-page .sp-intro .sp-gallery-slide{flex:0 0 min(450px,76vw);max-width:none;height:420px;}
    .sm-suites-page .sp-intro-copy p{font-size:16px;}
    .sm-suites-page .sp-suite-feature .sp-suite-desc p{font-size:16px;}

  .sm-suites-page .sp-intro .sp-intro-media .round-nav--split{top:210px;} /* card 420px */

  .philosophy h2,.sm-stack .sm-stack-heading{
      font-size:36px;
    }
    /* .story-body p,.philosophy-body p,.sm-stack .sm-stack-copy p{
      font-size:16px;;
    } */
    .story-body p{font-size:16px;}
    .philosophy-body p{font-size:16px;}
    .sm-stack .sm-stack-copy p{font-size:16px;}
    .compare-grid figcaption{font-size:16px;}
    .residence-body{font-size:16px;}
    .btn-residence{font-size:13px; width: max-content;}
    .compare-line{
      font-size:16px;
      line-height:24px;
    }
    /* .sm-suites-page .sp-hero{padding-top:75px;} */
    .sm-suites-page .sp-hero-shot{height:480px;}
    .sm-suites-page .sp-tagline{margin-bottom:64px;}
    .sm-suites-page .sp-intro-grid{grid-template-columns: minmax(0,1fr);gap:40px;}
    .sm-suites-page .sp-gallery-slide{height:520px;}
    .sm-suites-page .sp-intro-media .round-nav{margin-right:var(--pad);}
    .sm-suites-page .sp-included{padding-top:30px;}
    .sm-suites-page .sp-included-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;}
    .sm-suites-page .sp-alloc{padding:50px 0;}
    .sm-suites-page .sp-alloc-grid{grid-template-columns:repeat(2, minmax(0, 1fr));gap:28px;}
    .sm-suites-page .sp-alloc-guests{font-size:16px;}
    .sm-suites-page .sp-alloc-suites li{font-size:16px;}
    .sm-suites-page .sp-alloc-note{font-size:16px;}
    .sm-suites-page .sp-suites{padding-top:75px;}
    .sm-suites-page .sp-suite-shot{height:420px;}
    .sm-suites-page .sp-suite-shot .photo-nav{left:50%;transform:translateX(-50%);bottom:24px;}
    .sm-suites-page .sp-cta{margin-top:120px;}
    .sm-suites-page .sp-cta .cta-ornament{right:var(--pad);width:280px;height:420px;}
    .sm-suites-page .sp-alloc-lead{font-size:16px;}

  .sm-room-hero .rh-inner{padding-top:0;padding-bottom:40px;}

  .sm-book-page .bp-intro{padding-top:75px;}
    .sm-book-page .bp-booking{padding-top:72px;}
    .sm-book-page .bp-alloc{padding-top:75px;}
    .sm-book-page .bp-alloc-grid{grid-template-columns:minmax(0,1fr);gap:24px;}
    .sm-book-page .bp-details{padding-top:72px;}
    .sm-book-page .bp-two{grid-template-columns:minmax(0,1fr);gap:48px;}
    .sm-book-page .bp-help{padding:75px 0;}
    .sm-book-page .bp-help-grid{grid-template-columns:minmax(0,1fr);gap:36px;}

  .sm-legal-page{padding:75px 0 90px;}
    .sm-legal-page .lg-grid{grid-template-columns:minmax(0,1fr);gap:48px;}
    /* contents becomes a plain box above the clauses */
    .sm-legal-page .lg-toc{position:static;max-height:none;padding:24px 28px;background:#fdf8ee;border-radius:var(--radius);}
    .sm-legal-page .lg-toc ol{border-left:0;columns:2;column-gap:32px;}
    .sm-legal-page .lg-toc a{padding-left:0;break-inside:avoid;}

  .sm-arrive-page .ap-cta{margin-top:120px;}
    .sm-arrive-page .ap-cta .cta-ornament{right:var(--pad);width:280px;height:420px;}
    .sm-arrive-page .ap-cta .cta-content-wrap{max-width:calc(100% - 300px);}

  .sm-arrive-page .ap-intro-sec{padding:150px 0 64px;}
    .sm-arrive-page .ap-actions{grid-template-columns:repeat(2,minmax(0,1fr));}
    .sm-arrive-page .ap-two{grid-template-columns:minmax(0,1fr);gap:48px;}
    .sm-arrive-page .ap-sec{padding-bottom:72px;}

  /* .sm-reviews{padding:90px 0;} */
    .sm-reviews .rv-grid > .rv-card{flex-basis:calc((100% - 24px) / 2);}

  .page-hero--stacked{padding-top:150px;}
    .page-hero--stacked .page-hero-shot{height:480px;}

  .sm-stack--experience{padding-top:75px;}
    /* .sm-stack .sm-stack-heading{margin-bottom:80px;} */
    /* .sm-stack .sm-stack-copy{padding:50px 0 0;} */
}

/* ==========================================================================
   3. MOBILE (max-width: 760px)
   ========================================================================== */

@media (max-width: 760px) {
  .video-gallery.vg{padding:0 0 56px;}
    .vg-title{font-size:26px;margin-bottom:16px;}
    .vg-text p{font-size:16px;}
    .vg-select{display:block;margin-top:22px;}
    .vg-select-btn{width:max-content;}
    .vg-media{margin-top:28px;}
    .vg-items--videos{grid-template-columns:minmax(0,1fr);gap:14px;}
    .vg-more{margin-top:24px !important;}

  .lightbox-arrow{width:44px;height:44px;font-size:34px;line-height:40px;}
    .lightbox-prev{left:8px;}
    .lightbox-next{right:8px;}

  .story-heading {font-size:26px; margin-bottom:30px;}
    .story .band-slider,.gallery-intro .band-slider{margin-bottom:36px;}
    .story .band-slide,.gallery-intro .band-slide{height:320px;}
    .story .band-slider .round-nav--split,.gallery-intro .band-slider .round-nav--split{top:160px;}

  .exp-slider .round-nav--split{
      position: absolute;
      left: 0;
      right: calc(20px - var(--bleed-right));
      top: 40%;
      height: 0;
      margin: 0;
      display: flex;
      align-items: center;
      justify-content: space-between;
      pointer-events: none;
      z-index: 2;
    }

  /* ============ RESPONSIVE ============ */

  /* nav collapses to the slide-out panel */

  .main-nav{display:none;}
    .burger{display:flex;}
    .header-actions{margin-left:auto;}

  /* phone */

  :root{--pad:20px;}
    .residence-quote,.sm-stack .sm-stack-copy p{
      font-size:16px;
    }
    .story-body p,
    .philosophy-body p,
    .sm-stack-copy p,
    .residence-body,
    .residence-body p,
    .suites-body,
    .feature-copy p,
    .exp-card p,
    .ritual-copy p,
    .didyouknow p,
    .vg-text p,
    .cta--journey .cta-inner p,
    .sm-suites-page .sp-intro-copy p,
    .sm-suites-page .sp-suite-feature .sp-suite-desc p,
    .sm-home .home-copy,
    .replicate-body p,
    .crafted-body p,
    .personal-body,
    .personal-body p,
    .suite-block-copy > p {
      line-height: 1.6;
    }
    .site-header{padding:10px 0;}
    .header-inner{gap:12px;}
    .brand img{height:74px;}
    .site-header.stuck .brand img{height:62px;}
    .header-actions{gap:14px;}
    .header-actions .btn-gold{height:38px;font-size:11px;letter-spacing:.5px;padding:0 14px;}
    .burger{width:32px;height:16px;}
    .burger span{height:3px;}
    .burger.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg);}
    .burger.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg);}
    .nav-panel{padding:0 32px;gap:18px;}
    .nav-panel a{font-size:14px;letter-spacing:2px;}

    .intro-inner{flex-direction:column;align-items:flex-start;padding-top:56px;padding-bottom:56px;}
    .intro h1{margin-bottom:14px;}
    .intro-tagline{margin-bottom:16px;}
    .intro-copy .btn{margin-top:22px;}

    .welcome{padding:70px 0 56px;}
    .welcome-copy p{margin-bottom:28px;}
    .welcome-track{gap:16px;}
    .welcome-slide .shot{height:260px;}
    .welcome-slide figcaption{font-size:16px;margin-top:12px;}
    .round-nav{margin-top:20px;}
    .round-arrow{width:40px;height:40px;}

    .eternal-band > img,
    .eternal-band > video{height:220px;}
    .play-btn{width:70px;height:70px;top:30%;}
    .play-btn img{width:42px;height:54px;}
    .medallion{width:96px;height:96px;bottom:-48px;}
    .medallion-ring{width:96px;height:96px;}
    .medallion-mark{width:78px;height:78px;}
    .eternal-copy{padding:88px 20px 64px;}
    .eternal-copy h2{margin-bottom:18px;}
    .eternal-copy p{margin-bottom:30px;}

    .residence{padding:50px 0;}
    .residence h2{margin-bottom:18px; font-size:26px;}
    .residence-body{margin-bottom:24px;}
    .residence-quote{margin-bottom:30px;}
    .residence-track{gap:16px;}
    .residence-slide .shot{height:240px;}
    .residence-slide figcaption{font-size:17px;margin-top:14px;}
    .slide-nav{width:70%;bottom:14px;}
    .btn-residence{margin-top:30px;}
    .didyouknow .medallion{top:-50px}

    .suites{padding:64px 0 64px;}
    .suites h2.ruled{gap:14px;margin-bottom:22px;}
    .suites h2.ruled .rule{width:30px;}
    .suites-body{margin-bottom:36px; font-size:16px;}
    .suite-track{gap:16px;}
    .suite-shot,
    .sm-home .suite-shot{grid-row:1;height:240px;}
    .suite-panel,
    .sm-home .suite-panel{grid-row:2;padding:26px 22px 24px;}
    .suite-name{margin-bottom:20px;}
    .btn-suite{width:max-content;}
    .suite-nav{margin-top:20px;}
    .photo-nav{width:70%;bottom:12px;}

    .experience{min-height:0;}
    .experience-copy{padding:64px 20px;}
    .experience-copy h2{margin-bottom:18px;}
    .experience-copy p{margin-bottom:28px;}

    .gallery{padding:64px 0 64px;}
    .gallery h2{margin-bottom:26px;}
    .gallery-filter{margin-bottom:32px;}
    .gallery-grid{gap:16px;}
    .gallery-top,.gallery-bottom{grid-template-columns:minmax(0,1fr);gap:16px;}
    .g-col{gap:16px;}
    .gallery-bottom .g8{grid-column:span 1;}
    .g1,.g2,.g3,.g4,.g5,.g6,.g7,.g8{height:230px;}

    .gallery-intro{padding:64px 0 48px;}
    .collections{padding:0 0 20px;}
    .video-gallery{padding:0 0 56px;}
    .collection-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin-top:28px;}

    .cta{min-height:0;}
    .cta-inner{padding:56px 20px;}
    /* Barong (default CTA) and door (journey CTA) ornaments are hidden on phones */
    .cta-ornament{display:none;}
    .cta h2{margin-bottom:16px; font-size:26px;}
    .cta--journey .cta-inner p{margin-bottom:28px; font-size:16px;}
    .cta-actions{gap:12px;}

    .page-hero{min-height:88vh;min-height:88svh;}
    .page-hero-inner{padding-top:96px;padding-bottom:44px;}
    /* the 38px floor at full size reads oversized once the title wraps on a phone screen */
    .page-hero h1{font-size:clamp(30px,8vw,96px);}
    .story{padding:50px 0;}
    .story-label{margin-bottom:18px;}

    .story-compare{padding:50px 0;}
    .compare-grid{gap:30px; grid-template-columns: inherit;}
    .compare-grid figcaption{margin-bottom:14px; font-size:16px;}
    .compare-grid .shot{height:230px;}
    .compare-subheading {font-size:26px; margin-bottom:30px; }
    .suite-block{padding:0 0 48px;}
    .suite-block-shot{height:240px;}
    .suite-block-copy h2{margin-bottom:14px;}
    .features{display:inline;gap:2px;margin-bottom:24px;}
    .btn-suite-explore{width:max-content;max-width:320px;}
    .included{padding:56px 0;}
    .included h2{margin-bottom:28px;}
    .included-cols{grid-template-columns:minmax(0,1fr);gap:0;}
    .allocation{padding:56px 0;}
    .allocation-lead{margin-bottom:32px;}
    .allocation-table{grid-template-columns:minmax(0,1fr);gap:0;}
    .booking{padding:0 0 64px;}
    .booking-row{grid-template-columns:minmax(0,1fr);gap:20px;}
    .booking-contact{gap:32px;}
    .allocation-row > *{padding:16px 0;}
    .allocation-row .allocation-info{border-bottom:none;padding-bottom:4px;}
    .allocation-note{margin-top:32px;}
    .exp{padding:50px 0 0;}
    .exp h2{margin-bottom:26px; font-size:26px;}
    .exp-card h3 {margin-bottom:12px; font-size:26px;}
    .exp-card p {font-size:16px; margin-bottom:18px;}
    .exp-card .shot{height:230px;margin-bottom:18px;}
    .exp-nav{margin-top:24px;}
    .ritual{padding:50px 0;}
    .ritual-grid{grid-template-columns:minmax(0,1fr);gap:30px;}
    .ritual-copy{display:contents;}
    .ritual-copy h2{order:1; margin-bottom:0; font-size:26px; text-align:center;}
    .ritual .welcome-gallery{order:2;}
    .ritual-body{order:3;}
    .ritual-copy p {font-size:16px; margin-bottom:10px;}
    .ritual-copy p:last-child {margin-bottom:0;}
    .personal{padding:50px 0;}
    .personal-body{margin-bottom:28px;}
    .tag-btn{width: max-content;
      height: fit-content;
      padding: 20px 10px;
      font-size: 10px;
      font-weight: 200;
      letter-spacing: 1.5px;
      line-height: 1.35;
      white-space: normal;
      text-align: left;}
    .feature{padding:0 0 50px;}
    .feature-grid, .feature--flip .feature-grid{grid-template-columns:minmax(0,1fr);gap:24px;}
    .feature--flip .feature-shot, .feature--flip .feature-copy{order:0;}
    .feature-shot{height:240px;}
    .feature-copy h2{margin-bottom:25px; font-size:26px;}
    .feature-copy p {font-size:16px; margin-bottom:28px;}
    .lifestyle{padding:30px 0;}
    .lifestyle h2{font-size:26px; margin-bottom:30px;}
    .lifestyle-slide .shot{height:260px;}
    .video-band{min-height:300px;}
    .video-band + .cta{margin-top:56px;}
    .personal + .cta{margin-top:64px;}
    .video-band .play-btn{width:84px;height:84px;}
    .video-band .play-btn img{width:52px;height:66px;}
    .lifestyle-nav{max-width:92%;bottom:14px;}
    .lifestyle-arrow{width:36px;height:36px;}
    .didyouknow{margin-top:64px;padding:70px 0 56px;}
    .didyouknow .lifestyle-slider{margin-top:40px;}
    .story-block.philosophy-band{padding:50px 0 96px;margin-bottom:64px;}
    .didyouknow h2{margin-bottom:16px; font-size:26px;}
    .didyouknow p{font-size:16px; margin-bottom:24px;}
    .philosophy{padding:52px 0 60px;}
    .philosophy-grid{grid-template-columns:minmax(0,1fr);gap:32px;}
    .philosophy h2{margin-bottom:18px;}
    .philosophy .welcome-slide .shot{height:260px;}
    .story-block{padding:50px 0 0;}
    .story-block h2{margin-bottom:18px;}
    .intro-next{padding:86px 0 64px;}
    .intro-next h2{margin-bottom:18px;}
    .intro-next p{margin-bottom:28px;}
    .page-hero-sub{margin-top:18px;}
    .medallion-solo{padding:44px 0;}
    .replicate{padding:56px 0 64px;}
    .replicate h2{margin-bottom:14px;}
    .replicate-lead{margin-bottom:28px;}
    .crafted-body{margin-bottom:32px;}

    .story-wide{height:230px;}
    .personal h2 {font-size:26px; margin-bottom:16px;}
    .personal-lead {font-size:16px; margin-bottom:12px;}

    .site-footer{padding:52px 0;}
    .footer-grid{grid-template-columns:minmax(0,1fr);row-gap:36px;}
    .footer-brand p{font-size:18px;margin-bottom:16px;}
    .footer-col h4{margin-bottom:16px;}
    .link-cols{gap:8px;}
    .link-cols a{line-height:1.9;}

    .btn-outline-gold,.btn-outline-white,.btn-white{width:fit-content;
      height:52px;
      margin-top:0;
      font-size:10px;
      padding:15px 10px;}
    .btn-story,.btn-eternal,.btn-residence,.btn-experience,.btn-check,.btn-contact{padding:0 22px;}
    .btn-residence{width: max-content !important;
          height: fit-content;
          padding: 20px 10px;
          font-size: 10px !important;
          letter-spacing: 1.5px;
          line-height: 1.35;
          white-space: normal;
          text-align: left;
        margin-top: 30px;}
    .btn-suite{font-size:13px;letter-spacing:2px;height:38px;}
    .btn-suite-explore{font-size:13px;letter-spacing:1.5px;height:50px;}
    .sm-suites-page .sp-intro-copy p{font-size:16px;}
    .sm-suites-page .sp-suite-feature .sp-suite-desc p{font-size:16px;}

  .sm-home .home-title h1{font-size:36px;}
  .sm-home .suite-shot .photo-slide img{min-height:100%; height:100%; object-fit:cover;}

  .sm-home .suites--v2 .round-nav--split{top:150px;} /* photo 240px */
    .sm-home .home-exp .round-nav--split,
    .sm-home .band-slider .round-nav--split{top:160px;}   /* band 320px */

  .sm-home .hero-video--short{height:100vh;min-height:380px;}
    .sm-home .hero-video .video-toggle--corner{bottom:24px;width:44px;height:44px;}
    .sm-home .home-title{padding:50px 0;}
    .sm-home .full-shot,.sm-home .full-shot--mid,.sm-home .full-shot--tall{height:260px;}
    .sm-home .band-slide{height:320px;}
    .sm-home .home-block{padding-top:50px;}
    .sm-home .home-heading,.sm-home .home-heading--tight{margin-bottom:30px; font-size:26px;}
    .sm-home .home-block-copy,.sm-home .home-exp .home-block-copy{padding-top:36px;}
    .sm-home .home-copy{font-size:16px; line-height:1.6;}
    .sm-home .home-intro .home-copy{margin:0 0 24px;}
    .sm-home .home-block-copy .home-copy{margin-bottom:24px;}
    /* buttons side by side (left and right), sharing the row; a long label wraps to two lines */
    .sm-home .home-actions, .residence-actions{flex-direction:row;align-items:stretch;gap:12px; justify-content:start;}
    .sm-home .home-actions .btn, .residence-actions .btn{
      width:max-content;
      height:fit-content;
      margin-top:0;
      padding:15px 10px;
      font-size:10px;
      letter-spacing:1.5px;
      line-height:1.35;
      white-space:normal;
      text-align:left;
    }
    .sm-home .residence--v2{padding:56px 0;}
    .sm-home .residence--v2 .residence-body{margin-top:30px;}
    .sm-home .suites--v2{padding-top:50px;}
    .sm-home .suite-card{
      grid-template-columns:minmax(0,1fr);
      flex:0 0 86vw;
      height:auto;
    }
    .sm-home .suite-shot{grid-row:1;height:240px;}
    .sm-home .suite-panel{grid-row:2;}
    .sm-home .home-exp{padding-top:80px;}
    .sm-home .btn-watch,.sm-home .btn-exp-v2{font-size:13px;letter-spacing:1.5px;}
    .sm-home .cta--home{margin-top:72px;}
    .sm-reviews .rv-platforms{
      display:flex;
      gap:12px;
      margin-bottom:36px;
      overflow-x:auto;
      scroll-snap-type:x mandatory;
      -webkit-overflow-scrolling:touch;
      overscroll-behavior-x:contain;
      scrollbar-width:none;
    }
    .sm-reviews .rv-platforms::-webkit-scrollbar{display:none;}
    .sm-reviews .rv-platform{flex:0 0 80%;padding:22px 20px;scroll-snap-align:start;}
    .sm-home .residence--v2 .round-nav--split {
      position: absolute;
      top: 100px;
      left: 10px;
      right: 10px;
      height: 0;
      margin: 0;
    }
    /* .residence-body p {font-size: 16px; line-height: 1.4; margin-bottom: 24px;} */

  /* mobile: Residence + Suites arrows drop out of the photo and sit under the cards, on the left */

  .sm-home .residence--v2 .round-nav--split
  {
      position:static;
      height:auto;
      margin:20px 0 0;
      justify-content:flex-start;
      gap:12px;
      pointer-events:auto;
    }

  /* @media (max-width:1100px){
    .philosophy .round-nav--split{top:230px;} }/* shot 400px */

  .residence:not(.residence--v2) .round-nav--split{
      position:static;
      height:auto;
      margin:20px 0 0;
      justify-content:flex-start;
      gap:12px;
      pointer-events:auto;
    }

  .ritual .round-nav--split{
      position: absolute;
      left: 0;
      right: calc(20px - var(--bleed-right));
      top: 50%;
      height: 0;
      margin: 0;
      display: flex;
      align-items: center;
      justify-content: space-between;
      pointer-events: none;
      z-index: 2;
    }

  .lifestyle .round-nav--split,
  .story-compare .round-nav--split {
      position: absolute;
      top: 50%; /* half of .lifestyle-slide .shot (320px) */
      left: calc(20px - var(--bleed-right));
      right: calc(20px - var(--bleed-right));
      height: 0;
      margin: 0;
      display: flex;
      align-items: center;
      justify-content: space-between;
      pointer-events: none;
      z-index: 2;
    }

  .sm-suites-page .sp-intro .sp-gallery-slide{height:260px;}

  .sm-suites-page .sp-intro .sp-intro-media .round-nav--split{
      position: absolute;
      left: 0;
      right: calc(20px - var(--bleed-right));
      top: 50%; /* half of the 320px card */
      height: 0;
      margin: 0;
      display: flex;
      align-items: center;
      justify-content: space-between;
      pointer-events: none;
      z-index: 2;
    }
    /* mobile order: title (tagline + lead, above the grid) > photos > description */
    .sm-suites-page .sp-intro .sp-intro-media{order:-1;}

  .feature-shot .round-nav--split{
    left: 16px;
    right: 16px;
    top: 50%;
  }

  .round-nav--split .round-arrow,
  .round-nav--split .round-arrow.thin-arrow{
    width: 40px;
    height: 40px;
  }

  .sm-home .home-title h2{font-size:26px;}
    .sm-suites-page .sp-hero{padding:100px 0 0;}
    .sm-suites-page .sp-title{margin-bottom:50px; font-size:46px;}
    .sm-suites-page .sp-hero-shot{height:260px;}
    .sm-suites-page .sp-intro{padding-top:50px;}
    .sm-suites-page .sp-tagline{margin-bottom:36px;}
    .sm-suites-page .sp-lead{margin-bottom:50px; font-size:26px;}
    .sm-suites-page .sp-intro-copy p {font-size:16px;}
    .sm-suites-page .sp-gallery-slide{height:320px;}
    .sm-suites-page .sp-included{padding-top:50px;}
    .sm-suites-page .sp-included-heading{margin-bottom:26px; font-size:26px;}
    .sm-suites-page .sp-included-cols li {font-size:16px;}
    .sm-suites-page .sp-alloc-guests {font-size:16px;}
    .sm-suites-page .sp-alloc-suites li {font-size:16px;}
    .sm-suites-page .sp-alloc-note {font-size:16px;}
  .sm-suites-page .sp-suite-feature .sp-suite-desc p {font-size:16px !important;}
  .sm-suites-page .sp-suite-feature .features-label {font-size:16px !important;}
  .story-label {font-size:26px !important;}
  .features-label {font-size:26px !important;}
    .sm-suites-page .sp-included-cols{grid-template-columns:minmax(0,1fr);}
    .sm-suites-page .sp-alloc{padding-top:64px;}
    .sm-suites-page .sp-alloc-lead{margin-bottom:28px;}
    .sm-suites-page .sp-alloc-band{padding:28px 0;}
    .sm-suites-page .sp-alloc-row{grid-template-columns:minmax(0,1fr);gap:4px;}
    .sm-suites-page .sp-suites{padding-top:64px;}
    .sm-suites-page .sp-suite-name{margin-bottom:22px;}
    .sm-suites-page .sp-suite-shot{height:260px;}
    .sm-suites-page .sp-suite-shot .photo-nav{width:70%;bottom:12px;}
    .sm-suites-page .sp-suite-body{padding-top:28px;}
    /* one plain column: the base list flows 5 rows per column, which squeezes a 2nd column in */
    .sm-suites-page .features{grid-template-columns:minmax(0,1fr);grid-auto-flow:row;grid-template-rows:none;}
    .sm-suites-page .sp-suite-btn{ width: max-content;
      height: fit-content;
      margin-top: 0;
      padding: 15px 10px;
      font-size: 10px;
      letter-spacing: 1.5px;
      line-height: 1.35;
      white-space: normal;
      text-align: left;}
    .sm-suites-page .sp-cta{margin-top:72px;}
    .story-body p{padding:0}
    .philosophy h2,.sm-stack .sm-stack-heading{
      font-size:26px;
      line-height:32px;
    }
    .compare-line{margin:40px auto 34px;font-size:16px;line-height:1.15;}
    .story-lead{margin-bottom:50px; font-size:26px;}

  .sm-room-hero{height:70vh;height:70svh;min-height:380px;}
    .sm-room-hero .rh-inner{padding-top:0;padding-bottom:24px;padding-right:var(--pad);text-align:right;}
    .sm-room-hero .rh-title{font-size:clamp(22px,6vw,28px);}

  .story .btn-watch{width: max-content;
          height: fit-content;
          margin-top: 0;
          padding: 15px 10px;
          font-size: 10px;
          letter-spacing: 1.5px;
          line-height: 1.35;
          white-space: normal;
          text-align: left;}

  .story-actions{margin-top:30px;}
    /* .story .btn-watch{width:100%;height:46px;} */

  .sm-book-page .bp-intro{padding-top:56px;}
    .sm-book-page .bp-lead{margin-bottom:24px;}
    .sm-book-page .bp-booking{padding-top:56px;}
    .sm-book-page .bp-booking-head{margin-bottom:28px;}
    :is(.sm-book-page,.sm-reviews) .bp-form{padding:28px 20px;}
    :is(.sm-book-page,.sm-reviews) .bp-form .bp-row{grid-template-columns:minmax(0,1fr);}
    :is(.sm-book-page,.sm-reviews) .bp-form input[type="submit"],
    :is(.sm-book-page,.sm-reviews) .bp-form button[type="submit"]{width:100%;}
    .sm-book-page .bp-alloc{padding-top:64px;}
    .sm-book-page .bp-alloc .bp-band{padding:28px 0;}
    .sm-book-page .bp-alloc-row{grid-template-columns:minmax(0,1fr);gap:4px;}
    .sm-book-page .bp-details{padding-top:56px;}
    .sm-book-page .bp-help{padding:64px 0;}
    .sm-book-page .bp-contact{padding-left:20px;}
    .sm-book-page .bp-closing{padding:64px 0;}
    .sm-book-page .bp-closing-btn{width:100%;}

  .sm-legal-page{padding:118px 0 64px;}
    .sm-legal-page .lg-head{margin-bottom:40px;padding-bottom:28px;}
    .sm-legal-page .lg-toc ol{columns:1;}
    .sm-legal-page .lg-clause,
    .sm-legal-page .lg-contact{padding-bottom:28px;margin-bottom:28px;}

  .sm-arrive-page .ap-cta{margin-top:72px;}
    .sm-arrive-page .ap-cta .cta-content-wrap{max-width:none;}
    .sm-arrive-page .ap-cta .ap-cta-btn{width:100%;}

  .sm-arrive-page .ap-intro-sec{padding:118px 0 48px;}
    .sm-arrive-page .ap-actions{gap:12px;margin-top:36px;}
    .sm-arrive-page .ap-action{min-height:110px;font-size:12px;letter-spacing:1px;}
    .sm-arrive-page .ap-stay-grid{grid-template-columns:minmax(0,1fr);gap:16px;}
    .sm-arrive-page .ap-times{grid-template-columns:minmax(0,1fr);gap:20px;}
    .sm-arrive-page .ap-time{padding:26px 22px;}
    .sm-arrive-page .ap-sec{padding-bottom:56px;}
    .sm-arrive-page .ap-btn{width:100%;}

  .sm-reviews{padding:64px 0;}
    .sm-reviews .rv-head{margin-bottom:36px;}
    .sm-reviews .rv-head h2 {font-size:26px}
    /* platform cards become a swipe slider: one card at a time, the next one peeking in */
    .sm-reviews .rv-platforms{
      display:flex;
      gap:12px;
      margin-bottom:36px;
      overflow-x:auto;
      scroll-snap-type:x mandatory;
      -webkit-overflow-scrolling:touch;
      overscroll-behavior-x:contain;
      scrollbar-width:none;
    }
    .sm-reviews .rv-platforms::-webkit-scrollbar{display:none;}
    .sm-reviews .rv-platform{flex:0 0 80%;padding:22px 20px;scroll-snap-align:start;}
    .sm-reviews .rv-tabs{justify-content:flex-start;}
    /* review cards: one at a time, the next one peeking in */
    .sm-reviews .rv-grid{gap:16px;}
    .sm-reviews .rv-grid > .rv-card{flex-basis:85%;padding:24px 22px;}
    /* long reviews clamp to 3 lines, the length of a short one; main.js then gives every
       closed card the same height so the slider boxes line up */
    .sm-reviews .rv-text{max-height:calc(17px * 1.6 * 3);}
    .sm-reviews .rv-live{margin-top:56px;}
    .sm-reviews .rv-actions{margin-top:40px;}
    .sm-reviews .rv-btn{width:max-content; font-size:10px;}

  .sm-reviews .rv-overall{margin:-4px 0 28px;gap:14px;}
    .rv-panel{
      left:0;right:0;bottom:0;
      width:100%;max-width:none;max-height:85vh;
      border-radius:16px 16px 0 0;
      padding-bottom:env(safe-area-inset-bottom);
    }
    .rv-panel-view[data-view="summary"]{padding:26px 22px 18px;}
    .rv-panel-scroll{padding:18px 22px 22px;}
    .rv-badge{left:16px;bottom:16px;}

  .sm-reviews .rv-chips .wpcf7-list-item-label{height:40px;padding:0 14px;font-size:14px;}

  .sm-reviews .rv-write.is-open{margin-top:40px;}

  .page-hero--stacked{padding-top:118px;}
    .page-hero--stacked .page-hero-head{margin-bottom:24px;}
    .page-hero--stacked .page-hero-shot{height:260px;}

  /* .sm-suites-page .sp-suite-feature .sp-suite-btn{height:52px;width:260px;font-size:20px;} */

  .sm-suites-page .sp-suite-feature .features{grid-template-columns:minmax(0,1fr);grid-auto-flow:row;grid-template-rows:none;}

  .sm-stack--experience{padding-top:50px;}
    .sm-stack .sm-stack-heading{font-size:26px;margin-bottom:30px;}
    .sm-stack .sm-stack-subheading{font-size:20px;margin-bottom:16px;}
    .sm-stack .sm-stack-copy{padding:30px 0}
    .sm-stack .sm-stack-copy--tight{padding-top:0;}
    .sm-stack .sm-stack-copy .btn{width: max-content;
      height: fit-content;
      margin-top: 0;
      padding: 15px 10px;
      font-size: 10px;
      letter-spacing: 1.5px;
      line-height: 1.35;
      white-space: normal;
      text-align: left;
      margin-top: 30px;}
}

/* ==========================================================================
   4. SMALL MOBILE (max-width: 420px)
   ========================================================================== */

@media (max-width: 420px) {
  /* small phones */

  .header-actions .btn-gold{height:34px;font-size:10px;padding:0 10px;}
    .brand img{height:60px;}
    .welcome-slide .shot,.residence-slide .shot,.suite-shot{height:210px;}
    .philosophy .welcome-slide .shot{height:210px;}
    .feature-shot{height:210px;}
    .lifestyle-slide .shot{height:210px;}
    .exp-card .shot{height:200px;}
    .compare-grid .shot,.story-wide{height:200px;}
    .compare-subheading { font-size: 24px; }
    .page-hero{min-height:86vh;min-height:86svh;}
    .page-hero h1{font-size:26px;letter-spacing:.5px;}
    .g1,.g2,.g3,.g4,.g5,.g6,.g7,.g8{height:200px;}
    .guest-icons img{width:38px;height:38px;}
    .btn-outline-gold,.btn-outline-white,.btn-white
     {width:max-content;
      height:52px;
      padding:15px 10px; 
      font-size:10px;}
    /* .btn-residence{font-size:12px;letter-spacing:1.5px;padding:0 18px;} */
    .btn-suite{font-size:12px;letter-spacing:1.5px;padding:0 10px;}
    .btn-suite-explore{font-size:12px;letter-spacing:1px;padding:0 18px;}

  .sm-suites-page .sp-intro .sp-gallery-slide{height:210px;}
  .feature-shot .round-nav--split{left:10px;right:10px;}
}