From b2197e23dd4201d8d7e19d908ea47ba8fc3cd62f Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Mon, 9 Mar 2026 16:23:39 +0000
Subject: [PATCH] Update src/app/page.tsx

---
 src/app/page.tsx | 562 ++++++++++-------------------------------------
 1 file changed, 111 insertions(+), 451 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index ccecf78..61d37b1 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,502 +1,162 @@
 "use client";
 
+import React from "react";
+import { ThemeProvider } from "@/components/theme/ThemeProvider";
 import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
-import HeroLogoBillboardSplit from "@/components/sections/hero/HeroLogoBillboardSplit";
+import HeroBillboardGallery from "@/components/sections/hero/HeroBillboardGallery";
 import SplitAbout from "@/components/sections/about/SplitAbout";
-import ProductCardOne from "@/components/sections/product/ProductCardOne";
-import FeatureCardTwentyFour from "@/components/sections/feature/FeatureCardTwentyFour";
-import TestimonialCardThirteen from "@/components/sections/testimonial/TestimonialCardThirteen";
-import PricingCardOne from "@/components/sections/pricing/PricingCardOne";
-import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
-import FaqSplitText from "@/components/sections/faq/FaqSplitText";
-import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
-import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import { Award, CheckCircle, Crown, Heart, Shield, Sparkles, Calendar, Clock, Users } from "lucide-react";
-import React, { useState, useEffect } from "react";
+import FeatureCardSix from "@/components/sections/feature/FeatureCardSix";
+import TestimonialCardTwelve from "@/components/sections/testimonial/TestimonialCardTwelve";
+import ContactText from "@/components/sections/contact/ContactText";
+import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
+import { Sparkles, CheckCircle, Heart } from "lucide-react";
 
-interface TimeSlot {
-  time: string;
-  available: boolean;
-}
+const navItems = [
+  { name: "Home", id: "/" },
+  { name: "About", id: "#about" },
+  { name: "Features", id: "#features" },
+  { name: "Testimonials", id: "#testimonials" },
+  { name: "Contact", id: "#contact" },
+];
 
-interface DaySlots {
-  date: string;
-  day: string;
-  slots: TimeSlot[];
-}
+const heroMediaItems = [
+  { imageSrc: "asset://beauty-product-1", imageAlt: "Premium cosmetics collection" },
+  { imageSrc: "asset://beauty-product-2", imageAlt: "Natural skincare products" },
+  { imageSrc: "asset://beauty-product-3", imageAlt: "Luxury beauty essentials" },
+  { imageSrc: "asset://beauty-product-4", imageAlt: "Cruelty-free cosmetics" },
+  { imageSrc: "asset://beauty-product-5", imageAlt: "Dermatologist-tested skincare" },
+];
 
