Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a landing page for a pool company that showcases their portfolio of completed projects. The primary goal is to attract potential clients by presenting high-quality images and descriptions of previous work, alongside clear calls-to-action for inquiries and consultations.

## CORE FEATURES
1. **Hero Section**: A striking hero section with a captivating image of a pool installation, accompanied by a brief introduction to the company and a strong call-to-action button.
2. **Portfolio Gallery**: A dedicated section displaying a grid of high-quality images of completed pool projects, each linking to detailed project descriptions.
3. **Services Offered**: A concise overview of the services provided by the company, such as pool installation, maintenance, and renovation, presented with icons for visual appeal.
4. **Testimonials**: A section featuring client testimonials to build trust and credibility, highlighting customer satisfaction and quality of service.
5. **Contact Form**: A simple contact form that allows potential clients to easily reach out for quotes or consultations, integrated with essential fields like name, email, and message.
6. **Footer**: A footer containing company contact information, social media links, and quick navigation links to key sections of the page.

## 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 follow a single-column format with clear sections for the hero, portfolio, services, testimonials, contact form, and footer. Each section will be visually distinct yet cohesive, ensuring easy navigation.

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

## IMPLEMENTATION STEPS
1. **Set Up the Project**: Initialize a new React project using Create React App with TypeScript.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui for styling and UI components.
3. **Create Components**: Develop the following components:
   - HeroSection
   - PortfolioGallery
   - ServicesOverview
   - TestimonialsSection
   - ContactForm
   - Footer
4. **Implement Styling**: Utilize Tailwind CSS to style each component according to the specified design specifications, ensuring responsiveness across devices.
5. **Populate Content**: Add placeholder images and text for the portfolio, services section, and testimonials.
6. **Configure the Contact Form**: Set up the contact form to capture user input and handle submissions (e.g., via email service or API).
7. **Test Responsiveness**: Ensure all components render correctly on various screen sizes and devices.
8. **Deploy the Site**: Choose a hosting platform (like Vercel or Netlify) and deploy the landing page for public access.

## USER EXPERIENCE
The user experience will focus on simplicity and clarity. Visitors will first encounter the hero section, inviting them to explore the company's offerings. As they scroll, they will easily navigate through the portfolio and services, with engaging visuals and clear text that highlight the company's expertise. The testimonials will reinforce credibility, while the contact form will provide an accessible way to initiate engagement. Overall, the design will promote a seamless interaction that encourages potential clients to take action.