/* Bigger, crisper media on cards
   - Thumbnails (thumb1000) shown here
   - Mild crop for a clean, uniform grid
*/
.news-card .card-img-top,
.news-card .carousel-item img {
  width: 100%;
  display: block;
  aspect-ratio: 4 / 3;          /* card thumbnail shape */
  object-fit: cover;            /* fill the box, slight crop */
  object-position: center top;  /* keep heads/text higher in frame */
  border-top-left-radius: .5rem;
  border-top-right-radius: .5rem;
}

/* (Optional) tweak aspect ratio on very small screens if you like */
@media (max-width: 576px) {
  .news-card .card-img-top,
  .news-card .carousel-item img {
    aspect-ratio: 4 / 3;        /* keep same here; change to 3/4 if you want taller */
  }
}

/* Keep indicators readable over images */
.news-card .carousel-indicators {
  margin-bottom: .25rem;
  gap: .25rem;
}
.news-card .carousel-indicators [data-bs-target] {
  width: .5rem;
  height: .5rem;
  border-radius: 50%;
}

/* Subtle hover hint that images are clickable */
.news-card .lightbox-trigger {
  position: relative;
  padding: 0;
  border: 0;
  background: transparent;
}
.news-card .lightbox-trigger::after {
  content: "";
  position: absolute;
  inset: 0;
  box-shadow: inset 0 0 0 0 rgba(255,255,255,.15);
  transition: box-shadow .2s ease;
}
.news-card .lightbox-trigger:hover::after {
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.25);
  cursor: zoom-in;
}

/* Lightbox tweaks (uses full-resolution `src`) */
#newsLightbox .modal-content { background: #000; }
#newsLightbox .modal-body { padding: 0; }
#newsLightbox .carousel,
#newsLightbox .carousel-inner { height: 100%; }

/* Let the image fill the viewport while keeping aspect ratio (no crop) */
#newsLightbox .carousel-item img {
  width: 100%;
  height: auto;
  max-height: calc(100dvh - 3.25rem); /* subtract header height */
  object-fit: contain;
  background: #000;
}

/* Optional: uncomment to hide the header and go truly edge-to-edge
#newsLightbox .modal-header { display: none; }
#newsLightbox .carousel-item img { max-height: 100dvh; }
*/

.news-hero {
  background: #0b1b2b center/cover no-repeat;
  color: #fff;
}

.news-hero .overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.55));
}