Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project involves creating a landing page for "Seguros 360", a digital insurance service offering comprehensive car insurance for financed vehicles. The primary goal is to enhance the online conversion of potential customers through a streamlined, user-friendly experience that allows users to quickly obtain quotes and purchase insurance without any in-person interactions.

## CORE FEATURES
1. **Hero Section**: Engaging introductory area with a clear value proposition and prominent call-to-action (CTA) button, “Cotiza tu seguro en 2 minutos”.
2. **Insurance Features Overview**: A section highlighting the key benefits of the service, such as 100% digital process, quick quotes, and ease of document submission.
3. **Customer Testimonials**: Section featuring testimonials from satisfied customers to build trust and credibility.
4. **Quote Request Form**: A quick and straightforward form where users can enter their details to receive an insurance quote.
5. **Contact Information**: Displaying real contact details for customer support, including phone number and email.
6. **FAQs Section**: Addressing common questions about car insurance and the digital process to alleviate potential concerns.

## 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 will be a single-page scrolling format, divided into clearly defined sections for the hero, features, testimonials, quote request form, and FAQs. The overall structure will ensure a logical flow that guides users towards the CTA.

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

## IMPLEMENTATION STEPS
1. **Set up the React project**: Initialize a new React project using Create React App with TypeScript.
2. **Install Tailwind CSS**: Follow the documentation to set up Tailwind CSS within the project.
3. **Create Components**:
   - Develop reusable components for the hero section, features, testimonials, quote request form, and FAQs.
   - Ensure components follow the defined design specifications (typography, colors, border radius).
4. **Implement Routing**: If necessary, utilize React Router for navigation within the landing page (anchor links for sections).
5. **Form Handling**: Implement state management for the quote request form to capture user inputs.
6. **Testing**: Ensure all components are responsive and function correctly across various devices and screen sizes.
7. **SEO Optimization**: Implement basic SEO practices, including meta tags and structured data, to enhance visibility.
8. **Deployment**: Deploy the completed landing page to a web hosting service (e.g., Vercel, Netlify).

## USER EXPERIENCE
Users will land on the hero section, greeted with a clear proposition and a prominent CTA button. They can scroll down to view features, read testimonials, fill out the quote request form, and access FAQs seamlessly. The minimalist design ensures that users remain focused on the content without distractions, leading to higher engagement and conversion rates. Each section is designed to build trust and facilitate quick actions, ultimately guiding users towards requesting a quote efficiently.