Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project involves upgrading the homepage of Mohr Media into a premium, modern, and sleek marketing site focused on AI marketing systems. The main purpose is to enhance the visual system, performance, and overall polish while retaining the existing structure and content elements.

## CORE FEATURES
1. **Header Navigation**: A clear and concise navigation bar for easy access to different sections of the homepage.
2. **Hero Section**: A visually impactful hero area that integrates the new “Living Spine OS” visual system with existing messaging and CTAs.
3. **Live Proof Field**: A section showcasing real-time metrics and client success stories to build trust and credibility.
4. **Service Systems**: Clear presentation of the five service systems offered, ensuring they are visually integrated with the new design.
5. **Founder Section**: A premium display of the founder's image within a liquid-glass styled card, enhancing visual appeal while maintaining authenticity.
6. **Final CTA**: A compelling call-to-action section that encourages user engagement and conversion.

## 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 the existing homepage structure, with sections organized to enhance flow and user experience.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Not specified, use local component state as needed.

## IMPLEMENTATION STEPS
1. **Evaluate Existing Structure**: Review the current homepage structure to identify components and styles that need to be upgraded.
2. **Create Reusable Components**: Develop reusable components for the liquid-glass cards, spine visuals, and proof chips to ensure consistency.
3. **Upgrade Hero Section**: Implement the new hero section design with the integrated spine visual, ensuring the metrics are displayed correctly as per existing data.
4. **Revamp Founder Section**: Enhance the founder's image presentation within a liquid-glass card, ensuring it maintains the original image asset.
5. **Optimize Performance**: Implement performance optimizations, including lazy loading images, using optimized static assets, and ensuring smooth animations.
6. **Responsive Design Implementation**: Ensure the design is responsive across all devices, maintaining usability and visual integrity on mobile and tablet.
7. **Accessibility Improvements**: Review and apply accessibility standards, including semantic HTML, focus states for buttons, and alt text for images.
8. **Final Testing**: Conduct thorough testing for performance, responsiveness, and accessibility before deployment.

## USER EXPERIENCE
Users will interact with a visually stunning homepage that clearly communicates the value of Mohr Media's AI marketing systems. Key interactions will include engaging with the hero section, exploring service offerings through visually integrated cards, and reading proof metrics that support the brand's credibility. The overall experience will be smooth, modern, and focused on conversion pathways, guiding users seamlessly to the final CTA. 

---
This prompt outlines the necessary steps and specifications to elevate the Mohr Media homepage into a premium digital experience while respecting the existing structure and content.