/* ================= GLOBAL ================= */
body{
  font-family:'Inter',system-ui;
  background:#f4f8ff;
  color:#111827;
}

/* ================= HERO ================= */
.gallery-hero{
  padding:110px 0 70px;
  text-align:center;
}

.journey-badge{
  background:#eaf2ff;
  color:#0d6efd;
  padding:6px 16px;
  border-radius:999px;
  font-size:12px;
  font-weight:600;
}

.gallery-hero h1{
  font-size:46px;
  font-weight:800;
  margin:18px 0 10px;
}

.gallery-hero p{
  max-width:720px;
  margin:0 auto 30px;
  color:#6b7280;
  font-size:16px;
  line-height:1.7;
}

/* ================= TABS ================= */
.gallery-tabs{
  display:flex;
  justify-content:center;
  gap:14px;
  flex-wrap:wrap;
}

.gallery-tabs button{
  border:none;
  background:#fff;
  padding:8px 20px;
  border-radius:999px;
  font-size:14px;
  font-weight:600;
  color:#374151;
  box-shadow:0 8px 20px rgba(0,0,0,.08);
  transition:.3s;
}

.gallery-tabs button.active,
.gallery-tabs button:hover{
  background:#0d6efd;
  color:#fff;
}

/* ================= GRID ================= */
.gallery-section{
  padding:40px 0 100px;
}

.gallery-card{
  position:relative;
  border-radius:22px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 20px 45px rgba(0,0,0,.15);
  transition:.4s;
  cursor:pointer;
}

.gallery-card img{
  width:100%;
  height:260px;
  object-fit:cover;
  transition:.5s;
}

.gallery-card:hover{
  transform:translateY(-8px);
}

.gallery-card:hover img{
  transform:scale(1.08);
}

/* CITY TAG */
.city-tag{
  position:absolute;
  bottom:14px;
  left:14px;
  background:rgba(0,0,0,.75);
  color:#fff;
  font-size:12px;
  font-weight:600;
  padding:6px 12px;
  border-radius:999px;
}

/* ================= LIGHTBOX ================= */
.lightbox{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.9);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:99999;
}

.lightbox img{
  max-width:90%;
  max-height:90%;
  border-radius:14px;
}

.lightbox-close{
  position:absolute;
  top:20px;
  right:30px;
  font-size:38px;
  color:#fff;
  cursor:pointer;
}

/* ================= RESPONSIVE ================= */
@media(max-width:768px){
  .gallery-hero h1{ font-size:32px; }
  .gallery-card img{ height:200px; }
}