Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The project is a web application for the Navachara Group of Constructions that features a dark/white theme toggle for an immersive user interface. This application aims to provide users with a unique experience that differentiates the company from other construction firms, emphasizing a clean, minimalist aesthetic with a focus on usability and responsiveness.

## CORE FEATURES
1. **Theme Toggle**: Allow users to switch between dark and light themes seamlessly, enhancing user experience and accessibility.
2. **Project Showcase**: Display a portfolio of construction projects with high-quality images and descriptions, emphasizing the company’s expertise.
3. **Service Offerings**: Detail the various construction services available, including residential, commercial, and specialized projects, with clear descriptions and benefits.
4. **Testimonials Section**: Highlight client testimonials to build trust and credibility, featuring quotes and ratings.
5. **Contact Form**: Provide a simple contact form for inquiries, allowing users to easily reach out for quotes or more information.
6. **Responsive Design**: Ensure the application is fully responsive, providing an optimal experience across all 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 consist of a hero section at the top, followed by a project showcase, service offerings, testimonials, and a contact form, all arranged vertically with clear separations and ample whitespace.

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

## IMPLEMENTATION STEPS
1. **Setup Environment**: Initialize a new React project with TypeScript using Create React App or a similar tool.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui components to the project.
3. **Create Theme Context**: Implement a context for theme management to handle toggling between light and dark modes.
4. **Design Components**: Build reusable components for the hero section, project cards, service listings, testimonials, and the contact form using Tailwind CSS for styling.
5. **Implement Routing**: If necessary, set up React Router for any additional pages (e.g., about us, services).
6. **Responsive Design**: Use Tailwind's responsive classes to ensure all components look good on mobile, tablet, and desktop.
7. **Testing**: Conduct thorough testing for functionality, responsiveness, and user experience.

## USER EXPERIENCE
Users will be greeted with a clean hero section featuring the company name and a brief tagline. They can easily toggle between themes using a visible switch. The project showcase will display images and descriptions that users can click for more details. The service offerings will present clear information about what Navachara Group provides, while testimonials will enhance credibility. The contact form will be straightforward, encouraging users to make inquiries without unnecessary steps, ensuring a smooth and engaging user journey throughout the application.