document.addEventListener('DOMContentLoaded', function() { const heroBlocks = document.querySelectorAll('.hero-block'); heroBlocks.forEach(function(block) { const swiperContainer = block.querySelector('.swiper'); if (!swiperContainer) return; const swiper = new Swiper(swiperContainer, { slidesPerView: 1, loop: true, grabCursor: true, on: { slideChange: function () { const realIndex = this.realIndex; const paginationItems = block.querySelectorAll('.pagination-item'); paginationItems.forEach((item, index) => { const line = item.querySelector('.pagination-line'); const text = item.querySelector('.slide-text'); if (index === realIndex) { item.className = 'pagination-item flex-[2] cursor-pointer transition-all '; line.className = 'pagination-line bg-[#222] h-[2px] rounded-[30px] transition-colors '; text.className = 'slide-text mt-[10px] text-[14px] text-[#222] font-[600] opacity-100 transition-opacity '; } else { item.className = 'pagination-item flex-1 cursor-pointer transition-all '; line.className = 'pagination-line bg-[#e0e0e0] h-[2px] rounded-[30px] transition-colors '; text.className = 'slide-text mt-[10px] text-[14px] text-[#222] font-[600] opacity-0 transition-opacity '; } }); } } }); // Навигация block.querySelector('.custom-prev')?.addEventListener('click', () => swiper.slidePrev()); block.querySelector('.custom-next')?.addEventListener('click', () => swiper.slideNext()); // Пагинация block.querySelectorAll('.pagination-item').forEach((item, index) => { item.addEventListener('click', () => swiper.slideToLoop(index)); }); }); });