O card não fica ao lado do carrossel

Olá, tudo bem?

O problema é que a <div> .card está dentro da <div> .swiper, isso faz com que o .carrossel__container tenha somente um elemento filho direto e por isso o display flex não está sendo aplicado corretamente.

O html deve ficar assim:

<section class="carrossel">
    <h2 class="carrossel__titulo">Novos lançamentos</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 -->
          <div class="swiper-slide"> <img src="img/ApacheKafka.svg" alt="Apachekafka"></div>
          <div class="swiper-slide"> <img src="img/Liderança.svg" alt="liderança"></div>
          <div class="swiper-slide"> <img src="img/Javascript.svg" alt="javascript"></div>
          <div class="swiper-slide"> <img src="img/Guia Front-end.svg" alt="guia front-end"></div>
          <div class="swiper-slide"> <img src="img/MEAN.svg" alt="mean"></div>
          <div class="swiper-slide"> <img src="img/MetricasAgeis.svg" alt="metricas"></div>

          <!-- If we need navigation buttons -->

        </div>
        <div class="swiper-button-prev"></div>
        <div class="swiper-button-next"></div>
      </div>
      <div class="card">
        <div class="card__descricao">
          <div class="descricao">
            <h3 class="descricao__titulo">Talvez você se interesse por...</h3>
            <h2 class="descricao__titulo-livro">Angular 11 e Firebase</h2>
            <p class="descricao__texto">Construindo uma aplicação integrada com a plataforma do Google.</p>
          </div>
          <img src="img/Mask group.svg" class="descricao__imagem" alt="maskgroup">
        </div>
        <div class="card__botoes">
          <ul class="botoes">
            <li class="botoes__item"> <img src="img/Favoritos.svg" alt="favoritos"></li>
            <li class="botoes__item"> <img src="img/Sacola.svg" alt="sacola"></li>
          </ul>
          <a href="#" class="botoes__ancora">Saiba mais</a>
        </div>

  </section>

Espero ter ajudado!

Siga firme nos seus estudos e conte com o fórum sempre que precisar!

Abraços :)