Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project involves creating a landing page for an engineering firm that offers various structural and electrical services. The site will showcase the firm's expertise in urban and rural residential projects, highlighting services such as structural design, foundation projects, drainage projects, and property regularizations. The primary goal is to attract potential clients and provide easy access to information about services offered.

## CORE FEATURES
1. **Hero Section**: A visually striking hero section featuring a brief introduction to the firm, accompanied by a prominent call-to-action (CTA) button to encourage visitors to contact or request a quote.
2. **Services Offered**: A dedicated section that outlines the various services provided, including project structural, foundation projects, drainage projects, and evaluations. Each service will have a brief description and an icon for visual appeal.
3. **Testimonials**: A section showcasing client testimonials to build trust and credibility. Positive feedback will be highlighted to demonstrate the firm's reliability and quality of work.
4. **Contact Form**: A simple contact form allowing potential clients to easily reach out for inquiries or quotes. The form will be user-friendly and accessible.
5. **About Us**: A section that provides background on the engineering firm, its mission, and team members, fostering a personal connection with visitors.
6. **Footer**: A comprehensive footer with essential links, contact information, and social media icons for further 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**: The main layout will follow a single-column format with clear sections stacked vertically for easy navigation. Each section will be distinctly separated with ample spacing to enhance readability and visual appeal.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Not specifically required for this landing page but can utilize React's built-in state management for the contact form.

## IMPLEMENTATION STEPS
1. **Set Up the Project**: Initialize a new React project with TypeScript using Create React App.
2. **Install Dependencies**: Install Tailwind CSS and configure it for styling. Add shadcn/ui as a UI component library.
3. **Create Components**: Develop individual components for the Hero section, Services, Testimonials, About Us, Contact Form, and Footer.
4. **Implement Routing**: Although it’s a landing page, consider using React Router for potential future scalability.
5. **Style the Components**: Apply Tailwind CSS classes to achieve the minimalist design and specifications outlined.
6. **Test Responsiveness**: Ensure that the design is mobile-friendly by testing on various screen sizes.
7. **Deploy the Landing Page**: Choose a hosting platform (e.g., Vercel, Netlify) to deploy the landing page for public access.

## USER EXPERIENCE
Key interactions will include a smooth scroll experience through different sections, easy navigation via the contact form, and intuitive access to service details. The design will prioritize user engagement, ensuring that visitors can quickly find the information they need and feel compelled to reach out for services. The minimalist approach will enhance focus on the content, creating a pleasant browsing experience.