/* ==========================================================================
   KF Elements — Image Band
   --------------------------------------------------------------------------
   One photograph, edge to edge. No wrap, no section padding, no ground, no
   radius: everything this file does is give the <img> a height (or a ratio)
   and a crop.

   The height and the ratio are written per instance by band_height and
   band_ratio; the literals here are the same values as those controls'
   defaults, so a band saved before either control existed still renders at the
   band's own geometry rather than the image's natural height.

   The crop reads the focal tokens add_focal_controls( 'image' ) writes, with
   the same fallbacks base.css uses for .kfe-split-bleed.
   ========================================================================== */

.kfe .kfe-image-band {
  margin: 0;
  line-height: 0;
}

.kfe .kfe-image-band img {
  display: block;
  width: 100%;
  max-width: none;
  object-fit: cover;
  object-position: var(--kfe-focus-x, 50%) var(--kfe-focus-y, 55%);
}

.kfe .kfe-image-band.mode-fixed img { height: 357px; }
.kfe .kfe-image-band.mode-ratio img { height: auto; aspect-ratio: 2.6 / 1; }

@media (max-width: 1024px) {
  .kfe .kfe-image-band.mode-fixed img { height: 300px; }
}
@media (max-width: 767px) {
  .kfe .kfe-image-band.mode-fixed img { height: 230px; }
  .kfe .kfe-image-band.mode-ratio img { aspect-ratio: 2 / 1; }
}