{
    "name": "contact",
    "type": "registry:block",
    "title": "Split Form",
    "description": "Full-viewport contact section with border-grid layout, contact info rows, and sharp-corner form.",
    "category": "contact",
    "files": [
        {
            "path": "registry/contact/contact.tsx",
            "content": "\"use client\";\r\n\r\nimport React from \"react\";\r\nimport { Button } from \"@/components/ui/button\";\r\nimport { Input } from \"@/components/ui/input\";\r\nimport { Textarea } from \"@/components/ui/textarea\";\r\nimport { Label } from \"@/components/ui/label\";\r\nimport { motion } from \"framer-motion\";\r\nimport { Mail, Phone, MapPin, Send } from \"lucide-react\";\r\n\r\nexport function Contact() {\r\n  return (\r\n    <section className=\"w-full py-16 md:py-24 bg-background\">\r\n      <div className=\"container px-4 sm:px-6 mx-auto\">\r\n        <div className=\"grid grid-cols-1 lg:grid-cols-2 gap-10 lg:gap-16 items-start text-left\">\r\n          <div className=\"space-y-8\">\r\n            <div className=\"space-y-4\">\r\n              <h2 className=\"text-3xl sm:text-4xl md:text-5xl font-bold tracking-tight leading-tight\">Get in touch</h2>\r\n              <p className=\"text-base sm:text-lg text-muted-foreground font-light leading-relaxed\">\r\n                Have a project in mind? We'd love to hear from you.\r\n                Our team usually responds within 24 hours.\r\n              </p>\r\n            </div>\r\n\r\n            <div className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-1 gap-4 sm:gap-6\">\r\n              {[\r\n                { icon: Mail, title: \"Email us\", detail: \"hello@shadway.online\" },\r\n                { icon: Phone, title: \"Call us\", detail: \"+1 (555) 000-0000\" },\r\n                { icon: MapPin, title: \"Visit us\", detail: \"123 Design St, San Francisco, CA\" }\r\n              ].map((item, i) => (\r\n                <div key={i} className=\"flex items-start gap-4 p-4 rounded-xl border bg-card/50 transition-colors hover:bg-card\">\r\n                  <div className=\"w-10 h-10 rounded-full bg-primary/10 flex items-center justify-center shrink-0\">\r\n                    <item.icon className=\"w-5 h-5 text-primary\" />\r\n                  </div>\r\n                  <div className=\"min-w-0\">\r\n                    <h4 className=\"font-semibold text-sm sm:text-base\">{item.title}</h4>\r\n                    <p className=\"text-xs sm:text-sm text-muted-foreground truncate\">{item.detail}</p>\r\n                  </div>\r\n                </div>\r\n              ))}\r\n            </div>\r\n          </div>\r\n\r\n          <motion.div\r\n            initial={{ opacity: 0, y: 20 }}\r\n            animate={{ opacity: 1, y: 0 }}\r\n            className=\"p-6 sm:p-8 rounded-2xl border bg-card shadow-xl space-y-6\"\r\n          >\r\n            <div className=\"grid grid-cols-1 sm:grid-cols-2 gap-6\">\r\n              <div className=\"space-y-2\">\r\n                <Label htmlFor=\"first-name\" className=\"text-xs sm:text-sm\">First name</Label>\r\n                <Input id=\"first-name\" placeholder=\"John\" className=\"h-10 sm:h-11\" />\r\n              </div>\r\n              <div className=\"space-y-2\">\r\n                <Label htmlFor=\"last-name\" className=\"text-xs sm:text-sm\">Last name</Label>\r\n                <Input id=\"last-name\" placeholder=\"Doe\" className=\"h-10 sm:h-11\" />\r\n              </div>\r\n            </div>\r\n\r\n            <div className=\"space-y-2\">\r\n              <Label htmlFor=\"email\" className=\"text-xs sm:text-sm\">Email</Label>\r\n              <Input id=\"email\" type=\"email\" placeholder=\"john@example.com\" className=\"h-10 sm:h-11\" />\r\n            </div>\r\n\r\n            <div className=\"space-y-2\">\r\n              <Label htmlFor=\"message\" className=\"text-xs sm:text-sm\">Message</Label>\r\n              <Textarea id=\"message\" placeholder=\"Tell us about your project...\" rows={4} className=\"resize-none\" />\r\n            </div>\r\n\r\n            <Button className=\"w-full h-11 sm:h-12 gap-2 text-base font-semibold shadow-lg shadow-primary/20\">\r\n              <Send className=\"w-4 h-4\" />\r\n              Send Message\r\n            </Button>\r\n          </motion.div>\r\n        </div>\r\n      </div>\r\n    </section>\r\n  );\r\n}\r\n\r\nexport default Contact;\r\n",
            "type": "registry:block"
        }
    ],
    "dependencies": [
        "framer-motion",
        "lucide-react"
    ],
    "registryDependencies": [
        "button",
        "input",
        "textarea",
        "label"
    ]
}