body {
  background-color: var(--red);
  overflow: hidden;
}

.wrapper {
  color: var(--white);
  width: 100%;
  height: 100vh;
  line-height: 4rem;
  transform: translateY(-30px);
  position: relative;
}

.line-left {
  display: flex;
  font-size: 14rem;
  font-family: Adobe;
  font-variation-settings: "wdth" 1, "HGHT" 0;
  color: var(--black);
  transform: translateX(-1300px);
  animation: line-left 3s infinite alternate ease-in-out;
}

.line-right {
  display: flex;
  font-size: 14rem;
  font-family: Adobe;
  font-variation-settings: "wdth" 1, "HGHT" 0;
  color: var(--black);
  transform: translateX(0px);
  animation: line-right 3s infinite alternate ease-in-out;
}

@keyframes line-left {
  from {
  }
  to {
    transform: translateX(0px);
    font-variation-settings: "wdth" 500, "HGHT" 500;
    letter-spacing: 5px;
  }
}

@keyframes line-right {
  from {
  }
  to {
    transform: translateX(-1300px);
    font-variation-settings: "wdth" 500, "HGHT" 500;
    letter-spacing: 5px;
  }
}