{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "features-5",
  "type": "registry:block",
  "title": "Features 5",
  "description": "Feature list beside a light/dark product illustration.",
  "files": [
    {
      "path": "app/preview/features/five/page.tsx",
      "content": "import { Activity, DraftingCompass, Mail, Zap } from 'lucide-react'\nimport Image from 'next/image'\n\nexport default function FeaturesSection() {\n    return (\n        <section className=\"py-16 md:py-32\">\n            <div className=\"mx-auto max-w-6xl px-6\">\n                <div className=\"grid items-center gap-12 md:grid-cols-2 md:gap-12 lg:grid-cols-5 lg:gap-24\">\n                    <div className=\"lg:col-span-2\">\n                        <div className=\"md:pr-6 lg:pr-0\">\n                            <h2 className=\"text-4xl font-semibold lg:text-5xl\">Built for Scaling teams</h2>\n                            <p className=\"mt-6\">Give every team a shared workspace, clear ownership and the tooling to move fast without breaking things.</p>\n                        </div>\n                        <ul className=\"mt-8 divide-y border-y *:flex *:items-center *:gap-3 *:py-3\">\n                            <li>\n                                <Mail className=\"size-5\" />\n                                Email and web support\n                            </li>\n                            <li>\n                                <Zap className=\"size-5\" />\n                                Fast response time\n                            </li>\n                            <li>\n                                <Activity className=\"size-5\" />\n                                Menitoring and analytics\n                            </li>\n                            <li>\n                                <DraftingCompass className=\"size-5\" />\n                                Architectural review\n                            </li>\n                        </ul>\n                    </div>\n                    <div className=\"border-border/50 relative rounded-3xl border p-3 lg:col-span-3\">\n                        <div className=\"bg-linear-to-b aspect-76/59 relative rounded-2xl from-zinc-300 to-transparent p-px dark:from-zinc-700\">\n                            <Image src=\"/payments.png\" className=\"hidden rounded-[15px] dark:block\" alt=\"payments illustration dark\" width={1207} height={929} />\n                            <Image src=\"/payments-light.png\" className=\"rounded-[15px] shadow dark:hidden\" alt=\"payments illustration light\" width={1207} height={929} />\n                        </div>\n                    </div>\n                </div>\n            </div>\n        </section>\n    )\n}\n",
      "type": "registry:component",
      "target": "components/features-5.tsx"
    }
  ]
}