/* ==========================================================================
   DELTA INN BY SHORE — DESIGN SYSTEM
   "Tide in. Time out."
   Modern, Airbnb-inspired system: clean white surfaces, rounded photo
   cards, a single confident coral CTA colour, and a mobile-first bottom
   tab bar in place of a hamburger-only nav.
   ========================================================================== */

:root{
  /* ---- Core palette (Airbnb-inspired) ---- */
  --deep-lagoon:#FF6B35;      /* rausch — primary CTA / accent */
  --ink-navy:#222222;         /* near-black — body text + dark surfaces */
  --aqua-splash:#00A699;      /* babu — secondary accent / focus */
  --sun-coral:#FC642D;        /* arches — tags, distance chips */
  --champagne-gold:#FFB400;   /* warm gold — ratings / small accents */
  --sand-beige:#F7F7F7;       /* light neutral — section backgrounds */
  --pearl-white:#FFFFFF;
  --palm-green:#3A7D44;
  --charcoal:#717171;         /* Airbnb secondary grey text */
  --rausch:#FF6B35;
  --rausch-dark:#E8551F;
  --border-hair:#DDDDDD;

  --success:#22C55E;
  --warning:#F59E0B;
  --error:#EF4444;
  --info:#3B82F6;

  /* ---- Gradients ---- */
  --grad-sunset: linear-gradient(135deg,#FF6B35 0%,#FC642D 100%);
  --grad-lagoon: linear-gradient(135deg,#FF6B35 0%,#E8551F 100%);
  --grad-tide: linear-gradient(160deg,#2B2B2B 0%,#141414 100%);
  --grad-horizon: linear-gradient(180deg,#FF6B35 0%,#00A699 100%);
  --grad-dawn: linear-gradient(135deg,#F7F7F7 0%,#FFFFFF 100%);
  --grad-gold: linear-gradient(135deg,#FF6B35 0%,#E8551F 100%);
  --grad-navy-glass: linear-gradient(180deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.92) 100%);

  /* ---- Glass ---- */
  --glass-bg: rgba(255,255,255,0.14);
  --glass-border: rgba(255,255,255,0.22);
  --glass-highlight: rgba(255,255,255,0.30);
  --glass-shadow: rgba(0,0,0,0.32);
  --glass-blur: 22px;

  /* ---- Shadows (soft, neutral) ---- */
  --shadow-sm: 0 2px 8px rgba(0,0,0,0.08);
  --shadow-md: 0 6px 20px rgba(0,0,0,0.10);
  --shadow-lg: 0 16px 40px rgba(0,0,0,0.14);
  --shadow-float: 0 24px 64px rgba(0,0,0,0.18);

  /* ---- Type (clean geometric sans, Airbnb-adjacent) ---- */
  --font-display:'Plus Jakarta Sans', sans-serif;
  --font-body:'Inter', sans-serif;
  --font-ui:'Inter', sans-serif;

  --container: 1240px;

  /* organic blob shape — kept for legacy hooks but unused in the flat card system */
  --blob-a: 63% 37% 54% 46% / 43% 46% 54% 57%;
  --blob-b: 40% 60% 62% 38% / 55% 42% 58% 45%;
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--font-body);
  color:var(--ink-navy);
  background:var(--pearl-white);
  line-height:1.65;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
  -webkit-tap-highlight-color:transparent;
  overflow-x:hidden;
}
section[id]{scroll-margin-top:96px;}
img,svg{display:block;max-width:100%;}
/* Inline icon SVGs — constrain to small size everywhere they appear inline */
.meta svg, .chip svg, .icon-badge svg, .btn svg, .main-nav svg,
.partner-badge svg, .testi-stars svg, .social-row svg, .float-cta svg,
.stay-card-foot svg, .header-actions svg, .nav-dropdown-menu svg,
.breadcrumb svg, .cta-banner svg, .pillar svg, .section ul svg { 
  display:inline-block; width:16px; height:16px; vertical-align:middle; flex-shrink:0;
}
a{color:inherit;text-decoration:none;}
ul{list-style:none;}
button{font:inherit;cursor:pointer;border:none;background:none;}
input,textarea,select{font:inherit;}
:focus-visible{outline:3px solid var(--aqua-splash);outline-offset:3px;}

h1,h2,h3,h4{
  font-family:var(--font-display);
  color:var(--ink-navy);
  line-height:1.12;
  font-weight:600;
  letter-spacing:.1px;
}
h1{font-size:clamp(2.7rem,5.2vw,4.8rem);font-weight:600;}
h2{font-size:clamp(2rem,3.4vw,3rem);}
h3{font-size:clamp(1.3rem,2vw,1.7rem);}
p{color:#465563;}
.container{max-width:var(--container);margin:0 auto;padding:0 32px;}
@media(max-width:640px){.container{padding:0 20px;}}

/* ---------- Utility ---------- */
.eyebrow{
  font-family:var(--font-ui);
  text-transform:uppercase;
  letter-spacing:3px;
  font-size:.75rem;
  font-weight:700;
  color:var(--aqua-splash);
  display:inline-flex;align-items:center;gap:10px;
}
.eyebrow::before{content:'';width:26px;height:2px;background:var(--champagne-gold);display:inline-block;}
.section{padding:110px 0;position:relative;}
.section-tight{padding:70px 0;}
.section-dark{background:var(--grad-tide);color:var(--pearl-white);}
.section-dark p{color:rgba(255,252,247,.72);}
.section-dark h2,.section-dark h3{color:var(--pearl-white);}
.section-sand{background:var(--sand-beige);}
.text-center{text-align:center;}
.max-w{max-width:680px;}
.mx-auto{margin-left:auto;margin-right:auto;}
.mt-lg{margin-top:56px;}
.grad-text{background:var(--grad-sunset);-webkit-background-clip:text;background-clip:text;color:transparent;}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s ease;}
.reveal.is-visible{opacity:1;transform:translateY(0);}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none;}html{scroll-behavior:auto;}}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--font-ui);font-weight:700;font-size:.92rem;letter-spacing:.3px;
  padding:15px 30px;border-radius:999px;
  transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease,background .35s ease,color .35s ease;
  white-space:nowrap;
}
.btn svg{width:16px;height:16px;transition:transform .3s ease;}
.btn:hover svg{transform:translateX(4px);}
.btn-primary{background:var(--grad-lagoon);color:#fff;box-shadow:var(--shadow-md);}
.btn-primary:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);}
.btn-outline{border:1.5px solid var(--ink-navy);color:var(--ink-navy);}
.btn-outline:hover{border-color:var(--ink-navy);background:var(--ink-navy);color:#fff;}
.btn-gold{background:var(--ink-navy);color:#fff;box-shadow:var(--shadow-md);}
.btn-gold:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);background:#000;}
.btn-ghost-light{border:1.5px solid rgba(255,252,247,.4);color:var(--pearl-white);}
.btn-ghost-light:hover{background:rgba(255,252,247,.14);border-color:var(--pearl-white);}
.btn-block{width:100%;justify-content:center;}

/* ==========================================================================
   HEADER / NAV
   ========================================================================== */
.site-header{position:fixed;top:0;left:0;right:0;z-index:1000;padding:18px 0;transition:padding .3s ease,box-shadow .3s ease;background:#FFFFFF;box-shadow:0 1px 0 rgba(0,0,0,.09);}
.site-header.is-scrolled{padding:11px 0;box-shadow:0 2px 16px rgba(0,0,0,.10);}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;}
.logo{display:flex;align-items:center;gap:12px;}
.logo-full{height:56px;width:auto;flex-shrink:0;transition:height .3s ease;}
.site-header.is-scrolled .logo-full{height:44px;}

.main-nav{display:flex;align-items:center;gap:34px;}
.main-nav a{font-family:var(--font-ui);font-size:.9rem;font-weight:600;letter-spacing:.1px;position:relative;padding:6px 0;color:var(--ink-navy);}

.main-nav a::after{content:'';position:absolute;left:0;bottom:0;width:0;height:2px;background:var(--rausch);transition:width .3s ease;}
.main-nav a:hover::after,.main-nav a.active::after{width:100%;}
.main-nav a:hover,.main-nav a.active{color:var(--rausch);}

/* Dropdown */
.nav-dropdown { position: relative; }
.nav-dropdown-menu {
  position: absolute; top: 100%; left: 50%; transform: translateX(-50%) translateY(10px);
  background: #FFFFFF; border-radius: 16px; padding: 10px;
  min-width: 210px; opacity: 0; visibility: hidden;
  transition: all .3s cubic-bezier(.2,.8,.2,1);
  box-shadow: var(--shadow-lg); border: 1px solid rgba(0,0,0,.08);
  display: flex; flex-direction: column; z-index: 100;
}
.nav-dropdown:hover .nav-dropdown-menu { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.nav-dropdown-menu a {
  padding: 11px 14px; border-radius:10px; color: var(--ink-navy) !important; font-size: .88rem !important;
  font-weight: 500 !important; white-space: nowrap; transition: color .2s ease, background .2s ease;
}
.nav-dropdown-menu a::after { display: none !important; }
.nav-dropdown-menu a:hover { color: var(--rausch) !important; background: var(--sand-beige); }
.header-actions{display:flex;align-items:center;gap:18px;}
.nav-toggle{display:none;flex-direction:column;gap:5px;width:30px;z-index:1100;padding:12px;margin:-12px;}
.nav-toggle span{height:2px;width:100%;background:var(--ink-navy);border-radius:2px;transition:.3s;}
.nav-toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle.is-open span:nth-child(2){opacity:0;}
.nav-toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.nav-toggle.is-open span{background:var(--rausch) !important;}

@media(max-width:960px){
  /* Remove backdrop-filter when menu is open to prevent containing block clipping */
  .site-header:has(.nav-toggle.is-open) {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  /* Show hamburger */
  .nav-toggle{display:flex;}
  .nav-cta{display:none;}

  /* Full-screen slide-in panel from right */
  .main-nav{
    position:fixed;
    top:0; right:0; bottom:0; left:0;
    background:var(--ink-navy);
    display:flex;
    flex-direction:column;
    align-items:stretch;
    justify-content:flex-start;
    gap:0;
    padding:90px 28px 40px;
    transform:translateX(100%);
    transition:transform .4s cubic-bezier(.2,.8,.2,1);
    box-shadow:var(--shadow-float);
    overflow-y:auto;
    z-index:999;
  }
  .main-nav.is-open{transform:translateX(0);}

  /* Direct nav links */
  .main-nav > a{
    display:block;
    color:var(--pearl-white) !important;
    font-size:1.15rem !important;
    font-weight:600;
    padding:14px 0;
    border-bottom:1px solid rgba(255,255,255,.08);
    width:100%;
  }
  .main-nav > a::after{display:none !important;}
  .main-nav > a:hover,.main-nav > a.active{color:var(--champagne-gold) !important;}

  /* Dropdown wrapper */
  .nav-dropdown{
    width:100%;
    border-bottom:1px solid rgba(255,255,255,.08);
  }

  /* Dropdown trigger button row */
  .nav-dropdown > a{
    display:flex !important;
    align-items:center;
    justify-content:space-between;
    color:var(--pearl-white) !important;
    font-size:1.15rem !important;
    font-weight:600;
    padding:14px 0;
    width:100%;
    cursor:pointer;
  }
  .nav-dropdown > a::after{display:none !important;}
  .nav-dropdown > a::before{
    content:'none';
    display:none;
  }
  /* Arrow icon appended via JS — use a simple CSS arrow instead */
  .nav-dropdown > a .dd-arrow{
    display:inline-block;
    width:0;height:0;
    border-left:5px solid transparent;
    border-right:5px solid transparent;
    border-top:6px solid var(--champagne-gold);
    flex-shrink:0;
    transition:transform .3s ease;
  }
  .nav-dropdown.is-open > a .dd-arrow{transform:rotate(180deg);}

  /* Dropdown sub-menu */
  .nav-dropdown-menu{
    position:static !important;
    transform:none !important;
    opacity:1 !important;
    visibility:visible !important;
    background:rgba(255,255,255,.04);
    border-radius:10px;
    padding:4px 0 8px;
    margin-bottom:8px;
    min-width:unset;
    width:100%;
    box-shadow:none;
    border:1px solid rgba(255,255,255,.1);
    display:none;
    flex-direction:column;
  }
  .nav-dropdown.is-open .nav-dropdown-menu{display:flex !important;}
  .nav-dropdown-menu a{
    display:block !important;
    padding:13px 20px !important;
    font-size:1rem !important;
    font-weight:500 !important;
    color:rgba(255,252,247,.78) !important;
    border:none !important;
  }
  .nav-dropdown-menu a::after{display:none !important;}
  .nav-dropdown-menu a:hover{color:var(--champagne-gold) !important;background:rgba(255,255,255,.04);}
}

@media(max-width:640px){
  .logo-full{height:52px;}
  .site-header.is-scrolled .logo-full{height:42px;}
  .site-header{padding:14px 0;}
}

/* ==========================================================================
   PREMIUM IMAGE FRAMES
   Clean rectangular frames aligned with the ornamental gold logo identity.
   ========================================================================== */

/* Hero / feature imagery — elegant rectangle with gold accent ring */
.blob-frame{
  position:relative;
  overflow:hidden;
  border-radius:20px;
  box-shadow:
    0 0 0 1px rgba(0,0,0,.06),
    0 16px 40px rgba(0,0,0,.16);
  aspect-ratio:1/1.05;
  width:100%;
  transition:box-shadow .3s ease;
}
.blob-frame::after{
  content:'';
  position:absolute;inset:0;
  border-radius:20px;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.06);
  pointer-events:none;z-index:3;
}

/* Card imagery — clean uniform radius, Airbnb-style rounded photo card */
.wave-card-media{position:relative;overflow:hidden;border-radius:16px;box-shadow:var(--shadow-sm);}

/* Media-frame: shared plumbing for <img> + graceful placeholder */
.media-frame{position:relative;width:100%;height:100%;background:var(--ink-navy);}
.media-frame img{width:100%;height:100%;object-fit:cover;position:relative;z-index:2;display:block;}

/* ==========================================================================
   PREMIUM PLACEHOLDER SYSTEM
   Deep-navy gallery-dark aesthetic with gold ornamental accents.
   Mirrors the brand's gold lotus logo — intentional, never broken.
   ========================================================================== */
.ph-placeholder{
  position:absolute;inset:0;display:none;z-index:1;overflow:hidden;
  background: linear-gradient(160deg, #F0F0F0 0%, #E4E4E4 100%);
}
.media-frame.img-missing .ph-placeholder{display:block;}
.media-frame.img-missing img{display:none;}

/* Subtle grain texture overlay */
.ph-placeholder::before{
  content:'';
  position:absolute;inset:0;z-index:0;
  opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:180px 180px;
  mix-blend-mode:overlay;
}

/* Sweeping shimmer bar (skeleton-loader style) */
.ph-placeholder::after{
  content:'';
  position:absolute;top:0;left:-100%;width:60%;height:100%;z-index:1;
  background:linear-gradient(105deg, transparent 30%, rgba(255,255,255,.7) 50%, transparent 70%);
  animation:phShimmer 3.2s ease-in-out infinite;
}
@keyframes phShimmer{0%{left:-100%;}100%{left:200%;}}

/* Minimal corner marks (subtle, neutral) */
.ph-corners{
  position:absolute;inset:0;z-index:2;pointer-events:none;
}
.ph-corners::before,
.ph-corners::after{
  content:'';
  position:absolute;
  width:28px;height:28px;
  border-color:rgba(0,0,0,.14);
  border-style:solid;
  border-width:0;
}
.ph-corners::before{
  top:14px;left:14px;
  border-top-width:1.5px;
  border-left-width:1.5px;
  border-radius:3px 0 0 0;
}
.ph-corners::after{
  bottom:14px;right:14px;
  border-bottom-width:1.5px;
  border-right-width:1.5px;
  border-radius:0 0 3px 0;
}

/* Companion corner pair (top-right + bottom-left) via extra spans */
.ph-corner-tr,.ph-corner-bl{
  position:absolute;width:28px;height:28px;z-index:2;pointer-events:none;
  border-style:solid;border-width:0;border-color:rgba(0,0,0,.14);
}
.ph-corner-tr{top:14px;right:14px;border-top-width:1.5px;border-right-width:1.5px;border-radius:0 3px 0 0;}
.ph-corner-bl{bottom:14px;left:14px;border-bottom-width:1.5px;border-left-width:1.5px;border-radius:0 0 0 3px;}

/* Thin rule above caption */
.ph-rule{
  width:40px;height:1px;
  background:linear-gradient(90deg, transparent, rgba(0,0,0,.3), transparent);
  margin:0 auto;
}

.ph-content{
  position:relative;z-index:3;height:100%;width:100%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  padding:32px 24px;gap:12px;
}

/* Emblem logo — softly watermarked in centre */
.ph-emblem{
  width:clamp(52px,18%,80px);
  height:auto;
  opacity:.28;
  margin-bottom:4px;
}

.ph-tag{
  font-family:var(--font-ui);font-size:.6rem;font-weight:700;letter-spacing:3px;text-transform:uppercase;
  color:var(--rausch);opacity:.85;
}
.ph-caption{
  font-family:var(--font-display);font-size:clamp(.88rem,2vw,1.05rem);font-weight:600;
  color:rgba(34,34,34,.6);
  max-width:240px;line-height:1.4;margin-top:2px;
  letter-spacing:.1px;
}
.ph-file{
  font-family:var(--font-ui);font-size:.62rem;color:rgba(34,34,34,.32);
  letter-spacing:.6px;margin-top:2px;
}

/* ---- Tone variants — all stay in the neutral light-grey placeholder palette ---- */
.media-frame.tone-sand .ph-placeholder{
  background:linear-gradient(160deg, #F5F0EA 0%, #E9E1D6 100%);
}
.media-frame.tone-sunset .ph-placeholder{
  background:linear-gradient(160deg, #FBEAE6 0%, #F4D9D2 100%);
}
.media-frame.tone-sunset .ph-corners::before,
.media-frame.tone-sunset .ph-corners::after,
.media-frame.tone-sunset .ph-corner-tr,
.media-frame.tone-sunset .ph-corner-bl{border-color:rgba(255,107,53,.3);}
.media-frame.tone-sunset .ph-rule{
  background:linear-gradient(90deg, transparent, rgba(255,107,53,.5), transparent);
}
.media-frame.tone-sunset .ph-tag{color:var(--rausch);}

.media-frame.tone-tide .ph-placeholder{
  background:linear-gradient(160deg, #F0F0F0 0%, #E4E4E4 100%);
}

@media(max-width:600px){
  .ph-emblem{width:46px;}
  .ph-caption{font-size:.88rem;}
  .ph-content{padding:20px 16px;gap:9px;}
  .ph-corners::before,.ph-corners::after,.ph-corner-tr,.ph-corner-bl{width:30px;height:30px;top:10px;left:10px;}
  .ph-corner-tr{top:10px;left:auto;right:10px;}
  .ph-corner-bl{top:auto;left:10px;bottom:10px;}
  .ph-corners::after{bottom:10px;right:10px;}
}

.hero{position:relative;min-height:100vh;display:flex;align-items:center;padding:150px 0 90px;background:var(--grad-tide);color:var(--pearl-white);overflow:hidden;}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:center;}
.hero-eyebrow{color:var(--champagne-gold);}
.hero h1{color:var(--pearl-white);margin:18px 0 22px;}
.hero p.lead{color:rgba(255,252,247,.78);font-size:1.12rem;max-width:520px;margin-bottom:36px;}
.hero-cta{display:flex;gap:16px;flex-wrap:wrap;}
.hero-media-wrap{position:relative;}
.hero-media-wrap .blob-frame{aspect-ratio:4/4.6;width:100%;}
.hero-stats{display:flex;gap:0;position:absolute;right:0;bottom:-30px;background:var(--glass-bg);border:1px solid var(--glass-border);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));border-radius:20px;padding:22px 28px;box-shadow:0 8px 32px var(--glass-shadow);}
.hero-stats .stat{padding:0 22px;border-right:1px solid rgba(255,255,255,.18);}
.hero-stats .stat:last-child{border-right:none;}
.hero-stats .stat b{display:block;font-family:var(--font-display);font-size:1.6rem;color:var(--pearl-white);}
.hero-stats .stat span{font-size:.68rem;letter-spacing:1.5px;text-transform:uppercase;color:rgba(255,252,247,.65);}
@media(max-width:1150px){
  .hero-grid{grid-template-columns:1fr;}
  .hero-stats{position:static;margin-top:30px;flex-wrap:wrap;justify-content:center;}
  .hero-stats .stat{border-right:none;padding:8px 18px;}
}
.scroll-cue{position:absolute;bottom:40px;left:60px;display:flex;flex-direction:column;align-items:center;gap:8px;color:rgba(255,252,247,.6);font-family:var(--font-ui);font-size:.7rem;letter-spacing:2px;text-transform:uppercase;z-index:10;}
.scroll-cue .line{width:1px;height:36px;background:linear-gradient(var(--champagne-gold),transparent);animation:scrollcue 2s infinite;}
@keyframes scrollcue{0%{opacity:0;transform:scaleY(0);transform-origin:top;}40%{opacity:1;transform:scaleY(1);transform-origin:top;}100%{opacity:0;transform:scaleY(1);transform-origin:bottom;}}
@media (max-width: 1200px), (max-height: 750px) {
  .scroll-cue { display: none !important; }
}

/* Page header (non-home hero) */
.page-head{position:relative;padding:180px 0 100px;color:var(--pearl-white);overflow:hidden;background:var(--ink-navy);}
.page-head .head-blob{position:absolute;inset:0;width:100%;height:100%;opacity:1;z-index:0;}
.page-head .head-blob .blob-frame{width:100%;height:100%;border-radius:0 !important;aspect-ratio:unset !important;box-shadow:none !important;}
.page-head .head-blob .blob-frame::after{display:none;}
.page-head .head-blob .media-frame{width:100%;height:100%;}
.page-head .head-blob .media-frame img{width:100%;height:100%;object-fit:cover;display:block;}
.page-head::after{content:'';position:absolute;inset:0;background:linear-gradient(to right,rgba(7,28,44,.85) 0%,rgba(7,28,44,.6) 55%,rgba(7,28,44,.25) 100%);z-index:1;}
.page-head-inner{position:relative;z-index:2;max-width:640px;}
.breadcrumb{font-family:var(--font-ui);font-size:.78rem;letter-spacing:1px;color:rgba(255,252,247,.6);margin-bottom:18px;}
.breadcrumb b{color:var(--champagne-gold);}
.page-head h1{color:var(--pearl-white);margin:16px 0 14px;}
.page-head p{color:rgba(255,252,247,.75);font-size:1.05rem;max-width:540px;}

/* ---------- Wave divider (drawn SVG, replaces flat horizon line) ---------- */
.wave-divider{display:block;width:100%;height:44px;margin:8px 0;}

/* ==========================================================================
   CARDS
   ========================================================================== */
.card-grid{display:grid;gap:34px;}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}
@media(max-width:960px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.grid-3,.grid-4,.grid-2{grid-template-columns:1fr;}}

.stay-card{background:var(--pearl-white);border-radius:16px;overflow:hidden;box-shadow:var(--shadow-sm);border:1px solid var(--border-hair);transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s ease;display:flex;flex-direction:column;}
.stay-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);}
.stay-card .wave-card-media{aspect-ratio:4/3;border-radius:0;}
.stay-card-body{padding:22px 22px 26px;}
.stay-card .tag{display:inline-block;font-family:var(--font-ui);font-size:.68rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--rausch);background:rgba(255,107,53,.08);padding:6px 12px;border-radius:999px;margin-bottom:14px;}
.stay-card h3{margin-bottom:8px;}
.stay-card .meta{display:flex;gap:16px;margin:16px 0;font-family:var(--font-ui);font-size:.78rem;color:var(--charcoal);flex-wrap:wrap;}
.stay-card .meta span{display:flex;align-items:center;gap:6px;}
.stay-card .meta svg{width:15px;height:15px;color:var(--deep-lagoon);}
.stay-card .price{font-family:var(--font-display);font-size:1.3rem;color:var(--ink-navy);}
.stay-card .price small{font-family:var(--font-ui);font-size:.68rem;color:var(--charcoal);font-weight:600;}
.stay-card-foot{display:flex;align-items:center;justify-content:space-between;margin-top:18px;padding-top:18px;border-top:1px dashed rgba(7,28,44,.14);flex-wrap:wrap;gap:14px;}

