Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a landing page for a PC optimization service that offers three different plans tailored to improve computer performance for gaming and other tasks. The goal is to attract users, clearly present service options, and facilitate easy contact and payment processes.

## CORE FEATURES
1. **Service Plans Overview**: A section displaying the three optimization plans (Básico, Avançado, Super) with detailed descriptions and pricing, allowing users to quickly understand their options.
2. **Call-to-Action Buttons**: Prominent buttons for users to select their desired optimization plan (e.g., "QUERO O BÁSICO", "QUERO O AVANÇADO", "QUERO O SUPER 🔥").
3. **How It Works**: A clear, step-by-step guide explaining the process from selecting a plan to completion of the service, enhancing user understanding and trust.
4. **Transparency Notice**: A dedicated section addressing the limitations and expectations regarding the optimization results, promoting transparency and building customer confidence.
5. **Contact Form**: A simple contact form for users to submit their PC specifications and issues, facilitating easy communication with the service provider.

## 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 main layout consists of a hero section at the top with a brief introduction, followed by service plan details in a grid layout with call-to-action buttons, and concluding with the "How It Works" and "Transparency" sections.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui.
- **State Management**: Not specifically required, but could implement a simple context API for form handling if needed.

## IMPLEMENTATION STEPS
1. **Set up the project**: Initialize a new React project with TypeScript and install Tailwind CSS.
2. **Create components**: Develop individual components for the hero section, service plans, call-to-action buttons, how it works, and transparency sections.
3. **Styling**: Apply Tailwind CSS styles to achieve the minimalist design, ensuring to use the specified primary color and typography.
4. **Form Handling**: Implement a simple contact form that captures user input and displays a confirmation message upon submission.
5. **Responsive Design**: Ensure the layout is fully responsive, adjusting for various screen sizes, especially for mobile users.
6. **Testing**: Conduct thorough testing for functionality and user experience to ensure everything works as intended before deployment.

## USER EXPERIENCE
Users will land on a clean and inviting page where they can easily navigate through the service plans. Each plan will be clearly outlined, with prominent buttons to proceed with their choice. The "How It Works" section will provide a straightforward guide, ensuring users feel informed and confident about their decision. The minimalist design will facilitate a smooth and engaging user experience, focusing on essential information without distractions.