Lovable Prompt Creator - AI Prompt Generator

> ## APPLICATION OVERVIEW
This project is a landing page designed to promote a Robux giveaway. Its primary purpose is to attract users interested in receiving Robux, providing them with clear information about the giveaway process and encouraging them to participate.

## CORE FEATURES
1. **Hero Section**: A captivating introduction that clearly states the purpose of the giveaway, featuring an inviting call-to-action (CTA) button to participate.
2. **How It Works**: A simple explanation of the steps users need to follow to enter the giveaway, possibly including visuals or icons to enhance understanding.
3. **Testimonials**: Social proof from past participants, showcasing their positive experiences and outcomes from previous giveaways.
4. **FAQ Section**: Answers to common questions regarding the giveaway process, eligibility, and any other relevant information.
5. **Contact Form**: A straightforward form for users to reach out with any inquiries or issues, 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**: A single-column layout with a top hero section, followed by how it works, testimonials, FAQs, and a contact form at the bottom, ensuring a smooth flow of information.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui.
- **State Management**: Not required for this landing page.

## IMPLEMENTATION STEPS
1. **Set Up React Project**: Initialize a new React project with TypeScript using Create React App or Vite.
2. **Install Tailwind CSS**: Follow the Tailwind CSS installation guide to set it up in your project.
3. **Implement Global Styles**: Add the Inter font to your project and set up Tailwind's configuration for the primary color and border radius.
4. **Create Components**: Develop the individual components for the Hero Section, How It Works, Testimonials, FAQs, and Contact Form.
5. **Design Layout**: Organize the components into the defined layout structure using Tailwind classes for spacing and alignment.
6. **Add Interactivity**: Include functionality for the contact form, ensuring it captures user data effectively.
7. **Test Responsiveness**: Check the design on various screen sizes to ensure a seamless experience across devices.
8. **Deploy**: Choose a hosting platform (like Vercel or Netlify) to deploy the landing page.

## USER EXPERIENCE
Users will first be greeted by a visually appealing hero section that immediately communicates the giveaway's purpose. As they scroll down, they will easily understand how to participate through the simple steps outlined. Testimonials add trust and credibility, while the FAQ section addresses potential concerns. The contact form provides an easy way for users to get in touch with any questions, ensuring a smooth and supportive experience throughout their visit.