[Bug] desafio #7daysofcode carrossel não funciona

o carrossel parou de funcionar e não estou conseguindo mais fazer ele funcionar este é o meu código:

</head>
    <section class="carrossel">
        <h2 class="carrossel__titulo">Minha Lista</h2>
        <!-- Slider main container -->
        <div class="carrossel__container">
        <div class="swiper">
    <!-- Additional required wrapper -->
      <!-- If we need pagination -->
      <div class="swiper-pagination"></div>


            <div class="swiper-wrapper">
                <!-- Slides -->
                <a href="#"><div class="swiper-slide"><img src="img/poster_01.png" alt="Queen Loretta" class="imagemslide"></div></a>
                <a href="#"><div class="swiper-slide"><img src="img/poster_02.png" alt="As sete vidas de Lea" class="imagemslide"></div></a>
                <a href="#"><div class="swiper-slide"><img src="img/poster_03.png" alt="Young royals" class="imagemslide"></div></a>
                <a href="#"><div class="swiper-slide"><img src="img/poster_04.png" alt="Dark" class="imagemslide"></div></a>
                <a href="#"><div class="swiper-slide"><img src="img/poster_05.png" alt="Bem-vindos ao éden" class="imagemslide"></div></a>
                <a href="#"><div class="swiper-slide"><img src="img/poster_06.png" alt="ozark" class="imagemslide"></div></a>
                <a href="#"><div class="swiper-slide"><img src="img/poster_07.png" alt="Elize Matsunaga era uma vez um crime" class="imagemslide"></div></a>
                <a href="#"><div class="swiper-slide"><img src="img/carrossel8.png" alt="conversations with a killer: the Ted Bundy Tapes" class="imagemslide"></div></a>
                <a href="#"><div class="swiper-slide"><img src="img/carrossel9.png" alt="Gabriel Fluffy iglesias: One show fits all" class="imagemslide"></div></a>
                <a href="#"><div class="swiper-slide"><img src="img/carrossel10.png" alt="Fyre the greatest party that never happened" class="imagemslide"></div></a>
                <a href="#"><div class="swiper-slide"><img src="img/carrossel11.png" alt="Friends from college" class="imagemslide"></div></a>
                <a href="#"><div class="swiper-slide"><img src="img/carrossel12.png" alt="Riverdale" class="imagemslide"></div></a>
                <a href="#"><div class="swiper-slide"><img src="img/carrossel13.png" alt="Velvet Buzzsaw" class="imagemslide"></div></a>
                <a href="#"><div class="swiper-slide"><img src="img/carrossel14.png" alt="Amazing Interiors" class="imagemslide"></div></a>
                <a href="#"><div class="swiper-slide"><img src="img/carrossel15.png" alt="The good place" class="imagemslide"></div></a>
                <a href="#"><div class="swiper-slide"><img src="img/carrossel16.png" alt="unbreakable Kimmy Schmidt" class="imagemslide"></div></a>
            </div>
        
            <!-- If we need navigation buttons -->
            <div class="swiper-button-prev"></div>
            <div class="swiper-button-next"></div>
        </div>
    </section> 
</main>
<script src="https://cdn.jsdelivr.net/npm/swiper@10/swiper-bundle.min.js"></script>
<script>const swiper = new Swiper('.swiper', {
    speed: 400,
    spaceBetween: 100,
    slidesPerView: 7.5,
    });
</script>

    e o css está assim:

.carrossel{ padding-left: 1em; }

.carrossel__titulo{ font-size: 1em; padding: 1em 0 0.5em 0; }

.swiper-wrapper{ display: flex; }

.imagemslide { color: rgb(0, 0, 0); transition: transform 1s; transform: translateX(0) scale(1); }

.imagemslide:hover, .imagemslide:focus{ background: rgb(0, 0, 0); transform: translateX(0.2em) scale(1.4);

}

.imagemslide { width: 10.9em; height: 6em; padding:0 0.5em; }

.swiper-button-prev, .swiper-button-next{ padding-right: 1em; padding-top: 1em; color: var(--cor-secundaria); border-radius: 50%; width: 20px; height: 20px; color: aliceblue;

}

.swiper-pagination{ position: initial; margin: 0.5em 0; }