/* ==========================================================================
   BCNYC — 14 Photo gallery (hidden until real photos are added)
   Layout adapts to the number of photos: 1 → wide, 2 → pair,
   3+ → editorial grid with the first photo larger.
   ========================================================================== */

.bcnyc.bcnyc-gallery {
  margin: 0;
  background: var(--bcnyc-bg);
}

.bcnyc .bcnyc-gallery__title {
  margin: 0 0 clamp(28px, 4vw, 44px);
}

.bcnyc .bcnyc-gallery__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: clamp(180px, 20vw, 280px);
  gap: 16px;
}

.bcnyc .bcnyc-gallery__item {
  position: relative;
  margin: 0;
  overflow: hidden;
  border-radius: var(--bcnyc-radius-lg);
  background: var(--bcnyc-tint);
}

.bcnyc .bcnyc-gallery__item img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  margin: 0;
  border: 0;
  border-radius: 0;
  object-fit: cover;
}

/* 3+ photos: the first one spans two rows and two columns */
.bcnyc .bcnyc-gallery__grid[data-count="many"] .bcnyc-gallery__item:first-child {
  grid-column: span 2;
  grid-row: span 2;
}

.bcnyc .bcnyc-gallery__grid[data-count="1"] {
  grid-template-columns: minmax(0, 1fr);
  grid-auto-rows: clamp(240px, 36vw, 520px);
}

.bcnyc .bcnyc-gallery__grid[data-count="2"] {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: clamp(220px, 28vw, 420px);
}

@media (max-width: 767px) {
  .bcnyc .bcnyc-gallery__grid,
  .bcnyc .bcnyc-gallery__grid[data-count="2"] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: 42vw;
    gap: 10px;
  }

  .bcnyc .bcnyc-gallery__grid[data-count="1"] {
    grid-template-columns: minmax(0, 1fr);
    grid-auto-rows: 60vw;
  }

  .bcnyc .bcnyc-gallery__grid[data-count="many"] .bcnyc-gallery__item:first-child {
    grid-column: span 1;
    grid-row: span 1;
  }

  .bcnyc .bcnyc-gallery__grid[data-count="many"][data-mobile-lead="wide"] .bcnyc-gallery__item:first-child {
    grid-column: 1 / -1;
  }
}

/* Stays hidden (no space) until photo-gallery.js finds real photos */
.bcnyc.bcnyc-gallery[hidden],
.bcnyc .bcnyc-gallery__title[hidden] {
  display: none !important;
}

/* The next section (Services) has the same background, so its top padding
   already gives the spacing: drop the gallery's bottom padding to avoid a
   double gap */
.bcnyc.bcnyc-gallery > .bcnyc-section {
  padding-bottom: 0;
}