/* Mobile art-directed media: all 640x240 images and wrappers use 8:3. */
@media (max-width: 640px) {
    body.template-home .home-category-banner,
    body.template-home .home-category-banner__media,
    body.template-home .home-category-banner picture {
        display: block;
        width: 100%;
        height: auto !important;
        min-height: 0;
        aspect-ratio: auto !important;
        margin: 0;
        padding: 0;
    }

    body.template-home .home-category-banner img {
        display: block;
        width: 100% !important;
        max-width: none;
        height: auto !important;
        min-height: 0;
        margin: 0;
        aspect-ratio: 8 / 3 !important;
        object-fit: contain;
    }

    body.template-home .home-category-banner__button,
    body.template-home .home-category-banner--gender-reveal .home-category-banner__button,
    body.template-home .home-category-banner--photo-session .home-category-banner__button {
        right: clamp(8px, 3vw, 18px);
        bottom: clamp(8px, 3vw, 16px);
        min-height: 30px;
        max-width: 48%;
        padding: 6px 12px;
        border-width: 1px;
        font-size: clamp(9px, 2.4vw, 12px);
        line-height: 1.15;
        white-space: normal;
    }

    body.template-home .tns-hero-media,
    body.template-home .tns-hero-media .tns-hero-media__carousel,
    body.template-home .tns-hero-media .tns-hero-media__track,
    body.template-home .tns-hero-media .tns-hero-media__slide,
    body.template-home .tns-hero-media .tns-hero-media__picture {
        width: 100%;
        height: auto !important;
        min-height: 0;
        aspect-ratio: auto !important;
    }

    body.template-home .tns-hero-media .tns-hero-media__picture,
    body.template-home .tns-hero-media .tns-hero-media__image {
        display: block;
        margin: 0;
        padding: 0;
    }

    body.template-home .tns-hero-media .tns-hero-media__image {
        width: 100% !important;
        max-width: none;
        height: auto !important;
        aspect-ratio: 8 / 3 !important;
        object-fit: contain;
    }
}
