diff --git a/src/components/sections/ContactSection.tsx b/src/components/sections/ContactSection.tsx
new file mode 100644
index 0000000..220f97c
--- /dev/null
+++ b/src/components/sections/ContactSection.tsx
@@ -0,0 +1,145 @@
+'use client'
+
+import { useState } from 'react'
+import { useVulaContent } from '@/hooks/useVulaContent'
+import { Clock, Mail, MapPin, Phone } from 'lucide-react'
+import Input from '@/components/ui/Input'
+import Button from '@/components/ui/Button'
+
+export default function ContactSection() {
+  const { items, loading } = useVulaContent('business_hours')
+  const [formData, setFormData] = useState({ name: '', email: '', message: '' })
+  const [sent, setSent] = useState(false)
+
+  if (loading) {
+    return (
+      <div className="flex justify-center py-16">
+        <div className="w-8 h-8 rounded-full border-2 border-[#6b8e23] border-t-transparent animate-spin" />
+      </div>
+    )
+  }
+
+  if (items.length === 0) return null
+
+  const hours = items.map((item) => item.data as {
+    day_of_week?: string
+    open_time?: string
+    close_time?: string
+    is_closed?: boolean
+    note?: string
+  })
+
+  const handleSubmit = (e: React.FormEvent) => {
+    e.preventDefault()
+    // In production send to backend
+    setSent(true)
+    setFormData({ name: '', email: '', message: '' })
+  }
+
+  return (
+    <section id="contact" data-vula-section="contact" data-vula-cms="business_hours" className="py-20 bg-[#f4f5f2]">
+      <div className="max-w-5xl mx-auto px-4">
+        <div className="text-center mb-14">
+          <h2 className="text-3xl md:text-4xl font-bold text-[#2c331f]">We&apos;d Love to Hear from You</h2>
+          <p className="text-[#8b5a3c] mt-3 max-w-lg mx-auto">
+            From our studio in Pretoria to your skin — every enquiry is handwritten care.
+          </p>
+        </div>
+
+        <div className="grid grid-cols-1 md:grid-cols-2 gap-10">
+          {/* Contact details */}
+          <div className="space-y-6">
+            <div className="flex items-start gap-4">
+              <MapPin className="w-5 h-5 text-[#6b8e23] mt-1 shrink-0" />
+              <div>
+                <h3 className="font-semibold text-[#2c331f]">Studio & Workshop</h3>
+                <p className="text-[#8b5a3c]">42 Marula Lane, Hatfield, Pretoria, 0028</p>
+              </div>
+            </div>
+            <div className="flex items-start gap-4">
+              <Phone className="w-5 h-5 text-[#6b8e23] mt-1 shrink-0" />
+              <div>
+                <h3 className="font-semibold text-[#2c331f]">Phone</h3>
+                <p className="text-[#8b5a3c]">+27 12 345 6789</p>
+              </div>
+            </div>
+            <div className="flex items-start gap-4">
+              <Mail className="w-5 h-5 text-[#6b8e23] mt-1 shrink-0" />
+              <div>
+                <h3 className="font-semibold text-[#2c331f]">Email</h3>
+                <p className="text-[#8b5a3c]">hello@ngcobonaturals.co.za</p>
+              </div>
+            </div>
+            <div className="flex items-start gap-4">
+              <Clock className="w-5 h-5 text-[#6b8e23] mt-1 shrink-0" />
+              <div>
+                <h3 className="font-semibold text-[#2c331f]">Trading Hours</h3>
+                <ul className="text-[#8b5a3c] space-y-1">
+                  {hours.map((h, i) => (
+                    <li key={i} className="flex justify-between gap-4">
+                      <span>{h.day_of_week ?? '—'}</span>
+                      {h.is_closed ? (
+                        <span className="italic">Closed</span>
+                      ) : (
+                        <span>{h.open_time ?? '—'} – {h.close_time ?? '—'}</span>
+                      )}
+                    </li>
+                  ))}
+                </ul>
+                <p className="text-xs text-[#8b5a3c]/70 mt-2">Closed on South African public holidays.</p>
+              </div>
+            </div>
+          </div>
+
+          {/* Enquiry form */}
+          <div className="bg-white rounded-2xl p-8 shadow-lg shadow-[#6b8e23]/5 border border-[#daddd4]">
+            <h3 className="text-xl font-bold text-[#2c331f] mb-6">Send an Enquiry</h3>
+            {sent ? (
+              <div className="text-center py-8">
+                <div className="w-12 h-12 mx-auto bg-[#6b8e23]/10 rounded-full flex items-center justify-center mb-4">
+                  <Mail className="w-6 h-6 text-[#6b8e23]" />
+                </div>
+                <p className="text-[#6b8e23] font-medium">Thank you! We&apos;ll be in touch soon.</p>
+              </div>
+            ) : (
+              <form onSubmit={handleSubmit} className="space-y-4">
+                <Input
+                  type="text"
+                  placeholder="Your name"
+                  value={formData.name}
+                  onChange={(e) => setFormData({ ...formData, name: e.target.value })}
+                  required
+                  className="rounded-xl border-[#daddd4] bg-[#f4f5f2]"
+                />
+                <Input
+                  type="email"
+                  placeholder="your@email.com"
+                  value={formData.email}
+                  onChange={(e) => setFormData({ ...formData, email: e.target.value })}
+                  required
+                  className="rounded-xl border-[#daddd4] bg-[#f4f5f2]"
+                />
+                <textarea
+                  placeholder="Tell us about your skincare journey..."
+                  rows={4}
+                  value={formData.message}
+                  onChange={(e) => setFormData({ ...formData, message: e.target.value })}
+                  required
+                  className="w-full rounded-xl border border-[#daddd4] bg-[#f4f5f2] p-3 focus:outline-none focus:ring-2 focus:ring-[#6b8e23] resize-none"
+                />
+                <Button
+                  type="submit"
+                  variant="default"
+                  size="md"
+                  className="w-full bg-[#6b8e23] hover:bg-[#5a7a1d] text-white border-none rounded-xl"
+                >
+                  Send Message
+                </Button>
+              </form>
+            )}
+          </div>
+        </div>
+      </div>
+    </section>
+  )
+}
\ No newline at end of file