how to make gsap scroll stop for a sec then scroll next? w pin?

import { useEffect, useRef, useState } from 'react';
import React, { useLayoutEffect } from 'react';

import gsap from 'gsap';
import { ScrollTrigger } from 'gsap/ScrollTrigger';

gsap.registerPlugin(ScrollTrigger);


const ProjectsCard = ({ projectTitle, thumbnail, brief, stacks, stacksInfo, isLast }) => {

    let card_content = useRef();

    useLayoutEffect(() => {
        const ctx = gsap.context((self) => {
            const card_sections = self.selector('div');
            card_sections.forEach((card_section) => {
                gsap.from(card_section, {
                    delay: 0.5,
                    duration: 1,
                    x: -50,
                    scrollTrigger: {
                        trigger: card_section,
                        scrub: true,
                        start: 'bottom bottom',
                        end: 'top 0%',
                        ease: "elastic.out(3, 0.5)"
                    },
                });

            });
        }, card_content); // <- Scope!
        return () => ctx.revert(); // <- Cleanup!
    }, []);