:root{
  --deep-navy:#2e4057; --warm-sand:#f5f1ea; --terracotta:#da5c3f;
  --charcoal:#212529; --sage:#5ba077;
  --radius:16px; --shadow:0 2px 6px rgba(0,0,0,.06);
  --space-1:8px; --space-2:12px; --space-3:16px; --space-4:24px;
  --fs-sm:0.9375rem; --fs-base:1rem; --fs-lg:1.125rem; --fs-xl:1.5rem; --fs-2xl:2rem;
}

/* Layout + header */
.listing { max-width:1100px; margin:0 auto; padding: var(--space-3); }
.listing h1 { font-size: var(--fs-2xl); line-height:1.15; margin:0 0 var(--space-1); }
.listing .meta { color:#6b6b6b; margin-bottom: var(--space-2); }
.listing .price { font-weight:700; font-size: var(--fs-lg); }

/* Room gallery */
.room-list { display: grid; gap: var(--space-3); margin: var(--space-4) 0; }
.room { display:grid; grid-template-columns: 1fr 1fr; gap: var(--space-3); background:#fff;
        border-radius: var(--radius); box-shadow: var(--shadow); padding: var(--space-3); }
.room__img { width:100%; height:280px; object-fit:cover; border-radius: var(--radius); }
.room__title { color: var(--deep-navy); font-size: var(--fs-xl); margin:0 0 var(--space-2); }
.room__table { width:100%; border-collapse:collapse; font-size: var(--fs-sm); }
.room__table th { text-align:left; color: var(--deep-navy); padding:6px 8px; width:40%; }
.room__table td { padding:6px 8px; }

@media (max-width:900px){
  .room { grid-template-columns: 1fr; }
  .room__img { height:220px; }
}

.lb-no-scroll, .lb-no-scroll body { overflow: hidden; }
.lb-modal { position: fixed; inset: 0; display: none; z-index: 9999; }
.lb-modal.is-open { display: block; }
.lb-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.7); }
.lb-inner { position: absolute; inset: 3% 3%; background: #000; border-radius: 12px; display: grid; place-items: center; }
.lb-img   { max-width: 96vw; max-height: 86vh; }
.lb-caption { color:#fff; margin-top: 10px; text-align:center; padding: 0 12px; font-size: 0.95rem; opacity: .95; }
.lb-close, .lb-nav {
  position: absolute; border: 0; background: rgba(255,255,255,.9); color:#111; width:40px; height:40px;
  border-radius: 999px; cursor: pointer; font-size: 22px;
}
.lb-close { top: 10px; right: 14px; }
.lb-prev { left: 14px; top: 50%; transform: translateY(-50%); }
.lb-next { right: 14px; top: 50%; transform: translateY(-50%); }
.lb-counter { position:absolute; bottom:12px; right:16px; color:#fff; opacity:.8; font-size:0.9rem; }