@media (min-width: 651px) and (max-width: 1000px) {
    #main-content .product-card .product-image-link {
        width: 100%;
        min-width: 0;
        max-width: 100%;
    }
}

@media (max-width: 650px) {
    :root {
        --mobile-page-gutter: 16px;
    }

    html[data-home-showcase],
    html[data-listing-showcase] {
        scroll-snap-type: none;
    }

    #main-content .wrap,
    .site-footer > .wrap {
        box-sizing: border-box;
        width: calc(100% - 2 * var(--mobile-page-gutter));
        min-width: 0;
        max-width: none;
        margin-inline: auto;
    }

    #main-content .wrap .wrap {
        width: 100%;
        max-width: 100%;
        margin-inline: 0;
    }

    #main-content :is(.hero-copy, .page-opening__copy, .page-opening__body, .story-cover-copy, .story-copy, .story-narrative-heading, .story-narrative-copy, .contact-copy-inner, .product-detail-copy) {
        width: 100%;
        min-width: 0;
        max-width: 100%;
        padding-inline: 0;
    }

    #main-content :is(.hero-copy, .page-opening__body, .story-cover-copy, .contact-copy-inner) > p {
        max-width: none;
    }

    #main-content :is(.section-heading, .social-content-heading, .reviews-layout, .listing-screens, .listing-screen, .listing-screen__items, .product-detail, .product-detail-sidebar, .ig-detail-grid, .ig-detail-media, .ig-detail-sidebar) {
        min-width: 0;
        max-width: 100%;
    }

    #main-content :is(.section-heading, .page-opening__copy, .hero-copy, .story-cover-copy, .contact-copy-inner, .product-identity, .journal-card, .product-card-heading) :is(h1, h2, h3) {
        max-width: 100%;
        overflow-wrap: break-word;
    }

    #main-content .page-opening,
    #main-content .story-cover,
    html[data-home-showcase] #main-content .home-intro[data-home-screen] {
        height: auto;
        min-height: var(--opening-height);
    }

    #main-content .page-opening__inner,
    #main-content .story-cover-inner,
    #main-content .home-intro .hero-atelier {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: auto auto;
        align-content: start;
        height: auto;
        min-height: var(--opening-height);
        padding-inline: 0;
    }

    #main-content .home-intro .hero-atelier {
        gap: 26px;
        padding-block: 24px 76px;
    }

    #main-content .hero-atelier .hero-vitrine {
        width: calc(100% - 40px);
        max-width: 360px;
        min-width: 0;
        justify-self: center;
        align-self: start;
        margin: 0;
        padding: 0;
    }

    #main-content .hero-vitrine-caption {
        height: auto;
        min-height: 30px;
    }

    #main-content .hero-vitrine-caption strong {
        white-space: normal;
    }

    #main-content .page-opening__visual {
        width: 100%;
        height: clamp(220px, 72vw, 340px);
        max-height: none;
        max-width: none;
        min-width: 0;
    }

    #main-content .story-cover-media {
        width: calc(100% - 32px);
        max-width: 360px;
        align-self: start;
    }

    #main-content .story-cover-media figcaption {
        white-space: normal;
    }

    #main-content .catalog-showcase,
    #main-content .journal-scrapbook,
    #main-content .social-opening-art {
        width: 100%;
        max-width: 380px;
    }

    #main-content .contact-atelier .contact-copy {
        --contact-photo-height: min(82vw, 340px);
    }

    #main-content .contact-atelier .contact-photo {
        width: 100%;
        max-width: none;
    }

    #main-content .contact-channels,
    #main-content .contact-social {
        min-width: 0;
        max-width: 100%;
    }

    #main-content .contact-social > a {
        overflow-wrap: anywhere;
    }

    #main-content .product-page .product-main-image {
        height: min(calc(100vw - 34px), max(180px, calc(100svh - var(--site-header-height, 79px) - var(--mobile-purchase-height, 0px) - var(--product-gallery-controls-height, 0px) - 104px - env(safe-area-inset-bottom, 0px))));
        aspect-ratio: auto;
    }

    #main-content :is(.product-card, .journal-card, .ig-feed-card, .review-card, .product-gallery, .ig-gallery, .ig-detail-copy) {
        min-width: 0;
        max-width: 100%;
    }

    #main-content :is(.gallery-thumbnails, .ig-gallery-thumbnails) {
        width: 100%;
        min-width: 0;
        max-width: 100%;
    }
}
