Why does the horizontal scroll of the block on the page not always work?

Question

JavaScript

Good afternoon.
Added on the main block with a horizontal scroll.
Nothing special, just rotated one div through transform rotate, and rotated it back in the wrapper.
The problem is that when I scroll the page and reach this block, sometimes the page scrolls further, and the horizontal scroll does not work.

Why?

And yet, I made that when scrolling, when 200px remains before the block, the browser automatically centers this block.

Here is the code

let horizontalScroll = function () {
    if ($(window).width() > 992) {

      function chk_scroll(e) {
        let elem = $(e.currentTarget);

        if (Math.round(elem[0].scrollHeight - elem.scrollTop()) === elem.outerHeight()) {
          return true;
        }

      }

      let windowHeight = $(window).height();

      let productsBlockFirst = $('#js-products-block-first');
      let productsBlockMainHeader = $('#js-products-block-first .products-block__main-header');
      let productsBlockFirstHeight = productsBlockFirst.innerHeight() - productsBlockMainHeader.innerHeight();
      let productsBlockFirstOffsetTop = productsBlockFirst.offset().top + productsBlockMainHeader.innerHeight();

      $('.products-block').each(function () {
        let productsBlockOutWrapper = $(this).find('.products-block__outer-wrapper');
        let productsBlockOutWrapperOffsetTop = productsBlockOutWrapper.offset().top;
        let productsBlockOutWrapperScrollTop = productsBlockOutWrapper.scrollTop();
        let productsBlockOutWrapperHeight = productsBlockOutWrapper.innerHeight();
        let productsBlockOutWrapperOffsetBottom = productsBlockOutWrapperOffsetTop + productsBlockOutWrapperHeight;
        let productsBlockOutWrapperScrollHeight = document.getElementsByClassName('products-block__outer-wrapper')[0].scrollHeight;
        let productsBlockWrapperHeight = $('.products-block__wrapper').innerHeight();


        let scrollCenter = productsBlockFirstOffsetTop - ((windowHeight - productsBlockFirstHeight) / 2);

        let iScrollPos = 0;

        let flag = false;

        productsBlockOutWrapper.scroll(function (e) {
          let currentScroll = $(this).scrollTop();


          if (flag === false) {
            $('html, body').animate({
              scrollTop: scrollCenter
            });
            flag = true;
          }

          if (currentScroll === 0) {
            $('html, body').animate({
              scrollTop: productsBlockOutWrapperOffsetTop - 900
            });
            flag = false;
          } else if (currentScroll > iScrollPos) {
            if (chk_scroll(e)) {
              $('html, body').animate({
                scrollTop: productsBlockOutWrapperOffsetTop + 800
              });

              flag = false;
            }
          }

          iScrollPos = currentScroll;
        });
      });
    }

  }
  horizontalScroll();

Link to ideagelato.cf

Thank you in advance for the hint.