[Projeto] Consolidando conhecimento

HTML

    <section class="carrossel">
        <h2 class="carrossel__titulo">Mais vendidos<h2>
                <!-- Slider main container -->
                <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/Guia Front-end.png" alt="Livro guia sobre Front-end">
                        </div>
                        <div class="swiper-slide"><img src="img/Javascript.png" alt="Livro sobre javascript"></div>
                        <div class="swiper-slide"><img src="img/ApacheKafka.png" alt="Livro sobre apache kafka"></div>
                        <div class="swiper-slide"><img src="img/Liderança.png" alt="Livro sobre liderança"></div>
                        <div class="swiper-slide"><img src="img/Portugol.png" alt="Livro sobre acessibilidade"></div>
                        <div class="swiper-slide"><img src="img/ApacheKafka.png" alt="Livro sobre apache kafka"></div>
                    </div>


                    <!-- If we need navigation buttons -->
                    <div class="swiper-button-prev"></div>
                    <div class="swiper-button-next"></div>

                    <!-- If we need scrollbar -->
                    <!-- <div class="swiper-scrollbar"></div> -->

                </div>
    </section>

    <section class="card">
        <div class="card__2">
            <!-- 1º linha -->
            <div class="card__descricao">
                <!-- 1ª Coluna -->
                <div class="descricao">
                    <img src="img/Estrelinhas.png" class="imagem_estrelinha">
                    <h3 class="descricao__titulo">Autora do Mês</h3>
                    <h2 class="descricao__titulo-livro">Juliana Agarikov</h2>
                    <p class="descricao__texto">Analista de sistemas e escritora, Juliana é especialista em
                        Front-End.</p>
                </div>
                <!-- 2º Coluna -->
                <img src="img/Perfil-escritora.png" class="descricao__imagem">
            </div>

            <!-- 2º linha -->
            <div class="card__botoes">
                <!-- 1 coluna -->
                <ul class="botoes">
                    <li class="botoes__item"><img src="img/Favoritos.svg" alt="Favoritar livro"></li>
                    <li class="botoes__item"><img src="img/Compras.svg" alt="Adicionar no carrinho"></li>
                </ul>
                <!-- 2 coluna -->
                <a href="#" class="botoes__ancora">Saiba mais</a>
            </div>
        </div>
    </section>

CSS

.imagem_estrelinha{
    margin-bottom: 0.5rem;
}