.typing h1{
  width: max-content;
  position: relative;
  font-weight: 900;
}
.typing h1::before, h1::after{
  content: '';
  position: absolute;
  inset: 0;
}

.typing h1::before{
  background: white;
  animation: typing 5000ms steps(25) 2s forwards;
}

.typing h1::after{
  width: .2rem;
  background: black;
  animation: typing 5000ms steps(25) 2s forwards, blink 800ms infinite;
}

.about-intro .typing h1{
  font-size: 3.5rem;
  margin-bottom: 2rem;
}

@keyframes typing{
  to{
    left: 100%;
  }
}

@keyframes blink{
  to{
    background: transparent;
  }
}

@media (max-width: 576px) {
  .section-foreword .typing h1{
    font-size: 1.6rem;
  }
  .about-intro .typing h1{
      font-size: 1.8rem;      
  }
}