Testimonial Carousel

<Carousel className="w-full max-w-4xl mx-auto">
  <CarouselContent>
    {testimonials.map((t) => (
      <CarouselItem key={t.id}>
        <div className="p-8 text-center">
          <blockquote className="text-lg italic mb-4">"{t.quote}"</blockquote>
          <div className="flex items-center justify-center gap-3">
            <Avatar>
              <AvatarImage src={t.avatar} alt={t.name} />
              <AvatarFallback>{t.initials}</AvatarFallback>
            </Avatar>
            <div className="text-left">
              <div className="font-medium text-sm">{t.name}</div>
              <div className="text-xs text-muted-foreground">{t.role}</div>
            </div>
          </div>
        </div>
      </CarouselItem>
    ))}
  </CarouselContent>
  <CarouselPrevious />
  <CarouselNext />
</Carousel>