Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project entails creating a landing page for a marketing agency that offers six key services: SEO, SEM, Automations, Social Media, and Operational Excellence. The primary purpose of the site is to effectively showcase these services, attract potential clients, and encourage inquiries through a clear call-to-action.

## CORE FEATURES
- **Hero Section**: An engaging header with a strong tagline and a brief description of the agency's mission, accompanied by a prominent call-to-action button.
- **Service Overview**: A section highlighting each of the six services provided, with a brief description and relevant icons or images to enhance visual appeal.
- **Testimonials**: A dedicated section for client testimonials to build trust and credibility among potential customers.
- **Contact Form**: A simple contact form that allows users to easily reach out for inquiries or quotes.
- **Call to Action (CTA)**: Strategically placed CTA buttons throughout the page to encourage visitors to take action, such as “Get a Free Consultation”.
- **Footer**: Contains essential information such as social media links, contact details, and copyright information.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist - Clean and simple design with plenty of white space to ensure readability and focus on content.
- **Color Mode**: Light theme with dark text on light backgrounds for easy readability.
- **Layout**: A single-column layout that flows vertically, starting with the hero section, followed by services, testimonials, and ending with the contact form and footer.
- **Typography**: Use a sans-serif font for headings (e.g., 'Montserrat') and a serif or clean sans-serif font for body text (e.g., 'Roboto'). Maintain a clear hierarchy with larger font sizes for headings and smaller sizes for body text.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS for utility-first styling
- **UI Components**: Utilize shadcn/ui for pre-built components to speed up development.
- **State Management**: Not required for this landing page, but consider using React Context or Zustand if necessary for future enhancements.

## IMPLEMENTATION STEPS
1. **Setup Project**: Initialize a new React project with TypeScript. Install Tailwind CSS and configure it according to the documentation.
2. **Create Components**: Build reusable components for the hero section, service cards, testimonials, contact form, and footer.
3. **Layout Development**: Structure the layout using Tailwind CSS utility classes to achieve a clean and responsive design.
4. **Content Integration**: Populate the components with relevant content for each service, testimonials, and contact form.
5. **Styling Adjustments**: Fine-tune the styles to ensure alignment with the minimalist design and typography specifications.
6. **Testing**: Ensure the landing page is responsive across different devices and browsers. Test the contact form functionality.
7. **Deployment**: Deploy the landing page on a suitable platform (e.g., Vercel or Netlify) for public access.

## USER EXPERIENCE
Key user interactions will revolve around navigating through the service offerings, reading testimonials, and filling out the contact form. The CTA buttons will be prominently displayed to guide users toward taking the desired actions, thus enhancing the overall user experience. The minimalist design will ensure that users can easily focus on the content without distractions, making the site intuitive and user-friendly.