Hybrid scroll and allow reverse path (JS)

Question

I'm a beginner in the world of coding. I understand CSS and HTML but javascript remains difficult for me.

I am asking for your help because I would like to set a hybrid scroll (first horizontally on sections 1, 2 and 3) then vertical scroll for the 'shop' section but also allow the reverse path.

Here is my JS:

const postScroll = document.getElementById("root");
let scrollingHorizontally = true;

postScroll.addEventListener("wheel", (event) => {
  if (scrollingHorizontally) {
    postScroll.scrollBy({
      left: event.deltaY < 0 ? -70 : 70,
    });

    event.preventDefault();

    // check if the user has reached the end of the slider
    if (postScroll.scrollLeft >= postScroll.scrollWidth - postScroll.clientWidth) {
      scrollingHorizontally = false;
      postScroll.style.overflowY = "auto";
    }
  } else {
    // (scroll the page up/down)
    return true;
  }

    // Come back
    if (postScroll.scrollRight >= postScroll.scrollWidth - postScroll.clientWidth) {
      scrollingHorizontally = true;
      postScroll.style.overflowY = "auto";
    }
});

And if you need the full code:

[codepen] https://codepen.io/Havazu/pen/ZEwQwJq

I managed to apply the horizontal scroll then switch to vertical when the end of section 3 is reached but I cannot go back the other way once I have switched to vertical scroll (so 3, 2, 1).

I've been stuck for several weeks, so any help is welcome!! Thank you in advance for your help!