{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"dusk-team-1","type":"registry:block","title":"Team 1","description":"Tailark Dusk team variant 1 block","registryDependencies":["@tailark-oss/dusk-button"],"meta":{"aspect-ratio":"90/81","width":686,"height":617},"files":[{"path":"dusk/blocks/team/one.tsx","type":"registry:component","target":"@components/team-1.tsx","content":"import Link from 'next/link'\nimport Image from 'next/image'\nimport { Button } from '@/components/ui/button'\n\nconst members = [\n    {\n        name: 'Marcus Chen',\n        role: 'Head of Product',\n        avatar: 'https://images.unsplash.com/photo-1564564321837-a57b7070ac4f?q=80&w=2352&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D',\n    },\n    {\n        name: 'Sofia Ramirez',\n        role: 'Revenue Operations Lead',\n        avatar: 'https://images.unsplash.com/photo-1633625763717-045645e9e739?q=80&w=1287&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D',\n    },\n    {\n        name: 'Ethan Brooks',\n        role: 'Founder & CEO',\n        avatar: 'https://images.unsplash.com/photo-1758922584983-82ffd5720c6a?q=80&w=1331&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D',\n    },\n    {\n        name: 'Maya Patel',\n        role: 'Customer Success Manager',\n        avatar: 'https://images.unsplash.com/photo-1534528741775-53994a69daeb?q=80&w=1364&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D',\n    },\n    {\n        name: 'Nora Williams',\n        role: 'Product Designer',\n        avatar: 'https://images.unsplash.com/photo-1605661107759-587d4bfdf168?q=80&w=1364&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D',\n    },\n    {\n        name: 'Daniel Kim',\n        role: 'Co-Founder & CTO',\n        avatar: 'https://images.unsplash.com/photo-1563237023-b1e970526dcb?q=80&w=1365&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D',\n    },\n    {\n        name: 'Julian Parker',\n        role: 'Staff Software Engineer',\n        avatar: 'https://images.unsplash.com/photo-1506794778202-cad84cf45f1d?q=80&w=1287&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D',\n    },\n    {\n        name: 'Noah Wilson',\n        role: 'Sales Engineering Lead',\n        avatar: 'https://images.unsplash.com/photo-1628157588553-5eeea00af15c?q=80&w=1480&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D',\n    },\n]\n\nexport default function TeamSection() {\n    return (\n        <section className=\"py-16 md:py-20\">\n            <div className=\"mx-auto max-w-7xl px-6\">\n                <div className=\"grid grid-cols-[auto_1fr] items-center gap-4\">\n                    <span className=\"text-muted-foreground block text-sm\">Team</span>\n                    <span className=\"bg-border h-px w-full\" />\n                </div>\n                <div className=\"mt-12 grid gap-4 md:mt-24 md:grid-cols-2 md:gap-6 lg:gap-12\">\n                    <div className=\"sm:w-2/5\">\n                        <h2 className=\"text-4xl font-medium tracking-tight\">Our dream team</h2>\n                    </div>\n                    <div className=\"space-y-4\">\n                        <p className=\"text-muted-foreground text-lg\">During the working process, we perform regular fitting with the client because he is the only person who can feel whether a new suit fits or not.</p>\n                        <Button\n                            asChild\n                            variant=\"outline\"\n                        >\n                            <Link href=\"#\">See pending roles</Link>\n                        </Button>\n                    </div>\n                </div>\n                <div className=\"mt-12 md:mt-24\">\n                    <div className=\"grid gap-12 sm:grid-cols-2 lg:grid-cols-4\">\n                        {members.map((member, index) => (\n                            <div\n                                key={index}\n                                className=\"group\"\n                            >\n                                <div className=\"aspect-square overflow-hidden transition-all duration-200 [clip-path:inset(0_0_0_0_round_12px)] group-hover:[clip-path:inset(0_0_4px_0_round_16px)]\">\n                                    <Image\n                                        className=\"size-full object-cover object-top grayscale\"\n                                        src={member.avatar}\n                                        alt=\"team member\"\n                                        width=\"826\"\n                                        height=\"1239\"\n                                        sizes=\"(max-width: 768px) 100vw, 280px\"\n                                    />\n                                </div>\n                                <div className=\"pt-3\">\n                                    <h3 className=\"font-medium\">{member.name}</h3>\n                                    <p className=\"text-muted-foreground inline-block text-sm\">{member.role}</p>\n                                </div>\n                            </div>\n                        ))}\n                    </div>\n                </div>\n            </div>\n        </section>\n    )\n}\n"}]}