Lovable Prompt Creator - AI Prompt Generator

#a
2. **Product Showcase**: A section highlighting various matcha products with images, brief descriptions, and pricing information to entice wholesale buyers.
3. **About Us**: A brief narrative about Twin Dragons Matcha, emphasizing quality, sourcing, and the health benefits of matcha.
4. **Testimonials**: A section featuring quotes from satisfied customers or partners to build trust and credibility.
5. **Contact Form**: A simple form allowing potential customers to reach out for inquiries or to request quotes, with fields for name, email, phone number, and message.
6. **FAQ Section**: A collapsible section addressing common questions about matcha and wholesale purchasing to provide quick answers to potential customers.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist - Focus on a clean and simple design with ample white space, ensuring that the content is easy to read and navigate.
- **Color Mode**: Light theme with dark text on light backgrounds to enhance readability and maintain a fresh, airy feel.
- **Layout**: A single-page layout with smooth scrolling sections. The hero section at the top, followed by product showcases, about us, testimonials, contact form, and FAQ at the bottom.
- **Typography**: Use a clean sans-serif font for headings (e.g., Montserrat) and a legible serif font for body text (e.g., Lora) to create a modern yet approachable feel. Ensure a clear hierarchy with larger font sizes for headings and appropriate spacing for body text.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS for utility-first styling and responsive design.
- **UI Components**: Utilize shadcn/ui for pre-designed components that fit within the minimalist theme.
- **State Management**: Not necessary for a landing page, but can include context API for handling form submissions if needed.

## IMPLEMENTATION STEPS
1. **Set Up the Project**: Initialize a new React project with TypeScript using Create React App.
2. **Install Dependencies**: Install Tailwind CSS and shadcn/ui for styling and UI components.
3. **Create Layout Structure**: Develop the main layout component with sections for the hero, products, about us, testimonials, contact form, and FAQ.
4. **Implement Hero Section**: Create a visually appealing hero section with a background image, tagline, and CTA button.
5. **Build Product Showcase**: Design a grid layout to display products with images, descriptions, and pricing.
6. **Add About Us and Testimonials**: Create dedicated sections for company information and customer testimonials.
7. **Develop Contact Form**: Implement a form component with fields for user inputs and a submit button.
8. **Implement FAQ Section**: Create collapsible elements for FAQs to enhance user engagement.
9. **Ensure Responsiveness**: Test and adjust the layout for mobile and tablet views to ensure a seamless user experience.

## USER EXPERIENCE
The user experience will focus on intuitive navigation, allowing visitors to scroll through the page easily. The hero section captures attention immediately, with clear CTAs guiding users to product inquiries. The product showcase will use hover effects to enhance interactivity. The contact form will be straightforward, ensuring users can quickly reach out without confusion. The FAQ section will provide immediate answers, reducing the need for users to navigate away for information. Overall, the design will prioritize ease of use and visual appeal to create a welcoming online presence for Twin Dragons Matcha.