Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a landing page for a 5-star hotel, featuring a captivating 3D scrolling animation to enhance user engagement. The main purpose is to showcase the hotel’s luxurious offerings, amenities, and unique experiences, while providing a seamless path for potential guests to book their stay.

## CORE FEATURES
1. **Hero Section**: A visually striking introduction with a 3D scrolling effect, showcasing high-quality images of the hotel and a compelling welcome message.
2. **Amenities Showcase**: Highlight the various amenities offered by the hotel, such as pools, spas, restaurants, and room types through visually appealing cards.
3. **Testimonials**: A section dedicated to guest reviews and experiences, presented in an engaging format to build trust and credibility.
4. **Booking Call-to-Action**: A prominent booking button that leads users to the reservation system, ensuring it stands out against the minimalist design.
5. **Contact Information**: Easy access to contact details and a form for inquiries, allowing potential guests to reach out with questions.

## 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 include a full-width hero section at the top, followed by a grid of amenities cards, a testimonial slider, a prominent booking CTA, and a contact section 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 the Project**: Initialize a new React project using Create React App with TypeScript.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui for styling and UI components.
3. **Create Layout Components**: Build the main layout components, including the Hero, Amenities, Testimonials, Booking CTA, and Contact sections.
4. **Implement 3D Scrolling Animation**: Use CSS animations or a library to achieve the desired 3D scrolling effect in the hero section.
5. **Style Components**: Apply Tailwind CSS classes to ensure the design specifications are met, focusing on the color scheme and typography.
6. **Testing**: Test the responsiveness of the landing page across different devices and screen sizes.

## USER EXPERIENCE
Users will be greeted with an immersive hero section that draws them into the hotel experience. As they scroll down, the 3D animations will guide them through the amenities and testimonials, creating an engaging narrative. The prominent booking CTA will encourage them to take action, while the contact section ensures they can easily reach out for more information. The overall experience will be smooth, intuitive, and visually appealing, reflecting the luxury of the hotel.