/* Global Image Display Rule: show the complete uploaded image, including saved blocks. */
.wp-site-blocks :is(main, .wp-block-post-content, .wc-block-mini-cart__drawer) img:not(.zoomImg),
.wp-site-blocks :is(.wp-block-image, .wp-block-post-featured-image, .wc-block-components-product-image) img:not(.zoomImg) {
  max-width: 100%;
  height: auto !important;
  max-height: none;
  /* Keep the intrinsic width/height ratio hint: sizes="auto" lazy images need it. */
  object-fit: contain !important;
}

.wp-site-blocks :is(.wp-block-image, .wp-block-post-featured-image, .wc-block-components-product-image, .works-card__image, .case-card__image, .about-press__card-media),
.wp-site-blocks .wp-block-gallery figure.wp-block-image {
  height: auto !important;
  aspect-ratio: auto !important;
  overflow: visible;
}

.wp-site-blocks .wp-block-gallery figure.wp-block-image img {
  flex: none !important;
}

/* A Cover block is an intentional fixed frame; contain the artwork within it. */
.wp-site-blocks .wp-block-cover img.wp-block-cover__image-background {
  width: 100%;
  height: 100% !important;
  object-fit: contain !important;
}

/* Press keeps a viewport-sized slide so navigation stays usable for tall scans. */
.wp-site-blocks .press-dialog__image {
  height: min(65dvh, 46rem) !important;
  object-fit: contain !important;
}

/* WooCommerce's zoom overlay has its own proportional geometry; do not resize it. */
.woocommerce-product-gallery .flex-control-thumbs img {
  object-fit: contain !important;
}

@media (max-width: 781px) {
  .wp-site-blocks .press-dialog__image {
    height: min(58dvh, 36rem) !important;
  }
}

/* Desktop only. Preserve column width/layout, but cap the image itself by its
   intrinsic ratio. The header is measured once centrally, including admin bar.
   Give the image priority: target 88vh, with only the header and a 1vh safety gap.
   Captions can continue below the viewport; never squeeze the artwork for them. */
@media (min-width: 1024px) {
  /* A reduced portrait exposes its former placeholder background. Clear only
     image/media frames, not cards, text panels or the page's own background. */
  .wp-site-blocks :is(figure, .wp-block-image, .wp-block-post-featured-image, .wc-block-components-product-image, .woocommerce-product-gallery__image, .works-card__image, .case-card__image, .work-detail__main-image, .about-press__card-media, .home-hero):has(img.bf-portrait-image) {
    background: transparent !important;
  }

  :root {
    --bf-image-viewport-height: min(88vh, calc(100vh - var(--bf-image-header-height, 5rem) - 1vh));
  }

  @supports (height: 100svh) {
    :root {
      --bf-image-viewport-height: min(88svh, calc(100svh - var(--bf-image-header-height, 5rem) - 1svh));
    }
  }

  .wp-site-blocks img.bf-portrait-image.bf-portrait-image,
  .wc-block-mini-cart__drawer img.bf-portrait-image.bf-portrait-image {
    --bf-portrait-limit: max(1px, min(var(--bf-image-viewport-height), var(--bf-image-frame-height, 100000px)));
    display: block;
    max-width: min(100%, calc(var(--bf-portrait-limit) * var(--bf-image-ratio))) !important;
    height: auto !important;
    max-height: var(--bf-portrait-limit) !important;
    margin-inline: auto !important;
    object-fit: contain !important;
  }
}