html body main>.home-uploaded-banner,html body .online-shop-home-content>.home-uploaded-banner{display:block;order:0;position:relative;width:100%!important;max-width:1600px!important;margin:0 auto 24px!important;padding:0!important;border:0!important;overflow:hidden;border-radius:12px;background:transparent;box-sizing:border-box}
.home-uploaded-banner>a{display:block}
html body .home-uploaded-banner img{display:block;width:100%;height:auto;aspect-ratio:8/3;object-fit:contain;margin:0;padding:0;border:0}
@media(max-width:700px){html body main>.home-uploaded-banner,html body .online-shop-home-content>.home-uploaded-banner{margin-bottom:16px!important;border-radius:8px}}
html body.home-mobile-reference main>.home-uploaded-banner--bestsellers{order:10}

/* Main banner: 1920 × 720 proportions, scaled to the available page width. */
html body.home-mobile-reference main > .home-uploaded-banner:not(.home-uploaded-banner--bestsellers) { max-width: 1920px !important; }
html body.home-mobile-reference main > .home-uploaded-banner:not(.home-uploaded-banner--bestsellers) img { aspect-ratio: 1920 / 720; }

@media (max-width: 767px) {
    html body.home-mobile-reference main > .home-uploaded-banner:not(.home-uploaded-banner--bestsellers) img {
        height: auto;
        aspect-ratio: 1080 / 1350;
        object-fit: cover;
        object-position: center;
    }
}

.home-uploaded-banner picture{display:block;width:100%}
@media(min-width:768px){html body main>.home-uploaded-banner--mobile-only{display:none!important}}
@media(max-width:767px){html body .home-uploaded-banner--bestsellers img{aspect-ratio:auto;height:auto}}

/* Two mobile promo banners directly after the main banner (1000 × 625). */
@media (max-width:767px) {
    html body.home-mobile-reference main > .ref-promos--uploads {
        display:grid!important;
        order:1!important;
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:0!important;
        margin:0 auto 16px!important;
        width:100%!important;
        box-sizing:border-box;
    }
    html body.shared-site-header.home-mobile-reference:not(.staff-blue-page):not(.staff-admin-page):not(.magacin-page) > main > .ref-promos.ref-promos--uploads {
        padding:0!important;
        background:transparent!important;
        border:0!important;
    }
    html body.home-mobile-reference main > .mobile-home-categories { order:-1!important; }
    html body.home-mobile-reference .ref-promos--uploads > :is(.ref-promo,.ref-promo-upload) {
        min-width:0; min-height:0!important; height:auto!important;
        aspect-ratio:1000 / 625!important;
        border-radius:0!important;
        margin:0!important;
        border:0!important;
    }
    html body.home-mobile-reference .ref-promos--uploads .ref-promo-upload picture {
        display:block; width:100%; height:100%;
    }
    html body.home-mobile-reference .ref-promos--uploads .ref-promo-upload img {
        display:block; width:100%; height:100%; object-fit:cover;
    }
}

/* Mobile banner group is flush with the screen and has no vertical seam. */
@media (max-width:767px) {
    html body.shared-site-header.home-mobile-reference main > .home-uploaded-banner:not(.home-uploaded-banner--bestsellers) {
        width:100%!important;
        max-width:none!important;
        margin:0!important;
        padding:0!important;
        border:0!important;
        border-radius:0!important;
    }
    html body.shared-site-header.home-mobile-reference main > .ref-promos--uploads {
        margin-top:0!important;
        gap:0!important;
        border-radius:0!important;
    }
}

/* Break the mobile banners out of any inherited page container. */
@media (max-width:767px) {
    html body.shared-site-header.home-mobile-reference main > .home-uploaded-banner:not(.home-uploaded-banner--bestsellers),
    html body.shared-site-header.home-mobile-reference main > .ref-promos--uploads {
        width:100vw!important;
        max-width:none!important;
        margin-left:calc(50% - 50vw)!important;
        margin-right:calc(50% - 50vw)!important;
        box-sizing:border-box;
    }
}

/* Categories come before the mobile hero and scroll natively with a finger. */
@media (max-width:767px) {
    html body.home-mobile-reference #mobileHomeCategories { min-width:0; margin-bottom:0!important; padding-bottom:0!important; }
    html body.home-mobile-reference #mobileHomeCategories #homeCategoryTrack {
        display:grid!important;
        grid-template-columns:none!important;
        grid-auto-flow:column!important;
        grid-auto-columns:calc((100% - 30px) / 6)!important;
        gap:6px!important;
        width:100%; max-width:100%; min-width:0;
        overflow-x:auto!important; overflow-y:hidden;
        padding-bottom:0!important;
        margin-bottom:0!important;
        scrollbar-width:none;
        touch-action:auto;
        -webkit-overflow-scrolling:touch;
        overscroll-behavior-x:contain;
        scroll-snap-type:x proximity;
    }
    html body.home-mobile-reference #mobileHomeCategories #homeCategoryTrack::-webkit-scrollbar {
        display:none;
    }
    html body.home-mobile-reference #mobileHomeCategories #homeCategoryTrack > a {
        width:auto!important; min-width:0!important; max-width:none!important;
        scroll-snap-align:start;
    }
}

@media (max-width:767px) {
    html body.home-mobile-reference #mobileHomeCategories #homeCategoryTrack > a {
        background:transparent!important;
        border:0!important;
        box-shadow:none!important;
        border-radius:0!important;
    }
}

/* Mobile category strip spans the screen without a colored background. */
@media (max-width:767px) {
    html body.home-mobile-reference main > #mobileHomeCategories {
        width:100vw!important;
        max-width:none!important;
        margin-left:calc(50% - 50vw)!important;
        margin-right:calc(50% - 50vw)!important;
        background:transparent!important;
    }
}

/* A portrait video replaces the hero image on phones. */
html body .home-uploaded-banner__video { display: none; }
.home-uploaded-banner__video::-webkit-media-controls,
.home-uploaded-banner__video::-webkit-media-controls-enclosure,
.home-uploaded-banner__video::-webkit-media-controls-panel { display: none !important; }
@media (max-width: 767px) {
    html body .home-uploaded-banner__video {
        display: block;
        width: 100%;
        height: auto;
        aspect-ratio: 1080 / 1350;
        object-fit: cover;
    }
    html body .home-uploaded-banner--has-mobile-video picture { display: none; }
}