.typography-block {
  width: 100%;
  background-color: #9f0000; /* ajuste conforme sua preferência */
  opacity: 0;
  padding: 80px auto;
  transform: translateY(-30px);
  transition: all 0.6s ease-out;
}

.typography-block.slide-down {
  opacity: 1;
  transform: translateY(0);
}

.typography-block h2 {
  margin: 0;
  font-family: 'Roboto Slab', serif;
  font-size: 1.8rem;
  color: white;
}


.font-light,
.font-bold {
  opacity: 0;
  transform: translateY(30px);
  transition: all 0.6s ease-out;
}

.font-light.fade-up,
.font-bold.fade-up {
  opacity: 1;
  transform: translateY(0);
}

.typography-block .font-light {
  font-size: 1.6rem;
  font-weight: 100;
}

.typography-block .font-bold {
  font-weight: 500;
  text-transform: uppercase;
}

@media (max-width: 768px) {
  .typography-block h2 {
    font-size: 1.2rem;
  }
}