{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"dusk-content-3","type":"registry:block","title":"Content 3","description":"Tailark Dusk content variant 3 block","meta":{"aspect-ratio":"90/55","width":686,"height":419},"files":[{"path":"dusk/blocks/content/three.tsx","type":"registry:component","target":"@components/content-3.tsx","content":"import { Cpu, Zap } from 'lucide-react'\nimport Image from 'next/image'\n\nexport default function ContentSection() {\n    return (\n        <section className=\"overflow-hidden py-16 md:py-20\">\n            <div className=\"mx-auto max-w-7xl space-y-8 px-6 md:space-y-16\">\n                <div className=\"max-w-2xl max-lg:pr-6\">\n                    <h2 className=\"text-balance text-4xl font-medium tracking-tight md:text-5xl lg:text-6xl\">Workspace for every customer relationship.</h2>\n                </div>\n                <div className=\"grid items-center gap-6 lg:grid-cols-3 lg:gap-20\">\n                    <div className=\"mask-b-from-foreground relative max-lg:-mr-6 lg:col-span-2\">\n                        <div className=\"relative overflow-hidden p-px max-sm:-mr-56\">\n                            <div className=\"bg-background ring-foreground/6.5 before:mask-radial-at-top-left before:mask-radial-from-65% before:mask-radial-[100%_60%] before:ring-foreground before:border-foreground/10 relative rounded-2xl p-2 shadow-xl shadow-black/50 ring before:absolute before:-inset-px before:z-10 before:size-56 before:rounded-tl-2xl before:border-l before:border-t\">\n                                <div className=\"bg-foreground/2 z-1 absolute inset-0 rounded-2xl\" />\n                                <Image\n                                    className=\"bg-background aspect-15/8 relative rounded-2xl\"\n                                    src=\"/mail2.png\"\n                                    alt=\"app screen\"\n                                    width=\"2700\"\n                                    height=\"1440\"\n                                />\n                            </div>\n                        </div>\n                    </div>\n\n                    <div className=\"relative space-y-4\">\n                        <p className=\"text-muted-foreground text-balance text-2xl\">Tailark keeps pipeline, conversations, tasks, and account history connected so teams can spot the next best move.</p>\n\n                        <div className=\"grid gap-4 pt-6 sm:grid-cols-2\">\n                            <p className=\"text-muted-foreground text-balance\">\n                                <span className=\"text-foreground font-medium\">\n                                    <Zap className=\"inline size-4 -translate-y-0.5\" /> Fast.\n                                </span>{' '}\n                                Move from signal to follow-up without losing context.\n                            </p>\n\n                            <p className=\"text-muted-foreground text-balance\">\n                                <span className=\"text-foreground font-medium\">\n                                    <Cpu className=\"inline size-4 -translate-y-0.5\" /> Powerful.\n                                </span>{' '}\n                                Unify pipeline, tasks, and account history.\n                            </p>\n                        </div>\n                    </div>\n                </div>\n            </div>\n        </section>\n    )\n}\n"}]}