.icon-card{background:var(--pearl-white);border:1px solid var(--border-hair);border-radius:16px;padding:32px 26px;transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;}
.icon-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:transparent;}
.icon-badge{width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--grad-lagoon);color:var(--pearl-white);margin-bottom:20px;}
.icon-badge svg{width:26px;height:26px;}
.icon-card h3{font-size:1.15rem;margin-bottom:8px;}
.icon-card p{font-size:.92rem;}

.glass-card{background:var(--glass-bg);border:1px solid var(--glass-border);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));border-radius:24px;padding:32px 28px;box-shadow:0 8px 32px var(--glass-shadow);position:relative;}
.glass-card::before{content:'';position:absolute;top:0;left:24px;right:24px;height:1px;background:var(--glass-highlight);}

.attraction-card{position:relative;border-radius:16px;overflow:hidden;box-shadow:var(--shadow-sm);border:1px solid var(--border-hair);transition:transform .3s ease,box-shadow .3s ease;}
.attraction-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);}
.attraction-card .wave-card-media{aspect-ratio:5/4;border-radius:0;}
.attraction-card-info{padding:20px 20px 22px;background:var(--pearl-white);}
.attraction-card .dist{font-family:var(--font-ui);font-size:.72rem;letter-spacing:1px;color:var(--sun-coral);font-weight:700;text-transform:uppercase;margin-bottom:6px;display:block;}

