/* 2026-07-10 FINAL UI/UX POLISH — high-end readable desktop + mobile */
:root{
  --vc-orange:#F47C20;
  --vc-orange-soft:#ff9a4a;
  --vc-ink:#2E1A00;
  --vc-brown:#3A1F00;
  --vc-espresso:#080403;
  --vc-coffee:#140905;
  --vc-ivory:#FFF7EC;
  --vc-sand:#F3E4CF;
  --vc-clay:#E7B08A;
  --vc-rose:#F1D2BC;
  --vc-muted:#6D5443;
  --vc-line:rgba(58,31,0,.14);
  --vc-dark-line:rgba(244,124,32,.22);
  --vc-header-h:76px;
}

html{scroll-padding-top:calc(var(--vc-header-h) + 18px);} 
[id]{scroll-margin-top:calc(var(--vc-header-h) + 26px);} 
body{background:var(--vc-espresso)!important;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;}

/* Header: fixed, calm, premium; no beige jump on scroll */
.site-header{
  height:var(--vc-header-h)!important;
  background:rgba(3,3,3,.96)!important;
  backdrop-filter:blur(16px)!important;
  -webkit-backdrop-filter:blur(16px)!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;
  box-shadow:0 10px 34px rgba(0,0,0,.28)!important;
  padding:0 clamp(16px,3vw,46px)!important;
}
.site-header.is-scrolled{background:rgba(3,3,3,.96)!important;}
.brand{display:flex!important;align-items:center!important;gap:12px!important;min-width:max-content;}
.brand img{width:58px!important;height:auto!important;object-fit:contain!important;}
.brand-wordmark strong{color:#fff!important;font-size:.92rem!important;line-height:.95!important;letter-spacing:.04em!important;text-transform:uppercase!important;}
.brand-wordmark small{color:var(--vc-orange)!important;font-size:.62rem!important;letter-spacing:.23em!important;text-transform:uppercase!important;font-weight:900!important;}
.site-nav{gap:clamp(14px,1.6vw,26px)!important;}
.site-nav a,.site-header.is-scrolled .site-nav a{color:#fff!important;font-size:.76rem!important;letter-spacing:.16em!important;opacity:.88;}
.site-nav a:hover{color:var(--vc-orange)!important;opacity:1;}
.language-switcher{display:flex!important;align-items:center!important;gap:2px!important;padding:4px!important;border:1px solid rgba(255,255,255,.18)!important;border-radius:999px!important;background:rgba(255,255,255,.06)!important;}
.lang,.site-header.is-scrolled .lang{color:#fff!important;display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:34px;border-radius:999px;font-size:.72rem!important;}
.lang.active{background:var(--vc-orange)!important;color:#000!important;}
.book-small,.site-header.is-scrolled .book-small{background:var(--vc-orange)!important;color:#000!important;border:0!important;border-radius:999px!important;padding:12px 18px!important;box-shadow:0 10px 24px rgba(244,124,32,.22)!important;}

/* Global section rhythm: less empty space, more luxury */
.section,.video-section{padding:clamp(58px,5.8vw,88px) 24px!important;}
.intro{padding-top:clamp(72px,7vw,104px)!important;padding-bottom:clamp(54px,5vw,76px)!important;}
.facade-preview{padding-top:clamp(42px,4vw,64px)!important;padding-bottom:clamp(52px,5vw,74px)!important;}
.stay-overview{padding-top:clamp(58px,5vw,78px)!important;padding-bottom:clamp(58px,5vw,82px)!important;}
.room-detail-section{padding-top:clamp(76px,6.8vw,104px)!important;padding-bottom:clamp(72px,6.2vw,96px)!important;}
.gallery{padding-top:clamp(66px,6vw,92px)!important;padding-bottom:clamp(54px,5vw,78px)!important;}
.outdoor,.indoor,.nearby,.faq-section,.reserve{padding-top:clamp(66px,6vw,92px)!important;padding-bottom:clamp(66px,6vw,92px)!important;}
.trust{padding-top:clamp(70px,6vw,96px)!important;padding-bottom:clamp(58px,5vw,82px)!important;}
.video-section{padding-top:clamp(72px,6vw,96px)!important;padding-bottom:clamp(68px,5.5vw,92px)!important;}
.container{max-width:1180px!important;}

/* Typography hierarchy: large but not overblown */
.intro-copy h2,.outdoor-copy h2,.indoor h2,.video-inner h2,.section-head h2,.nearby h2,.trust h2,.faq-section h2,.reserve h2{
  font-size:clamp(2.45rem,4.6vw,4.9rem)!important;
  line-height:.96!important;
  letter-spacing:-.048em!important;
}
.section-head{align-items:flex-end!important;margin-bottom:clamp(24px,3.2vw,40px)!important;}
.section-head p,.intro-copy p,.outdoor-copy p,.indoor p,.nearby p,.trust p,.reserve p{font-size:1.02rem!important;line-height:1.72!important;}
.eyebrow,.kicker{color:var(--vc-orange)!important;letter-spacing:.25em!important;}

/* Hero */
.hero{min-height:92svh!important;}
.hero-content{padding-top:calc(var(--vc-header-h) + 92px)!important;padding-bottom:clamp(150px,14vw,210px)!important;}
.hero h1{font-size:clamp(3.9rem,8.4vw,8.8rem)!important;max-width:820px!important;color:#fff!important;text-shadow:0 8px 34px rgba(0,0,0,.34)!important;}
.hero-sub{max-width:620px!important;color:rgba(255,255,255,.92)!important;font-weight:600!important;}
.hero-panel{bottom:26px!important;border-radius:22px!important;background:rgba(16,12,9,.70)!important;border-color:rgba(255,255,255,.18)!important;}
.fact{padding:20px 22px!important;}
.fact p{color:rgba(255,255,255,.78)!important;}

/* Intro: prevent floating images from creating dead white space */
.intro-grid,.outdoor-grid,.indoor-grid,.nearby-grid,.reserve-grid{gap:clamp(34px,5.4vw,68px)!important;}
.intro-media{min-height:clamp(380px,42vw,540px)!important;}
.media-main{height:82%!important;border-radius:30px!important;}
.media-float{height:42%!important;border-radius:22px!important;border-width:8px!important;}

/* Facade hero card */
.facade-card{
  position:relative!important;
  overflow:hidden!important;
  border-radius:34px!important;
  min-height:clamp(460px,49vw,620px)!important;
  box-shadow:0 30px 80px rgba(58,31,0,.20)!important;
  border:1px solid rgba(58,31,0,.18)!important;
}
.facade-card img{width:100%!important;height:100%!important;min-height:inherit!important;object-fit:cover!important;filter:saturate(1.02) contrast(1.02)!important;}
.facade-card::after{background:linear-gradient(90deg, rgba(7,5,4,.68) 0%, rgba(7,5,4,.42) 38%, rgba(7,5,4,.08) 75%, rgba(7,5,4,0) 100%)!important;}
.facade-copy{
  left:clamp(22px,5vw,56px)!important;
  bottom:clamp(22px,4vw,52px)!important;
  max-width:min(520px,calc(100% - 44px))!important;
  padding:clamp(24px,3.4vw,42px)!important;
  border-radius:28px!important;
  background:linear-gradient(135deg,rgba(8,6,5,.91),rgba(32,18,10,.84))!important;
  backdrop-filter:blur(14px)!important;
}
.facade-copy h2{font-size:clamp(2.1rem,4.8vw,4.8rem)!important;line-height:.95!important;color:#fff!important;}
.facade-copy p{font-size:1.02rem!important;line-height:1.65!important;color:rgba(255,255,255,.92)!important;}

/* Overview cards: calmer and readable */
.stay-row{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:16px!important;}
.stay-card{border-radius:25px!important;min-height:300px!important;border-color:rgba(58,31,0,.24)!important;box-shadow:0 20px 46px rgba(58,31,0,.16)!important;}
.stay-card img{filter:saturate(1.02) contrast(1.03)!important;}
.stay-card > div{left:16px!important;right:16px!important;bottom:16px!important;}
.stay-card span{font-size:.66rem!important;padding:7px 10px!important;}
.stay-card h3{font-size:clamp(1.34rem,1.7vw,1.72rem)!important;}
.stay-card p{font-size:.86rem!important;line-height:1.43!important;}

/* Room cards */
.room-list{gap:22px!important;margin-top:26px!important;}
.room-card{
  grid-template-columns:.78fr 1.22fr!important;
  gap:24px!important;
  padding:24px!important;
  border-radius:32px!important;
  background:linear-gradient(135deg,rgba(255,255,255,.075),rgba(255,255,255,.035))!important;
}
.room-copy{padding:10px!important;align-self:center!important;}
.room-copy h3{font-size:clamp(2.2rem,3.4vw,3.7rem)!important;}
.room-copy p{font-size:1rem!important;line-height:1.7!important;color:#EEE4DA!important;}
.room-tags{gap:8px!important;margin-top:18px!important;}
.room-tags span{font-size:.78rem!important;padding:8px 12px!important;background:rgba(255,255,255,.04)!important;}
.room-photos{grid-template-columns:1.16fr .84fr!important;grid-auto-rows:168px!important;gap:12px!important;}
.room-photos img{border-radius:20px!important;filter:saturate(1.02) contrast(1.02)!important;}
.bath-connection{
  margin-top:22px!important;
  width:max-content!important;
  background:rgba(244,124,32,.10)!important;
  border:1px solid rgba(244,124,32,.32)!important;
  border-radius:999px!important;
  padding:10px 12px!important;
  gap:8px!important;
}
.bath-connection .dot,.bath-connection .bath{width:34px!important;height:34px!important;font-size:.86rem!important;}
.bath-connection .line{width:18px!important;opacity:.7!important;}

/* Gallery: premium grid, no clipped labels */
.gallery-grid{
  display:grid!important;
  grid-template-columns:repeat(12,1fr)!important;
  grid-auto-rows:190px!important;
  gap:16px!important;
  align-items:stretch!important;
}
.gallery-item{
  display:block!important;
  grid-column:span 3!important;
  grid-row:span 1!important;
  border-radius:24px!important;
  box-shadow:0 18px 44px rgba(58,31,0,.13)!important;
  overflow:hidden!important;
}
.gallery-item:nth-child(1){grid-column:span 6!important;grid-row:span 2!important;}
.gallery-item:nth-child(3){grid-column:span 3!important;grid-row:span 1!important;}
.gallery-item img{object-fit:cover!important;}
.gallery-item span{
  position:absolute!important;
  left:14px!important;
  bottom:14px!important;
  z-index:3!important;
  max-width:calc(100% - 28px)!important;
  white-space:normal!important;
  line-height:1.15!important;
  padding:8px 12px!important;
  background:rgba(46,26,0,.86)!important;
  border:1px solid rgba(255,255,255,.12)!important;
}
.filters{gap:10px!important;}
.filter-btn{box-shadow:0 8px 22px rgba(58,31,0,.08)!important;}

/* Outdoor/indoor blocks */
.outdoor-media img{height:min(58vh,600px)!important;border-radius:34px!important;}
.moment-card{border-radius:22px!important;}
.indoor-collage{grid-auto-rows:190px!important;}
.indoor-collage img{border-radius:22px!important;}
.video-frame{border-radius:30px!important;max-width:960px!important;margin:0 auto!important;}
.nearby .tip{border-radius:24px!important;}
.trust-intro{margin-bottom:34px!important;}
.platform-grid{gap:16px!important;}
.platform-card{border-radius:28px!important;padding:26px!important;}
.trust-strip{max-width:820px!important;margin:22px auto 0!important;padding:0!important;background:transparent!important;}
.faq-grid{margin-top:24px!important;}
.reserve .form-card{border-radius:30px!important;}

/* Fix anchor content behind fixed header */
#main > section:first-child{margin-top:0!important;}

/* Mobile UX */
@media(max-width:1100px){
  .stay-row{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .stay-card:last-child{grid-column:auto!important;}
  .room-card{grid-template-columns:1fr!important;}
  .room-photos{grid-auto-rows:190px!important;}
  .gallery-grid{grid-template-columns:repeat(6,1fr)!important;grid-auto-rows:180px!important;}
  .gallery-item,.gallery-item:nth-child(1),.gallery-item:nth-child(3){grid-column:span 3!important;grid-row:span 1!important;}
  .gallery-item:nth-child(1){grid-column:span 6!important;grid-row:span 2!important;}
}
@media(max-width:860px){
  :root{--vc-header-h:68px;}
  .site-header{padding:0 16px!important;}
  .brand img{width:46px!important;}
  .brand-wordmark strong{font-size:.78rem!important;}
  .brand-wordmark small{font-size:.54rem!important;}
  .nav-toggle{display:flex!important;margin-left:auto!important;}
  .nav-toggle span{background:#fff!important;}
  .header-actions{gap:8px!important;}
  .book-small{display:none!important;}
  .language-switcher{display:none!important;}
  .site-nav{
    position:fixed!important;
    top:var(--vc-header-h)!important;
    left:12px!important;
    right:12px!important;
    margin:0!important;
    display:none!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:0!important;
    padding:12px!important;
    background:rgba(5,4,3,.98)!important;
    border:1px solid rgba(244,124,32,.22)!important;
    border-radius:22px!important;
    box-shadow:0 22px 60px rgba(0,0,0,.42)!important;
  }
  .site-nav.open{display:flex!important;}
  .site-nav a{padding:15px 14px!important;border-bottom:1px solid rgba(255,255,255,.08)!important;color:#fff!important;}
  .site-nav a:last-child{border-bottom:0!important;}
  .hero{min-height:92svh!important;}
  .hero-content{padding-left:22px!important;padding-right:22px!important;padding-top:calc(var(--vc-header-h) + 76px)!important;padding-bottom:250px!important;}
  .hero h1{font-size:clamp(3.25rem,14vw,5.2rem)!important;line-height:.90!important;}
  .hero-sub{font-size:1rem!important;line-height:1.65!important;}
  .hero-cta{gap:10px!important;}
  .btn{width:100%;padding:13px 18px!important;}
  .hero-panel{left:14px!important;right:14px!important;bottom:16px!important;grid-template-columns:1fr 1fr!important;border-radius:20px!important;}
  .fact{padding:16px!important;border-bottom:1px solid rgba(255,255,255,.13)!important;}
  .fact:nth-child(2){border-right:0!important;}
  .fact:nth-child(3),.fact:nth-child(4){border-bottom:0!important;}
  .fact span{font-size:2.1rem!important;}
  .intro-grid,.outdoor-grid,.indoor-grid,.nearby-grid,.reserve-grid{grid-template-columns:1fr!important;}
  .outdoor-grid .outdoor-media{order:2!important;}
  .outdoor-grid .outdoor-copy{order:1!important;}
  .section-head{display:block!important;}
  .filters{justify-content:flex-start!important;margin-top:22px!important;}
  .platform-grid,.faq-grid,.tips{grid-template-columns:1fr!important;}
  .intro-media{min-height:390px!important;}
  .media-main{width:100%!important;height:78%!important;}
  .media-float{width:54%!important;}
  .indoor-collage{grid-template-columns:1fr 1fr!important;grid-auto-rows:160px!important;}
  .indoor-collage img:first-child{grid-row:span 2!important;}
}
@media(max-width:620px){
  .section,.video-section{padding-left:18px!important;padding-right:18px!important;}
  .intro-copy h2,.outdoor-copy h2,.indoor h2,.video-inner h2,.section-head h2,.nearby h2,.trust h2,.faq-section h2,.reserve h2{font-size:clamp(2.3rem,12vw,3.25rem)!important;}
  .hero-panel{grid-template-columns:1fr!important;}
  .fact{border-right:0!important;border-bottom:1px solid rgba(255,255,255,.13)!important;}
  .fact:last-child{border-bottom:0!important;}
  .hero-content{padding-bottom:380px!important;}
  .facade-card{min-height:auto!important;border-radius:26px!important;background:#090605!important;}
  .facade-card img{height:330px!important;min-height:330px!important;}
  .facade-card::after{display:none!important;}
  .facade-copy{position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;max-width:none!important;margin:0!important;border-radius:0!important;border-left:0!important;border-right:0!important;border-bottom:0!important;}
  .stay-row{grid-template-columns:1fr!important;}
  .stay-card{min-height:310px!important;}
  .room-card{padding:16px!important;border-radius:26px!important;}
  .room-photos{grid-template-columns:1fr!important;grid-auto-rows:230px!important;}
  .room-photos img:first-child{grid-row:span 1!important;}
  .bath-connection{transform:scale(.95);transform-origin:left center;}
  .gallery-grid{grid-template-columns:1fr!important;grid-auto-rows:230px!important;}
  .gallery-item,.gallery-item:nth-child(1),.gallery-item:nth-child(3){grid-column:1!important;grid-row:span 1!important;}
  .gallery-item:first-child{grid-row:span 1!important;}
  .outdoor-media img{height:360px!important;border-radius:26px!important;}
  .moment-card{grid-template-columns:88px 1fr!important;padding:10px!important;}
  .moment-card img{width:88px!important;height:74px!important;}
  .field-row{grid-template-columns:1fr!important;}
  .footer-grid{gap:28px!important;}
}
.gallery-item[hidden]{display:none!important;}
