/* BuddyAvenue v1.3.2: supplied desktop directory artwork only.
 * No global, navigation, category, form, homepage or mobile rules are changed.
 * Original headings stay in the document for assistive technology and printing.
 * At 1024 CSS pixels and below, the original header is rendered unchanged.
 */
@media screen and (min-width: 1025px) {
    body.area-public.desktop-directory-banner > .page > .page-hero {
        position: relative;
        width: 100%;
        max-width: none;
        height: auto;
        min-height: 0;
        aspect-ratio: 1600 / 533;
        padding: 0;
        margin-left: 0;
        margin-right: 0;
        border-bottom: 0;
        background-color: #edf9fe;
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
    }

    body.area-public.desktop-directory-banner-products > .page > .page-hero {
        background-image: url("../banners/products-desktop-v1.3.2.jpg");
    }

    body.area-public.desktop-directory-banner-services > .page > .page-hero {
        background-color: #051c2d;
        background-image: url("../banners/services-desktop-v1.3.2.jpg");
    }

    body.area-public.desktop-directory-banner-shops > .page > .page-hero {
        aspect-ratio: 1600 / 534;
        background-image: url("../banners/shops-desktop-v1.3.2.jpg");
    }

    /* Avoid duplicate visible text over the supplied artwork without removing
       the page's semantic heading or description from the accessibility tree. */
    body.area-public.desktop-directory-banner > .page > .page-hero > .eyebrow,
    body.area-public.desktop-directory-banner > .page > .page-hero > h1,
    body.area-public.desktop-directory-banner > .page > .page-hero > p {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        clip-path: inset(50%);
        white-space: nowrap;
        border: 0;
    }
}
