/* Homepage gallery sets; spacing selectors outrank the .ev2 reset. */
.em-gal {
  display: grid;
  gap: 56px;
  min-width: 0;
  max-width: 100%;
  color: var(--ink, #3D3A2C);
}
.em-gal .em-gal__group {
  min-width: 0;
  max-width: 100%;
}
.em-gal .em-gal__title {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 18px;
  margin: 0 0 20px;
  font-family: var(--font-display, "Cormorant Garamond", Georgia, serif);
  font-size: clamp(26px, 2.4vw, 30px);
  font-weight: 400;
  line-height: 1.2;
  color: var(--ink, #3D3A2C);
}
.em-gal .em-gal__date {
  font-family: var(--font-ui, "Jost", sans-serif);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;
  text-transform: uppercase;
  letter-spacing: .16em;
  color: var(--accent, #A8763F);
}
.em-gal .em-gal__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  min-width: 0;
  max-width: 100%;
}
.em-gal .em-gal__item {
  position: relative;
  min-width: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border-radius: 10px;
  background: var(--bg, #F5F0E7);
  aspect-ratio: 3 / 2;
}
/* Bento: 1-й і 8-й рендери — плитки 2×2, тож 10 кадрів складають рівний прямокутник 4×4. */
.em-gal__grid--renders .em-gal__item:first-child,
.em-gal__grid--renders .em-gal__item:nth-child(8) {
  grid-column: span 2;
  grid-row: span 2;
  aspect-ratio: auto;
}
.em-gal__grid--build .em-gal__item { aspect-ratio: 4 / 5; }
/* Панорама кварталу (5-й кадр, горизонтальний) — широка плитка: 11 фото = рівно 3 ряди. */
.em-gal__grid--build .em-gal__item:nth-child(5) {
  grid-column: span 2;
  aspect-ratio: auto;
}
.em-gal .em-gal__img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.em-gal .em-gal__img:focus-visible {
  outline: 2px solid var(--accent, #A8763F);
  outline-offset: -4px;
}
@media (hover: hover) {
  .em-gal .em-gal__img {
    /* mod-gallery.js sets an inline pointer cursor on every trigger. */
    cursor: zoom-in !important;
    transition: transform 700ms cubic-bezier(.16, 1, .3, 1);
  }
  .em-gal .em-gal__item:hover .em-gal__img { transform: scale(1.04); }
}
@media (max-width: 900px) {
  .em-gal .em-gal__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .em-gal__grid--renders .em-gal__item:first-child,
  .em-gal__grid--renders .em-gal__item:nth-child(8),
  .em-gal__grid--build .em-gal__item:nth-child(5) {
    grid-column: span 2;
    grid-row: span 1;
    aspect-ratio: 3 / 2;
  }
}
@media (max-width: 640px) {
  .em-gal { gap: 40px; }
  .em-gal .em-gal__grid {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }
  .em-gal .em-gal__grid::-webkit-scrollbar { display: none; }
  .em-gal .em-gal__item {
    flex: 0 0 78%;
    scroll-snap-align: start;
  }
  .em-gal__grid--build .em-gal__item:nth-child(5) { aspect-ratio: 4 / 5; }
}
@media (prefers-reduced-motion: reduce) {
  .em-gal .em-gal__img { transition: none; }
  .em-gal .em-gal__item:hover .em-gal__img { transform: none; }
}
