Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a landing page that serves as a digital presence for a company. The main purpose is to provide information about the company, its services, and ways for potential customers to contact them. The design will feature a modern aesthetic with engaging visual elements to enhance user interaction.

## CORE FEATURES
1. **Hero Section:** A prominent hero area with the company's logo (HTS) displayed without a white background, set against an impactful tank image that is blurred as it scrolls down, creating a dynamic backdrop.
  
2. **About Us Page:** A dedicated section that outlines the history of the company, including when it was founded, what services it offers, and information about the director.
  
3. **Contact Us Page:** A comprehensive contact section featuring the company's email, phone number, social media links (Instagram, Facebook, LinkedIn), and physical location.
  
4. **Projects Showcase:** A visually appealing display of the company's products and projects, highlighting their portfolio.
  
5. **Responsive Design:** The layout will adapt seamlessly across devices, ensuring an optimal user experience on both desktop and mobile.

## 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 feature a full-width hero section, followed by an about section and a contact section. Each section will be clearly defined with ample spacing and a clean structure for easy navigation.

## TECHNICAL REQUIREMENTS
- **Framework:** React with TypeScript
- **Styling:** Tailwind CSS
- **UI Components:** shadcn/ui
- **State Management:** Not specified, but consider using Context API or Redux if needed in the future.

## IMPLEMENTATION STEPS
1. **Set Up the Project:** Initialize a new React project with TypeScript and install Tailwind CSS for styling. Ensure shadcn/ui components are available for use.
  
2. **Create the Layout Structure:** Develop a responsive layout that includes the hero section, about us section, projects showcase, and contact us section. Use Tailwind CSS for styling and responsiveness.
  
3. **Implement the Hero Section:** Add the company logo and tank image as a background. Apply blurring effects to the tank image as it scrolls down to create a dynamic visual experience.
  
4. **Design the About Us Page:** Create a section that details the company's history and services, ensuring alignment with the minimalist design approach.
  
5. **Build the Contact Us Page:** Incorporate fields for email, phone number, social media links, and location. Ensure that this section is easily accessible and visually appealing.
  
6. **Test the User Experience:** Conduct testing on various devices to ensure the website is responsive and that user interactions are smooth and engaging.

## USER EXPERIENCE
Users will be greeted with a striking hero section that immediately captures their attention. Navigation will be intuitive, with clear sections that guide users through the company's story, services, and contact information. The minimalist design will create a pleasant browsing experience, while the dynamic elements will keep users engaged as they explore the content.