{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "home",
  "type": "registry:block",
  "title": "Home Page",
  "description": "Blinkist Home Page with Pricing Card and Skeptical Banner",
  "dependencies": [
    "lucide-react",
    "@radix-ui/react-slot",
    "class-variance-authority"
  ],
  "files": [
    {
      "path": "app/page.tsx",
      "content": "import Link from \"next/link\"\nimport Image from \"next/image\"\nimport { PricingCard } from \"@/components/pricing-card\"\nimport { SkepticalBanner } from \"@/components/skeptical-banner\"\n\nexport default function Home() {\n  return (\n    <main className=\"min-h-screen bg-white\">\n      <header className=\"border-b border-gray-200\">\n        <div className=\"container mx-auto px-4 py-4 flex items-center justify-between\">\n          <Image\n            src=\"https://cdn.brandfetch.io/blinkist.com/w/512/h/99/logo?c=1idyyS2Jmw4KgfR-C00\"\n            alt=\"Blinkist Logo\"\n            width={100}\n            height={35}\n            className=\"h-6 w-auto\"\n          />\n        </div>\n      </header>\n\n      <div className=\"container mx-auto py-12 px-4\">\n        <div className=\"max-w-3xl mx-auto space-y-12\">\n          <SkepticalBanner />\n\n          <div className=\"max-w-md mx-auto\">\n            <PricingCard />\n          </div>\n        </div>\n      </div>\n    </main>\n  )\n}\n",
      "type": "registry:page",
      "target": "app/page.tsx"
    },
    {
      "path": "components/pricing-card.tsx",
      "content": "import { Check } from \"lucide-react\"\nimport { Card, CardHeader, CardTitle, CardContent, CardFooter } from \"@/components/ui/card\";\nimport { Button } from \"@/components/ui/button\";\n\nexport function PricingCard() {\n  return (\n    <Card className=\"overflow-hidden\">\n      <CardHeader className=\"bg-blue-500 text-white text-center font-medium\">\n        7-DAY FREE TRIAL — €0 TODAY\n      </CardHeader>\n      <CardContent className=\"p-6 space-y-6 bg-white\">\n        <div className=\"space-y-6\">\n          <div className=\"flex justify-between items-start\">\n            <div className=\"flex items-center gap-2\">\n              <h3 className=\"text-midnight font-bold text-xl\">PRO</h3>\n              <span className=\"text-gray-600\">- 12 Months</span>\n            </div>\n            <div className=\"text-right\">\n              <div className=\"flex items-end justify-end\">\n                <span className=\"text-sm mt-1\">€</span>\n                <span className=\"text-5xl font-bold text-midnight leading-none\">0</span>\n                <div className=\"flex flex-col items-start ml-0.5\">\n                  <span className=\"text-lg font-bold text-midnight leading-none\">.39</span>\n                  <span className=\"text-sm text-gray-600\">a day</span>\n                </div>\n              </div>\n              <p className=\"text-gray-600 mt-1\">€139.98</p>\n            </div>\n          </div>\n          <Button className=\"w-full\">Get started</Button>\n        </div>\n        <div className=\"space-y-4\">\n          <p className=\"font-medium text-midnight\">Reach your goals faster</p>\n          <div className=\"space-y-4\">\n            <div className=\"flex gap-3 items-start\">\n              <div className=\"flex-shrink-0 mt-0.5\">\n                <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                  <path\n                    d=\"M10 0L12.7009 6.21885L19.4127 5.87785L14.1941 9.62215L16.1803 16.1222L10 12.5L3.81966 16.1222L5.80589 9.62215L0.587322 5.87785L7.29909 6.21885L10 0Z\"\n                    fill=\"#0365F2\"\n                  />\n                </svg>\n              </div>\n              <div>\n                <span className=\"text-blue-500 font-medium\">Blinkist AI:</span>{\" \"}\n                <span className=\"text-gray-700\">Summarize videos, podcasts, docs, articles & more.</span>\n              </div>\n            </div>\n            <div className=\"flex gap-3 items-start\">\n              <Check className=\"h-5 w-5 text-gray-700 flex-shrink-0 mt-0.5\" />\n              <p className=\"text-gray-700\">7,500+ book and podcast summaries.</p>\n            </div>\n            <div className=\"flex gap-3 items-start\">\n              <Check className=\"h-5 w-5 text-gray-700 flex-shrink-0 mt-0.5\" />\n              <p className=\"text-gray-700\">Read & listen in 15 min.</p>\n            </div>\n            <div className=\"flex gap-3 items-start\">\n              <Check className=\"h-5 w-5 text-gray-700 flex-shrink-0 mt-0.5\" />\n              <p className=\"text-gray-700\">Personal daily recommendations.</p>\n            </div>\n          </div>\n        </div>\n      </CardContent>\n    </Card>\n  )\n}\n",
      "type": "registry:component"
    },
    {
      "path": "components/skeptical-banner.tsx",
      "content": "export function SkepticalBanner() {\n  return (\n    <div className=\"text-center space-y-2 mb-8 px-4\">\n      <h1 className=\"text-2xl sm:text-3xl md:text-4xl font-bold text-midnight break-words\">Skeptical? Try Blinkist PRO</h1>\n      <p className=\"text-xl sm:text-2xl md:text-3xl font-bold text-blue-500\">free for 7 days.</p>\n    </div>\n  )\n}\n",
      "type": "registry:component"
    },
    {
      "path": "components/ui/blinkist-logo.tsx",
      "content": "import Image from \"next/image\";\n\nexport function BlinkistLogo() {\n  return (\n    <Image\n      src=\"https://cdn.brandfetch.io/blinkist.com/w/512/h/99/logo?c=1idyyS2Jmw4KgfR-C00\"\n      alt=\"Blinkist Logo\"\n      width={100}\n      height={35}\n      className=\"h-6 w-auto\"\n    />\n  );\n} ",
      "type": "registry:component"
    },
    {
      "path": "components/ui/card.tsx",
      "content": "import * as React from \"react\"\n\nimport { cn } from \"@/lib/utils\"\n\nconst Card = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ className, ...props }, ref) => (\n  <div ref={ref} className={cn(\"rounded-lg border bg-card text-card-foreground shadow-sm\", className)} {...props} />\n))\nCard.displayName = \"Card\"\n\nconst CardHeader = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  ({ className, ...props }, ref) => (\n    <div ref={ref} className={cn(\"flex flex-col space-y-1.5 p-6\", className)} {...props} />\n  ),\n)\nCardHeader.displayName = \"CardHeader\"\n\nconst CardTitle = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLHeadingElement>>(\n  ({ className, ...props }, ref) => (\n    <h3 ref={ref} className={cn(\"text-2xl font-semibold leading-none tracking-tight\", className)} {...props} />\n  ),\n)\nCardTitle.displayName = \"CardTitle\"\n\nconst CardDescription = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLParagraphElement>>(\n  ({ className, ...props }, ref) => (\n    <p ref={ref} className={cn(\"text-sm text-muted-foreground\", className)} {...props} />\n  ),\n)\nCardDescription.displayName = \"CardDescription\"\n\nconst CardContent = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  ({ className, ...props }, ref) => <div ref={ref} className={cn(\"p-6 pt-0\", className)} {...props} />,\n)\nCardContent.displayName = \"CardContent\"\n\nconst CardFooter = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  ({ className, ...props }, ref) => (\n    <div ref={ref} className={cn(\"flex items-center p-6 pt-0\", className)} {...props} />\n  ),\n)\nCardFooter.displayName = \"CardFooter\"\n\nexport { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent }\n",
      "type": "registry:ui",
      "target": ""
    },
    {
      "path": "components/ui/button.tsx",
      "content": "import * as React from \"react\"\nimport { Slot } from \"@radix-ui/react-slot\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"@/lib/utils\"\n\nconst buttonVariants = cva(\n  \"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-primary text-primary-foreground hover:bg-primary/90\",\n        destructive:\n          \"bg-destructive text-destructive-foreground hover:bg-destructive/90\",\n        outline:\n          \"border border-input bg-background hover:bg-accent hover:text-accent-foreground\",\n        secondary:\n          \"bg-secondary text-secondary-foreground hover:bg-secondary/80\",\n        ghost: \"hover:bg-accent hover:text-accent-foreground\",\n        link: \"text-primary underline-offset-4 hover:underline\",\n      },\n      size: {\n        default: \"h-10 px-4 py-2\",\n        sm: \"h-9 rounded-md px-3\",\n        lg: \"h-11 rounded-md px-8\",\n        icon: \"h-10 w-10\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  }\n)\n\nexport interface ButtonProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n    VariantProps<typeof buttonVariants> {\n  asChild?: boolean\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  ({ className, variant, size, asChild = false, ...props }, ref) => {\n    const Comp = asChild ? Slot : \"button\"\n    return (\n      <Comp\n        className={cn(buttonVariants({ variant, size, className }))}\n        ref={ref}\n        {...props}\n      />\n    )\n  }\n)\nButton.displayName = \"Button\"\n\nexport { Button, buttonVariants }\n",
      "type": "registry:ui",
      "target": ""
    }
  ]
}