Deploy

2026-07-14 19:12:49 +00:00
parent 025ec9a206
commit fe9cc29327
1 changed files with 132 additions and 0 deletions
@@ -0,0 +1,132 @@
 import { Camera, Globe, Mail, MapPin, MessageCircle, Phone, X } from 'lucide-react'
 export default function Footer() {
  return (
    <footer className="bg-background border-t border-border pt-16 pb-8">
      <div className="max-w-7xl mx-auto px-6 grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-10 text-sm text-foreground">
        {/* Brand */}
        <div>
          <h4 className="font-heading text-xl font-bold text-secondary mb-3">
            Thornveld Game Lodge
          </h4>
          <p className="leading-relaxed">
            A family-run bush retreat outside Hoedspruit, Limpopo – eight self-catering
            chalets, guided walks, sundowner drives, and genuine Kruger wildlife.
          </p>
        </div>
        {/* Quick Links */}
        <div>
          <h5 className="font-heading text-base font-bold mb-3 text-secondary">
            Quick Links
          </h5>
          <ul className="space-y-2">
            {[
              { label: 'Thornveld Experiences', href: '#thornveld-experiences' },
              { label: 'Our Family Roots', href: '#family-roots' },
              { label: 'Seasonal Specials', href: '#specials' },
              { label: 'Bush Gallery', href: '#bush-gallery' },
              { label: 'Contact Enquiry', href: '#contact' },
            ].map((link) => (
              <li key={link.href}>
                <a
                  href={link.href}
                  className="hover:text-primary transition-all duration-200 ease-out"
                >
                  {link.label}
                </a>
              </li>
            ))}
          </ul>
        </div>
        {/* Contact */}
        <div>
          <h5 className="font-heading text-base font-bold mb-3 text-secondary">
            Get in Touch
          </h5>
          <ul className="space-y-3">
            <li className="flex items-center gap-2">
              <MapPin size={16} className="text-primary shrink-0" />
              <a
                href="https://maps.google.com/?q=Thornveld+Game+Lodge+R531+Hoedspruit"
                target="_blank"
                rel="noopener noreferrer"
                className="hover:text-primary transition-all duration-200 ease-out"
              >
                R531, Hoedspruit, 1380, Limpopo, South Africa
              </a>
            </li>
            <li className="flex items-center gap-2">
              <Phone size={16} className="text-primary shrink-0" />
              <a
                href="tel:+27157931234"
                className="hover:text-primary transition-all duration-200 ease-out"
              >
                +27 (0)15 793 1234
              </a>
            </li>
            <li className="flex items-center gap-2">
              <Mail size={16} className="text-primary shrink-0" />
              <a
                href="mailto:info@thornveldlodge.co.za"
                className="hover:text-primary transition-all duration-200 ease-out"
              >
                info@thornveldlodge.co.za
              </a>
            </li>
          </ul>
        </div>
        {/* Social + Hours */}
        <div>
          <h5 className="font-heading text-base font-bold mb-3 text-secondary">
            Connect &amp; Visit
          </h5>
          <div className="flex gap-4 mb-4">
            <a
              href="https://facebook.com/thornveldlodge"
              target="_blank"
              rel="noopener noreferrer"
              className="text-foreground hover:text-primary transition-all duration-200 ease-out"
            >
              <Globe size={20} />
            </a>
            <a
              href="https://instagram.com/thornveldlodge"
              target="_blank"
              rel="noopener noreferrer"
              className="text-foreground hover:text-primary transition-all duration-200 ease-out"
            >
              <Camera size={20} />
            </a>
            <a
              href="https://x.com/thornveldlodge"
              target="_blank"
              rel="noopener noreferrer"
              className="text-foreground hover:text-primary transition-all duration-200 ease-out"
            >
              <X size={20} />
            </a>
            <a
              href="https://wa.me/27791234567"
              target="_blank"
              rel="noopener noreferrer"
              className="text-foreground hover:text-primary transition-all duration-200 ease-out"
            >
              <MessageCircle size={20} />
            </a>
          </div>
          <div className="text-xs space-y-1">
            <p>Reception: 07:00 – 19:00 daily</p>
            <p>Check-in from 14:00 | Check-out by 10:00</p>
          </div>
        </div>
      </div>
      <div className="mt-12 border-t border-border pt-6 text-center text-xs text-foreground/60">
        &copy; {new Date().getFullYear()} Thornveld Game Lodge. All rights reserved.
      </div>
    </footer>
  )
 }