{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"mist-pricing-1","type":"registry:block","title":"Pricing 1","description":"Tailark Mist pricing variant 1 block","registryDependencies":["@tailark-oss/mist-button","@tailark-oss/mist-card","@tailark-oss/core-spotify","@tailark-oss/core-supabase","@tailark-oss/core-vercel"],"meta":{"aspect-ratio":"80/51","width":686,"height":437},"files":[{"path":"mist/blocks/pricing/one.tsx","type":"registry:component","target":"@components/pricing-1.tsx","content":"import { Button } from '@/components/ui/button'\nimport { Check } from 'lucide-react'\nimport Link from 'next/link'\nimport { Card } from '@/components/ui/card'\nimport { Spotify } from '@/components/ui/svgs/spotify'\nimport { SupabaseFull } from '@/components/ui/svgs/supabase'\nimport { VercelFull } from '@/components/ui/svgs/vercel'\n\nexport default function Pricing() {\n    return (\n        <div className=\"bg-muted relative py-16 md:py-20\">\n            <div className=\"mx-auto max-w-5xl px-6\">\n                <div className=\"mx-auto max-w-2xl text-center\">\n                    <h2 className=\"text-balance text-3xl font-bold md:text-4xl lg:text-5xl\">Pricing that scale with your business</h2>\n                    <p className=\"text-muted-foreground mx-auto mt-4 max-w-md text-balance text-lg\">Choose the perfect plan for your needs and start optimizing your workflow today</p>\n                </div>\n                <div className=\"mt-8 md:mt-16\">\n                    <Card className=\"relative\">\n                        <div className=\"grid items-center gap-12 divide-y p-12 md:grid-cols-2 md:divide-x md:divide-y-0\">\n                            <div className=\"pb-12 text-center md:pb-0 md:pr-12\">\n                                <h3 className=\"text-2xl font-semibold\">Suite Enterprise</h3>\n                                <p className=\"mt-2 text-lg\">For your company of any size</p>\n                                <span className=\"mb-6 mt-12 inline-block text-6xl font-bold\">\n                                    <span className=\"text-4xl\">$</span>234\n                                </span>\n\n                                <div className=\"flex justify-center\">\n                                    <Button\n                                        asChild\n                                        size=\"lg\"\n                                    >\n                                        <Link href=\"#\">Get started</Link>\n                                    </Button>\n                                </div>\n\n                                <p className=\"text-muted-foreground mt-12 text-sm\">Includes : Security, Unlimited Storage, Payment, Search engine, and all features</p>\n                            </div>\n                            <div className=\"relative\">\n                                <ul\n                                    role=\"list\"\n                                    className=\"space-y-4\"\n                                >\n                                    {['First premium advantage', 'Second advantage weekly', 'Third advantage donate to project', 'Fourth, access to all components weekly'].map((item, index) => (\n                                        <li\n                                            key={index}\n                                            className=\"flex items-center gap-2\"\n                                        >\n                                            <Check\n                                                className=\"text-primary size-3\"\n                                                strokeWidth={3.5}\n                                            />\n                                            <span>{item}</span>\n                                        </li>\n                                    ))}\n                                </ul>\n                                <p className=\"text-muted-foreground mt-6 text-sm\">Team can be any size, and you can add or switch members as needed. Companies using our platform include:</p>\n                                <div className=\"**:fill-foreground mt-6 flex items-center gap-8\">\n                                    <VercelFull\n                                        height={20}\n                                        width={76}\n                                    />\n                                    <Spotify\n                                        height={22}\n                                        width={73}\n                                    />\n                                    <SupabaseFull className=\"h-[22px]\" />\n                                </div>\n                            </div>\n                        </div>\n                    </Card>\n                </div>\n            </div>\n        </div>\n    )\n}\n"}]}