/* ==========================================================================
   CAMPUS GALLERY & LIGHTBOX
   ========================================================================== */
.gallery-filter-bar {
  display: flex;
  justify-content: center;
  gap: 0.75rem;
  margin-bottom: 2.5rem;
  flex-wrap: wrap;
}

.gallery-filter-btn {
  padding: 0.5rem 1.25rem;
  border-radius: var(--radius-pill);
  border: 1px solid var(--color-border);
  background: #FFFFFF;
  font-weight: 400;
  font-size: 0.85rem;
  cursor: pointer;
  transition: var(--transition);
}

.gallery-filter-btn:hover, .gallery-filter-btn.active {
  background-color: var(--color-primary);
  color: #FFFFFF;
  border-color: var(--color-primary);
}

.gallery-masonry-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1.5rem;
}

.gallery-item-card {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  height: 240px;
  cursor: pointer;
  border: 1px solid var(--color-border);
}

.gallery-item-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

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

.gallery-caption-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 40%, rgba(18, 24, 36, 0.85) 100%);
  display: flex;
  align-items: flex-end;
  padding: 1.25rem;
  color: #FFFFFF;
  font-weight: 400;
  font-size: 0.9rem;
  opacity: 0;
  transition: var(--transition);
}

.gallery-item-card:hover .gallery-caption-overlay {
  opacity: 1;
}



/* Ensure picture wrappers fill image containers without layout shifts */
.hero-banner-box picture,
.tri-photo-inner picture,
.philosophy-image-frame picture,
.track-hero-card picture,
.why-image-card picture,
.educator-card picture,
.gallery-item-card picture {
  display: block;
  width: 100%;
  height: 100%;
}

/* Focal point refinements for real RGR photography across desktop & mobile ratios */
img[src*="rgr-teaching-faculty-alt"] {
  object-position: 35% center;
}
img[src*="rgr-doubt-clearing"] {
  object-position: 42% center;
}
img[src*="rgr-guidance-counselling"] {
  object-position: 60% center;
}
img[src*="rgr-results-wall"] {
  object-position: 38% center;
}

/* Approved RGR Hero Cover responsive positioning & minimal readability scrim */
.hero-bg-media {
  object-fit: cover;
  object-position: center 58%;
}
.hero-scrim-overlay {
  background: linear-gradient(180deg, rgba(18, 24, 36, 0.16) 0%, rgba(18, 24, 36, 0.34) 55%, rgba(18, 24, 36, 0.24) 100%);
}
@media (max-width: 1024px) {
  .hero-bg-media {
    object-position: 45% 60%;
  }
}
@media (max-width: 768px) {
  .hero-bg-media {
    object-position: 38% 62%;
  }
}