Deploy

2026-07-14 18:35:20 +00:00
parent 44ebf67358
commit 4536e88317
1 changed files with 60 additions and 0 deletions
@@ -0,0 +1,60 @@
+'use client'
+
+export default function GuestReverieTestimonialsSection() {
+  const testimonials = [
+    {
+      name: 'Eleanor Vance',
+      role: 'Guest from London',
+      quote: 'Waking to the roar of a lion across the river — I have never felt so alive.',
+    },
+    {
+      name: 'Mateo Silva',
+      role: 'Travel writer, São Paulo',
+      quote: 'The ranger knew every bird by its call. That kind of intimacy with the bush is rare.',
+    },
+    {
+      name: 'Yuki Tanaka',
+      role: 'Bespoke travel curator, Tokyo',
+      quote: 'Six suites, infinite privacy. Every detail whispers care.',
+    },
+  ]
+
+  return (
+    <section
+      id="guest-testimonials"
+      data-vula-section="guesttestimonials"
+      className="py-20 bg-[#17170f] border-t border-white/10"
+    >
+      <div className="max-w-5xl mx-auto px-6 text-center">
+        {/* Eyebrow */}
+        <div className="flex items-center justify-center gap-4 mb-4">
+          <div className="w-14 h-px bg-[#f5f5dc]" />
+          <span className="text-[#6b8e23] font-sans uppercase tracking-[0.15em] text-sm">
+            Guest Reverie
+          </span>
+          <div className="w-14 h-px bg-[#f5f5dc]" />
+        </div>
+        <h2 className="text-3xl md:text-4xl font-light text-[#eeeee7] font-serif mb-12">
+          Whispers from the Wild
+        </h2>
+
+        <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
+          {testimonials.map((t, i) => (
+            <div
+              key={i}
+              className="border border-white/10 rounded-[8px] p-6 bg-[#17170f] text-left"
+            >
+              <p className="text-[#eeeee7]/85 font-sans text-sm leading-relaxed mb-4">
+                &ldquo;{t.quote}&rdquo;
+              </p>
+              <p className="text-[#eeeee7] font-serif text-base">{t.name}</p>
+              <p className="text-[#6b8e23] font-sans uppercase tracking-wider text-xs mt-1">
+                {t.role}
+              </p>
+            </div>
+          ))}
+        </div>
+      </div>
+    </section>
+  )
+}