/* "השלם את הסט" - the other half of a tracksuit, under the garment itself.
   The block borrows the theme's related-products markup so the card is the card
   the grids carry; all that is added here is the panel that tells a shopper this
   is an offer and not another row of the shop.

   Every rule carries .related.products as well, because that is the selector the
   theme styles the row with and a single class loses to it. The panel hugs its
   one card - stretched across the page it reads as an empty band - and holds no
   trailing space, or the row below is laid over its tail. */

.tb-set.related.products {
    background: #f7f6f4;
    padding: 30px 26px 26px;
    margin: 0 0 46px;
    width: fit-content;
    max-width: 100%;
    display: flow-root;
    clear: both;
}

.tb-set.related.products > h2 {
    font-size: 24px !important;
    margin: 0 0 18px !important;
}

.tb-set.related.products .products {
    gap: 0;
    margin-bottom: 0;
}

.tb-set.related.products .products > section.product {
    width: 300px !important;
    max-width: 100%;
    margin-bottom: 0 !important;
    padding: 0 !important;
}

.tb-set.related.products .thumbnail-wrapper {
    background: #fff;
}

@media (max-width: 767px) {
    .tb-set.related.products {
        padding: 22px 18px 18px;
        margin-bottom: 34px;
        width: auto;
    }

    .tb-set.related.products > h2 {
        font-size: 20px !important;
    }

    .tb-set.related.products .products > section.product {
        width: 62% !important;
    }
}