.testi-card{background:var(--pearl-white);border-radius:16px;padding:30px 26px;box-shadow:var(--shadow-sm);border:1px solid var(--border-hair);}
.testi-stars{display:flex;gap:4px;color:var(--champagne-gold);margin-bottom:16px;}
.testi-stars svg{width:16px;height:16px;}
.testi-quote{font-family:var(--font-display);font-size:1.1rem;font-style:italic;color:var(--ink-navy);margin-bottom:20px;}
.testi-person{display:flex;align-items:center;gap:12px;}
.testi-avatar{width:44px;height:44px;border-radius:50%;background:var(--grad-sunset);flex-shrink:0;}
.testi-person b{display:block;font-size:.9rem;}
.testi-person span{font-size:.76rem;color:var(--charcoal);}

.pillar{display:flex;gap:20px;align-items:flex-start;padding:26px 0;border-bottom:1px solid rgba(7,28,44,.1);}
.pillar:last-child{border-bottom:none;}
.pillar-num{font-family:var(--font-display);font-size:1.4rem;color:var(--champagne-gold);flex-shrink:0;width:50px;}
.pillar h3{margin-bottom:6px;}

.timeline{position:relative;padding-left:44px;}
.timeline::before{content:'';position:absolute;left:9px;top:6px;bottom:6px;width:2px;background:var(--grad-horizon);}
.timeline-item{position:relative;padding-bottom:52px;}
.timeline-item:last-child{padding-bottom:0;}
.timeline-item::before{content:'';position:absolute;left:-44px;top:4px;width:20px;height:20px;border-radius:50%;background:var(--pearl-white);border:3px solid var(--aqua-splash);}
.timeline-year{font-family:var(--font-ui);font-weight:700;color:var(--deep-lagoon);letter-spacing:1px;font-size:.85rem;margin-bottom:6px;display:block;}

