motion.jsx

const container = {
  hidden: { opacity: 0 },
  show: {
    opacity: 1,
    transition: {
      staggerChildren: 0.25,
    },
  },
}

const item = {
  hidden: { opacity: 0, y: 75 },
  show: {
    opacity: 1,
    y: 0,
  },
}

<motion.section
  variants={container}
  initial="hidden"
  whileInView="show"
  viewport={{ once: true, amount: 0.5 }}
>
  <motion.div variants={item}>....</motion.div>
  <motion.div variants={item}>....</motion.div>
  <motion.div variants={item}>....</motion.div>
</motion.section>