{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"dusk-hero-section-10","type":"registry:block","title":"Hero Section 10","description":"Tailark Dusk hero-section variant 10 block","registryDependencies":["@tailark-oss/dusk-button","@tailark-oss/dusk-hero-section-10-header","@tailark-oss/dusk-hero-section-10-logo-cloud"],"meta":{"aspect-ratio":"40/31","width":686,"height":532},"files":[{"path":"dusk/blocks/hero-section/ten/hero-section.tsx","type":"registry:component","target":"@components/hero-section-10.tsx","content":"import { Button } from '@/components/ui/button'\nimport { ArrowRight } from 'lucide-react'\nimport Image from 'next/image'\nimport Link from 'next/link'\nimport { HeroHeader } from '@/components/hero-section-10-header'\nimport LogoCloud from '@/components/hero-section-10-logo-cloud'\n\nexport default function HeroSection() {\n    return (\n        <>\n            <HeroHeader />\n\n            <main>\n                <section className=\"pt-40 xl:pt-48\">\n                    <div className=\"mx-auto max-w-7xl px-6\">\n                        <div className=\"grid items-end gap-4 md:grid-cols-2 md:gap-6\">\n                            <h1 className=\"text-balance text-4xl font-medium tracking-tight md:text-5xl\">Build Software businesses can rely on</h1>\n                            <div className=\"flex max-w-md flex-col gap-4 md:mx-auto\">\n                                <p className=\"text-muted-foreground text-balance text-lg\">Leads, deals, tasks, and conversations. </p>\n\n                                <Button\n                                    className=\"w-fit\"\n                                    asChild\n                                >\n                                    <Link href=\"#\">Get Started</Link>\n                                </Button>\n                            </div>\n                        </div>\n\n                        <div className=\"bg-muted relative mt-16 overflow-hidden rounded-xl px-4 pt-6 max-lg:-mx-4 md:px-6 lg:px-8 lg:pt-16\">\n                            <div className=\"aspect-3/2 relative z-10 mx-auto flex max-w-5xl -space-x-12 sm:aspect-video lg:-space-x-56\">\n                                <div className=\"w-2/3 pt-6 lg:pt-16\">\n                                    <div className=\"ring-foreground/6.5 bg-card h-full rounded-t-2xl shadow-2xl shadow-black/35 ring\"></div>\n                                </div>\n                                <div className=\"ring-foreground/6.5 bg-card relative h-full w-2/3 rounded-t-2xl shadow-2xl shadow-black/35 ring\"></div>\n                            </div>\n\n                            <Image\n                                src=\"https://images.unsplash.com/photo-1451337516015-6b6e9a44a8a3?q=80&w=1974&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D\"\n                                alt=\"landscape image\"\n                                width={2215}\n                                height={1477}\n                                sizes=\"(max-width: 768px) 100vw, 1280px\"\n                                className=\"absolute inset-0 size-full object-cover\"\n                            />\n                        </div>\n                    </div>\n                </section>\n                <LogoCloud />\n            </main>\n        </>\n    )\n}\n"}]}