@charset "utf-8";

/* Обложка альбома: фиксированная пропорция, чтобы карточки не прыгали по высоте.
   height: auto обязателен — иначе атрибут height в разметке задаёт высоту явно,
   и aspect-ratio не срабатывает (в отличие от плиток, где .img-fluid уже даёт auto). */
.album-cover {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.album-card {
  transition: transform .15s ease, box-shadow .15s ease;
}

.album-card:hover,
.album-card:focus-visible {
  transform: translateY(-2px);
}

/* Миниатюры Coppermine разной пропорции — приводим к квадрату кадрированием. */
.thumb-link img {
  aspect-ratio: 1 / 1;
  object-fit: cover;
  width: 100%;
  transition: opacity .15s ease;
}

.thumb-link:hover img,
.thumb-link:focus-visible img {
  opacity: .85;
}

.photo-main {
  max-height: 80vh;
  width: auto;
}

@media (prefers-reduced-motion: reduce) {
  .album-card,
  .thumb-link img {
    transition: none;
  }
}