.principal{
  background-color: #b5b5b51e;
  height: 100vh;
}

.red-card{
  content: '';
  width: 541px;
  height: 67%;
  background-color: var(--red-color);
  position: absolute;
  top: 10rem;
  right: 3rem;
  z-index: -1;
}

.red-card2{
  content: '';
  width: 541px;
  height: 53%;
  background-color: var(--red-color);
  position: absolute;
  top: 65rem;
  left: 3.5rem;
  z-index: -1;
}


.title p{
  color: var(--greymedium-color);
  font-weight: bold;
  text-align: justify;
  width: 93%;
  font-size: 20px;

}

.img-principal img{
  width: 541px;
}

.title-principal{
  margin-top: 6rem;
}

.title-principal h2{
  font-weight: bold;
  margin: 0 !important;
}

.title-principal p{
  font-weight: 600;
}

.separador-title{
  content: '';
  width: 25%;
  height: 1px;
  background: #DBDBDB;
  margin-bottom: 2rem;
}

.about{
  margin-bottom: 3rem;
}

.text-about p{
  text-align: justify;
  font-weight: 600;
}

.about-button button{
  padding: 0.5rem 3rem !important;
}

.principal h2{
  padding-top: 5rem;
}

.circle{
  padding: 3rem 0;
}

.circle i{
  background: var(--red-color);
  padding: 2rem;
  border-radius: 50%;
  font-size: 3rem;
  color: var(--white-color);
  
}

.circle p{
  font-weight: bold;
  font-size: 1.23rem;
  padding-top: 2.5rem;
}

.cards-loja .card{
  transition: 0.3s;
}

.cards-loja .card:hover{
  box-shadow: 0px 0px 10px #00000046;
}

.princ-mobile{
  margin-top: 4rem;
}

.cliente img{
  width: 300px;
}