Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
Create a landing page for Sociomaze Media, a digital marketing agency that provides a comprehensive range of services. The website aims to showcase the agency’s offerings effectively while emphasizing a clean and minimalist design that enhances user engagement and conversion rates.

## CORE FEATURES
1. **Hero Section**: A prominent section that includes a catchy headline, subheadline, and a call-to-action (CTA) button inviting users to learn more or get in touch.
2. **Services Offered**: A detailed showcase of the latest service offerings such as SEO, content marketing, social media management, and digital advertising, each with a brief description.
3. **Testimonials**: A section featuring client testimonials to build trust and credibility with potential customers.
4. **About Us**: A brief introduction to Sociomaze Media, highlighting its mission, vision, and unique selling points.
5. **Contact Form**: An accessible form allowing visitors to easily reach out for inquiries or consultations.
6. **Footer**: A simple footer with links to social media, privacy policy, and contact information.

## 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 vertical flow structure with the hero section at the top, followed by the services section, testimonials, about us, contact form, and a footer.

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

## IMPLEMENTATION STEPS
1. **Set Up the Project**: Initialize a new React project with TypeScript and install Tailwind CSS.
2. **Create the Main Layout**: Design the layout using Tailwind CSS classes to ensure responsiveness and a clean look.
3. **Develop the Hero Section**: Implement the hero section with a background image or color, headline, subheadline, and CTA button styled with the primary color.
4. **Add Services Section**: Create a grid or list layout to display the services offered, including icons or images for visual appeal.
5. **Incorporate Testimonials**: Design a carousel or grid layout for testimonials, ensuring they are easy to read and visually distinct.
6. **Build the About Us Section**: Write concise content about the company and integrate it into the layout.
7. **Create the Contact Form**: Develop a simple contact form with inputs for name, email, and message, styled with the specified border radius.
8. **Implement the Footer**: Add a footer with necessary links and social media icons.
9. **Optimize for SEO**: Ensure that all sections are optimized for search engines with appropriate meta tags and descriptions.
10. **Test Responsiveness**: Verify that the landing page works seamlessly across various devices and screen sizes.

## USER EXPERIENCE
The landing page will guide users through a seamless flow, starting from the engaging hero section to the detailed services and testimonials. Users will easily find the information they need, with clear CTAs prompting them to get in touch. The minimalist design will enhance readability and usability, making it straightforward for visitors to navigate and interact with the content.

By following this structured approach, the landing page for Sociomaze Media will effectively attract and convert potential clients while maintaining a clean and professional aesthetic.