Lovable Prompt Creator - AI Prompt Generator

- > ## APPLICATION OVERVIEW
This project is a landing page designed to promote a fake Robux sending service. Its primary purpose is to attract users with a clean, minimalist design and provide essential information about the service, encouraging visitors to take action through clear calls to action (CTAs).

## CORE FEATURES
1. **Hero Section**: A visually engaging introduction that highlights the service's value proposition, with a prominent CTA button to encourage users to get started.
2. **Features Overview**: A brief section outlining key features of the service, showcasing benefits like easy transactions, quick delivery, and user-friendly interface.
3. **Testimonials Section**: A space for user testimonials to build trust and credibility, featuring quotes and names of satisfied users.
4. **FAQ Section**: A section addressing common questions to alleviate user concerns and provide clarity about the service.
5. **Contact Form**: A simple form for users to reach out with inquiries or support requests, enhancing user engagement and support.

## DESIGN SPECIFICATIONS
- **Visual Style**: minimalist - Clean, simple design with plenty of white space, minimal color palette, and focus on typography.
- **Color Mode**: Light theme with dark text on light backgrounds.
- **Primary Color**: #1978E5 (accent for buttons, links, highlights).
- **Typography**: Use Inter from Google Fonts for headings, Inter for body text and UI elements.
- **Border Radius**: 8px (moderately rounded) for buttons, cards, and inputs.
- **Layout**: The layout will be structured in sections, starting with the hero, followed by features, testimonials, FAQ, and contact, ensuring a smooth vertical flow that guides the user through the content.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui.
- **State Management**: Not specified, but use local state management for form handling if necessary.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript using Create React App or a similar setup.
2. **Integrate Tailwind CSS**: Install and configure Tailwind CSS to style components according to the design specifications.
3. **Create Component Structure**: Develop components for each section (Hero, Features, Testimonials, FAQ, Contact) using functional components.
4. **Implement Navigation**: Create a simple navigation bar to allow users to scroll to different sections smoothly.
5. **Add Styling**: Apply Tailwind CSS classes to components, ensuring the design specifications are met (colors, typography, border radius).
6. **Set Up Form Handling**: Create a simple form in the Contact section and manage its state for user submissions.
7. **Test Responsiveness**: Ensure the landing page is responsive across devices and screen sizes.
8. **Deploy**: Choose a hosting platform (like Vercel or Netlify) to deploy the landing page for public access.

## USER EXPERIENCE
Users will first encounter the hero section, which captures their attention with a strong CTA. As they scroll down, they will learn about the service's features, read testimonials to build trust, and find answers to their questions in the FAQ section. Finally, they can easily reach out through the contact form, ensuring a straightforward and engaging user experience throughout the landing page.