/* ============================================================
   Jungle Land redesign — Gallery page (tabs + Fancybox grid)
   ============================================================ */

.gallery-tabs-wrap { margin-top: -64px; position: relative; z-index: 2; }
.gallery-tabs { display: flex; justify-content: center; gap: 14px; flex-wrap: wrap; }
.gallery-tabs .tab-btn { text-decoration: none; }

.gallery-intro {
  background: #fff;
  border-radius: var(--r-lg);
  padding: 36px 42px;
  margin: 30px 0 0;
  box-shadow: 0 14px 34px rgba(23, 66, 31, .1);
}
.gallery-intro h2 { font-size: clamp(24px, 3.5vw, 32px); line-height: 1.15; }
.gallery-intro p { font-weight: 600; font-size: 15px; color: var(--body); line-height: 1.7; margin: 14px 0 0; }
.gallery-intro .gi-flex { display: flex; gap: 36px; align-items: center; flex-wrap: wrap; }
.gallery-intro .gi-copy { flex: 1; min-width: 300px; }
.gallery-intro .gi-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; min-width: 280px; }
.gallery-intro .gi-stat { border-radius: var(--r-sm); padding: 14px 18px; text-align: center; }
.gallery-intro .gi-stat .v { font-family: var(--font-display); font-weight: 800; font-size: 26px; color: var(--ink); }
.gallery-intro .gi-stat .s { font-weight: 700; font-size: 12px; color: var(--body); }
@media (max-width: 640px) { .gallery-intro { padding: 26px 22px; } .gallery-intro .gi-stats { min-width: 100%; } }

.room-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin: 24px 0 0; }
.room-card { border-radius: 20px; padding: 20px; border-top: 6px solid; transition: transform .2s; }
.room-card:hover { transform: translateY(-4px); }
.room-card .rc-n { font-family: var(--font-display); font-weight: 800; font-size: 20px; color: var(--ink); }
.room-card .rc-c { font-weight: 700; font-size: 12.5px; margin-top: 4px; }
.room-card .rc-s { font-weight: 600; font-size: 12.5px; color: var(--body); margin-top: 8px; }
@media (max-width: 1080px) { .room-cards { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px)  { .room-cards { grid-template-columns: 1fr; } }

.gallery-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin: 26px 0 0; }
.gallery-grid a {
  position: relative;
  display: block;
  border-radius: 18px;
  overflow: hidden;
  cursor: zoom-in;
  background: var(--sand-chip);
  transition: transform .25s, box-shadow .25s;
}
.gallery-grid a:hover { transform: translateY(-5px) scale(1.02); box-shadow: 0 16px 34px rgba(23, 66, 31, .2); z-index: 2; }
.gallery-grid img { width: 100%; height: 190px; object-fit: cover; display: block; }
@media (max-width: 1080px) { .gallery-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 800px)  { .gallery-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 420px)  { .gallery-grid { grid-template-columns: 1fr; } .gallery-grid img { height: 230px; } }

.gallery-note { text-align: center; margin: 34px 0 0; font-weight: 600; font-size: 13.5px; color: var(--moss); }

.gallery-cta {
  background: var(--ink);
  border-radius: var(--r-lg);
  padding: 36px 42px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 26px;
  flex-wrap: wrap;
}
.gallery-cta .gc-t { font-family: var(--font-display); font-weight: 800; font-size: clamp(21px, 3vw, 28px); color: var(--cream); }
.gallery-cta .gc-s { font-weight: 600; font-size: 14.5px; color: var(--on-dark-dim); margin-top: 6px; }
.gallery-cta .gc-btns { display: flex; gap: 12px; flex-wrap: wrap; }

/* Fancybox tweaks to match the design */
.fancybox__container { --fancybox-bg: rgba(8, 30, 16, .88); }