.sentence {

  display: inline;
 /* your original inline text layout */
  white-space: normal;

	color: var(--colors--dark-grey);

  font-family: var(--font-family--main);

  font-size: var(--typography--p);

  letter-spacing: -0.05em;

}


.rotating-wrapper {

  display: inline-block;

  position: relative;

}


.rotating-word {

  opacity: 0;

  display: inline-block;

  white-space: nowrap;

  padding: var(--spacers--8);

  border-style: solid;

  border-color: var(--colors--neon-yellow);

  border-width: 1px;

	color: var(--colors--white);

  margin-left: var(--spacers--8);

  margin-right: var(--spacers--8);

}

@media (max-width: 767px) {

  .sentence {

    display: flex;

    flex-direction: column;

    align-items: flex-start;
 /* or center */
    gap: var(--spacers--8);

  }


  /* Make each piece of text behave like a block on mobile */
  .static-left,
  .rotating-wrapper,
  .static-right {

    display: block;

    width: 100%;

  }

}