Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a web application designed for a home renovation and painting company in Sevilla. The main purpose is to provide an interactive platform for users to explore various services offered, such as wall painting and tiling, and to request automated quotes based on the area they want to renovate. The application aims to enhance user engagement while maintaining a professional and innovative feel.

## CORE FEATURES
1. **Service Overview**: A dedicated section showcasing various renovation and painting services with detailed descriptions and visuals to attract potential customers.
2. **Interactive Quote Calculator**: Users can input the square meters they want to paint or tile, and the app will provide an instant, automated quote based on their input.
3. **Portfolio Gallery**: A display of previous projects and transformations to showcase the company’s expertise and attract new clients.
4. **Contact Form**: An easy-to-use contact form for inquiries and requests, allowing users to reach out for further information.
5. **Testimonials Section**: A space for customer reviews to build trust and credibility with potential clients.
6. **Responsive Design**: The application will be fully responsive, ensuring an optimal experience on both desktop and mobile devices.

## 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 feature a hero section at the top, followed by service descriptions, the interactive quote calculator, portfolio gallery, testimonials, and a contact form, all organized in a vertical flow for easy navigation.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Redux or Context API (if needed for state management)

## IMPLEMENTATION STEPS
1. **Set Up the Project**: Initialize a new React project with TypeScript and install Tailwind CSS.
2. **Create Component Structure**: Develop components for the hero section, service overview, quote calculator, portfolio, testimonials, and contact form.
3. **Implement the Quote Calculator**: Build the interactive quote calculator using React state to manage user input and calculations.
4. **Design Responsive Layout**: Use Tailwind CSS to ensure each component is responsive and adapts to different screen sizes.
5. **Integrate UI Components**: Utilize shadcn/ui components for buttons, forms, and cards to maintain a consistent design.
6. **Test Functionality**: Perform thorough testing on different devices and browsers to ensure everything works smoothly.
7. **Deploy the Application**: Host the application on a suitable platform (e.g., Vercel, Netlify) for public access.

## USER EXPERIENCE
Users will land on a visually appealing hero section that captures their attention with a clear call to action. As they scroll, they will see detailed descriptions of services with engaging visuals and an interactive quote calculator that allows them to input their desired measurements. The portfolio gallery will showcase past work, while testimonials will help build trust. Finally, the contact form will provide a straightforward way for users to reach out for more information or to request services. The overall design will be intuitive and user-friendly, ensuring a seamless experience from start to finish.