.gallery-banner{
  width:100%;
  min-height:260px;

  background:url('../img/blue-bg.jpg') center center/cover no-repeat;

  display:flex;
  align-items:center;
  justify-content:center;

  text-align:center;
  position:relative;
  overflow:hidden;
}

/* Dark Overlay */
.gallery-banner::before{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.35);
}

.gallery-banner-overlay{
  position:relative;
  z-index:2;
  color:#fff;
  padding:20px;
}

.gallery-banner h1{
  font-size:48px;
  font-weight:700;
  margin-bottom:10px;
  line-height:1.2;
}

.gallery-banner p{
  font-size:16px;
  font-weight:500;
  letter-spacing:.5px;
}

/* GALLERY */
.gallery-section{
  width:100%;
  background:#fff;
  padding:70px 15px;
  font-family:Arial, Helvetica, sans-serif;
}

.gallery-container{
  max-width:1120px;
  margin:0 auto;
}

.gallery-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}

.gallery-item{
  height:260px;
  overflow:hidden;
  border-radius:6px;
  cursor:pointer;
  box-shadow:0 8px 25px rgba(0,0,0,.12);
}

.gallery-item img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:.4s;
}

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

/* LIGHTBOX */
.gallery-lightbox{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.85);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:9999;
  padding:20px;
}

.gallery-lightbox.active{
  display:flex;
}

.gallery-lightbox img{
  max-width:90%;
  max-height:85vh;
  border-radius:6px;
}

.lightbox-close{
  position:absolute;
  top:22px;
  right:35px;
  color:#fff;
  font-size:42px;
  cursor:pointer;
}

/* RESPONSIVE */
@media(max-width:991px){
  .gallery-grid{
    grid-template-columns:repeat(2,1fr);
  }
}

@media(max-width:575px){
  .gallery-banner{
    height:210px;
  }

  .gallery-banner h1{
    font-size:32px;
  }

  .gallery-banner p{
    font-size:17px;
  }

  .gallery-grid{
    grid-template-columns:1fr;
  }

  .gallery-item{
    height:230px;
  }
}