Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The project involves creating a landing page for "Infoservii," a digital agency specializing in hybrid solutions, including web development, AI services, and digital marketing. The primary goal is to attract young adults aged 20-30 and showcase the various services offered by Infoservii while driving engagement and conversions through a well-structured landing page.

## CORE FEATURES
1. **Hero Section**: A visually engaging introduction that captures attention with a strong headline, subheadline, and a call-to-action button directing users to learn more about the services.
   
2. **Service Areas**: Divided sections for each service offered, including:
   - **INFOSERVII Desarrollo Web**: Detailing web pages, systems, landing pages, and online stores.
   - **INFOSERVII IA**: Showcasing chatbots, automation, AI, and WhatsApp Business solutions.
   - **INFOSERVII Academy**: Highlighting courses, tutorials, and training opportunities.
   - **INFOSERVII Marketing**: Covering social media management, advertising, and branding services.
   - **INFOSERVII Digital Services**: Featuring graphic design, editing, digital invoicing, and consulting.
   - **Servii_Sport**: Promoting the sale of sports clothing and related products.

3. **Testimonials Section**: Featuring client reviews and success stories to build trust and credibility.

4. **Call-to-Action (CTA)**: Strategically placed buttons throughout the page to encourage users to contact Infoservii or sign up for a newsletter.

5. **Contact Form**: A simple form for potential clients to reach out for inquiries, ensuring easy user interaction.

6. **FAQ Section**: Addressing common queries about services to reduce barriers to engagement.

## 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-page layout with a vertical scroll structure, featuring sections for the hero, services, testimonials, CTA, and contact.

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

## IMPLEMENTATION STEPS
1. **Set up the project**: Initialize a new React project with TypeScript and install Tailwind CSS.
2. **Create the main layout**: Set up the single-page structure using a vertical scroll layout with sections for each core feature.
3. **Develop the Hero Section**: Implement a visually striking hero section with a headline, subheadline, and CTA button.
4. **Add Service Areas**: Create individual sections for each service with relevant icons and descriptions.
5. **Incorporate Testimonials**: Design a section for showcasing testimonials with client quotes and photos.
6. **Implement CTA Buttons**: Add multiple CTA buttons throughout the landing page to encourage user engagement.
7. **Create the Contact Form**: Develop a simple contact form using controlled components for user inquiries.
8. **Add the FAQ Section**: Include a collapsible FAQ section for common questions regarding services.
9. **Test Responsiveness**: Ensure the landing page is fully responsive across different devices and screen sizes.
10. **Optimize for SEO**: Implement basic SEO best practices, including meta tags and alt texts for images.

## USER EXPERIENCE
The user journey begins with an impactful hero section that draws attention and clearly communicates the brand's value proposition. Users can easily navigate through services, read testimonials, and understand the offerings through a clean and intuitive layout. The contact form and CTAs are prominently displayed, encouraging conversions, while the FAQ section addresses potential concerns, enhancing user confidence and satisfaction.