From 72f5b59d4206568a0f05f49f33c8477c614812fb Mon Sep 17 00:00:00 2001
From: Vula Builder <deploy@vula.app>
Date: Sun, 26 Jul 2026 16:40:56 +0000
Subject: [PATCH] Deploy

---
 src/components/layout/Footer.tsx | 138 +++++++++++++++++++++++++++++++
 1 file changed, 138 insertions(+)
 create mode 100644 src/components/layout/Footer.tsx

diff --git a/src/components/layout/Footer.tsx b/src/components/layout/Footer.tsx
new file mode 100644
index 0000000..cfd2c2b
--- /dev/null
+++ b/src/components/layout/Footer.tsx
@@ -0,0 +1,138 @@
+import { Camera, Clock, Globe, Mail, MapPin, MessageCircle, Phone, X } from 'lucide-react';
+;
+
+const footerLinks = [
+  { label: 'Home', href: '/' },
+  { label: 'Book a Room', href: '/booking' },
+  { label: 'Our Story', href: '/#our-story' },
+  { label: 'Specials', href: '/#specials' },
+  { label: 'Gallery', href: '/#gallery' },
+  { label: 'Cultural Insights', href: '/#cultural-insights' },
+  { label: 'Contact', href: '/#contact' },
+];
+
+export default function Footer() {
+  const currentYear = new Date().getFullYear();
+
+  return (
+    <footer className="bg-accent text-accent-foreground pt-16 pb-8 px-6">
+      <div className="max-w-7xl mx-auto grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-10 border-b border-white/20 pb-12">
+        {/* Contact */}
+        <div>
+          <h3 className="font-heading text-2xl font-bold mb-6 text-primary">vaVenda Lodge</h3>
+          <ul className="space-y-4 text-sm">
+            <li className="flex gap-3 items-start">
+              <MapPin size={18} className="mt-0.5 text-secondary shrink-0" />
+              <span>Plot 12, Tshikota Road<br />Makhado (Louis Trichardt)<br />Limpopo, South Africa</span>
+            </li>
+            <li className="flex gap-3 items-center">
+              <Phone size={18} className="text-secondary shrink-0" />
+              <a href="tel:+27151234567" className="hover:text-primary transition-all duration-200 ease-out">+27 15 123 4567</a>
+            </li>
+            <li className="flex gap-3 items-center">
+              <Mail size={18} className="text-secondary shrink-0" />
+              <a href="mailto:stay@vavendalodge.co.za" className="hover:text-primary transition-all duration-200 ease-out">stay@vavendalodge.co.za</a>
+            </li>
+          </ul>
+        </div>
+
+        {/* Quick Links */}
+        <div>
+          <h4 className="font-heading text-xl font-bold mb-6 text-primary">Quick Links</h4>
+          <ul className="space-y-3 text-sm">
+            {footerLinks.map((link) => (
+              <li key={link.label}>
+                <a
+                  href={link.href}
+                  className="hover:text-primary transition-all duration-200 ease-out inline-block py-1"
+                >
+                  {link.label}
+                </a>
+              </li>
+            ))}
+          </ul>
+        </div>
+
+        {/* Hours */}
+        <div>
+          <h4 className="font-heading text-xl font-bold mb-6 text-primary">Reception Hours</h4>
+          <ul className="space-y-3 text-sm">
+            <li className="flex gap-3 items-start">
+              <Clock size={18} className="mt-0.5 text-secondary shrink-0" />
+              <span>Monday – Friday: 6:30 AM – 9:00 PM<br />Saturday: 7:00 AM – 10:00 PM<br />Sunday: 7:00 AM – 8:00 PM</span>
+            </li>
+            <li className="text-xs opacity-80">
+              Check-in: 2:00 PM | Check-out: 10:00 AM
+            </li>
+          </ul>
+        </div>
+
+        {/* Social & Newsletter */}
+        <div>
+          <h4 className="font-heading text-xl font-bold mb-6 text-primary">Follow Our Story</h4>
+          <div className="flex gap-4 mb-6">
+            <a
+              href="https://facebook.com/vavendalodge"
+              target="_blank"
+              rel="noopener noreferrer"
+              className="p-2 rounded-full bg-white/10 hover:bg-primary hover:text-accent transition-all duration-200 ease-out"
+              aria-label="Facebook"
+            >
+              <Globe size={20} />
+            </a>
+            <a
+              href="https://instagram.com/vavendalodge"
+              target="_blank"
+              rel="noopener noreferrer"
+              className="p-2 rounded-full bg-white/10 hover:bg-primary hover:text-accent transition-all duration-200 ease-out"
+              aria-label="Instagram"
+            >
+              <Camera size={20} />
+            </a>
+            <a
+              href="https://x.com/vavendalodge"
+              target="_blank"
+              rel="noopener noreferrer"
+              className="p-2 rounded-full bg-white/10 hover:bg-primary hover:text-accent transition-all duration-200 ease-out"
+              aria-label="X (formerly Twitter)"
+            >
+              <X size={20} />
+            </a>
+            <a
+              href="https://wa.me/27151234567"
+              target="_blank"
+              rel="noopener noreferrer"
+              className="p-2 rounded-full bg-white/10 hover:bg-primary hover:text-accent transition-all duration-200 ease-out"
+              aria-label="WhatsApp"
+            >
+              <MessageCircle size={20} />
+            </a>
+          </div>
+          <p className="text-xs opacity-80 mt-4">
+            Subscribe to receive seasonal offers and insights from the Soutpansberg — one mail a month.
+          </p>
+          <form className="mt-4 flex flex-col sm:flex-row gap-3">
+            <input
+              type="email"
+              placeholder="Your email address"
+              className="px-4 py-2 rounded-md bg-white/15 border border-white/20 text-sm placeholder:text-white/50 focus:outline-none focus:ring-2 focus:ring-primary flex-1"
+            />
+            <button
+              type="submit"
+              className="btn-primary text-sm py-2 px-5 shrink-0"
+            >
+              Subscribe
+            </button>
+          </form>
+        </div>
+      </div>
+
+      <div className="max-w-7xl mx-auto mt-8 flex flex-col sm:flex-row justify-between items-center text-xs opacity-70">
+        <p>© {currentYear} vaVenda Lodge. All rights reserved.</p>
+        <p className="mt-2 sm:mt-0">
+          Handcrafted stays in the heart of Limpopo.
+        </p>
+      </div>
+    </footer>
+  );
+}