.split{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;}
@media(max-width:900px){.split{grid-template-columns:1fr;gap:44px;}}
.split.reverse .split-media{order:2;}
@media(max-width:900px){.split.reverse .split-media{order:0;}}

.chip-list{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px;}
.chip{display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:var(--sand-beige);font-family:var(--font-ui);font-size:.82rem;font-weight:600;color:var(--ink-navy);}
.chip svg{width:15px;height:15px;color:var(--deep-lagoon);}

/* ---------- Booking partner links (OTA deep links) ---------- */
.partner-row{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:22px;}
.partner-row-label{font-family:var(--font-ui);font-size:.74rem;letter-spacing:.5px;color:var(--charcoal);margin-right:2px;}
.partner-badge{
  display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:999px;
  border:1.5px solid var(--border-hair);font-family:var(--font-ui);font-size:.8rem;font-weight:700;
  color:var(--ink-navy);transition:border-color .25s ease,transform .25s ease,box-shadow .25s ease;background:#fff;
}
.partner-badge:hover{border-color:var(--partner-color,var(--rausch));transform:translateY(-2px);box-shadow:var(--shadow-sm);}
.partner-badge .partner-dot{width:8px;height:8px;border-radius:50%;background:var(--partner-color,var(--rausch));flex-shrink:0;}

