<section class="carrossel">
<h3 class="carrossel__titulo">Mais vendidos</h3>
<div class="swiper">
<!-- Additional required wrapper -->
<!-- If we need pagination -->
<div class="swiper-pagination"></div>
<div class="swiper-wrapper">
<!-- Slides -->
<div class="swiper-slide"><img src="img/ApacheKafka.png" alt="Livro sobre apache kafka e spring boot da alura books"></div>
<div class="swiper-slide"><img src="img/Liderança.png" alt="Livro sobre liderança em design da alura books"></div>
<div class="swiper-slide"><img src="img/Javascript.png" alt="Livro sobre javasccript assertivo da alura books"></div>
</div>
<!-- If we need navigation buttons -->
<div class="swiper-button-prev"></div>
<div class="swiper-button-next"></div>
</div>
<div class="card">
<!-- 1º Linha -->
<div class="card__descrição">
<!--1º Coluna -->
<div class="descrição">
<img src="img/Estrelinhas.png" alt="Imagem de cinco estrelinhas ">
<h3 class="descrição__titulo">Autora do mês</h3>
<h2 class="descrição__titulo-livro">Juliana Agarikov</h2>
<p class="descrição__texto">Analista de sistemas e escritora, Juliana é especialista em Front-End. </p>
</div>
<!--2º Coluna-->
<img src="img/Perfil-escritora 1.png" alt="Imagem da autora">
</div>
<!-- 2º Linha -->
<div class="card__botões">
<!-- 1º Coluna -->
<ul class="botões">
<li class="botões__itens"><img src="img/Favoritos.svg" alt="Favoritar livros"></li>
<li class="botões__itens"><img src="img/Compras.svg" alt="Adicionar no carrinho"></li>
</ul>
<!-- 2º Coluna -->
<a href="#" class="botões__ancora">Saiba mais</a>
</div>
</div>
</section>
<script src="https://unpkg.com/swiper@8/swiper-bundle.min.js"></script>
<script>
const swiper = new Swiper('.swiper', {
spaceBetween: 10,
slidesPerView: 3,
pagination: {
el: '.swiper-pagination',
type: 'bullets',
},
});
</script>
</body>
</html>