.brands-slider {
    padding-block: 24px 4px;
    background: #1a1a1a;
    margin-bottom: 56px;
    position: relative
}

@media(min-width:768px) {
    .brands-slider {
        padding-block: 24px 24px;
        margin-bottom: 82px
    }
    .brands-slider {
        border-radius: 12px
    }
    .padding-side {
        padding-left: 48px;
        padding-right: 48px
    }
}

.brands-slider .section-title {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-bottom: 16px;
    padding-inline: 16px;
    height: 22px
}

@media(min-width:768px) {
    .brands-slider .section-title {
        gap: 20px;
        margin-bottom: 24px;
        padding-inline: 48px;
        height: 26px
    }
}

.brands-slider .section-title:before,
.brands-slider .section-title:after {
    content: "";
    flex: 1;
    height: 1.5px;
    background: var(--paragraphs-lighter-white, rgba(255, 255, 255, .6));
    border-radius: 69px
}

.brands-slider .brand-logos {
    overflow: hidden;
    position: relative
}

.brands-slider .brand-slide {
    display: flex;
    gap: 10px
}

.brands-slider .brand-slide {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px
}

.brands-slider .brand-slide .slide {
    width: 100%;
    text-align: center;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 6px;
    padding-top: 8px;
    padding-bottom: 8px
}

.brands-slider .brand-slide .slide img {
    max-height: 34px;
    display: block;
    margin: auto;
    width: auto
}

.brands-slider .brand-slide {
    padding-left: 16px;
    padding-right: 16px;
    padding-bottom: 16px
}

@media(min-width:768px) {
    .brands-slider .brand-slide {
        grid-template-columns: 1fr 1fr 1fr 1fr;
        gap: 16px
    }
    .brands-slider .brand-slide .slide img {
        max-heigth: 45px
    }
    .brands-slider .brand-slide {
        padding-bottom: 0;
        padding-left: 20px;
        padding-right: 20px
    }
}

.brands-slider .brand-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

@media(min-width:1441px) {
    .brands-slider:after {
        left: initial;
        right: -8px
    }
}

@keyframes scroll {
    0% {
        transform: translate(0)
    }
    to {
        transform: translate(-50%)
    }
}

/*# sourceMappingURL=/cdn/shop/t/4/assets/brands-slider.css.map?v=69935069506827375581749452682 */