{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "glassmorphism-minimal-metrics-block-shadcnui",
  "type": "registry:block",
  "title": "Glassmorphism Minimal Metrics",
  "description": "Focused metric cards with glass surfaces, subtle motion, and concierge insight CTA banner",
  "registryDependencies": [
    "button"
  ],
  "dependencies": [
    "framer-motion",
    "react"
  ],
  "files": [
    {
      "path": "@uitripled/react-shadcn/src/components/sections/glassmorphism-minimal-metrics-block.tsx",
      "content": "\"use client\";\n\nimport { motion, type Variants } from \"framer-motion\";\n\nimport { Badge } from \"@/components/ui/badge\";\nimport { Button } from \"@/components/ui/button\";\nimport { Card } from \"@/components/ui/card\";\nimport { ArrowUpRight, Users, Zap } from \"lucide-react\";\n\nconst metrics = [\n  {\n    label: \"Activated teams\",\n    value: \"1.2k\",\n    delta: \"+18%\",\n    description: \"teams shipping faster\",\n  },\n  {\n    label: \"Daily automations\",\n    value: \"58\",\n    delta: \"+42%\",\n    description: \"manual tasks replaced\",\n  },\n  {\n    label: \"Customer NPS\",\n    value: \"71\",\n    delta: \"+9\",\n    description: \"in just three sprints\",\n  },\n  {\n    label: \"Launch lead time\",\n    value: \"6d\",\n    delta: \"-3d\",\n    description: \"from concept to production\",\n  },\n];\n\nconst fadeUp: Variants = {\n  hidden: { opacity: 0, y: 16 },\n  show: { opacity: 1, y: 0, transition: { duration: 0.5, ease: \"easeOut\" } },\n};\n\nexport function GlassmorphismMinimalMetricsBlock() {\n  return (\n    <section className=\"relative overflow-hidden px-6 py-24 lg:py-32\">\n      <div className=\"absolute inset-0 -z-10\">\n        <div className=\"absolute left-0 top-0 h-[380px] w-[380px] rounded-full bg-foreground/[0.03] blur-[120px]\" />\n        <div className=\"absolute right-0 top-1/2 h-[420px] w-[420px] -translate-y-1/2 rounded-full bg-foreground/[0.025] blur-[140px]\" />\n      </div>\n\n      <div className=\"mx-auto max-w-6xl space-y-12\">\n        <motion.div\n          variants={fadeUp}\n          initial=\"hidden\"\n          whileInView=\"show\"\n          viewport={{ once: true, amount: 0.3 }}\n          className=\"mx-auto max-w-3xl text-center\"\n        >\n          <Badge\n            variant=\"outline\"\n            className=\"mb-4 inline-flex items-center gap-2 rounded-full border-border/50 bg-background/55 px-4 py-1.5 text-xs uppercase tracking-[0.2em] text-foreground/70 backdrop-blur\"\n          >\n            <Zap className=\"h-3.5 w-3.5\" />\n            realtime insights\n          </Badge>\n          <h2 className=\"text-4xl font-semibold tracking-tight text-foreground md:text-5xl\">\n            A snapshot of momentum that refuses to clutter the dashboard\n          </h2>\n          <p className=\"mt-5 text-base leading-relaxed text-foreground/70 md:text-lg\">\n            Glassy panels surface just the signal, Highlighting the metrics that\n            matter while the rest stays gracefully out of the way.\n          </p>\n        </motion.div>\n\n        <motion.div\n          initial=\"hidden\"\n          whileInView=\"show\"\n          viewport={{ once: true, amount: 0.2 }}\n          transition={{ staggerChildren: 0.08 }}\n          className=\"grid gap-4 md:grid-cols-2\"\n        >\n          {metrics.map((metric) => (\n            <motion.div key={metric.label} variants={fadeUp}>\n              <Card className=\"group relative overflow-hidden rounded-3xl border border-border/50 bg-background/45 p-8 backdrop-blur-2xl transition-transform duration-300 hover:-translate-y-1\">\n                <div className=\"absolute inset-0 bg-gradient-to-br from-foreground/[0.04] via-transparent to-transparent\" />\n                <div className=\"relative z-10 space-y-5\">\n                  <div className=\"flex items-center justify-between\">\n                    <span className=\"text-xs font-medium uppercase tracking-[0.25em] text-foreground/60\">\n                      {metric.label}\n                    </span>\n                    <ArrowUpRight className=\"h-4 w-4 text-foreground/40 transition-transform duration-300 group-hover:translate-x-1 group-hover:-translate-y-1\" />\n                  </div>\n                  <div className=\"flex items-end gap-3\">\n                    <span className=\"text-5xl font-semibold tracking-tight text-foreground\">\n                      {metric.value}\n                    </span>\n                    <span className=\"rounded-full border border-border/40 bg-background/60 px-2.5 py-1 text-xs font-semibold uppercase tracking-[0.2em] text-foreground/60 backdrop-blur\">\n                      {metric.delta}\n                    </span>\n                  </div>\n                  <p className=\"text-sm leading-relaxed text-foreground/70\">\n                    {metric.description}\n                  </p>\n                </div>\n              </Card>\n            </motion.div>\n          ))}\n        </motion.div>\n\n        <motion.div\n          variants={fadeUp}\n          initial=\"hidden\"\n          whileInView=\"show\"\n          viewport={{ once: true, amount: 0.3 }}\n          className=\"flex flex-wrap items-center justify-between gap-6 rounded-3xl border border-border/50 bg-background/40 px-6 py-6 backdrop-blur-xl md:px-8\"\n        >\n          <div className=\"flex items-center gap-4\">\n            <div className=\"flex h-12 w-12 items-center justify-center rounded-full border border-border/40 bg-background/70 text-foreground/80 shadow-[0_15px_40px_rgba(15,23,42,0.25)]\">\n              <Users className=\"h-5 w-5\" />\n            </div>\n            <div>\n              <p className=\"text-sm uppercase tracking-[0.25em] text-foreground/60\">\n                concierge insight desk\n              </p>\n              <p className=\"text-base text-foreground/80\">\n                Curated weekly digests keep leaders aligned without dashboards.\n              </p>\n            </div>\n          </div>\n          <Button\n            size=\"lg\"\n            variant=\"ghost\"\n            className=\"h-11 rounded-full border border-border/40 bg-background/70 px-6 text-sm uppercase tracking-[0.2em] text-foreground/70 backdrop-blur hover:text-foreground\"\n          >\n            Request a sample\n          </Button>\n        </motion.div>\n      </div>\n    </section>\n  );\n}\n",
      "type": "registry:block",
      "target": "components/uitripled/glassmorphism-minimal-metrics-block-shadcnui.tsx"
    }
  ]
}