.video-grid span, .video-grid small {
    display: none
}

.category-grid {
    grid-template-columns: repeat(5,1fr)
}

.category-card img {
    height: 168px;
    object-fit: cover;
    object-position: center;
    background: #eef5f0
}

.product-card img {
    height: 230px;
    object-fit: contain;
    object-position: center;
    
    padding: 4px
}

.products-section, .community {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background-color: #f4faf6;
    background-image: radial-gradient(circle at 50% 0,rgba(220,244,226,.9),transparent 58%),linear-gradient(180deg,#f8fcf9,#eef8f1)
}

    .products-section::before, .products-section::after, .community::before, .community::after {
        content: "";
        position: absolute;
        z-index: -1;
        top: 0;
        bottom: 0;
        width: min(18vw,250px);
        background: url("assets/botanical-edge.svg") left center/100% 100% no-repeat;
        pointer-events: none;
        opacity: .8
    }

    .products-section::before, .community::before {
        left: 0
    }

    .products-section::after, .community::after {
        right: 0;
        transform: scaleX(-1)
    }

    .products-section > *, .community > * {
        position: relative;
        z-index: 1
    }

@media(max-width:1050px) {
    .category-grid {
        grid-template-columns: repeat(3,1fr)
    }
}

@media(max-width:720px) {
    .hero img {
        width: 100%;
        max-width: 100%;
        transform: none
    }
}

@media(max-width:720px) {
    .category-grid {
        grid-template-columns: repeat(2,1fr)
    }

    .category-card img {
        height: 145px
    }

    .product-card img {
        height: 260px
    }

    .products-section::before, .products-section::after, .community::before, .community::after {
        width: 34vw;
        opacity: .38
    }
}