/* Variant for use on dark/photo backgrounds (e.g. the homepage hero) */
.partner-badge--on-dark{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.28);color:#fff;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);}
.partner-badge--on-dark:hover{background:rgba(255,255,255,.16);border-color:#fff;}

.partner-block{padding:8px 0;}
.partner-card{position:relative;text-align:left;}
.partner-card--direct{background:var(--grad-lagoon);border-color:transparent;}
.partner-card--direct h3,.partner-card--direct p{color:var(--pearl-white);}
.partner-card--direct .icon-badge{background:rgba(255,255,255,.22);}
.partner-card .icon-badge svg{color:#fff;}
.partner-card .btn-outline{border-color:rgba(0,0,0,.16);}

/* Mobile bottom-sheet style stacked OTA list */
.partner-sheet{display:flex;flex-direction:column;gap:10px;}
.partner-sheet-row{
  display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:14px;
  border:1px solid var(--border-hair);transition:border-color .2s ease,background .2s ease;
}
.partner-sheet-row:hover{border-color:var(--rausch);background:var(--sand-beige);}
.partner-sheet-row--direct{border-color:var(--rausch);background:rgba(255,107,53,.05);}
.partner-sheet-icon{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#fff;}
.partner-sheet-icon svg{width:16px;height:16px;}
.partner-sheet-copy{flex:1;display:flex;flex-direction:column;font-family:var(--font-ui);}
.partner-sheet-copy b{font-size:.9rem;color:var(--ink-navy);}
.partner-sheet-copy span{font-size:.76rem;color:var(--charcoal);}
.partner-sheet-row svg:last-child{width:16px;height:16px;color:var(--charcoal);flex-shrink:0;}

@media(max-width:600px){
  .partner-row{gap:8px;}
  .partner-badge{font-size:.76rem;padding:7px 14px;}
}

/* ==========================================================================
   FORMS
   ========================================================================== */
.form-field{margin-bottom:20px;}
.form-field label{display:block;font-family:var(--font-ui);font-size:.78rem;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--charcoal);margin-bottom:8px;}
.form-field input,.form-field select,.form-field textarea{width:100%;padding:14px 16px;border:1.5px solid rgba(7,28,44,.16);border-radius:14px;background:var(--pearl-white);color:var(--ink-navy);transition:border-color .3s ease,box-shadow .3s ease;}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus{border-color:var(--aqua-splash);box-shadow:0 0 0 4px rgba(0,166,153,.14);outline:none;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
@media(max-width:640px){.form-row{grid-template-columns:1fr;}}
.form-note{font-size:.8rem;color:var(--charcoal);margin-top:14px;}

.contact-info-card{background:var(--ink-navy);color:var(--pearl-white);border-radius:26px;padding:40px;position:relative;overflow:hidden;}
.contact-info-row{display:flex;gap:16px;align-items:flex-start;padding:18px 0;border-bottom:1px solid rgba(255,252,247,.14);}
.contact-info-row:first-of-type{padding-top:0;}
.contact-info-row .ico{width:40px;height:40px;border-radius:50% 50% 50% 10px;background:rgba(224,168,88,.18);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.contact-info-row .ico svg{width:18px;height:18px;color:var(--champagne-gold);}
.contact-info-row b{display:block;font-size:.92rem;margin-bottom:3px;}
.contact-info-row span{font-size:.85rem;color:rgba(255,252,247,.68);}
.social-row{display:flex;gap:12px;margin-top:26px;}
.social-row a{width:40px;height:40px;border-radius:50%;background:rgba(255,252,247,.1);display:flex;align-items:center;justify-content:center;transition:background .3s ease,transform .3s ease;}
.social-row a:hover{background:var(--champagne-gold);transform:translateY(-3px);color:var(--ink-navy);}
.social-row svg{width:17px;height:17px;}

.map-frame{border-radius:26px;overflow:hidden;box-shadow:var(--shadow-md);border:1px solid rgba(7,28,44,.1);height:100%;min-height:340px;}

.cta-banner{position:relative;border-radius:36px;overflow:hidden;background:var(--grad-lagoon);padding:70px 60px;display:flex;align-items:center;justify-content:space-between;gap:40px;flex-wrap:wrap;}
.cta-banner h2{color:var(--pearl-white);max-width:520px;}
.cta-banner p{color:rgba(255,252,247,.75);margin-top:10px;max-width:480px;}

/* ==========================================================================
   FOOTER
   ========================================================================== */
.site-footer{background:var(--ink-navy);color:rgba(255,252,247,.7);padding-top:80px;}
.footer-top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:48px;padding-bottom:56px;}
@media(max-width:900px){.footer-top{grid-template-columns:1fr 1fr;}}
@media(max-width:560px){.footer-top{grid-template-columns:1fr;}}
.footer-brand .logo-full{height:72px;margin-bottom:18px;}
.footer-brand p{color:rgba(255,252,247,.55);margin:0 0 22px;max-width:280px;font-size:.92rem;}
@media(max-width:640px){.footer-brand .logo-full{height:52px;}}
.footer-col h4{font-family:var(--font-ui);font-size:.78rem;letter-spacing:1.5px;text-transform:uppercase;color:var(--champagne-gold);margin-bottom:20px;}
.footer-col a{display:block;font-size:.9rem;color:rgba(255,252,247,.62);margin-bottom:13px;transition:color .3s ease;}
.footer-col a:hover{color:var(--pearl-white);}
.footer-newsletter form{display:flex;gap:0;margin-top:14px;border:1px solid rgba(255,252,247,.2);border-radius:999px;overflow:hidden;padding:4px;}
.footer-newsletter input{flex:1;background:transparent;border:none;padding:10px 14px;color:var(--pearl-white);font-size:.85rem;}
.footer-newsletter button{background:var(--champagne-gold);color:var(--ink-navy);border-radius:999px;padding:10px 18px;font-family:var(--font-ui);font-weight:700;font-size:.82rem;}
.footer-bottom{border-top:1px solid rgba(255,252,247,.1);padding:26px 0;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;font-size:.8rem;color:rgba(255,252,247,.45);}
.footer-bottom a{color:rgba(255,252,247,.45);}
.footer-bottom a:hover{color:var(--champagne-gold);}

.swatch-strip{display:flex;height:6px;width:100%;}
.swatch-strip span{flex:1;}

.float-cta{position:fixed;bottom:26px;right:26px;z-index:900;width:56px;height:56px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-lg);animation:pulse 2.6s infinite;}
.float-cta svg{width:26px;height:26px;color:#fff;}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(37,211,102,.5),var(--shadow-lg);}70%{box-shadow:0 0 0 14px rgba(37,211,102,0),var(--shadow-lg);}100%{box-shadow:0 0 0 0 rgba(37,211,102,0),var(--shadow-lg);}}

/* ==========================================================================
   MOBILE BOTTOM TAB BAR (Airbnb-app style) + sticky "Reserve" strip
   ========================================================================== */
.sticky-book-bar{
  display:none;position:fixed;left:0;right:0;bottom:0;z-index:940;
  align-items:center;justify-content:space-between;gap:14px;
  padding:12px 16px;
  background:#FFFFFF;
  border-top:1px solid var(--border-hair);
}
.sticky-book-bar .sbb-text{font-family:var(--font-ui);}
.sticky-book-bar .sbb-text b{display:block;font-size:.86rem;color:var(--ink-navy);}
.sticky-book-bar .sbb-text span{font-size:.72rem;color:var(--charcoal);}
.sticky-book-bar .btn{padding:11px 22px;font-size:.82rem;flex-shrink:0;}

.bottom-tab-bar{
  display:none;position:fixed;left:0;right:0;bottom:0;z-index:945;
  grid-template-columns:repeat(5,1fr);align-items:end;
  background:#FFFFFF;border-top:1px solid var(--border-hair);
  padding:8px 4px calc(6px + env(safe-area-inset-bottom));
  box-shadow:0 -6px 20px rgba(0,0,0,.06);
}
.bottom-tab-bar a{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  padding:5px 2px;color:var(--charcoal);font-family:var(--font-ui);
}
.bottom-tab-bar a svg{width:22px;height:22px;stroke-width:1.8;}
.bottom-tab-bar a span{font-size:.62rem;font-weight:600;letter-spacing:.1px;}
.bottom-tab-bar a.active{color:var(--rausch);}
.bottom-tab-bar a.tab-book{color:var(--charcoal);position:relative;}
.bottom-tab-bar a.tab-book .tab-book-badge{
  width:38px;height:38px;border-radius:50%;background:var(--grad-lagoon);
  display:flex;align-items:center;justify-content:center;margin-bottom:2px;
  box-shadow:0 6px 16px rgba(255,107,53,.4);transform:translateY(-6px);
}
.bottom-tab-bar a.tab-book .tab-book-badge svg{width:18px;height:18px;color:#fff;stroke-width:2.2;}
.bottom-tab-bar a.tab-book span{color:var(--rausch);font-weight:700;}

@media(max-width:760px){
  .bottom-tab-bar{display:grid;}
  .sticky-book-bar{display:none !important;}
  .float-cta{bottom:calc(80px + env(safe-area-inset-bottom));}
  body{padding-bottom:66px;}
}

@media(max-width:900px){
  .section{padding:80px 0;}
  .cta-banner{padding:50px 30px;flex-direction:column;text-align:left;}
}

/* ---------- Small-phone refinement pass ---------- */
@media(max-width:600px){
  .hero{padding:118px 0 70px;min-height:auto;}
  .page-head{padding:130px 0 64px;}
  .section{padding:64px 0;}
  .section-tight{padding:48px 0;}
  h1{line-height:1.1;}
  .hero-cta{flex-direction:column;align-items:stretch;}
  .hero-cta .btn{width:100%;justify-content:center;}
  .cta-banner{padding:38px 24px;border-radius:26px;}
  .cta-banner .btn{width:100%;justify-content:center;}
  .stay-card-foot{flex-direction:column;align-items:flex-start;gap:14px;}
  .stay-card-foot .btn{width:100%;justify-content:center;}
  .contact-info-card{padding:28px 22px;}
  .glass-card{padding:26px 22px;}
  .icon-card{padding:26px 20px;}
  .testi-card{padding:26px 22px;}
  .footer-newsletter form{flex-direction:column;border-radius:16px;padding:8px;}
  .footer-newsletter button{width:100%;margin-top:8px;}
  .float-cta{bottom:calc(18px + env(safe-area-inset-bottom));right:18px;width:52px;height:52px;}
  .blob-frame{aspect-ratio:1/1;}
}

/* ==========================================================================
   ROOM HERO — two-column premium layout
   ========================================================================== */
.room-hero{
  background:var(--grad-tide);
  padding:140px 0 80px;
  position:relative;
  overflow:hidden;
}
.room-hero::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse at 60% 50%, rgba(255,107,53,.06) 0%, transparent 70%);
  pointer-events:none;
}
.room-hero-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:64px;
  align-items:center;
}
.room-hero-left .breadcrumb{color:rgba(255,252,247,.5);}
.room-hero-left .breadcrumb a{color:rgba(255,252,247,.5);}
.room-hero-left .breadcrumb b{color:var(--champagne-gold);}
.room-hero-tagline{
  color:rgba(255,252,247,.72);
  font-size:1.08rem;
  margin:16px 0 0;
  max-width:480px;
  line-height:1.7;
}
.room-hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:32px;}
.room-hero .room-stat-bar{
  background:rgba(255,255,255,.07);
  border-color:rgba(0,0,0,.12);
  margin-top:32px;
}
.room-hero .room-stat b{color:var(--pearl-white);}
.room-hero .room-stat span{color:rgba(255,252,247,.55);}
.room-hero .room-stat{border-right-color:rgba(255,255,255,.1);}
.room-hero-media{position:relative;}
.room-hero-frame{
  border-radius:28px;overflow:hidden;aspect-ratio:4/4.4;
  box-shadow:0 0 0 1px rgba(255,255,255,.14),0 30px 80px rgba(0,0,0,.5);
  position:relative;
}
.room-hero-frame::after{
  content:'';position:absolute;inset:0;border-radius:28px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);
  pointer-events:none;z-index:3;
}
.room-hero-frame .media-frame,.room-hero-frame img{width:100%;height:100%;object-fit:cover;}
@media(max-width:900px){
  .room-hero-grid{grid-template-columns:1fr;gap:40px;}
  .room-hero-media{order:-1;}
  .room-hero-frame{aspect-ratio:16/9;}
  .room-hero{padding:110px 0 60px;}
}
@media(max-width:600px){
  .room-hero{padding:100px 0 50px;}
  .room-hero-frame{aspect-ratio:4/3;}
  .room-hero-actions{flex-direction:column;}
  .room-hero-actions .btn{justify-content:center;}
}

