[Sugestão] Meu resultado para o desafio da nova seção

Basicamente reutilizei toda seção anterior, alterando apenas os conteúdos no HTML, no CSS crie apenas uma classe para as Estrelas da Classificação para refinar o espaçamento.

HTML:

 <section class="carrossel">
        <h2 class="carrossel__titulo">Mais vendidos</h2>

        <!-- Slider main container -->
        <div class="swiper">
            <!-- If we need pagination -->
            <div class="swiper-pagination"></div>
            <!-- Additional required wrapper -->
            <div class="swiper-wrapper">
            <!-- Slides -->
                <div class="swiper-slide"><img src="./img/Angular.png" alt="Livro sobre angular da alura books"></div>
                <div class="swiper-slide"><img src="./img/Arquitetura.png" alt="Livro sobre arquitetura de software distribuido da alura books"></div>
                <div class="swiper-slide"><img src="./img/Gestão.png" alt="Livro sobre gestão de produtos da alura books"></div>
                <div class="swiper-slide"><img src="./img/ReactNative.png" alt="Livro react native da alura books"></div>
                <div class="swiper-slide"><img src="./img/MetricasAgeis.png" alt="Livro sobre métricas ageis da alura books"></div>
                <div class="swiper-slide"><img src="./img/Tuning.png" alt="Livro sobre tuning da alura books"></div>
                <div class="swiper-slide"><img src="./img/Construct2.png" alt="Livro sobre construct 2 da alura books"></div>
                <div class="swiper-slide"><img src="./img/Gestão.png" alt="Livro sobre gestão da alura books"></div>
                <div class="swiper-slide"><img src="./img/Gestão2.png" alt="Livro sobre gestão 2 da alura books"></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>
        <div class="card">
            <!-- 1ª Linha -->
            <div class="card__descrição">
                <!-- 1ª Coluna'-->
                <div class="descrição">
                    <img src="./img/Estrelinhas.png" alt="classificação 5 estrelas" class="classificação">
                    <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" class="Foto de Juliana Agarikov">
            </div>
            <!-- 2ª Linha -->
            <div class="card__botoes">
                <!-- 1ª Coluna -->
                <ul class="botoes">
                    <li class="botoes__itens"><img src="./img/Favoritos.svg" alt="Favoritar livro"></li>
                    <li class="botoes__itens"><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:

.classificação{
    margin: 1em 0;
}