/* ============================
   FIXED PHOTOSWIPE GALLERY LAYOUT
   ============================ */


/* Turn the gallery into a flexbox grid */
.photoswipe-gallery {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px;
  margin: 20px 0;
  position: relative;
}
.photoswipe-gallery::before {
  content: "More images";
  width: 100%;
  font-size: 22px;
  font-weight: 300;
  margin-bottom: 10px;
  color: #1377b8;
}


/* Each anchor becomes a grid item */
.photoswipe-gallery a.photoswipe {
  display: block;
  flex: 1 1 220px;        /* makes items wrap horizontally */
  max-width: 31%;         /* 3 per row on desktop */
  box-sizing: border-box;
  border-radius: 6px;
  overflow: hidden;
}

/* Images inside */
.photoswipe-gallery a.photoswipe img {
  width: 100%;
  height: 180px;
  object-fit: cover;
  border-radius: 6px;
  transition: transform .2s ease, opacity .2s ease;
}

/* Hover effect */
.photoswipe-gallery a.photoswipe img:hover {
  transform: scale(1.05);
  opacity: 0.9;
}

/* === Responsive breakpoints === */
@media (max-width: 1024px) {
  .photoswipe-gallery a.photoswipe {
    max-width: 48%;   /* 2 per row */
  }
}

@media (max-width: 600px) {
  .photoswipe-gallery a.photoswipe {
    max-width: 100%;  /* 1 per row */
  }
}

/* Sidebar box styling */
.article-sidebar {
  background: #f7f7f7;
  padding: 16px;
  border-radius: 6px;
  margin-bottom: 24px;
}

@media (min-width: 1024px) {
  .article-sidebar {
    float: right;
    width: 30%;
  }
  .main-content {
    width: 65%;
    float: left;
  }
}

@media (max-width: 1023px) {
  .article-sidebar,
  .main-content {
    width: 100%;
    float: none;
  }
}