/* Product-family and WooCommerce headings only. Desktop remains unchanged. */
@media screen and (max-width: 767px) {
    .products-title-row h1,
    .product h1 {
        font-size: clamp(30px, 8vw, 40px);
        line-height: 1.18;
        letter-spacing: 0;
        max-width: 100%;
        white-space: normal;
        word-break: normal;
        overflow-wrap: anywhere;
        text-wrap: balance;
    }

    /* Desktop overlaps the transparent product photograph with the title.
       On a phone, keep both elements in normal flow as the title wraps. */
    .products-title-row .products-main-title {
        margin-bottom: 24px;
        padding-inline: 9px;
    }

    .products-title-row .products-main-image img {
        max-width: 100%;
        height: auto;
        margin-top: 0;
    }

    .products-title-row > .vc_column_container,
    .product .vc_column_container {
        min-width: 0;
    }
}
