/* ============================================================
   Room detail pages — builds on css/site.css
   ============================================================ */

.room-page main{ display:block; }

/* back link */
.back{ display:inline-flex; align-items:center; gap:8px; font-size:13px; letter-spacing:0.04em;
       text-transform:uppercase; color:var(--muted); transition:color .2s ease; }
.back:hover{ color:var(--terra); }

/* room header */
.room-head{ padding-top:clamp(28px,4vw,44px); padding-bottom:0; }
.room-head .room-title{ font-size:clamp(38px,6vw,72px); line-height:1.0; margin:18px 0 6px; }
.room-head .nick{ font-family:'Marcellus',serif; font-size:clamp(20px,2.4vw,28px); color:var(--terra); margin:0 0 14px; }
.room-head .room-sub{ font-family:'Marcellus',serif; font-size:clamp(17px,2vw,22px); color:var(--muted); margin:0 0 16px; }
.facts{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; font-size:15px; color:var(--muted); margin:0; }
.facts .star{ color:var(--terra); font-weight:600; }
.facts .sep{ color:#CBBDA4; }

/* gallery */
.gallery{ display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:1fr; gap:12px;
          margin-top:clamp(26px,4vw,38px); }
.gallery a{ display:block; position:relative; overflow:hidden; border-radius:8px;
            background:var(--sand-2); aspect-ratio:4/3; cursor:zoom-in; }
.gallery a.hero{ grid-column:span 2; grid-row:span 2; }
.gallery img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .45s ease; }
.gallery a:hover img{ transform:scale(1.045); }
.gallery .more{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
                background:rgba(38,34,28,0.46); color:#FCFAF5; font-size:18px; letter-spacing:0.04em; }
@media (max-width:720px){
  .gallery{ grid-template-columns:repeat(2,1fr); }
  .gallery a.hero{ grid-column:span 2; grid-row:auto; aspect-ratio:16/10; }
}

/* body: about + booking card */
.room-main{ display:grid; grid-template-columns:1.5fr 0.9fr; gap:clamp(36px,5vw,64px); align-items:start; }
.room-about h2{ font-size:clamp(26px,3vw,38px); line-height:1.12; margin:0 0 18px; }
.room-about p{ font-size:16px; line-height:1.75; color:var(--muted); margin:0 0 16px; }
.room-about .ig{ font-size:14px; color:var(--muted-2); }
.room-about h3{ font-size:20px; margin:30px 0 16px; }
.amenities{ list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(2,1fr); gap:13px 22px; }
.amenities li{ display:flex; gap:11px; align-items:center; font-size:15px; color:#3E382F; }
.amenities li .dot{ width:7px; height:7px; border-radius:50%; background:var(--terra); flex:none; }

/* sticky booking card */
.book-card{ position:sticky; top:96px; background:var(--sand-3); border:1px solid rgba(46,42,36,0.1);
            border-radius:14px; padding:28px; box-shadow:0 6px 30px rgba(46,42,36,0.06); }
.book-card .rate{ display:flex; align-items:baseline; gap:8px; margin:0 0 14px; }
.book-card .rate .star{ font-family:'Marcellus',serif; font-size:22px; color:var(--terra); }
.book-card .rate .small{ font-size:13px; color:var(--muted); }
.book-card .facts-list{ list-style:none; padding:0; margin:0 0 22px; display:flex; flex-direction:column; gap:0; }
.book-card .facts-list li{ display:flex; justify-content:space-between; gap:14px; padding:12px 0;
                           border-bottom:1px solid rgba(46,42,36,0.1); font-size:14px; }
.book-card .facts-list li:last-child{ border-bottom:none; }
.book-card .facts-list .k{ color:var(--muted); }
.book-card .facts-list .v{ color:var(--ink); text-align:right; }
.book-card .btn{ width:100%; justify-content:center; padding:16px 20px; }
.book-card .host{ font-size:12px; color:var(--muted-2); text-align:center; margin:14px 0 0; }
.book-card .host a{ color:var(--terra); }

/* other-rooms strip */
.more-rooms{ display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap; }
.more-rooms h2{ font-size:clamp(24px,3vw,36px); margin:0; }

@media (max-width:860px){
  .room-main{ grid-template-columns:1fr; }
  .book-card{ position:static; }
}

/* ===== lightbox ===== */
.lb{ position:fixed; inset:0; background:rgba(26,23,19,0.93); display:none;
     align-items:center; justify-content:center; z-index:100; }
.lb.open{ display:flex; }
.lb img{ max-width:92vw; max-height:86vh; border-radius:6px; box-shadow:0 16px 70px rgba(0,0,0,0.55); }
.lb button{ position:absolute; color:#FCFAF5; background:rgba(252,250,245,0.12); border:none;
            cursor:pointer; border-radius:999px; display:flex; align-items:center; justify-content:center;
            transition:background .2s ease; -webkit-tap-highlight-color:transparent; }
.lb button:hover{ background:rgba(252,250,245,0.26); }
.lb .x{ top:18px; right:20px; width:46px; height:46px; font-size:24px; }
.lb .nav{ top:50%; transform:translateY(-50%); width:54px; height:54px; font-size:28px; }
.lb .prev{ left:18px; }
.lb .next{ right:18px; }
.lb .count{ position:absolute; bottom:22px; left:50%; transform:translateX(-50%);
            color:#F1E6D2; font-size:13px; letter-spacing:0.12em; }
@media (max-width:600px){
  .lb .nav{ width:44px; height:44px; font-size:22px; }
}