{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "features-13",
  "title": "Features 13",
  "description": "A simple features block",
  "files": [
    {
      "path": "src/registry/blocks/shared/features-13/components/features.tsx",
      "content": "import {\n  Cable,\n  Code,\n  Contrast,\n  MonitorSmartphone,\n  SquareDashedMousePointer,\n  Zap,\n} from \"lucide-react\";\n\nconst features = [\n  {\n    title: \"Blazing Fast Performance\",\n    description:\n      \"Optimized for speed with minimal loading times and instant interactions, ensuring a smooth experience across devices.\",\n    icon: Zap,\n  },\n  {\n    title: \"Fully Customizable\",\n    description:\n      \"Tailor every component to match your brand or workflow — with built-in support for themes, layouts, and configurations.\",\n    icon: SquareDashedMousePointer,\n  },\n  {\n    title: \"Developer-Friendly\",\n    description:\n      \"Built with clean, modern code and best practices in mind, making it easy to integrate, extend, and scale.\",\n    icon: Code,\n  },\n  {\n    title: \"Responsive by Default\",\n    description:\n      \"Every component is designed to look great on all screen sizes — no extra work needed to make things mobile-friendly.\",\n    icon: MonitorSmartphone,\n  },\n  {\n    title: \"Accessible for Everyone\",\n    description:\n      \"Built with accessibility best practices in mind to ensure an inclusive experience for all users, regardless of ability.\",\n    icon: Contrast,\n  },\n  {\n    title: \"Seamless Integration\",\n    description:\n      \"Easily connect with your favorite tools, APIs, and services — whether it's authentication, databases, or third-party libraries.\",\n    icon: Cable,\n  },\n];\n\nconst Features = () => {\n  return (\n    <div className=\"mx-auto flex max-w-7xl flex-col px-6 py-20\">\n      <h2 className=\"text-pretty text-center font-medium text-4xl tracking-[-0.04em] sm:text-[2.75rem]\">\n        Engineered for speed\n      </h2>\n      <p className=\"mt-3 text-pretty text-center text-muted-foreground text-xl -tracking-[0.01em] sm:text-2xl\">\n        Designed for speed, flexibility, and ease of use\n      </p>\n\n      <div className=\"mt-20 grid grid-cols-1 gap-6 sm:grid-cols-2 lg:grid-cols-3\">\n        {features.map((feature, index) => (\n          <div\n            className=\"relative overflow-hidden rounded-xl border bg-card p-6 dark:border-card-foreground/7\"\n            key={index}\n          >\n            <div className=\"flex h-10 w-10 items-center justify-center rounded-lg bg-primary/5 text-primary dark:bg-primary/10\">\n              <feature.icon />\n            </div>\n            <h3 className=\"mt-5 font-medium text-lg tracking-[-0.005em]\">\n              {feature.title}\n            </h3>\n            <p className=\"mt-2 text-foreground/80\">{feature.description}</p>\n\n            <div\n              className=\"absolute inset-0 -top-px z-0\"\n              style={{\n                backgroundImage: `\n        linear-gradient(to right, var(--border) 1px, transparent 1px),\n        linear-gradient(to bottom, var(--border) 1px, transparent 1px)\n      `,\n                backgroundSize: \"20px 20px\",\n                backgroundPosition: \"0 0, 0 0\",\n                maskImage: `\n          repeating-linear-gradient(\n              to right,\n              black 0px,\n              black 3px,\n              transparent 3px,\n              transparent 8px\n            ),\n            repeating-linear-gradient(\n              to bottom,\n              black 0px,\n              black 3px,\n              transparent 3px,\n              transparent 8px\n            ),\n            radial-gradient(ellipse 100% 80% at 100% 0%, #000 50%, transparent 100%)\n      `,\n                WebkitMaskImage: `\n    repeating-linear-gradient(\n              to right,\n              black 0px,\n              black 3px,\n              transparent 3px,\n              transparent 8px\n            ),\n            repeating-linear-gradient(\n              to bottom,\n              black 0px,\n              black 3px,\n              transparent 3px,\n              transparent 8px\n            ),\n            radial-gradient(ellipse 80% 80% at 100% 0%, #000 50%, transparent 90%)\n      `,\n                maskComposite: \"intersect\",\n                WebkitMaskComposite: \"source-in\",\n              }}\n            />\n          </div>\n        ))}\n      </div>\n    </div>\n  );\n};\n\nexport default Features;\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:block"
}