From f60439a3841e45d0c9145f524e35dee8ffea2f4c Mon Sep 17 00:00:00 2001
From: Vula Builder <deploy@vula.app>
Date: Tue, 23 Jun 2026 08:47:18 +0000
Subject: [PATCH] Deploy

---
 .../sections/ConvenientLocationSection.tsx    | 72 +++++++++++++++++++
 1 file changed, 72 insertions(+)
 create mode 100644 src/components/sections/ConvenientLocationSection.tsx

diff --git a/src/components/sections/ConvenientLocationSection.tsx b/src/components/sections/ConvenientLocationSection.tsx
new file mode 100644
index 0000000..63e0a92
--- /dev/null
+++ b/src/components/sections/ConvenientLocationSection.tsx
@@ -0,0 +1,72 @@
+'use client'
+
+import { Car, MapPin, Navigation } from 'lucide-react'
+
+const address = "44 Rutherford Circle, Bisley, Pietermaritzburg, 3201"
+
+export default function ConvenientLocationSection() {
+  return (
+    <section data-vula-section="convenientlocation" id="bisley-location" className="bg-[#FDF6EC] py-16 md:py-24 px-4">
+      <div className="max-w-6xl mx-auto">
+        <div className="grid md:grid-cols-2 gap-10 items-start">
+          {/* Map */}
+          <div className="rounded-xl overflow-hidden shadow-[var(--shadow-card)] border border-[#e5e7eb] h-[350px] md:h-[450px]">
+            <iframe
+              title="KwaNtofontofo location"
+              src={`https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d0!2d0!3d0!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0x0!2zMjnCsDAwJzAwLjAiUyAzMMKwMDAnMDAuMCJF!5e0!3m2!1sen!2sza!4v1700000000000!5m2!1sen!2sza&q=${encodeURIComponent(address)}`}
+              width="100%"
+              height="100%"
+              style={{ border: 0 }}
+              allowFullScreen
+              loading="lazy"
+              referrerPolicy="no-referrer-when-downgrade"
+            />
+          </div>
+
+          {/* Details */}
+          <div className="space-y-6">
+            <h2 className="text-3xl md:text-4xl font-bold text-[#2C1810]">
+              Prime Location in Bisley
+            </h2>
+            <p className="text-[#2C1810]/80 leading-relaxed">
+              Just 1 km from Pietermaritzburg Airport and bordering a nature reserve where zebras graze and monkeys swing through the trees. KwaNtofontofo sits on peaceful Rutherford Circle — close enough to the city yet surrounded by bushveld quiet.
+            </p>
+
+            <div className="space-y-4">
+              <h3 className="text-xl font-semibold text-[#C0392B]">Getting Here</h3>
+
+              <div className="flex items-start gap-3">
+                <Car className="w-5 h-5 text-[#E67E22] shrink-0 mt-0.5" />
+                <div className="text-sm text-[#2C1810]/70">
+                  <p className="font-semibold text-[#2C1810]">From Pietermaritzburg Airport</p>
+                  <ol className="list-decimal list-inside space-y-1 mt-1">
+                    <li>Exit the airport onto the R56 / Howick Road heading east.</li>
+                    <li>After 400 m, turn left into Rutherford Circle.</li>
+                    <li>Number 44 is on your right — look for the secure gate.</li>
+                  </ol>
+                </div>
+              </div>
+
+              <div className="flex items-start gap-3">
+                <Navigation className="w-5 h-5 text-[#E67E22] shrink-0 mt-0.5" />
+                <div className="text-sm text-[#2C1810]/70">
+                  <p className="font-semibold text-[#2C1810]">From the N3 Highway</p>
+                  <ol className="list-decimal list-inside space-y-1 mt-1">
+                    <li>Take the Howick / Airport off-ramp (Exit 75).</li>
+                    <li>Head south on the R56 for 2.5 km.</li>
+                    <li>Turn right into Rutherford Circle — we are at number 44.</li>
+                  </ol>
+                </div>
+              </div>
+            </div>
+
+            <div className="flex items-center gap-2 text-[#E67E22]">
+              <MapPin className="w-5 h-5" />
+              <address className="not-italic text-sm">{address}, KwaZulu-Natal</address>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section>
+  )
+}