-export default function LandingPage() {
-  const [calendarData, setCalendarData] = useState<DaySlots[]>([]);
-  const [selectedDate, setSelectedDate] = useState<string | null>(null);
-  const [selectedSlot, setSelectedSlot] = useState<string | null>(null);
+const aboutBulletPoints = [
+  {
+    title: "Natural Ingredients",    description: "Crafted with premium natural ingredients sourced responsibly from around the world",    icon: Sparkles,
+  },
+  {
+    title: "Dermatologist-Tested",    description: "All products are rigorously tested and approved by leading dermatologists",    icon: CheckCircle,
+  },
+  {
+    title: "Cruelty-Free",    description: "100% cruelty-free and ethically produced for conscious beauty lovers",    icon: Heart,
+  },
+];
 
-  useEffect(() => {
-    // Generate availability calendar for next 7 days
-    const generateCalendar = () => {
-      const days: DaySlots[] = [];
-      const today = new Date();
+const features = [
+  {
+    id: 1,
+    title: "Cleanse & Purify",    description: "Our gentle cleansing formulas remove impurities while maintaining skin's natural balance for a fresh, radiant complexion",    imageSrc: "asset://feature-cleanse"},
+  {
+    id: 2,
+    title: "Nourish & Hydrate",    description: "Rich moisturizing treatments infused with antioxidants and vitamins to deeply hydrate and restore skin vitality",    imageSrc: "asset://feature-nourish"},
+  {
+    id: 3,
+    title: "Protect & Glow",    description: "Advanced sun protection and brightening serums that shield your skin while enhancing natural radiance",    imageSrc: "asset://feature-protect"},
+];
 
-      for (let i = 0; i < 7; i++) {
-        const date = new Date(today);
-        date.setDate(date.getDate() + i);
-        const dateStr = date.toISOString().split('T')[0];
-        const dayName = date.toLocaleDateString('en-US', { weekday: 'short' });
-
-        const slots: TimeSlot[] = [];
-        const hours = [9, 10, 11, 13, 14, 15, 16, 17];
-
-        for (const hour of hours) {
-          // Simulate availability - 80% slots available
-          const available = Math.random() > 0.2;
-          slots.push({
-            time: `${hour.toString().padStart(2, '0')}:00`,
-            available,
-          });
-        }
-
-        days.push({
-          date: dateStr,
-          day: dayName,
-          slots,
-        });
-      }
-
-      setCalendarData(days);
-      if (days.length > 0) {
-        setSelectedDate(days[0].date);
-      }
-    };
-
-    generateCalendar();
-  }, []);
-
-  const getAvailableCount = (date: string): number => {
-    const day = calendarData.find(d => d.date === date);
-    return day ? day.slots.filter(s => s.available).length : 0;
-  };
-
-  const getSelectedDaySlots = (): TimeSlot[] => {
-    const day = calendarData.find(d => d.date === selectedDate);
-    return day ? day.slots : [];
-  };
+const testimonials = [
+  {
+    id: "1",    name: "Sarah Johnson",    imageSrc: "asset://testimonial-avatar-1"},
+  {
+    id: "2",    name: "Emily Chen",    imageSrc: "asset://testimonial-avatar-2"},
+  {
+    id: "3",    name: "Jessica Martinez",    imageSrc: "asset://testimonial-avatar-3"},
+  {
+    id: "4",    name: "Amanda Wilson",    imageSrc: "asset://testimonial-avatar-4"},
+];
 
+export default function Page() {
   return (
     <ThemeProvider
-      defaultButtonVariant="expand-hover"
-      defaultTextAnimation="background-highlight"
-      borderRadius="soft"
-      contentWidth="small"
-      sizing="largeSizeMediumTitles"
-      background="noiseDiagonalGradient"
-      cardStyle="solid"
-      primaryButtonStyle="diagonal-gradient"
+      defaultButtonVariant="hover-magnetic"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="rounded"
+      contentWidth="mediumLarge"
+      sizing="largeSmallSizeLargeTitles"
+      background="circleGradient"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="gradient"
       secondaryButtonStyle="glass"
-      headingFontWeight="bold"
+      headingFontWeight="semibold"
     >
-      <div id="nav" data-section="nav">
-        <NavbarStyleApple
-          brandName="Radiance Beauty"
-          navItems={[
-            { name: "Shop", id: "products" },
-            { name: "About", id: "about" },
-            { name: "Testimonials", id: "testimonials" },
-            { name: "Book Consultation", id: "availability" },
-          ]}
-        />
-      </div>
+      <NavbarStyleApple navItems={navItems} brandName="Radiance" />
 
       <div id="hero" data-section="hero">
-        <HeroLogoBillboardSplit
-          logoText="RADIANCE"
-          description="Discover premium cosmetics crafted with natural ingredients. Enhance your natural beauty with our luxury skincare and makeup collection."
-          background={{ variant: "radial-gradient" }}
+        <HeroBillboardGallery
+          background={{ variant: "plain" }}
+          title="Premium Cosmetics & Skincare"
+          description="Discover luxury beauty products crafted with natural ingredients. Cruelty-free, dermatologist-tested, and made for all skin types."
+          tag="Beauty Excellence"
+          tagIcon={Sparkles}
+          mediaItems={heroMediaItems}
           buttons={[
-            { text: "Shop Now", href: "#products" },
+            { text: "Shop Now", href: "#features" },
             { text: "Learn More", href: "#about" },
           ]}
-          layoutOrder="default"
-          imageSrc="http://img.b2bpic.net/free-photo/assortment-cosmetic-bottles-jars_23-2152029108.jpg"
-          imageAlt="Luxury cosmetics beauty collection"
-          frameStyle="card"
-          mediaAnimation="slide-up"
-          buttonAnimation="slide-up"
         />
       </div>
 
       <div id="about" data-section="about">
         <SplitAbout
           title="About Radiance Beauty"
-          description="We believe beauty comes from within and is enhanced by quality skincare and cosmetics. Our products are carefully formulated with premium natural ingredients to nourish your skin while delivering stunning color and finish."
+          description="We believe that true beauty comes from within, enhanced by premium skincare that respects your skin and the environment. Our mission is to provide effective, luxurious beauty solutions without compromising on ethics or quality."
           tag="Our Story"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          bulletPoints={[
-            {
-              title: "Natural Ingredients",              description: "Sourced from sustainable suppliers worldwide for purity and effectiveness",              icon: Sparkles,
-            },
-            {
-              title: "Cruelty-Free",              description: "Never tested on animals, always kind to all living beings",              icon: Heart,
-            },
-            {
-              title: "Dermatologist Tested",              description: "Safe and effective for all skin types including sensitive skin",              icon: Shield,
-            },
-            {
-              title: "Premium Quality",              description: "Rigorous quality control ensures every product exceeds expectations",              icon: Award,
-            },
-          ]}
-          imageSrc="http://img.b2bpic.net/free-photo/happy-woman-holding-mascara-wand_23-2148398589.jpg?_wi=1"
-          imageAlt="Radiance Beauty cosmetics laboratory"
-          mediaAnimation="slide-up"
+          tagIcon={Heart}
+          bulletPoints={aboutBulletPoints}
+          imageSrc="asset://about-image"
+          imageAlt="Radiance Beauty products display"
           imagePosition="right"
-          buttons={[{ text: "Discover Our Philosophy", href: "#features" }]}
-          buttonAnimation="slide-up"
-        />
-      </div>
-
-      <div id="products" data-section="products">
-        <ProductCardOne
-          title="Featured Products"
-          description="Explore our bestselling collection of premium cosmetics and skincare products"
-          tag="New Collection"
           textboxLayout="default"
           useInvertedBackground={false}
-          animationType="slide-up"
-          gridVariant="three-columns-all-equal-width"
-          products={[
-            {
-              id: "1",              name: "Luminous Foundation",              price: "$45",              imageSrc: "http://img.b2bpic.net/free-photo/makeup-foundation-celebrating-all-skin-tones_23-2149179692.jpg?_wi=1",              imageAlt: "Luminous Foundation premium makeup"
-            },
-            {
-              id: "2",              name: "Radiant Lipstick",              price: "$28",              imageSrc: "http://img.b2bpic.net/free-photo/high-angle-different-shades-lip-gloss_52683-95223.jpg",              imageAlt: "Radiant Lipstick luxury cosmetics"
-            },
-            {
-              id: "3",              name: "Glow Serum",              price: "$52",              imageSrc: "http://img.b2bpic.net/free-photo/top-view-natural-cosmetics-concept_23-2148578622.jpg",              imageAlt: "Glow Serum premium skincare"
-            },
+          buttons={[
+            { text: "Explore Products", href: "#features" },
+            { text: "Our Values", href: "#about" },
           ]}
-          buttons={[{ text: "View All Products", href: "#" }]}
-          buttonAnimation="slide-up"
         />
       </div>
 
       <div id="features" data-section="features">
-        <FeatureCardTwentyFour
-          title="Why Choose Radiance"
-          description="Discover what sets our cosmetics apart from the rest"
-          tag="Benefits"
+        <FeatureCardSix
+          features={features}
+          title="Our Beauty Ritual"
+          description="A complete skincare journey designed to transform your complexion through innovative formulations and time-tested techniques."
+          tag="Product Features"
+          tagIcon={CheckCircle}
           textboxLayout="default"
-          useInvertedBackground={true}
-          animationType="slide-up"
-          features={[
-            {
-              id: "1",              title: "Advanced Formula Technology",              author: "Beauty Lab",              description: "Our proprietary blend combines cutting-edge cosmetic science with nature's finest ingredients for superior performance and results.",              tags: ["Innovation", "Science"],
-              imageSrc: "http://img.b2bpic.net/free-photo/happy-woman-holding-mascara-wand_23-2148398589.jpg?_wi=2",              imageAlt: "Advanced cosmetics formulation"
-            },
-            {
-              id: "2",              title: "Long-Lasting Performance",              author: "Quality Team",              description: "Engineered to last all day without fading, creasing, or settling. Experience beauty that stays true from morning to night.",              tags: ["Durability", "Performance"],
-              imageSrc: "http://img.b2bpic.net/free-photo/makeup-foundation-celebrating-all-skin-tones_23-2149179692.jpg?_wi=2",              imageAlt: "Long-lasting cosmetics products"
-            },
+          useInvertedBackground={false}
+          buttons={[
+            { text: "View All Products", href: "#features" },
+            { text: "Get Started", href: "#contact" },
           ]}
-          buttons={[{ text: "Shop Premium Line", href: "#pricing" }]}
-          buttonAnimation="slide-up"
         />
       </div>
 
       <div id="testimonials" data-section="testimonials">
-        <TestimonialCardThirteen
-          title="What Our Customers Say"
-          description="Join thousands of satisfied beauty enthusiasts who trust Radiance"
-          tag="Reviews"
-          textboxLayout="default"
+        <TestimonialCardTwelve
+          testimonials={testimonials}
+          cardTitle="Over 50,000 customers worldwide trust Radiance Beauty for their skincare needs"
+          cardTag="Join Our Community"
+          cardTagIcon={Heart}
+          cardAnimation="slide-up"
           useInvertedBackground={false}
-          showRating={true}
-          animationType="slide-up"
-          testimonials={[
-            {
-              id: "1",              name: "Sarah Johnson",              handle: "@sarahjbeauty",              testimonial: "The quality is absolutely incredible! My skin has never looked better. The foundation blends seamlessly and lasts all day.",              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/beauty-portrait-asian-attractive-sensual-young-woman-pose-holding-makeup-blusher-brush-isolated-gray-wall_1150-51864.jpg",              imageAlt: "Sarah Johnson"
-            },
-            {
-              id: "2",              name: "Emma Davis",              handle: "@emmadavis_makeup",              testimonial: "Finally found a lipstick that doesn't dry out my lips! The formula is so creamy and the colors are stunning.",              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/elegant-stylish-lady-with-collected-hair-dressed-gold-tshirt-neck-jewelry-is-smiling-camera-posing-beige-background_291650-2401.jpg",              imageAlt: "Emma Davis"
-            },
-            {
-              id: "3",              name: "Jessica Chen",              handle: "@jessicabeauty",              testimonial: "Love that these products are cruelty-free and natural. My sensitive skin responds so well to the skincare line.",              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/portrait-attractive-female-pink-dress-with-blonde-hair-poses-camera-with-open-mouth_132075-8044.jpg",              imageAlt: "Jessica Chen"
-            },
-            {
-              id: "4",              name: "Michelle Rodriguez",              handle: "@michelleglam",              testimonial: "The customer service is exceptional and the products deliver results. Worth every penny!",              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/real-professional-smiling-businesswoman-looking-confident-determined-face-expression-standing-suit-white-background_1258-123234.jpg",              imageAlt: "Michelle Rodriguez"
-            },
-            {
-              id: "5",              name: "Rachel Kim",              handle: "@rachelkimbeauty",              testimonial: "I recommend Radiance to all my friends. The quality speaks for itself. This is luxury beauty done right.",              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/woman-s-portrait-blondie-straight-hair_633478-1294.jpg",              imageAlt: "Rachel Kim"
-            },
-            {
-              id: "6",              name: "Victoria Lee",              handle: "@victorialee_glow",              testimonial: "Changed my entire makeup routine. The products are so easy to apply and the results are professional-grade.",              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/woman-talks-via-headphones-phone_1304-5107.jpg",              imageAlt: "Victoria Lee"
-            },
-          ]}
         />
       </div>
 
-      <div id="pricing" data-section="pricing">
-        <PricingCardOne
-          title="Simple, Transparent Pricing"
-          description="Choose the collection that's right for your beauty routine"
-          tag="Collections"
-          textboxLayout="default"
+      <div id="contact" data-section="contact">
+        <ContactText
+          text="Ready to transform your skincare routine? Discover the Radiance difference today and get exclusive welcome offers."
+          animationType="entrance-slide"
+          buttons={[
+            { text: "Shop Now", href: "#features" },
+            { text: "Get in Touch", href: "#contact" },
+          ]}
+          background={{ variant: "plain" }}
           useInvertedBackground={false}
-          animationType="slide-up"
-          plans={[
-            {
-              id: "1",              badge: "Starter",              badgeIcon: Sparkles,
-              price: "$49",              subtitle: "Perfect for first-time buyers",              features: [
-                "3 essential products",                "Natural ingredients",                "Free shipping",                "30-day guarantee"
-              ],
-            },
-            {
-              id: "2",              badge: "Most Popular",              badgeIcon: Heart,
-              price: "$99",              subtitle: "Complete beauty essentials",              features: [
-                "7 premium products",                "Luxury packaging",                "Priority support",                "Quarterly new releases",                "VIP access"
-              ],
-            },
-            {
-              id: "3",              badge: "Ultimate",              badgeIcon: Crown,
-              price: "$179",              subtitle: "The complete collection",              features: [
-                "All 15 products",                "Exclusive items",                "Personal beauty consultant",                "Monthly box service",                "Lifetime support"
-              ],
-            },
-          ]}
-          buttons={[{ text: "Get Started", href: "#" }]}
-          buttonAnimation="slide-up"
         />
       </div>
 
-      <div id="availability" data-section="availability" className="py-20">
-        <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-          {/* Header */}
-          <div className="mb-12 text-center">
-            <div className="inline-flex items-center gap-2 mb-4 px-4 py-2 rounded-full bg-opacity-10 backdrop-blur">
-              <Calendar className="w-4 h-4" />
-              <span className="text-sm font-medium">Consultation Booking</span>
-            </div>
-            <h2 className="text-4xl md:text-5xl font-bold mb-4">Schedule Your Personal Consultation</h2>
-            <p className="text-lg text-opacity-70 max-w-2xl mx-auto">Book a consultation with our beauty experts to find the perfect products and routine for your skin type.</p>
-          </div>
-
-          <div className="grid grid-cols-1 lg:grid-cols-3 gap-8">
-            {/* Calendar */}
-            <div className="lg:col-span-2">
-              <div className="rounded-lg border border-opacity-20 p-8 backdrop-blur">
-                <h3 className="text-2xl font-bold mb-6 flex items-center gap-2">
-                  <Calendar className="w-6 h-6" />
-                  Available Dates
-                </h3>
-
-                <div className="grid grid-cols-1 md:grid-cols-2 gap-4 mb-8">
-                  {calendarData.map((day) => (
-                    <button
-                      key={day.date}
-                      onClick={() => setSelectedDate(day.date)}
-                      className={`p-4 rounded-lg border-2 transition-all ${
-                        selectedDate === day.date
-                          ? 'border-opacity-100 bg-opacity-20'
-                          : 'border-opacity-20 hover:border-opacity-40'
-                      }`}
-                    >
-                      <div className="flex justify-between items-center">
-                        <div className="text-left">
-                          <p className="font-semibold">{day.day}</p>
-                          <p className="text-sm opacity-70">{new Date(day.date).toLocaleDateString('en-US', { month: 'short', day: 'numeric' })}</p>
-                        </div>
-                        <div className="text-right">
-                          <p className="font-bold text-lg">{getAvailableCount(day.date)}</p>
-                          <p className="text-xs opacity-70">slots</p>
-                        </div>
-                      </div>
-                    </button>
-                  ))}
-                </div>
-
-                {/* Time Slots */}
-                <div>
-                  <h4 className="text-xl font-bold mb-4 flex items-center gap-2">
-                    <Clock className="w-5 h-5" />
-                    Available Times
-                  </h4>
-                  <div className="grid grid-cols-2 md:grid-cols-4 gap-3">
-                    {getSelectedDaySlots().map((slot, idx) => (
-                      <button
-                        key={idx}
-                        onClick={() => slot.available && setSelectedSlot(slot.time)}
-                        disabled={!slot.available}
-                        className={`py-3 px-4 rounded-lg font-semibold transition-all ${
-                          !slot.available
-                            ? 'opacity-30 cursor-not-allowed'
-                            : selectedSlot === slot.time
-                            ? 'bg-opacity-100 text-white shadow-lg transform scale-105'
-                            : 'hover:bg-opacity-20'
-                        }`}
-                      >
-                        {slot.time}
-                      </button>
-                    ))}
-                  </div>
-                </div>
-              </div>
-            </div>
-
-            {/* Booking Summary */}
-            <div className="lg:col-span-1">
-              <div className="rounded-lg border border-opacity-20 p-8 backdrop-blur sticky top-20">
-                <h3 className="text-xl font-bold mb-6 flex items-center gap-2">
-                  <Users className="w-5 h-5" />
-                  Booking Summary
-                </h3>
-
-                <div className="space-y-4">
-                  <div>
-                    <p className="text-sm opacity-70 mb-2">Selected Date</p>
-                    <p className="font-bold text-lg">
-                      {selectedDate
-                        ? new Date(selectedDate).toLocaleDateString('en-US', { weekday: 'long', month: 'long', day: 'numeric' })
-                        : 'No date selected'}
-                    </p>
-                  </div>
-
-                  <div>
-                    <p className="text-sm opacity-70 mb-2">Selected Time</p>
-                    <p className="font-bold text-lg">
-                      {selectedSlot ? selectedSlot : 'No time selected'}
-                    </p>
-                  </div>
-
-                  <div>
-                    <p className="text-sm opacity-70 mb-2">Consultation Type</p>
-                    <p className="font-bold">30-Minute Personal Consultation</p>
-                  </div>
-
-                  <div className="border-t border-opacity-20 pt-4 mt-6">
-                    <p className="text-sm opacity-70 mb-3">What to Expect:</p>
-                    <ul className="space-y-2 text-sm">
-                      <li className="flex items-start gap-2">
-                        <CheckCircle className="w-4 h-4 flex-shrink-0 mt-0.5" />
-                        <span>Personalized skin analysis</span>
-                      </li>
-                      <li className="flex items-start gap-2">
-                        <CheckCircle className="w-4 h-4 flex-shrink-0 mt-0.5" />
-                        <span>Product recommendations</span>
-                      </li>
-                      <li className="flex items-start gap-2">
-                        <CheckCircle className="w-4 h-4 flex-shrink-0 mt-0.5" />
-                        <span>Custom routine guidance</span>
-                      </li>
-                    </ul>
-                  </div>
-
-                  <button
-                    disabled={!selectedDate || !selectedSlot}
-                    className={`w-full py-3 px-4 rounded-lg font-bold transition-all mt-6 ${
-                      selectedDate && selectedSlot
-                        ? 'hover:shadow-lg hover:scale-105'
-                        : 'opacity-50 cursor-not-allowed'
-                    }`}
-                  >
-                    Confirm Booking
-                  </button>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <div id="socialproof" data-section="socialproof">
-        <SocialProofOne
-          title="Trusted by Beauty Experts"
-          description="Featured in leading beauty magazines and endorsed by professional makeup artists"
-          tag="Featured"
-          textboxLayout="default"
-          useInvertedBackground={true}
-          names={[
-            "Vogue Beauty",            "Elle Magazine",            "Harper's Bazaar",            "Beauty Insider",            "Glamour",            "Marie Claire",            "Allure",            "InStyle"
-          ]}
-          speed={40}
-          showCard={true}
-        />
-      </div>
-
-      <div id="faq" data-section="faq">
-        <FaqSplitText
-          sideTitle="Frequently Asked Questions"
-          sideDescription="Everything you need to know about Radiance Beauty products and services"
-          textPosition="left"
-          useInvertedBackground={false}
-          animationType="smooth"
-          showCard={true}
-          faqsAnimation="slide-up"
-          faqs={[
-            {
-              id: "1",              title: "Are your products suitable for all skin types?",              content: "Yes! Our products are formulated to be gentle and effective for all skin types, including sensitive skin. We use hypoallergenic ingredients and dermatologist test everything before release."
-            },
-            {
-              id: "2",              title: "How long does delivery usually take?",              content: "Standard shipping takes 5-7 business days. We offer free shipping on orders over $50. Express shipping options are also available for faster delivery."
-            },
-            {
-              id: "3",              title: "What's your return policy?",              content: "We offer a 30-day money-back guarantee on all products. If you're not completely satisfied, simply return the unused product for a full refund."
-            },
-            {
-              id: "4",              title: "Are your products cruelty-free?",              content: "Absolutely! All Radiance Beauty products are 100% cruelty-free and vegan. We're certified by leading animal welfare organizations."
-            },
-            {
-              id: "5",              title: "Can I mix and match products?",              content: "Of course! Our formulations are designed to work beautifully together, but you can also customize your collection based on your preferences and needs."
-            },
-            {
-              id: "6",              title: "Do you offer subscription services?",              content: "Yes! Our Ultimate collection includes monthly beauty boxes with new releases and exclusive items. You can customize frequency and pause anytime."
-            },
-          ]}
-        />
-      </div>
-
-      <div id="footer" data-section="footer">
-        <FooterLogoEmphasis
-          logoText="Radiance Beauty"
-          columns={[
-            {
-              items: [
-                { label: "Shop", href: "#products" },
-                { label: "New Arrivals", href: "#products" },
-                { label: "Best Sellers", href: "#products" },
-                { label: "Collections", href: "#pricing" },
-              ],
-            },
-            {
-              items: [
-                { label: "About Us", href: "#about" },
-                { label: "Our Story", href: "#about" },
-                { label: "Sustainability", href: "#" },
-                { label: "Careers", href: "#" },
-              ],
-            },
-            {
-              items: [
-                { label: "Help Center", href: "#faq" },
-                { label: "Book Consultation", href: "#availability" },
-                { label: "Shipping Info", href: "#" },
-                { label: "Track Order", href: "#" },
-              ],
-            },
-            {
-              items: [
-                { label: "Privacy Policy", href: "#" },
-                { label: "Terms of Service", href: "#" },
-                { label: "Refund Policy", href: "#" },
-                { label: "Accessibility", href: "#" },
-              ],
-            },
-          ]}
-        />
-      </div>
+      <FooterLogoReveal
+        logoText="Radiance Beauty"
+        leftLink={{ text: "Privacy Policy", href: "#" }}
+        rightLink={{ text: "Terms of Service", href: "#" }}
+      />
     </ThemeProvider>
   );
 }