/* ── Frontend styles – buffalo-run-photo-slider ─────────────────────────────── */

.buffalo-run-photo-slider {
  /*
   * Left offset calculation to align with buffalo-run-map content:
   *
   *  buffalo-run-map is centred inside .has-global-padding
   *  (padding-left: 15px, padding-right: 25px) with max-width: 1270px.
   *
   *  Left edge of map block from viewport =
   *    15px  (parent left padding)
   *  + (100vw - 40px - 1270px) / 2  (centering margin)
   *  = 50vw - 640px
   *
   *  Add map's own left padding (2rem) → content left edge = 50vw - 640px + 2rem
   *
   *  max() keeps a minimum of 2rem on small / constrained viewports.
   */
  padding: 2.5rem 0;
  overflow: hidden;
  background: #fff;
}

/* body prefix gives specificity (0,1,1) — beats .is-layout-constrained > :where(...) (0,1,0)
   so our !important always wins, regardless of whether alignfull is stamped on the element */
body .buffalo-run-photo-slider {
  width: min(100vw, 3000px) !important;
  max-width: 3000px !important;
  margin-left: auto !important;
  margin-right: calc(50% - 50vw) !important; /* negative value pulls right edge to viewport */
}

/* ── Swiper ─────────────────────────────────────────────────────────────────── */
.buffalo-run-photo-slider__swiper .swiper-slide {
  height: auto !important;
}
.buffalo-run-photo-slider__swiper {
  width: 100%;
  overflow: hidden;
}

.buffalo-run-photo-slider__slide img {
  display: block;
  width: 100%;
  height: 280px;
  object-fit: cover;
  border-radius: 4px;
}

/* ── Responsive ─────────────────────────────────────────────────────────────── */

@media (max-width: 767px) {
  .buffalo-run-photo-slider__slide img {
    height: 200px;
  }
}
