document.addEventListener("DOMContentLoaded", () => {
  function updateCharactersOffset() {
    const charactersWrapper = document.querySelector(".characters");
    const MAX_OFFSET = 7;
    const SPEED = 0.6;

    const topSpace = Math.max(0, MAX_OFFSET - (window.scrollY / 16) * SPEED);
    charactersWrapper.style.setProperty("--offset", topSpace + "rem");
  }

  window.addEventListener("scroll", updateCharactersOffset);
});