/* ═══════════════════════════════════════════════════════════
   LVGI Photo Alignment — exact slot ratios + object-fit cover
   Loaded after ux-fixes.css
   ═══════════════════════════════════════════════════════════ */

/* Every image fills its slot without distortion */
.hero-gwh-img,
.page-hero-img,
.page-hero-banner img,
.overview-image-real,
.leadership-img,
.leadership-photo img,
.news-card-img,
.blog-card-img,
.news-card-image img,
.blog-card-image img,
.program-img img,
.facility-img,
.facility-img-wrap img,
.activity-img,
.activity-img-wrap img,
.sport-img,
.sport-img-wrap img,
.image-card-img,
.facilities-showcase-img,
.facilities-showcase-media img,
.trust-img,
.gallery-img,
.gallery-item img,
.campus-collage-img,
.campus-collage-item img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center 35% !important;
  display: block !important;
}

/* Hero — 16:9 full-bleed */
.hero-gwh-media {
  overflow: hidden;
}
.hero-gwh-img {
  object-position: center 40% !important;
}

/* Page hero banner — 3:1 strip */
.page-hero-banner {
  aspect-ratio: 3 / 1 !important;
  max-height: none !important;
  overflow: hidden;
}
.page-hero-banner img,
.page-hero-img {
  height: 100% !important;
  max-height: none !important;
  object-position: center 30% !important;
}

/* Overview — 4:3 */
.overview-image-wrap {
  aspect-ratio: 4 / 3 !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: hidden;
}
.overview-image-wrap .overview-image-real {
  min-height: 0 !important;
  max-height: none !important;
}

/* Leadership — 3:4 portrait */
.leadership-photo {
  aspect-ratio: 3 / 4 !important;
  max-height: none !important;
  overflow: hidden;
}
.leadership-photo img,
.leadership-img {
  min-height: 0 !important;
  max-height: none !important;
  object-position: center 20% !important;
}

/* News / blog cards — 16:10 */
.news-card-image,
.blog-card-image {
  aspect-ratio: 16 / 10 !important;
  max-height: none !important;
  overflow: hidden !important;
}
.news-card-image img,
.blog-card-image img,
.news-card-img,
.blog-card-img {
  max-height: none !important;
}

/* Program cards — 16:9 */
.program-card-v2 .program-img {
  aspect-ratio: 16 / 9 !important;
  max-height: none !important;
  overflow: hidden;
}

/* Showcase — 16:9 */
.facilities-showcase-media {
  aspect-ratio: 16 / 9 !important;
  height: auto !important;
  overflow: hidden;
}
.facilities-showcase-media img,
.facilities-showcase-img {
  min-height: 0 !important;
}

/* Square tiles — trust, facilities, activities, sports */
.trust-item-img,
.facility-card-v2 .facility-img-wrap,
.activity-card-v2 .activity-img-wrap,
.sport-card-v2 .sport-img-wrap,
.image-card-media {
  aspect-ratio: 1 / 1 !important;
  max-height: none !important;
  overflow: hidden;
}

/* Gallery — uniform 4:3 grid (not uneven masonry columns) */
.gallery-masonry {
  columns: unset !important;
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 1rem !important;
}

.gallery-item {
  break-inside: unset !important;
  margin-bottom: 0 !important;
  aspect-ratio: 4 / 3 !important;
  overflow: hidden;
  border-radius: 12px;
}

.gallery-item img,
.gallery-img {
  transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}

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

.gallery-item[hidden] {
  display: none !important;
}

/* Gallery filter pills */
.gallery-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  justify-content: center;
  margin: 0 0 1.75rem;
}

.gallery-filter-btn {
  padding: 0.55rem 1.1rem;
  border-radius: 999px;
  border: 1px solid rgba(74, 127, 167, 0.45);
  background: rgba(255, 255, 255, 0.65);
  color: #1A3D63;
  font-weight: 600;
  font-size: 0.85rem;
  cursor: pointer;
  transition: background 0.25s, color 0.25s, border-color 0.25s;
}

.gallery-filter-btn:hover,
.gallery-filter-btn.active {
  background: linear-gradient(135deg, #1A3D63, #4A7FA7);
  color: #fff;
  border-color: transparent;
}

@media (max-width: 1100px) {
  .gallery-masonry { grid-template-columns: repeat(3, 1fr) !important; }
}

@media (max-width: 768px) {
  .gallery-masonry { grid-template-columns: repeat(2, 1fr) !important; }
  .page-hero-banner { aspect-ratio: 16 / 9 !important; }
  .facilities-showcase-media { height: auto !important; }
}

@media (max-width: 480px) {
  .gallery-masonry { grid-template-columns: 1fr !important; }
}

/* Homepage card alignment */
.why-grid.why-grid-3 {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 1.25rem !important;
  align-items: stretch !important;
}

.why-grid.why-grid-3 .why-card {
  height: 100% !important;
}

.programs-grid-compact {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: stretch !important;
  gap: 1.25rem !important;
}

.programs-grid-compact .program-card-compact {
  flex: 1 1 240px !important;
  max-width: 340px !important;
  min-height: 190px;
  display: flex !important;
  flex-direction: column;
  text-align: center;
}

.programs-grid-compact .program-card-link {
  margin-top: auto;
}

/* Photo collage replacing the empty virtual-tour placeholder */
.campus-collage {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-auto-rows: 180px;
  gap: 1rem;
}

.campus-collage-item {
  grid-column: span 4;
  overflow: hidden;
  border-radius: 16px;
}

.campus-collage-item:nth-child(1),
.campus-collage-item:nth-child(5) {
  grid-column: span 8;
}

.campus-collage-item img {
  transition: transform 0.45s ease;
}

.campus-collage-item:hover img {
  transform: scale(1.04);
}

/* Inner-page and contact hero alignment */
.page-hero-content {
  width: min(920px, 100%);
  margin-inline: auto;
  text-align: center;
}

.page-hero-contact .page-hero-banner {
  aspect-ratio: 14 / 5 !important;
}

.page-hero-contact .page-hero-img {
  object-position: center 42% !important;
}

.leadership-photo-inline {
  width: min(280px, 100%);
  margin: 0 auto 1.25rem;
  border-radius: 14px;
}

@media (max-width: 900px) {
  .why-grid.why-grid-3 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .campus-collage {
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 170px;
  }

  .campus-collage-item,
  .campus-collage-item:nth-child(1),
  .campus-collage-item:nth-child(5) {
    grid-column: span 1;
  }
}

@media (max-width: 600px) {
  .why-grid.why-grid-3 {
    grid-template-columns: 1fr !important;
  }

  .programs-grid-compact .program-card-compact {
    flex-basis: 100% !important;
    max-width: none !important;
    min-height: 0;
  }

  .campus-collage {
    grid-template-columns: 1fr;
    grid-auto-rows: 220px;
  }

  .page-hero-contact .page-hero-banner {
    aspect-ratio: 16 / 10 !important;
  }
}
