🍽️ Restaurant Delight – Responsive Restaurant Website UI

Restaurant Delight is a modern, responsive, and visually engaging restaurant website UI built using HTML5 and CSS3. This project showcases a vibrant and user-friendly interface for a fictional restaurant, complete with promotional banners, feature highlights, and a dynamic menu gallery. It’s ideal for learning or demonstrating front-end development skills with a focus on layout design, responsiveness, and visual aesthetics.

---

🔥 Features

• Sticky Navigation Bar
  Gradient-themed header with logo and hamburger menu icon that remains fixed at the top for easy access.

• Hero Banner Section
  Bold introductory section featuring a high-resolution dish image, promotional label (e.g., “50% Off on All Products”), and a call-to-action button.

• Restaurant Highlights
  Three feature cards showcasing key services:

  • Discount Vouchers
  • Fresh Healthy Food
  • Fast Home Delivery
    Each card includes an icon and description with hover effects.

• Menu Showcase Grid
  A visually rich gallery of seven dishes arranged in a custom CSS grid layout. Hover effects scale images for emphasis.

• Footer Section
  Includes:

  • Logo branding
  • Navigation links (Order Tracking, New Order, Contact Us, News & Blogs)
  • Support links (About Us, Privacy Policy, Terms & Conditions)
  • Newsletter subscription input
  • Social media icons with hover animations

---

🎨 Styling Highlights

• Typography
  Uses the Roboto font from Google Fonts for a clean and modern look.

• Color Scheme
  Vibrant palette with green and yellow gradients, complemented by dark footer tones and accent highlights.

• Responsive Design
  Media queries for mobile (max-width: 430px) and tablet (max-width: 770px) breakpoints with adaptive background gradients and layout adjustments.

• Hover & Transition Effects
  Smooth transitions on buttons, cards, and social icons enhance user experience.

---

📁 Technologies Used

• HTML5
• CSS3 (Flexbox, Grid, Media Queries)
• Font Awesome (for icons)
• Google Fonts (Roboto)

---

🚀 How to Use

1. Clone the repository:

   git clone https://github.com/your-username/restaurant-delight.git

2. Open index.html in your browser.
3. Customize images and content as needed to match your brand or concept.

---

💡 Future Enhancements

• Add JavaScript for menu toggle and interactivity.
• Integrate a backend for order tracking and newsletter subscription.
• Include animations using libraries like AOS or GSAP.