@media only screen and (max-width: 576px) {
    .brands {
        padding-left: 24px;
        padding-right: 24px;

        .brands__content {
            flex-direction: column;

            figure {
                width: 100%;
                margin-bottom: 32px;
            }

            .brands__content-text {
                .brands__content-text-group {
                    flex-direction: column;
                    align-items: flex-start;
                    padding-bottom: 0 !important;

                    & > div {
                        margin-bottom: 32px;

                        h3 {
                            margin-top: 0 !important;
                        }

                        figure {
                            width: 60px;
                            height: 60px;
                            margin-left: 0 !important;
                            margin-bottom: 0 !important;
                        }
                    }

                }
            }
        }

        .wp-block-cb-carousel .slick-slide {
            padding-left: 12px;
            padding-right: 12px;
        }
    }
}

@media only screen and (max-width: 1100px) {
    .brands {
        .brands__content {
            flex-direction: column;
            align-items: flex-start;

            figure {
                width: 50%;
                margin-bottom: 32px;
                margin-left: 0 !important;
            }
        }
    
        .wp-block-cb-carousel .slick-slide {
            padding-left: 24px;
            padding-right: 24px;
        }
    }
}

@media only screen and (min-width: 1200px) {
    .brands {
        .brands__content {
            gap: clamp(64px, 8vw, 165px);

            & > figure {
                width: clamp(300px, 36vw, 700px);
            }

            .brands__content-text {
                width: clamp(300px, 32vw, 600px);
  
                .brands__content-text-group {

                    & > div {


                        h3 {
                            margin-top: 0 !important;
                        }

                        figure {
                            width: clamp(48px, 4vw, 80px);
                            height: clamp(48px, 4vw, 80px);
                            margin-left: 0 !important;
                        }
                    }

                }
            }
        }

        .wp-block-cb-carousel .slick-slide {
            padding-left: 24px;
            padding-right: 24px;
        }
    }
}