boa noite amigos, estou seguindoa risca a aula porem o meu card nao esta ficando como arprofessora esta passando na aula. Alguem poderia me ajudar por favor?
<div class="card">
<!--1° linha-->
<div class="card__descricao">
<!-- 1° coluna-->
<div class="descricao">
<h3 class="descricao__titulo">Talvez você também 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>
<!--2° coluna-->
<img src="img/angular.svg" class="descriçao__imagem">
</div>
</div>
<!--2° LINHA-->
<div class="card__botoes">
<!--1° coluna-->
<ul class="botoes">
<li class="botoes__item"><img src="img/Favoritos.svg" alt="favoritar livros"></li>
<li class="botoes__item"><img src="img/Compras.svg" alt="add carrinho"></li>
</ul>
<!--2° coluna-->
<a href="#" target="_blank" class="botoes__ancora" >Saiba mais</a>
</div>
</section>
.card{
background-color: var(--branco);
box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
border-radius: 10px;
margin: 1em;
padding: 1em;
}
.card__descricao, .card__botoes{
display: flex;
justify-content: space-between;
align-items: center;
}
.card__descricao{
margin-bottom: 0.5em;
text-align: left;
}
.descricao__titulo{
font-weight: 700;
color: var(--laranja);
}
.descricao__titulo-livro{
color: var(--azul);
font-size: 18px;
font-weight: 700;
margin: 0.5em;
}
.descricao__texto{
font-size: 14px;
}
.descricao__imagem{
width: 162px;
height: 168px;
}
.botoes{
display: flex;
height: 3em;