<ContainerScroll className="min-h-[400vh] space-y-8 py-12 place-content-center place-items-center">
  <CardSticky
    index={1}
    className="rounded-2xl border p-8 shadow-md backdrop-blur-md max-w-md"
  >
    <div className="flex items-center justify-between gap-4">
      <h2 className="my-6 text-2xl font-bold tracking-tighter">heading</h2>
      <h3 className="text-2xl font-bold text-primary">title</h3>
    </div>

    <p className="text-foreground">description</p>
  </CardSticky>
  <CardSticky
    index={2}
    className="rounded-2xl border p-8 shadow-md backdrop-blur-md max-w-md"
  >
    <div className="flex items-center justify-between gap-4">
      <h2 className="my-6 text-2xl font-bold tracking-tighter">heading 2</h2>
      <h3 className="text-2xl font-bold text-primary">title 2</h3>
    </div>

    <p className="text-foreground">description 2</p>
  </CardSticky>
</ContainerScroll>