var initHeroSlices = function () {
    ScrollTrigger.saveStyles('.hero-slices > *');

    ScrollTrigger.matchMedia({
        '(min-width: 992px)': function () {
            var timeline = gsap.timeline({
                scrollTrigger: {
                    trigger: '.hero-slices',
                    pin: true,
                    start: 'top top',
                    scrub: 1
                }
            });

            timeline
                .add('start')
                .from('.hero-slices__background--left', {
                    yPercent: -40
                }, 'start')
                .from('.hero-slices__text--left', {
                    y: -300
                }, 'start')
                .from('.hero-slices__background--right', {
                    yPercent: 60
                }, 'start')
                .from('.hero-slices__text--right', {
                    y: 200
                }, 'start')
                // Empty tween to add delay at the end
                .to({}, { duration: 0.25 });
        }
    });
};

initHeroSlices();