/* Beranda — kartu paket memakai markup & CSS referensi apa adanya
   (.pkg-card.pkg-card--thumb). Penyesuaian HANYA pada foto:
   - foto tidak dipotong (object-fit: contain)
   - tinggi cover mengikuti proporsi foto asli, jadi tidak ada ruang kosong besar
   - tinggi kartu tetap seragam karena grid memakai align-items: stretch */

/* Cover: rasio default 4:5 (foto portrait bawaan). Kelas .pkg-thumb--land
   dipakai otomatis oleh PHP saat foto aslinya landscape. */
.pkg-thumb {
  background: linear-gradient(150deg, var(--p1) 0%, #f7f2fc 55%, #fdf4e3 100%);
}

.pkg-thumb img {
  object-fit: contain;
  object-position: center;
}

/* Foto landscape (~1.4:1) — beri ruang sesuai proporsinya agar tidak terpotong
   dan tidak menyisakan bidang kosong besar. */
.pkg-thumb--land {
  aspect-ratio: 1.4 / 1;
}

/* Foto sangat lebar */
.pkg-thumb--wide {
  aspect-ratio: 16 / 9;
}

@media (max-width: 768px) {
  .pkg-thumb {
    aspect-ratio: 4 / 5;
  }
  .pkg-thumb--land {
    aspect-ratio: 1.4 / 1;
  }
  .pkg-thumb--wide {
    aspect-ratio: 16 / 9;
  }
}

@media (prefers-reduced-motion: reduce) {
  .pkg-thumb img {
    transition: none;
  }
}
