Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a minimalist clothing landing page designed to showcase a collection of t-shirts and denim. The main purpose is to create an engaging and visually appealing homepage that highlights products with interactive elements, such as hover effects and background gradients, to enhance user experience and drive conversions.

## CORE FEATURES
1. **Hero Section**: A large, visually striking hero section featuring a t-shirt background that fades with a gradient as the user scrolls down the page.
2. **Product Display**: Interactive product cards for t-shirts and denim, where hovering over the images triggers a rotation effect to simulate a 360-degree view.
3. **Navigation Bar**: A simple navigation menu linking to various product categories, ensuring easy access for visitors.
4. **Call-to-Action (CTA)**: Prominent buttons encouraging users to explore collections or make purchases, styled with the primary color for visibility.
5. **Footer**: A clean footer that includes contact information and social media links for user engagement.

## 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 hero section at the top, followed by a grid of product cards for t-shirts and denim, and a footer at the bottom. 

## 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**: Install Tailwind CSS and shadcn/ui for styling and UI components.
3. **Create Components**: Build reusable components for the Hero section, Product Cards, Navigation Bar, and Footer.
4. **Style Components**: Apply Tailwind CSS classes to achieve the minimalist design specified, ensuring to use the primary color and typography styles.
5. **Implement Hover Effects**: Use CSS transitions to create the rotating effect on product images when hovered.
6. **Add Background Gradient**: Implement a scrolling background gradient effect in the Hero section using CSS.
7. **Test Responsiveness**: Ensure the layout is responsive and provides a seamless experience across different devices and screen sizes.
8. **Deploy**: Deploy the landing page on a web hosting platform like Vercel or Netlify.

## USER EXPERIENCE
Users will land on a visually captivating homepage with a large t-shirt background that smoothly transitions as they scroll down. They can easily navigate through categories via the navigation bar. Hovering over product cards will reveal a dynamic rotation effect, allowing users to interact with the products. Prominent CTAs will guide them toward purchasing or exploring more, while the clean footer will provide additional engagement options. The overall experience will be streamlined and visually appealing, encouraging users to explore the clothing offerings further.