Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a landing page for a fake Robux generator website aimed at attracting visitors and converting them into users. The site will present information about the service, its features, and encourage users to engage through clear calls to action.

## CORE FEATURES
1. **Hero Section**: A visually appealing introduction to the website that captures user attention with a strong headline, subheadline, and a prominent call-to-action button.
2. **Features Overview**: A section highlighting the benefits and features of the service, using concise descriptions and engaging visuals.
3. **Testimonials**: A section showcasing user testimonials to build credibility and trust among visitors.
4. **Call-to-Action (CTA)**: Multiple strategically placed CTAs encouraging users to engage, whether it's signing up, learning more, or accessing the service.
5. **Contact Information**: A section providing contact details or a simple form for inquiries, ensuring users can easily reach out for support or more information.

## 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 with a full-width hero section at the top, followed by the features overview in a grid layout, testimonials in a carousel or stacked format, and a footer with contact information.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui.
- **State Management**: Not required for a simple landing page, but context API can be utilized if needed for managing modals or user interactions.

## IMPLEMENTATION STEPS
1. **Set Up React Project**: Initialize a new React project using Create React App with TypeScript template.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui for styling and UI components.
3. **Create Components**: Develop the necessary components for the hero section, features overview, testimonials, CTAs, and contact form.
4. **Implement Routing (if necessary)**: If there are multiple sections or modals, use React Router for navigation.
5. **Style Components**: Use Tailwind CSS classes to implement the minimalist design principles, ensuring the use of the primary color and typography as specified.
6. **Test Responsiveness**: Ensure the landing page is responsive and looks good on various screen sizes by testing and adjusting Tailwind CSS breakpoints.
7. **Deploy the Landing Page**: Use platforms like Vercel or Netlify to deploy the landing page for public access.

## USER EXPERIENCE
The user experience will focus on simplicity and clarity, guiding visitors through the site with straightforward navigation and engaging content. Users will be able to quickly understand the purpose of the site, explore its features, and easily find ways to interact, whether through signing up or learning more about the service. The design will prioritize accessibility and responsiveness to ensure a seamless experience across devices.