/* ============================================================
 * IMG CROP FIX — property-banner main images "self-crop" after load
 * Authored 2026-06-10 (substrate, Claude Opus 4.8, Chairman bug report)
 *
 * SYMPTOM (Chairman): on SOME listing photos the image loads/paints
 *   FULLY, then "self-crops" and cuts off ~1/3 of the picture.
 *
 * ROOT CAUSE: lane-o-perf.css (CLS pack, 2026-05-23) added, on the
 *   raw <img> elements of the property banner:
 *     .property-featured-image      { aspect-ratio:16/9; object-fit:cover }
 *     .property-banner .img-fluid   { aspect-ratio:4/3;  object-fit:cover }
 *   The browser paints the image at its natural size first, then on
 *   layout applies the forced aspect-ratio box + object-fit:cover,
 *   which CROPS any photo whose native ratio differs from the box.
 *   Measured crop (headless Chromium): mobile featured 16:9 box on a
 *   3:2 photo = 15.6% cut; on a 4:3 photo = 25% cut. Desktop banner
 *   mosaic 4:3 box on a PORTRAIT photo (900x1200) = 43.8% cut ("1/3").
 *   Cloudflare Polish ruled OUT (re-encodes, never crops; CloudFront-
 *   hosted MLS photos don't pass WP-origin Polish). Today's slick
 *   bug2/bug3 work ruled OUT (those touch carousels/lightbox, not the
 *   banner <img> aspect-ratio; the lightbox already shows full images).
 *
 * FIX PHILOSOPHY: keep CLS protection (retain a reserved aspect-ratio
 *   box so nothing shifts) but stop the inappropriate crop on the MAIN
 *   images by switching object-fit to CONTAIN with a neutral backdrop,
 *   so the full photo is always visible. The small 4-up collage tiles
 *   (positions 2-5) keep cover-cropping — that uniform collage look is
 *   the intended Houzez design and matches the tidy card-grid behavior.
 *
 * REVERSIBILITY: delete this file + remove its wp_enqueue_style block
 *   (marker IMG CROP FIX) from child functions.php. lane-o-perf.css is
 *   unchanged (and separately backed up).
 *
 * Load order: enqueued at priority 110 (AFTER lane-o-perf @99) so these
 *   rules win without !important wherever specificity ties.
 * ============================================================ */

/* ---- MOBILE main featured image (the only photo shown pre-lightbox) ----
 * Show the full photo. Keep a 4/3 reservation (matches the parent theme's
 * native .property-banner .tab-pane aspect-ratio) instead of Lane O's 16/9. */
.property-banner .property-featured-image {
    object-fit: contain;
    aspect-ratio: 4 / 3;
    background-color: #f1f1f3;
}

/* ---- DESKTOP banner mosaic: large hero tile (position 1) ----
 * This is the dominant desktop photo — show it fully (no crop). */
.hs-gallery-v5-grid .hs-gallery-v5-grid-item-01 img.img-fluid,
.property-banner .img-wrap-1 img.img-fluid,
.property-banner a.img-wrap-1 img.img-fluid {
    object-fit: contain;
    background-color: #f1f1f3;
}

/* The four small collage tiles (positions 2-5) intentionally stay
 * object-fit:cover for a tidy uniform mosaic — that is desired design,
 * NOT the reported bug. No override needed; lane-o-perf.css governs them. */

/* ---- Single-image banner fallback (listings with one photo) ----
 * When the banner is a lone image, never crop it. */
.property-banner-grid-wrap.has-one-image .img-fluid {
    object-fit: contain;
    background-color: #f1f1f3;
}