Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The Nawora landing page is a modern, marketing-focused single-page website designed to promote a B2B SaaS platform for supplement retailers. It aims to attract store owners by showcasing the platform's unique features and benefits, encouraging them to register and start selling supplements directly to customers.

## CORE FEATURES
1. **Hero Section**: Captivating introduction with an animated badge, headline, and strong CTAs to drive sign-ups.
2. **How It Works**: A clear, step-by-step guide outlining the onboarding process for new users.
3. **Features Showcase**: Grid layout displaying the platform's key functionalities, each with engaging icons and descriptions.
4. **Social Proof**: Dynamic scrolling ticker featuring logos of partner brands and testimonials from satisfied users to build trust.
5. **Pricing Plans**: Clear and compelling pricing comparison, highlighting the benefits of each plan.
6. **Final CTA**: Strong closing statement with a clear call to action, encouraging immediate sign-ups.

## 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 consists of a fixed navbar, followed by sections for the hero, features, testimonials, pricing, and a final CTA, all designed to facilitate an intuitive flow for users.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: Lucide React for all icons
- **Animations**: Framer Motion for smooth transitions and effects
- **State Management**: Not specified, but consider using React's Context API or similar for managing any required state.

## IMPLEMENTATION STEPS
1. **Setup Project**: Initialize a new React project with TypeScript and install Tailwind CSS, Framer Motion, and Lucide React.
2. **Create Navbar**: Implement a fixed navbar with a blurred backdrop that includes logo and menu links, ensuring responsiveness with a hamburger menu for mobile.
3. **Develop Hero Section**: Design the hero section with an animated badge, a strong headline, and two distinct CTAs, incorporating a mockup image of the storefront.
4. **Build How It Works Section**: Create a visually appealing 3-step guide with icons and succinct descriptions.
5. **Features Grid**: Develop a grid to showcase the platform's features, using icons from Lucide React and Tailwind CSS for styling.
6. **Add Social Proof**: Implement a horizontal ticker for partner logos and a testimonial section with user quotes.
7. **Design Pricing Plans**: Create a pricing section with two plans, highlighting key features and incorporating a clear CTA for both plans.
8. **Final CTA Section**: Design a compelling conclusion with a strong headline and a prominent call-to-action button.
9. **Footer**: Implement a footer with links to important pages and social media icons.
10. **Responsive Design**: Ensure the entire layout is mobile-first and check responsiveness across different screen sizes.

## USER EXPERIENCE
The user experience focuses on smooth navigation and clear calls to action. Users will first be greeted with an attention-grabbing hero section, followed by straightforward information about how the platform works. As they scroll down, they will encounter feature highlights, social proof, and pricing information laid out in a clear and engaging manner, ultimately guiding them to sign up for the service with a well-placed final call to action. The design should feel modern and trustworthy, reflecting the professional nature of the B2B SaaS offering.