/* ==========================================================================
   MARQUEE GALLERY — infinite horizontal photo ribbon
   ========================================================================== */
.marquee-section{padding:60px 0;overflow:hidden;background:var(--ink-navy);}
.marquee-section .eyebrow{color:var(--champagne-gold);}
.marquee-section h2{color:var(--pearl-white);}
.marquee-header{text-align:center;margin-bottom:36px;}
.marquee-container{position:relative;overflow:hidden;width:100%;}
.marquee-container::before,
.marquee-container::after{
  content:'';position:absolute;top:0;bottom:0;width:160px;z-index:2;pointer-events:none;
}
.marquee-container::before{left:0;background:linear-gradient(to right,var(--ink-navy) 0%,transparent 100%);}
.marquee-container::after{right:0;background:linear-gradient(to left,var(--ink-navy) 0%,transparent 100%);}
.marquee-track{
  display:flex;gap:20px;width:max-content;
  animation:marqueeScroll 35s linear infinite;
}
.marquee-track:hover{animation-play-state:paused;}
.marquee-slide{
  flex-shrink:0;width:340px;height:240px;border-radius:18px;overflow:hidden;
  box-shadow:0 8px 32px rgba(7,28,44,.5);
  border:1px solid rgba(255,255,255,.14);
  transition:transform .4s ease,box-shadow .4s ease;
}
.marquee-slide:hover{transform:scale(1.03) translateY(-4px);box-shadow:0 20px 50px rgba(7,28,44,.6);}
.marquee-slide .media-frame{width:100%;height:100%;}
.marquee-slide img{width:100%;height:100%;object-fit:cover;}
@keyframes marqueeScroll{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}
@media(max-width:640px){
  .marquee-slide{width:260px;height:190px;}
}

