/* Фотографии: первый экран, обложки, галереи, карточки на главной. */

/*
 * Колонки grid по умолчанию не сжимаются уже своего содержимого,
 * поэтому широкая картинка распирала всю страницу и появлялась
 * горизонтальная прокрутка на телефоне.
 */
.hero-grid > *,
.project-grid > *,
.two-col > *{min-width:0}

/* Фотография на первом экране главной */
.hero-image img{display:block;max-width:100%;height:auto;background:#deddd6}

/* Большая обложка проекта на странице «Проекты» */
.large-image{min-height:0}
.large-image img{display:block;width:100%;height:auto;background:#deddd6}

/* Галерея проекта */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:34px}
.gallery a{display:block;background:#deddd6;overflow:hidden}
.gallery img{display:block;width:100%;height:auto;transition:transform .35s ease}
.gallery a:hover img{transform:scale(1.04)}
.gallery a:focus-visible{outline:2px solid var(--ink);outline-offset:2px}

/* Карточки избранных проектов на главной */
.project-image{min-height:0}
.project-image img{display:block;width:100%;height:100%;aspect-ratio:4/3;object-fit:cover}

@media(max-width:850px){
  .gallery{grid-template-columns:repeat(2,1fr);gap:10px}
}

@media(prefers-reduced-motion:reduce){
  .gallery img{transition:none}
  .gallery a:hover img{transform:none}
}