{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "features-numbered-grid",
  "title": "Features — Numbered Grid",
  "type": "registry:block",
  "files": [
    {
      "path": "packages/registry-react/blocks/features-numbered-grid/FeaturesNumberedGrid.tsx",
      "content": "'use client'\n\nimport { ArrowRight, Boxes, Clock, GitBranch, Lock, Receipt, Signal } from 'lucide-react'\nimport { Badge } from '@/components/ui/badge'\nimport { Button } from '@/components/ui/button'\n\nconst features = [\n  {\n    icon: GitBranch,\n    title: 'Definitions under review',\n    body: 'Metrics live in the repo. Changing one opens a pull request with a diff, an owner, and a revert path.',\n  },\n  {\n    icon: Lock,\n    title: 'Access at query time',\n    body: 'Scope resolves from your identity provider on every query, so a shared link cannot outrun permissions.',\n  },\n  {\n    icon: Clock,\n    title: 'Freshness you choose',\n    body: 'Materialise the hot aggregates on a schedule; let everything else fall through to the warehouse.',\n  },\n  {\n    icon: Receipt,\n    title: 'Cost ceilings per team',\n    body: 'Query budgets are enforced where the query runs, not reconciled from an invoice a month later.',\n  },\n  {\n    icon: Signal,\n    title: 'Drift alerting',\n    body: 'Threshold and anomaly alerts fire against certified metrics, so nobody debates the trigger.',\n  },\n  {\n    icon: Boxes,\n    title: 'Embedding without forks',\n    body: 'Signed, scoped URLs render the same dashboards inside your product with the viewer’s own permissions.',\n  },\n]\n\nexport function FeaturesNumberedGrid() {\n  return (\n    <section data-slot=\"features-numbered-grid\" className=\"bg-background\">\n      <div className=\"mx-auto max-w-6xl px-6 py-20 lg:py-28\">\n        <div className=\"flex flex-wrap items-end justify-between gap-6\">\n          <div className=\"max-w-2xl\">\n            <Badge variant=\"secondary\">How it holds up</Badge>\n            <h2 className=\"mt-4 text-3xl font-semibold tracking-tight sm:text-4xl\">\n              Six decisions, in order of impact\n            </h2>\n          </div>\n          <Button variant=\"outline\">\n            Read the architecture notes\n            <ArrowRight className=\"ml-2 size-4\" aria-hidden=\"true\" />\n          </Button>\n        </div>\n\n        {/* gap-px over a border-coloured ground draws hairline rules between\n            cells, so the grid reads as one table rather than six floating cards. */}\n        <div className=\"bg-border border-border mt-10 grid gap-px overflow-hidden rounded-xl border sm:grid-cols-2 lg:grid-cols-3\">\n          {features.map((feature, index) => (\n            <article key={feature.title} className=\"bg-background p-6\">\n              <div className=\"flex items-center gap-3\">\n                <span className=\"text-muted-foreground/70 font-mono text-xs\">{String(index + 1).padStart(2, '0')}</span>\n                <feature.icon className=\"text-muted-foreground size-4\" aria-hidden=\"true\" />\n              </div>\n              <h3 className=\"mt-4 text-base font-semibold\">{feature.title}</h3>\n              <p className=\"text-muted-foreground mt-2 text-sm leading-relaxed\">{feature.body}</p>\n            </article>\n          ))}\n        </div>\n      </div>\n    </section>\n  )\n}\n",
      "type": "registry:block",
      "target": "~/components/blocks/FeaturesNumberedGrid.tsx"
    }
  ],
  "dependencies": [
    "lucide-react"
  ],
  "devDependencies": [],
  "registryDependencies": [
    "https://uipkge.dev/r/react/badge.json",
    "https://uipkge.dev/r/react/button.json"
  ],
  "description": "Six-cell feature grid drawn with one-pixel dividers instead of cards, each cell led by a monospace ordinal, an icon, a title, and two lines of supporting copy.",
  "categories": [
    "marketing"
  ]
}