/* ==========================================================================
   ROOM DETAIL PAGE STYLES
   ========================================================================== */

/* Room hero stats bar */
.room-stat-bar{
  display:flex;flex-wrap:wrap;gap:0;
  background:var(--glass-bg);border:1px solid rgba(255,255,255,.2);
  backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));
  border-radius:20px;padding:22px 10px;margin-top:32px;
  box-shadow:0 8px 32px rgba(7,28,44,.15);
}
.room-stat{
  flex:1;min-width:100px;text-align:center;padding:8px 16px;
  border-right:1px solid rgba(7,28,44,.1);
}
.room-stat:last-child{border-right:none;}
.room-stat b{display:block;font-family:var(--font-display);font-size:1.4rem;color:var(--ink-navy);}
.room-stat span{font-family:var(--font-ui);font-size:.68rem;letter-spacing:1.2px;text-transform:uppercase;color:var(--charcoal);}

/* Amenities grid */
.amenities-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:32px;}
@media(max-width:760px){.amenities-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:480px){.amenities-grid{grid-template-columns:1fr;}}
.amenity-item{
  display:flex;align-items:center;gap:14px;
  padding:16px 18px;border-radius:14px;
  background:var(--pearl-white);border:1px solid rgba(7,28,44,.07);
  transition:border-color .3s ease,box-shadow .3s ease;
}
.amenity-item:hover{border-color:rgba(255,107,53,.3);box-shadow:var(--shadow-sm);}
.amenity-icon{
  width:40px;height:40px;flex-shrink:0;border-radius:12px;
  background:var(--grad-lagoon);color:var(--pearl-white);
  display:flex;align-items:center;justify-content:center;
}
.amenity-icon svg{width:18px;height:18px;}
.amenity-item span{font-family:var(--font-ui);font-size:.86rem;font-weight:600;color:var(--ink-navy);}

