Omnifood - AI-Powered Food Subscription Landing Page

Omnifood is a modern, responsive landing page for a fictional AI-powered food subscription service. The service aims to make healthy eating convenient by delivering personalized meals daily. This project showcases a clean design and highlights various features of the food subscription service.

✨ Features

• Responsive Design: Adapts to different screen sizes (desktop, tablet, mobile).
• Hero Section: Engaging introduction with a clear call to action.
• How It Works: A 3-step visual guide explaining the service.
• Meal Showcase: Examples of meals offered, including dietary tags, nutritional information, and ratings.
• Diet Compatibility: Highlights compatibility with various diets (Vegetarian, Vegan, Gluten-free, etc.).
• Testimonials: Customer reviews to build trust.
• Photo Gallery: A visually appealing gallery of food items.
• Pricing Plans: Clear presentation of different subscription tiers.
• Call to Action (CTA): A prominent section for users to sign up, including a contact form.
• Sticky Navigation: The header navigation bar becomes sticky on scroll for easy access.
• Mobile Navigation: A functional hamburger menu for smaller screens.
• Smooth Scrolling: Implemented for internal page links.
• Semantic HTML5: Well-structured and meaningful HTML markup.

🛠️ Technologies Used

• HTML5: For the structure and content of the website.
• CSS3: For styling, layout (including CSS Grid and Flexbox), and responsiveness (media queries).
  • style.css: Main styles for the website.
  • general.css: General reusable styles and utility classes.
  • queries.css: Media queries for responsive design.
• JavaScript: For interactive elements like the mobile navigation and sticky header.
  • script.js: Contains the JavaScript logic.
• Google Fonts: Utilizes the "Rubik" font family.
• Ionicons: For icons used throughout the website.
• Netlify: The form in the CTA section is configured for Netlify form handling (as indicated by the netlify attribute).

🚀 How to View

1. Clone the repository:

   git clone <your-repository-url>

2. Navigate to the project directory:

   cd <project-directory-name>

3. Open the index.html file in your web browser.

Alternatively, if you deploy this project to a hosting service (like GitHub Pages, Netlify, Vercel), you can add the live URL here.

📄 File Structure