Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a landing page for a sea freight forwarding company. The website aims to present the company's services, engage potential customers, and provide essential information about the sea cargo container forwarding process. It will feature a clean, minimalist design focused on user experience and conversion.

## CORE FEATURES
1. **Hero Section**: A prominent visual area at the top, highlighting the company's mission and services, with a call-to-action button encouraging visitors to get in touch.
2. **Services Offered**: A detailed section outlining various forwarding services, showcasing the benefits and features of choosing the company for sea cargo transportation.
3. **About Us**: A brief overview of the company's history, values, and team, helping to build trust with potential clients.
4. **Testimonials**: A section featuring customer reviews and success stories to enhance credibility and demonstrate customer satisfaction.
5. **Contact Form**: An easy-to-use contact form for inquiries, ensuring potential customers can reach out quickly.
6. **Call to Action**: Strategically placed buttons throughout the site encouraging visitors to connect with the business.

## 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 follow a single-page structure with a vertical flow, organized into sections for hero, services, about us, testimonials, and contact. Each section will have ample spacing for clarity and ease of navigation.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Not required for this landing page.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project using Create React App with TypeScript.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui for styling and UI components.
3. **Create Layout Components**: Build the main layout structure using functional components for each section (Hero, Services, About Us, Testimonials, Contact).
4. **Implement Styling**: Apply Tailwind CSS classes to style each component according to the design specifications.
5. **Add Content**: Fill each section with relevant content based on the information provided in the Word file.
6. **Set Up Contact Form**: Create a functional contact form that collects user inquiries and can be integrated with a backend service or API for form submissions.
7. **Test Responsiveness**: Ensure the design is responsive across different devices and screen sizes.

## USER EXPERIENCE
Visitors will be greeted by a visually appealing hero section that clearly communicates the company's services. As they scroll down, they will encounter sections detailing the offerings, company background, and testimonials, all designed to build trust and encourage engagement. The contact form will be easily accessible, ensuring users can quickly reach out for more information. The minimalist design will enhance readability and navigation, creating a seamless user experience.