/* Luander Hotel — Editorial Luxury refresh
   Keeps all existing booking/JS hooks intact; visual layer only. */

:root{
  --lux-ink:#171813;
  --lux-muted:#6e7068;
  --lux-olive:#7f8868;
  --lux-olive-dark:#626b50;
  --lux-sage:#e8ebdf;
  --lux-ivory:#fbfaf6;
  --lux-cream:#f3f0e8;
  --lux-line:#dcd8cd;
  --lux-white:#fff;
  --lux-serif:Georgia,"Times New Roman",serif;
}

html{background:var(--lux-ivory)}
body{
  background:var(--lux-ivory);
  color:var(--lux-ink);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.container{max-width:1240px}
.section{padding:108px 0}
.section--soft{background:var(--lux-cream)}
.eyebrow{
  color:var(--lux-olive-dark)!important;
  font-size:.67rem!important;
  letter-spacing:.28em!important;
  text-transform:uppercase;
  font-weight:800!important;
}
h1,h2,h3{color:var(--lux-ink)}
.section-heading h2,
.intro h2,
.booking-shell__intro h2,
.faq-intro h2,
.final-cta__box h2{
  font-family:var(--lux-serif);
  font-weight:400;
  letter-spacing:-.045em;
}
.section-heading h2{font-size:clamp(2.6rem,5vw,5.2rem);line-height:.96}
.text-link{
  color:var(--lux-ink)!important;
  font-weight:600!important;
  border-bottom:1px solid var(--lux-ink);
  padding-bottom:5px;
}

/* top bar + editorial header */
.topbar{
  background:var(--lux-ivory);
  color:#777970;
  border-bottom:1px solid rgba(220,216,205,.65);
  font-size:.7rem;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.topbar a{color:var(--lux-ink)}
.topbar__inner{min-height:32px}
.header{
  background:rgba(251,250,246,.94);
  border-bottom:1px solid var(--lux-line);
  backdrop-filter:blur(18px);
}
.header__inner{min-height:86px}
.brand--textonly .brand__text strong{
  font-family:var(--lux-serif);
  font-size:1.46rem;
  font-weight:500;
  letter-spacing:.13em;
  color:var(--lux-ink);
  text-shadow:none;
}
.brand--textonly .brand__text small{
  margin-top:6px;
  color:var(--lux-olive-dark);
  font-size:.61rem;
  letter-spacing:.44em;
}
.nav{gap:30px}
.nav a{
  color:#3f413b;
  font-family:var(--lux-serif);
  font-size:.96rem;
}
.nav a:hover{color:var(--lux-olive-dark)}
.language-switch{
  border:0;
  border-radius:0;
  background:transparent;
  gap:1px;
  padding:0;
}
.language-switch button{
  min-width:31px;
  min-height:34px;
  border-radius:0;
  font-size:.67rem;
  color:#777970;
}
.language-switch button.is-active{
  color:var(--lux-olive-dark);
  background:transparent;
  box-shadow:inset 0 -1px 0 var(--lux-olive-dark);
}
.header__cta{
  min-height:44px!important;
  padding:0 18px!important;
  border-radius:0!important;
  background:var(--lux-olive)!important;
  color:#fff!important;
  box-shadow:none!important;
  font-family:var(--lux-serif);
  font-weight:500!important;
}

/* editorial hero */
.luxury-hero{
  min-height:0!important;
  padding:64px 0 54px;
  background:var(--lux-ivory);
  color:var(--lux-ink);
}
.luxury-hero .luxury-hero__shell{position:relative}
.luxury-hero__top{
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(300px,.75fr);
  gap:72px;
  align-items:end;
  margin-bottom:42px;
}
.luxury-hero .hero__copy{
  max-width:820px;
  padding-left:0;
  color:var(--lux-ink);
}
.luxury-hero .hero__copy .eyebrow{margin-bottom:22px}
.luxury-hero h1{
  margin:0;
  font-family:var(--lux-serif);
  font-weight:400;
  font-size:clamp(4.2rem,7vw,7.5rem);
  line-height:.91;
  letter-spacing:-.06em;
  color:var(--lux-ink);
  text-shadow:none;
}
.luxury-hero__intro{
  padding:0 0 8px 34px;
  border-left:1px solid var(--lux-line);
}
.luxury-hero__intro p{
  margin:0 0 24px;
  color:#6b6d65;
  font-size:1rem;
  line-height:1.65;
}
.luxury-hero .hero__actions{
  display:flex;
  flex-wrap:wrap;
  gap:22px;
  margin-top:0;
}
.luxury-hero .hero__actions .button{
  width:auto;
  min-height:auto;
  padding:0 0 7px;
  border:0;
  border-bottom:1px solid var(--lux-ink);
  border-radius:0;
  background:transparent!important;
  box-shadow:none!important;
  color:var(--lux-ink)!important;
  font-family:var(--lux-serif);
  font-size:.96rem;
  font-weight:500;
}
.luxury-hero__visual{
  display:grid;
  grid-template-columns:minmax(0,1fr) 260px;
  gap:34px;
  align-items:stretch;
}
.luxury-hero .hero__media{
  position:relative!important;
  inset:auto!important;
  height:570px;
  overflow:hidden;
  background:#e6e3da;
}
.luxury-hero .hero__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 42%;
  filter:none;
}
.luxury-hero .hero__shade{display:none}
.luxury-hero .hero-contact{
  margin:0;
  padding:8px 0 0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  color:var(--lux-ink);
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
}
.luxury-hero .hero-contact__eyebrow{
  color:var(--lux-olive-dark);
  font-size:.62rem;
  letter-spacing:.25em;
}
.luxury-hero .hero-contact h2{
  margin:12px 0 4px;
  font:400 1.8rem/1 var(--lux-serif);
}
.luxury-hero .hero-contact>p{
  color:var(--lux-muted);
  font-size:.78rem;
  margin-bottom:26px;
}
.luxury-hero .hero-contact__actions{
  border-top:1px solid var(--lux-line);
}
.luxury-hero .hero-contact__link{
  min-height:70px;
  padding:15px 0;
  border:0;
  border-bottom:1px solid var(--lux-line);
  border-radius:0;
  background:transparent;
  display:grid;
  grid-template-columns:40px 1fr auto;
  gap:10px;
  align-items:center;
  color:var(--lux-ink);
}
.luxury-hero .hero-contact__link>span{
  width:auto;height:auto;border:0;background:transparent;color:var(--lux-olive-dark);
  font-family:var(--lux-serif);font-size:.85rem;
}
.luxury-hero .hero-contact__link:hover{background:transparent}
.luxury-hero .hero-contact__link::after{content:"→";color:#8b8d84}
.luxury-hero .hero-contact__link strong{
  font-family:var(--lux-serif);
  font-size:.98rem;
  font-weight:500;
}
.luxury-hero .hero__meta{
  margin:24px 0 0;
  padding-top:16px;
  border-top:1px solid var(--lux-line);
  display:flex;
  gap:26px;
}
.luxury-hero .hero__meta span{
  color:#6e7068;
  border:0;
  background:transparent;
  padding:0;
  font-size:.7rem;
  letter-spacing:.04em;
}

/* facts */
.quick-facts{
  margin:0;
  background:var(--lux-ivory);
  border-top:1px solid var(--lux-line);
  border-bottom:1px solid var(--lux-line);
}
.quick-facts__grid{
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.quick-facts article{padding:28px 22px;min-height:112px}
.fact-icon{
  border:1px solid var(--lux-line)!important;
  background:transparent!important;
  color:var(--lux-olive-dark)!important;
}
.quick-facts strong{font-family:var(--lux-serif);font-size:1.02rem;font-weight:500}
.quick-facts small{color:#83857d}

/* intro */
.intro{background:var(--lux-ivory)}
.intro__grid{grid-template-columns:1.08fr .92fr;gap:110px}
.intro h2{font-size:clamp(3rem,5.2vw,5.5rem);line-height:.95}
.intro__copy{padding-top:34px}
.intro__copy>p{color:#6b6d65;font-size:1.03rem;line-height:1.8}

/* gallery */
.gallery-section{background:#efede6}
.gallery-pro{gap:12px}
.gallery-pro figure{
  border-radius:0!important;
  box-shadow:none!important;
  background:#ddd8cd;
}
.gallery-pro img{transition:transform .7s ease}
.gallery-pro figure:hover img{transform:scale(1.025)}
.gallery-pro figcaption{
  left:0!important;right:auto!important;bottom:0!important;
  padding:10px 13px!important;border-radius:0!important;
  background:rgba(251,250,246,.94)!important;color:var(--lux-ink)!important;
  font-family:var(--lux-serif);font-size:.88rem!important;font-weight:500!important;
}

/* room editorial cards */
.rooms-section{background:var(--lux-ivory)}
.room-price-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:20px;
}
.price-card{
  min-height:0!important;
  padding:0 0 18px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:hidden;
}
.price-card::before{display:none!important}
.price-card__image{
  width:100%;
  aspect-ratio:1.28/1;
  margin:0 0 18px;
  overflow:hidden;
  background:#e7e3da;
}
.price-card__image img{width:100%;height:100%;object-fit:cover;transition:transform .65s ease}
.price-card:hover .price-card__image img{transform:scale(1.03)}
.price-card__type{
  display:block;
  margin-bottom:8px;
  color:var(--lux-ink)!important;
  font:400 1.32rem/1.08 var(--lux-serif)!important;
  letter-spacing:-.02em!important;
  text-transform:none!important;
}
.price-card h3{
  margin:0 0 8px!important;
  color:var(--lux-ink)!important;
  font:400 1rem/1.2 var(--lux-serif)!important;
}
.price-card h3 small{
  color:#888a82!important;
  font-family:Inter,ui-sans-serif,system-ui,sans-serif!important;
  font-size:.62rem!important;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.price-card>p{color:#8a8c84!important;font-size:.69rem!important;text-transform:uppercase;letter-spacing:.11em}
.price-card__action{
  width:100%;
  margin-top:12px;
  padding:11px 0 8px!important;
  border:0!important;
  border-top:1px solid var(--lux-line)!important;
  border-bottom:1px solid var(--lux-line)!important;
  border-radius:0!important;
  background:transparent!important;
  color:var(--lux-ink)!important;
  text-align:left!important;
  font-family:var(--lux-serif)!important;
  font-weight:500!important;
}
.price-card__action::after{content:" →";float:right}
.payment-methods{
  margin-top:34px;
  border:1px solid var(--lux-line);
  border-radius:0;
  background:transparent;
}
.payment-methods__icon{background:var(--lux-sage);color:var(--lux-olive-dark)}
.payment-methods__badges>span{border-color:var(--lux-line);border-radius:0;background:#fff}

/* booking */
.booking-section{background:#efede6}
.booking-shell{grid-template-columns:330px minmax(0,1fr);gap:64px}
.booking-shell__intro{top:116px}
.booking-shell__intro h2{font-size:clamp(2.9rem,4.6vw,4.9rem);line-height:.96}
.booking-shell__intro>p:last-child{color:#6d6f67;line-height:1.7}
.request-switch{
  gap:0;
  padding:0;
  border:1px solid var(--lux-line);
  border-radius:0;
  background:#f8f6f0;
}
.request-switch__option{
  border-radius:0!important;
  border:0!important;
  background:transparent!important;
}
.request-switch__option+ .request-switch__option{border-left:1px solid var(--lux-line)!important}
.request-switch__option.is-active{
  background:var(--lux-olive)!important;
  color:#fff!important;
}
.request-switch__option.is-active small,.request-switch__option.is-active strong{color:#fff!important}
.request-switch__icon,.form-mode__mark{
  border:1px solid var(--lux-line)!important;
  border-radius:50%!important;
  background:transparent!important;
  color:inherit!important;
}
.booking-trust__item,.booking-trust__review{
  border-color:var(--lux-line);
  border-radius:0;
  background:#f8f6f0;
}
.booking-form{
  border:1px solid var(--lux-line)!important;
  border-radius:0!important;
  background:#fff!important;
  box-shadow:none!important;
  padding:28px!important;
}
.form-mode{
  border:0!important;
  border-bottom:1px solid var(--lux-line)!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  padding:0 0 18px!important;
}
.form-title h3{font:400 2rem/1 var(--lux-serif)!important}
.form-badge{border-radius:0!important;background:var(--lux-sage)!important;color:var(--lux-olive-dark)!important}
.field>span{color:#666860!important;font-size:.68rem!important;letter-spacing:.04em}
.field input,.field select,.field textarea{
  border:0!important;
  border-bottom:1px solid #cfcbbf!important;
  border-radius:0!important;
  background:#fff!important;
  box-shadow:none!important;
  padding-inline:0!important;
}
.field input:focus,.field select:focus,.field textarea:focus{
  border-color:var(--lux-olive-dark)!important;
}
.stay-length,.turnstile-wrap,.room-mix{
  border-color:var(--lux-line)!important;
  border-radius:0!important;
  background:#f8f6f0!important;
}
.room-picker{border-radius:0!important}
.send-actions .button{
  border-radius:0!important;
  box-shadow:none!important;
}
.send-actions .button--primary{background:var(--lux-olive)!important}
.send-actions .button--outline{border-color:var(--lux-line)!important}

/* arrival/location/faq */
.arrival-essential{background:var(--lux-ivory)}
.arrival-essential__grid article{
  border:0;
  border-top:1px solid var(--lux-line);
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.arrival-essential__grid article>span{background:var(--lux-sage);color:var(--lux-olive-dark)}
.location-section{background:#efede6}
.route-card,.travel-card{
  border-color:var(--lux-line)!important;
  border-radius:0!important;
  box-shadow:none!important;
}
.route-card{background:#f8f6f0!important}
.route-card>span{background:transparent!important;color:var(--lux-olive-dark)!important;border:1px solid var(--lux-line)}
.faq-section{background:var(--lux-ivory)}
.faq-list details{
  border:0;
  border-top:1px solid var(--lux-line);
  border-radius:0;
  box-shadow:none;
  background:transparent;
}
.faq-list details:last-child{border-bottom:1px solid var(--lux-line)}
.faq-list summary{font-family:var(--lux-serif);font-weight:500;font-size:1.06rem}
.faq-list summary::after{background:transparent;color:var(--lux-olive-dark)}

/* final CTA/footer */
.final-cta{background:var(--lux-ivory)}
.final-cta__box{
  padding:58px;
  border-radius:0;
  background:var(--lux-olive-dark);
}
.final-cta__box h2{font-size:clamp(2.5rem,4vw,4.4rem)}
.final-cta__actions .button{border-radius:0}
.footer{
  background:#20231d;
  color:#c8cabf;
}
.brand--footer.brand--textonly .brand__text strong{font-family:var(--lux-serif);font-weight:500}
.floating-wa{
  border-radius:0;
  background:var(--lux-olive-dark);
  box-shadow:0 14px 35px rgba(32,35,29,.18);
}

/* desktop decorative marks inspired by editorial property layouts */
.luxury-hero::before,
.luxury-hero::after{
  content:"";
  position:absolute;
  pointer-events:none;
}
.luxury-hero{position:relative;overflow:hidden}
.luxury-hero::before{
  left:34px;top:185px;width:1px;height:320px;background:#a7aa9e;
}
.luxury-hero::after{
  right:28px;top:52px;width:34px;height:118px;
  background:repeating-linear-gradient(90deg,#9fa298 0 1px,transparent 1px 8px);
  opacity:.7;
}

/* responsive */
@media(max-width:1100px){
  .luxury-hero__top{grid-template-columns:1fr .65fr;gap:42px}
  .luxury-hero__visual{grid-template-columns:1fr 220px}
  .room-price-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .booking-shell{grid-template-columns:270px 1fr;gap:38px}
}
@media(max-width:860px){
  .section{padding:82px 0}
  .luxury-hero{padding-top:42px}
  .luxury-hero::before,.luxury-hero::after{display:none}
  .luxury-hero__top{grid-template-columns:1fr;gap:28px}
  .luxury-hero__intro{padding:0;border:0;max-width:620px}
  .luxury-hero__visual{grid-template-columns:1fr}
  .luxury-hero .hero__media{height:480px}
  .luxury-hero .hero-contact{display:block!important;padding-top:4px}
  .luxury-hero .hero-contact__actions{display:grid;grid-template-columns:repeat(3,1fr)}
  .luxury-hero .hero-contact__link{grid-template-columns:1fr;min-height:72px}
  .luxury-hero .hero-contact__link::after{display:none}
  .luxury-hero .hero-contact h2,.luxury-hero .hero-contact>p,.luxury-hero .hero-contact__eyebrow{display:none}
  .intro__grid{grid-template-columns:1fr;gap:34px}
  .intro__copy{padding-top:0}
  .booking-shell{grid-template-columns:1fr}
  .booking-shell__intro{position:static}
}
@media(max-width:620px){
  .topbar{display:none}
  .header__inner{min-height:68px}
  .brand--textonly .brand__text strong{font-size:1.04rem;letter-spacing:.09em}
  .brand--textonly .brand__text small{display:block;font-size:.5rem;letter-spacing:.35em}
  .luxury-hero{padding:34px 0 34px}
  .luxury-hero h1{font-size:clamp(3.25rem,15vw,5rem);line-height:.92}
  .luxury-hero__top{margin-bottom:28px}
  .luxury-hero .hero__media{height:360px}
  .luxury-hero .hero-contact__actions{grid-template-columns:1fr}
  .luxury-hero .hero-contact__link{
    grid-template-columns:38px 1fr auto;
    min-height:58px;
    padding:11px 0;
  }
  .luxury-hero .hero-contact__link::after{display:block}
  .luxury-hero .hero__meta{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px}
  .room-price-grid{grid-template-columns:1fr}
  .price-card__image{aspect-ratio:1.45/1}
  .booking-form{padding:18px!important}
  .final-cta__box{padding:34px 22px}
}


/* mobile editorial menu */
@media(max-width:860px){
  .nav{
    top:68px;
    border:1px solid var(--lux-line);
    border-radius:0;
    background:rgba(251,250,246,.98);
    box-shadow:0 18px 50px rgba(32,35,29,.08);
  }
  .nav a{font-family:var(--lux-serif);font-size:1.08rem;padding:11px 5px}
}
