Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The project is a landing page designed for a business specializing in warehouse and infrastructure construction. It aims to present a modern, visually appealing interface that highlights the company's services and projects using engaging scroll effects and a minimalist aesthetic. The landing page will feature interactive elements and animations to enhance user experience and encourage conversions.

## CORE FEATURES
1. **Hero Section**: A captivating introduction with a compelling headline, subheadline, and a call-to-action (CTA) button encouraging users to learn more or contact the business.
2. **Blueprint to Buildings Section**: A dynamic section that showcases vector outline blueprints transitioning into final real images as users scroll, illustrating the construction process visually.
3. **Location Map**: An interactive map of Tamil Nadu displaying multiple locations with pulse dot effects, highlighting the areas served by the business.
4. **Testimonials**: A section dedicated to customer feedback, featuring rotating testimonials that enhance credibility and trust.
5. **Scroll Effects**: Engaging scroll animations and transitions throughout the site that create a next-gen user experience, making the site feel modern and interactive.
6. **Gradients and Counters**: Elements that incorporate gradient backgrounds and animated counters to visually represent statistics or project milestones.

## 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 featuring distinct sections for the hero, features, testimonials, and the interactive map, optimized for smooth scrolling and engagement.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Not specified, but could utilize React Context or a state management library if needed for handling complex interactions.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and install Tailwind CSS and shadcn/ui for UI components.
2. **Create Basic Structure**: Build the main layout using React functional components, dividing the page into sections (Hero, Blueprint, Testimonials, Map).
3. **Implement Hero Section**: Design the hero section with a background image and text overlay, including a prominent CTA button styled with the primary color and border radius.
4. **Develop Blueprint to Buildings Section**: Use a library for dynamic image transitions to create the blueprint-to-building effect during scrolling.
5. **Add Interactive Map**: Integrate a map component that displays pulse dots for locations, ensuring responsiveness and interactivity.
6. **Build Testimonials Section**: Create a rotating carousel for testimonials, using CSS animations for smooth transitions.
7. **Incorporate Scroll Effects**: Utilize CSS and JavaScript libraries to implement engaging scroll animations and effects throughout the page.
8. **Optimize for Mobile**: Ensure the design is fully responsive and test across different devices to guarantee a seamless user experience.

## USER EXPERIENCE
Users will begin their journey on the landing page, greeted by a visually striking hero section. As they scroll, they will encounter engaging animations that transition between blueprints and final images, establishing a connection between the design and the completed projects. The interactive map will allow users to explore the service areas, while testimonials will build trust and provide social proof. The overall experience will be fluid and engaging, encouraging users to take action through well-placed CTAs.