Redesign homepage with moumoujus-inspired layout

- Add AnnouncementBar with marquee animation
- Add NewHero with floating product card
- Add StatsSection with large stat numbers
- Add FeaturesSection with icons
- Add TestimonialsSection with cards
- Add NewsletterSection with signup form
- Update Header styling for new design
- Update globals.css with marquee animations
- Update page.tsx to use new components

All existing WooCommerce functionality preserved

src/components/home/TestimonialsSection.tsx

@@ -0,0 +1,100 @@
+"use client";
+
+import { motion } from "framer-motion";
+import { Star, Check } from "lucide-react";
+
+const testimonials = [
+  {
+    id: 1,
+    name: "Sarah M.",
+    skinType: "Dry, sensitive skin",
+    text: "I've tried countless oils over the years, but ManoonOils is different. My skin has never felt this nourished and healthy. The argan oil is now a staple in my routine.",
+    verified: true,
+  },
+  {
+    id: 2,
+    name: "James K.",
+    skinType: "Hair care enthusiast",
+    text: "Finally found an oil that actually tames my frizz without making my hair greasy. The jojoba oil works wonders for my beard too. Highly recommend!",
+    verified: true,
+  },
+  {
+    id: 3,
+    name: "Emma L.",
+    skinType: "Combination skin",
+    text: "Was skeptical at first but after 3 weeks of using the rosehip oil, my skin texture has improved dramatically. The quality is unmatched.",
+    verified: true,
+  },
+];
+
+export default function TestimonialsSection() {
+  return (
+    <section className="py-24 lg:py-32 bg-[#F0F7FA]">
+      <div className="max-w-[1400px] mx-auto px-6">
+        {/* Header */}
+        <motion.div
+          initial={{ opacity: 0, y: 20 }}
+          whileInView={{ opacity: 1, y: 0 }}
+          viewport={{ once: true }}
+          transition={{ duration: 0.6 }}
+          className="text-center mb-16"
+        >
+          <span className="text-xs tracking-[0.3em] uppercase text-[#6B7280] mb-4 block">
+            Testimonials
+          </span>
+          <h2 className="font-serif italic text-4xl lg:text-5xl text-[#1A1A1A] tracking-tight">
+            What our customers say
+          </h2>
+        </motion.div>
+
+        {/* Testimonials Grid */}
+        <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
+          {testimonials.map((testimonial, index) => (
+            <motion.div
+              key={testimonial.id}
+              initial={{ opacity: 0, y: 20 }}
+              whileInView={{ opacity: 1, y: 0 }}
+              viewport={{ once: true }}
+              transition={{ duration: 0.6, delay: index * 0.1 }}
+              className="bg-white rounded-[6px] border border-[#1A1A1A]/[0.06] p-9 flex flex-col"
+            >
+              {/* Stars */}
+              <div className="flex gap-1 mb-5">
+                {[...Array(5)].map((_, i) => (
+                  <Star
+                    key={i}
+                    className="w-4 h-4 fill-amber-400 text-amber-400"
+                  />
+                ))}
+              </div>
+
+              {/* Quote */}
+              <p className="font-serif italic text-base lg:text-lg text-[#1A1A1A] leading-relaxed flex-1 mb-6">
+                &ldquo;{testimonial.text}&rdquo;
+              </p>
+
+              {/* Author */}
+              <div className="flex items-center justify-between pt-4 border-t border-[#1A1A1A]/[0.06]">
+                <div>
+                  <p className="text-sm font-medium text-[#1A1A1A]">
+                    {testimonial.name}
+                  </p>
+                  <p className="text-xs text-[#4A4A4A]/70">
+                    {testimonial.skinType}
+                  </p>
+                </div>
+
+                {testimonial.verified && (
+                  <div className="inline-flex items-center gap-1 text-[10px] tracking-wider uppercase text-emerald-600 font-medium">
+                    <Check className="w-3 h-3" />
+                    Verified purchase
+                  </div>
+                )}
+              </div>
+            </motion.div>
+          ))}
+        </div>
+      </div>
+    </section>
+  );
+}