.gallery {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   /* default 4 */
   gap: 15px;
 }

 /* Tablet (≤ 992px) → 2 per row */
 @media (max-width: 992px) {
   .gallery {
     grid-template-columns: repeat(2, 1fr);
   }
 }

 /* Mobile (≤ 576px) → 1 per row */
 @media (max-width: 576px) {
   .gallery {
     grid-template-columns: 1fr;
   }
 }

 .gallery img {
   width: 100%;
   height: 200px;
   object-fit: cover;
   border-radius: 10px;
   cursor: pointer;
   transition: transform 0.3s;
 }

 .gallery img:hover {
   transform: scale(1.05);
 }

 /* Lightbox */
 .lightbox {
   display: none;
   position: fixed;
   z-index: 10000;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background: rgba(0, 0, 0, 0.9);
   justify-content: center;
   align-items: center;
   flex-direction: column;
 }

 .lightbox img {
   max-width: 90%;
   max-height: 80%;
   border-radius: 10px;
   box-shadow: 0 2px 10px rgba(255, 255, 255, 0.3);
 }

 .close,
 .prev,
 .next {
   position: absolute;
   color: white;
   font-size: 40px;
   font-weight: bold;
   cursor: pointer;
   user-select: none;
 }

 .close {
   top: 20px;
   right: 30px;
 }

 .prev {
   top: 50%;
   left: 30px;
   transform: translateY(-50%);
 }

 .next {
   top: 50%;
   right: 30px;
   transform: translateY(-50%);
 }

 .ga-box {
   margin: 20px;
 }