/**
 * jp-440-hero-image-aspect-cascade.css — widget-wide follow-up to PR #199.
 *
 * PR #199 fixed ONE page (/de/lagerverwaltung-software, id 93818): its hero
 * graphic was cropped because the shared hero widget locks the picture box to
 *   .hero-product-section__image picture { aspect-ratio: 703/733; }
 *   .hero-product-section__image picture img { object-fit: cover; }
 * (wpb-oop-widget-with-global/assets/style.css). `cover` in that portrait box
 * crops the left/right edges of any hero image whose native ratio isn't ~0.959.
 *
 * A DB sweep of all 295 published pages (scripts/db/_hero-scan.php) showed this
 * is systemic, not a single-page issue: of 139 pages using the hero composite,
 * ~80 carry a hero image whose aspect ratio deviates >8% from the 703/733 box —
 * including every product hero that shares the common 764×668 demo graphic
 * (ratio 1.144, ~19% off) and the marketplace/ERP heroes (up to ~31% off). The
 * widget default is therefore wrong for the majority of heroes, not the
 * exception — so the fix belongs at the widget level, not per page-id.
 *
 * Fix (mirrors PR #199, generalised): let the picture box take the image's
 * NATIVE ratio (`aspect-ratio:auto`) and switch to `object-fit:contain`, so the
 * whole composed graphic (badges, blobs, cards, counters) is always visible and
 * never cropped — on every hero, regardless of its image ratio.
 *
 * Safety:
 *  - No hero image is meaningfully taller than the box (scan min ratio 0.958),
 *    so nothing relied on cover cropping top/bottom — `contain` can't letterbox.
 *  - All SVG heroes carry a viewBox + intrinsic width/height, so `aspect-ratio:
 *    auto` + `height:auto` resolves their natural ratio (no collapse).
 *  - Higher specificity than the widget base rule (.hero-product-section prefix)
 *    + !important so it wins; loads after custom-clone.css via the overrides
 *    glob (00-dump-clone-overrides.php). Reaches all hero pages, touches nothing
 *    else.
 *  - Supersedes the page-scoped block in jp-440-lagerverwaltung.css (left in
 *    place; harmless/redundant — its hardcoded 1260/1204 is ~identical to this
 *    rule's auto result for id 93818).
 */

.hero-product-section .hero-product-section__image picture {
    aspect-ratio: auto !important;
}
.hero-product-section .hero-product-section__image picture img {
    object-fit: contain !important;
    height: auto !important;
}

/* Mobile (<768px): the widget already restacks the image full-width and re-sets
   aspect-ratio:703/733 — same crop applies, so neutralise it there too. */
@media only screen and (max-width: 767px) {
    .hero-product-section .hero-product-section__image picture {
        aspect-ratio: auto !important;
    }
    .hero-product-section .hero-product-section__image picture img {
        object-fit: contain !important;
        height: auto !important;
    }
}