{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "testimonial-1",
  "title": "Testimonial Exemple 1",
  "description": "Frequently asked questions section with collapsible items.",
  "dependencies": [
    "framer-motion",
    "lucide-react"
  ],
  "files": [
    {
      "path": "registry/default/blocks/Testimonial/testimonial1.tsx",
      "content": "\"use client\";\n\nimport { motion, Variants } from \"framer-motion\";\nimport Image from \"next/image\";\n\n/* ─── Types ─── */\ninterface Testimonial {\n    id: number;\n    quote: string;\n    author: string;\n    location: string;\n    avatar: string;\n    variant: \"white\" | \"muted\" | \"dark\";\n}\n\n/* ─── Data ─── */\nconst testimonials: Testimonial[] = [\n    {\n        id: 1,\n        quote:\n            '\"The process of buying our home was as stress-free as we could have imagined.\"',\n        author: \"Janie Stewart\",\n        location: \"Idaho, USA.\",\n        avatar: \"https://i.pravatar.cc/80?img=47\",\n        variant: \"white\",\n    },\n    {\n        id: 2,\n        quote:\n            '\"We have had two great experiences working with Realty Group, as they sold two of our homes. They were professional, attentive, and patient.\"',\n        author: \"Madison Wilson\",\n        location: \"Idaho, USA.\",\n        avatar: \"https://i.pravatar.cc/80?img=32\",\n        variant: \"muted\",\n    },\n    {\n        id: 3,\n        quote:\n            \"Great experience working with Realty Group, especially as a first time buyer!\",\n        author: \"Rosa Smith\",\n        location: \"Idaho, USA.\",\n        avatar: \"https://i.pravatar.cc/80?img=25\",\n        variant: \"dark\",\n    },\n];\n\n/* ─── Variants map ─── */\nconst variantStyles = {\n    white: {\n        card: \"bg-white border border-[#e2e8f0]\",\n        quote: \"text-[#1e293b]\",\n        author: \"text-[#0f172a]\",\n        location: \"text-[#94a3b8]\",\n        ring: \"ring-[#e2e8f0]\",\n    },\n    muted: {\n        card: \"bg-[#f1f5f9] border border-[#e2e8f0]\",\n        quote: \"text-[#1e293b]\",\n        author: \"text-[#0f172a]\",\n        location: \"text-[#94a3b8]\",\n        ring: \"ring-[#e2e8f0]\",\n    },\n    dark: {\n        card: \"bg-black border border-[#1e293b]\",\n        quote: \"text-[#f1f5f9]\",\n        author: \"text-white\",\n        location: \"text-[#64748b]\",\n        ring: \"ring-[#334155]\",\n    },\n};\n\n/* ─── Animation ─── */\nconst containerVariants: Variants = {\n    hidden: {},\n    visible: { transition: { staggerChildren: 0.14 } },\n};\n\nconst cardVariants: Variants = {\n    hidden: { opacity: 0, y: 32 },\n    visible: {\n        opacity: 1,\n        y: 0,\n        transition: { duration: 0.55, ease: [0.22, 1, 0.36, 1] },\n    },\n};\n\nconst headerVariants: Variants = {\n    hidden: { opacity: 0, y: 18 },\n    visible: { opacity: 1, y: 0, transition: { duration: 0.5, ease: \"easeOut\" } },\n};\n\n/* ─── Card ─── */\nfunction TestimonialCard({ t }: { t: Testimonial }) {\n    const s = variantStyles[t.variant];\n\n    return (\n        <motion.div\n            variants={cardVariants}\n            whileHover={{ y: -4, transition: { duration: 0.2 } }}\n            className={`${s.card} rounded-2xl p-8 flex flex-col justify-between h-full shadow-sm`}\n        >\n            {/* Quote */}\n            <p className={`${s.quote} text-[17px] leading-relaxed font-normal flex-1`}>\n                {t.quote}\n            </p>\n\n            {/* Divider */}\n            <div className={`my-6 h-px ${t.variant === \"dark\" ? \"bg-[#1e293b]\" : \"bg-[#e2e8f0]\"}`} />\n\n            {/* Author */}\n            <div className=\"flex items-center gap-3\">\n                <div\n                    className={`relative w-11 h-11 rounded-full overflow-hidden ring-2 ${s.ring} flex-shrink-0`}\n                >\n                    <Image src={t.avatar} alt={t.author} fill className=\"object-cover\" />\n                </div>\n                <div>\n                    <p className={`text-sm font-semibold ${s.author} leading-tight`}>{t.author}</p>\n                    <p className={`text-sm ${s.location} mt-0.5`}>{t.location}</p>\n                </div>\n            </div>\n        </motion.div>\n    );\n}\n\n/* ─── Section ─── */\nexport default function TestimonialsSection1() {\n    return (\n        <section className=\"w-full py-24 px-4\">\n            <div className=\"max-w-5xl mx-auto\">\n\n                {/* ── Header ── */}\n                <motion.div\n                    className=\"text-center mb-16\"\n                    initial=\"hidden\"\n                    whileInView=\"visible\"\n                    viewport={{ once: true, margin: \"-80px\" }}\n                    variants={containerVariants}\n                >\n                    {/* Eyebrow */}\n                    <motion.div\n                        variants={headerVariants}\n                        className=\"flex items-center justify-center gap-2 mb-5\"\n                    >\n                        <span className=\"w-2 h-2 rounded-full bg-[#ef4444] inline-block\" />\n                        <span className=\"text-[11px] font-semibold tracking-[0.2em] uppercase text-[#64748b]\">\n              Review\n            </span>\n                    </motion.div>\n\n                    {/* Title */}\n                    <motion.h2\n                        variants={headerVariants}\n                        className=\"text-[2.6rem] sm:text-5xl font-semibold text-[#0f172a] leading-[1.1] tracking-tight mb-5\"\n                    >\n                        Real State success{\" \"}\n                        <em className=\"font-serif italic font-normal\">stories</em>\n                    </motion.h2>\n\n                    {/* Subtitle */}\n                    <motion.p\n                        variants={headerVariants}\n                        className=\"text-[#64748b] text-base leading-relaxed max-w-md mx-auto\"\n                    >\n                        Our goal is to provide clients with an exceptional real estate experience,\n                        offering top-tier service every step of the way.\n                    </motion.p>\n                </motion.div>\n\n                {/* ── Cards grid ── */}\n                <motion.div\n                    className=\"grid grid-cols-1 md:grid-cols-3 gap-5\"\n                    initial=\"hidden\"\n                    whileInView=\"visible\"\n                    viewport={{ once: true, margin: \"-60px\" }}\n                    variants={containerVariants}\n                >\n                    {testimonials.map((t) => (\n                        <TestimonialCard key={t.id} t={t} />\n                    ))}\n                </motion.div>\n            </div>\n        </section>\n    );\n}",
      "type": "registry:block",
      "target": "components/blocks/testimonial-ex-1.tsx"
    }
  ],
  "type": "registry:block"
}