Desafio: dando vida ao projeto

html 1

 <div class="col-6 col-md-4 col-xxl-2">
      <div class="card">
        <svg class="bd-placeholder-img card-img-top" width="100%" height="180" xmlns="http://www.w3.org/2000/svg"
          role="img" aria-label="Placeholder: Image cap" preserveAspectRatio="xMidYMid slice" focusable="false">
          <title>Placeholder</title>
          <rect width="100%" height="100%" fill="#868e96"></rect>
          <text x="50%" y="50%" fill="#dee2e6" dy=".3em">Image cap</text>
        </svg>
        <div class="card-header bg-black text-bg-dark">
          <p class="text-center card-text">
            Categoria
          </p>
        </div>
      </div>
    </div>

html 2

<section class="pb-4 bg-black text-bg-dark">

    <h2 class="text-center py-3">Conheça todas as nossas facilidades</h2>

    <div class="d-flex flex-column flex-lg-row align-items-center justify-content-center gap-3 px-3">
      <div class="divs-facilidades d-flex align-items-center">
        <div><i class="verde-limao bi bi-x-diamond fs-1"></i></div>
        <div>
          <div class="ms-3 mb-1 verde-limao">PAGUE PELO PIX</div>
          <div class="texto-menor ms-3">Ganhe 5% OFF em
            pagamentos via PIX</div>
        </div>
      </div>

      <div class="divs-facilidades d-flex">
        <div><i class="verde-limao bi bi-arrow-repeat fs-1"></i></div>
        <div>
          <div class="ms-3 mb-1 verde-limao">TROCA GRÁTIS</div>
          <div class="texto-menor ms-3">Fique livre para trocar em até 30 dias.</div>
        </div>
      </div>

      <div class="divs-facilidades d-flex">
        <div><i class="verde-limao bi bi-flower1 fs-1"></i></div>
        <div>
          <div class="ms-3 mb-1 verde-limao">SUSTENTABILIDADE</div>
          <div class="texto-menor ms-3">Moda responsável, que respeita o meio ambiente.</div>
        </div>
      </div>
    </div>

  </section>

html 3

<footer class="text-center bg-black text-bg-dark">
    <p class="card-text py-3">2023 <i class="bi bi-c-circle"></i> Desenvolvido por Alura | Projeto fictício sem fins comerciais.</p>
  </footer>

html 4

        <div class="col-12 col-md-6 col-xxl-4 pb-4">
      <div class="card">
        <svg class="bd-placeholder-img card-img-top" width="100%" height="180" xmlns="http://www.w3.org/2000/svg"
          role="img" aria-label="Placeholder: Image cap" preserveAspectRatio="xMidYMid slice" focusable="false">
          <title>Placeholder</title>
          <rect width="100%" height="100%" fill="#868e96"></rect><text x="50%" y="50%" fill="#dee2e6" dy=".3em">Image
            cap</text>
        </svg>
        <div class="card-body">
          <h5 class="card-title">Produto</h5>
          <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's
            content.</p>
          <p>R$30,00</p>
          <a href="#" class="btn btn-primary botao-lilas rounded-0 border-0">Ver mais</a>
        </div>
      </div>
    </div>

O meu deu erro!