{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"veil-faqs-5","type":"registry:block","title":"Faqs 5","description":"Tailark Veil faqs variant 5 block","registryDependencies":["@tailark-oss/veil-card","@tailark-oss/veil-accordion"],"meta":{"aspect-ratio":"60/38","width":686,"height":434},"files":[{"path":"veil/blocks/faqs/five.tsx","type":"registry:component","target":"@components/faqs-5.tsx","content":"'use client'\n\nimport { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/components/ui/accordion'\nimport { Card } from '@/components/ui/card'\nimport Link from 'next/link'\nimport { CreditCard, HelpCircle, Package } from 'lucide-react'\n\nconst faqCategories = [\n    {\n        title: 'Getting Started',\n        icon: Package,\n        items: [\n            {\n                id: 'gs-1',\n                question: 'How do I create an account?',\n                answer: 'Click \"Sign Up\" and follow the prompts. You can sign up with email or connect your Google account.',\n            },\n            {\n                id: 'gs-2',\n                question: 'Is there a free trial?',\n                answer: 'Yes, we offer a 14-day free trial with full access to all features. No credit card required.',\n            },\n        ],\n    },\n    {\n        title: 'Billing',\n        icon: CreditCard,\n        items: [\n            {\n                id: 'b-1',\n                question: 'What payment methods do you accept?',\n                answer: 'We accept all major credit cards, PayPal, and bank transfers for annual plans.',\n            },\n            {\n                id: 'b-2',\n                question: 'Can I get a refund?',\n                answer: 'We offer a 30-day money-back guarantee. Contact support within 30 days for a full refund.',\n            },\n        ],\n    },\n    {\n        title: 'Support',\n        icon: HelpCircle,\n        items: [\n            {\n                id: 's-1',\n                question: 'How do I contact support?',\n                answer: 'You can reach us via email, live chat, or through your account dashboard. We typically respond within 24 hours.',\n            },\n            {\n                id: 's-2',\n                question: 'Do you offer phone support?',\n                answer: 'Phone support is available for Pro and Enterprise plans during business hours (9 AM - 6 PM EST).',\n            },\n        ],\n    },\n]\n\nexport default function FAQs() {\n    return (\n        <section className=\"bg-background @container py-24\">\n            <div className=\"mx-auto max-w-2xl px-6\">\n                <div className=\"text-center\">\n                    <h2 className=\"text-balance font-serif text-4xl font-medium\">Help Center</h2>\n                    <p className=\"text-muted-foreground mx-auto mt-4 max-w-md text-balance\">Browse by category to find the answers you need.</p>\n                </div>\n                <div className=\"mt-12 space-y-3\">\n                    {faqCategories.map((category) => (\n                        <Card\n                            key={category.title}\n                            variant=\"outline\"\n                            className=\"p-5\"\n                        >\n                            <div className=\"mb-4 flex items-center gap-2\">\n                                <category.icon className=\"text-muted-foreground size-4\" />\n                                <h3 className=\"text-foreground font-medium\">{category.title}</h3>\n                            </div>\n                            <Accordion\n                                type=\"single\"\n                                collapsible\n                            >\n                                {category.items.map((item) => (\n                                    <AccordionItem\n                                        key={item.id}\n                                        value={item.id}\n                                        className=\"border-dashed last:border-b-0\"\n                                    >\n                                        <AccordionTrigger className=\"cursor-pointer py-3 text-sm font-medium hover:no-underline\">{item.question}</AccordionTrigger>\n                                        <AccordionContent>\n                                            <p className=\"text-muted-foreground pb-1 text-sm\">{item.answer}</p>\n                                        </AccordionContent>\n                                    </AccordionItem>\n                                ))}\n                            </Accordion>\n                        </Card>\n                    ))}\n                </div>\n                <p className=\"text-muted-foreground mt-8 text-center text-sm\">\n                    Need more help?{' '}\n                    <Link\n                        href=\"#\"\n                        className=\"text-primary font-medium hover:underline\"\n                    >\n                        Contact our team\n                    </Link>\n                </p>\n            </div>\n        </section>\n    )\n}\n"}]}