/**
 * Ottimizzazioni per immagini responsive
 * Riduce il peso delle immagini utilizzando le dimensioni appropriate
 */

/* Ottimizzazioni per card immagini */
.card-img-top {
  width: 100%;
  height: auto;
  object-fit: cover;
  aspect-ratio: 16/9;
  contain: size;
}

/* Ottimizzazioni per immagini hero */
.hero-image {
  width: 100%;
  height: auto;
  object-fit: cover;
  contain: size;
}

/* Media queries per ottimizzare il caricamento */
@media (max-width: 576px) {
  .card-img-top {
    min-height: 150px;
  }
}

@media (min-width: 577px) and (max-width: 768px) {
  .card-img-top {
    min-height: 180px;
  }
}

@media (min-width: 769px) {
  .card-img-top {
    min-height: 200px;
  }
}

/* Preload hint per immagini critiche */
.critical-image {
  content-visibility: auto;
  contain-intrinsic-size: 300px 200px;
}

/* Lazy loading ottimizzato */
img[loading="lazy"] {
  content-visibility: auto;
  contain-intrinsic-size: 1px 200px;
}