Слайдер на Tilda из стандартных блоков

<!--https://mods.authweb.ru/sliderstd-block-->
<!--Для работы слайдера в стандартном блоке, используйте класс uc-awslick-->
<script>
  document.addEventListener("DOMContentLoaded", function () {
    // Удаляем лишние разделители, если они есть
    document
      .querySelectorAll(".uc-awslick .t772__separator")
      .forEach((el) => el.remove());

    // Инициализация Slick
    $(".uc-awslick .t772__wrapper").slick({
      infinite: true, // Бесконечная прокрутка
      autoplay: true, // Автопроигрывание
      autoplaySpeed: 3000, // Время между сменой слайдов
      speed: 400, // Скорость анимации
      pauseOnHover: false, // Не ставить на паузу при наведении
      pauseOnDotsHover: false, // Не ставить на паузу при наведении на точки
      slidesToShow: 3, // Количество видимых карточек
      //slidesToScroll: 1, // Количество карточек, которые прокручиваются
      centerMode: false, // Без центрирования
      adaptiveHeight: false, // Высота адаптируется под содержимое
      cssEase: "ease-in", // Плавность анимации
      dots: true, // Включить точки
      swipeToSlide: true, // Свободный свайп по слайдам
      prevArrow:
        "<img class='slick-prev' src='https://static.tildacdn.com/tild3262-6561-4132-b137-323337656238/arrow-left.svg'>",
      nextArrow:
        "<img class='slick-next' src='https://static.tildacdn.com/tild6139-3962-4139-b530-353762393238/arrow-right.svg'>",
      responsive: [
        {
          breakpoint: 1024, // Планшет горизонтальный
          settings: {
            slidesToShow: 3, // Показывать 2 карточки
            slidesToScroll: 1,
          },
        },
        {
          breakpoint: 640, // Планшет вертикальный
          settings: {
            slidesToShow: 2,
            slidesToScroll: 1,
          },
        },
        {
          breakpoint: 480, // Телефон горизонтальный
          settings: {
            slidesToShow: 1,
            slidesToScroll: 1,
          },
        },
      ],
    });
  });
</script>



<style>
    :root{
  --borderRadiusContainer: 16px; /*Скругление углов у контейнера*/
  --widthIcon: 40px;     /*Ширина иконки стрелки*/
  --heightIcon: 40px;    /*Высота иконки стрелки */
  --opacityHover: 0.7;   /*Прозрачность стрелок при наведении*/
  --tansitionHover: .3s ease-in-out;    /*Скорость и плавность анимации при наведении на стрелки*/
  --overflow: hidden; /*visible - если нужно, чтобы карточки выходили за предел контейнера*/
  --arrowDisplay: block; /*Видимость стрелок навигации, если нужно убрать стрелки пропишите значение none вместо block*/    
}
.slick-list {
    border-radius: var(--borderRadiusContainer) !important; 
    /*Если нужно, чтобы карточки выходили за предел контейнера*/
    overflow:var(--overflow) !important; 
}
.slick-arrow{
    top:50%;
    transform: translateY(-50%);
    position:absolute;
    cursor:pointer;
    display: var(--arrowDisplay) !important;
}
/*Настройка точек навигации*/
.slick-dots{
    display: block !important;
    position: relative !important;
    bottom: -20px !important; /*Регулировка отступа снизу*/
    padding-left: 0px !important;
    width: 100% !important;
}
.slick-dots li.slick-active button:before {
    color: #9155F7 !important;  /*Цвет точки активного слайда*/
}
.slick-dots li button:before {
    color: #ffffff !important;  /*Цвет точек неактивных слайдов*/
    font-size: 10px !important; /*Размер точек*/
}

/*Десктоп разрешение*/
@media screen and (min-width: 1200px) {
    .slick-prev { /*Стрелка влево*/
        width: var(--widthIcon) !important;      
        height: var(--heightIcon) !important;
        left: -25px !important;       /*Положение стрелки*/
        z-index:998;
        top:50% !important;         /* Расположение стрелки по вертикали*/
    } 

    .slick-next { /*Стрелка вправо*/
        width: var(--widthIcon) !important;
        height: var(--heightIcon) !important;
        right: -25px !important;      /*Положение стрелки*/
        z-index:998;
        top:50% !important;         /* Расположение стрелки по вертикали*/
    }
    .slick-prev:hover, .slick-next:hover{
        opacity: var(--opacityHover) !important;
        transition: var(--tansitionHover);
    }  
  
}

/*Разрешение для вертикального планшета*/
@media screen and (max-width: 960px) {
    .slick-prev { /*Стрелка в лево*/
        width:30px !important;      /*Ширина иконки стрелки влево*/
        height:30px !important;     /*Высота иконки стрелки влево*/
        left: 30px !important;       /*Положение стрелки*/
        z-index:998;
    } 

    .slick-next {   /*Стрелка в право*/
        width:30px !important;      /*Ширина иконки стрелки вправо*/
        height:30px !important;     /*Высота иконки стрелки вправо*/
        right: 30px !important;      /*Положение стрелки*/
        z-index:998;
    }
}
/*Разрешение для горизонтального телефона*/
@media screen and (max-width: 640px) {
    .slick-prev {
        left: 10px !important;
        z-index: 998 !important;
    } 
    .slick-next {
        right: 10px !important;
        z-index: 998 !important;
    }
}
/*Разрешение для вертикального телефона*/
@media screen and (max-width: 480px) {
    .slick-prev {
        width: 40px !important;
        height: 40px !important;
        left: 10px !important;
        z-index: 998 !important;
    } 
    .slick-next {
        width: 40px !important;
        height: 40px !important;
        right: 10px !important;
        z-index: 998 !important;
    }
}
</style>

<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css"
/>
<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick-theme.css"
/>
<script src="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>