.hero{
    text-align: center;
    padding: 8rem 0 18rem 0;
}
.hero__titulo{
  font-size: 3.5rem;
  font-weight: 700;
  margin: 0;
  line-height: 1.1;
}
.hero__descripcion{
  font-size: 1.6rem;
  font-weight: 400;
  margin: 1rem 0 0 0;
  color: var(--color-parrafo);
}
@media (min-width: 768px) {
  .hero__titulo{
    font-size: 4rem;
  }
  .hero__descripcion{
    font-size: 1.8rem;
  }
}
@media (min-width: 1024px) {
   .hero__titulo{
    font-size: 5.5rem;
   }
   .hero__descripcion{
    font-size: 2rem;
   }
}