/* Room price sidebar */
.room-booking-card{
  background:var(--pearl-white);border:1px solid rgba(7,28,44,.1);border-radius:26px;
  padding:36px 32px;box-shadow:var(--shadow-md);position:sticky;top:120px;
}
.room-booking-card .price-big{font-family:var(--font-display);font-size:2.6rem;color:var(--ink-navy);line-height:1;}
.room-booking-card .price-big small{font-family:var(--font-ui);font-size:.8rem;color:var(--charcoal);font-weight:600;}
.room-booking-divider{height:1px;background:rgba(7,28,44,.08);margin:22px 0;}
.room-booking-row{display:flex;justify-content:space-between;align-items:center;font-family:var(--font-ui);font-size:.88rem;margin-bottom:12px;color:var(--charcoal);}
.room-booking-row b{color:var(--ink-navy);}

/* Room detail layout */
.room-detail-layout{display:grid;grid-template-columns:1fr 360px;gap:60px;}
@media(max-width:960px){.room-detail-layout{grid-template-columns:1fr;}}
@media(max-width:960px){.room-booking-card{position:static;}}

/* Section title with gold underline */
.section-title-gold{display:block;margin-top:12px;margin-bottom:32px;padding-bottom:14px;position:relative;}
.section-title-gold::after{content:'';display:block;width:48px;height:3px;background:var(--grad-gold);border-radius:2px;margin-top:10px;}

/* ==========================================================================
   MOBILE FIXES — comprehensive pass
   ========================================================================== */

/* Room stat bar — allow wrapping on phones */
@media(max-width:600px){
  .room-stat-bar{flex-wrap:wrap;gap:0;}
  .room-stat{min-width:50%;border-right:none;border-bottom:1px solid rgba(7,28,44,.1);padding:12px 8px;}
  .room-stat:nth-child(odd){border-right:1px solid rgba(7,28,44,.1);}
  .room-stat:last-child,.room-stat:nth-last-child(-n+2):nth-child(odd){border-bottom:none;}
  .room-hero-actions{gap:10px;}
  .room-stat b{font-size:1.1rem;}
  .room-booking-card .price-big{font-size:2rem;}
}

/* Amenities page grid stacking */
@media(max-width:600px){
  .amenity-list{flex-direction:column;}
}

/* Contact page layout */
@media(max-width:760px){
  .contact-grid{grid-template-columns:1fr !important;}
}

/* About / split sections */
@media(max-width:600px){
  .split{gap:32px;}
  .blob-frame{aspect-ratio:4/3;}
}

/* Hero min-height for mobile */
@media(max-width:600px){
  .hero{min-height:auto;}
  .hero h1{font-size:clamp(2.4rem,10vw,3.8rem);}
}

/* Marquee on mobile — slightly slower */
@media(max-width:600px){
  .marquee-track{animation-duration:50s;}
}

/* Rooms page gallery card */
@media(max-width:600px){
  .rooms-feature-grid{grid-template-columns:1fr !important;}
}

/* Nav toggle background on scrolled dark header */
@media(max-width:960px){
  .site-header:not(.is-scrolled) .nav-toggle span{background:var(--pearl-white);}
}

/* Close dropdown when menu closes */
@media(max-width:960px){
  .main-nav:not(.is-open) .nav-dropdown{display:block;}
  .main-nav:not(.is-open) .nav-dropdown-menu{display:none !important;}
}

/* ==========================================================================
   CONTACT PAGE MOBILE FIXES
   ========================================================================== */
@media(max-width:640px){
  /* Tighter page-head on small phones */
  .page-head{padding:110px 0 52px;}

  /* Split gap is very large (70px) — reduce further on phones */
  .split{gap:28px;}

  /* Form inputs: prevent horizontal overflow on iOS */
  .form-field input,
  .form-field select,
  .form-field textarea{
    width:100%;
    max-width:100%;
    box-sizing:border-box;
    font-size:16px; /* Prevents iOS auto-zoom on focus */
  }

  /* Map: cap height on phones so it doesn't take up the whole screen */
  .map-frame{min-height:220px;}
  .map-frame .media-frame{min-height:220px !important; aspect-ratio: 16/10 !important;}

  /* Contact info card — remove excess padding */
  .contact-info-card{padding:24px 18px;border-radius:18px;}

  /* Social icons — slightly larger tap targets */
  .social-row a{width:46px;height:46px;}

  /* FAQ grid — single column */
  .card-grid.grid-2{grid-template-columns:1fr;}

  /* Ensure submit button is above sticky bar */
  .form-note{margin-bottom:8px;}
}