Update src/app/services/page.tsx

Merge version_5 into main

src/app/about/page.tsx

@@ -1,55 +1,54 @@
 "use client";
 
-import Link from "next/link";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
-import HeroBillboardGallery from "@/components/sections/hero/HeroBillboardGallery";
+import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
-import MetricSplitMediaAbout from "@/components/sections/about/MetricSplitMediaAbout";
+import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
-import FeatureCardTen from "@/components/sections/feature/FeatureCardTen";
+import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
-import FooterSimple from "@/components/sections/footer/FooterSimple";
+import ContactText from '@/components/sections/contact/ContactText';
-import { Palette, Award, Shield, CheckCircle } from "lucide-react";
+import FooterSimple from '@/components/sections/footer/FooterSimple';
+import { Sparkles, Palette, Heart, Smile, Zap, Music, Briefcase, Target, Users, Star, Award } from 'lucide-react';
 
 export default function AboutPage() {
   const navItems = [
-    { name: "Home", id: "home" },
+    { name: "Home", id: "/" },
-    { name: "Services", id: "services" },
+    { name: "Services", id: "/services" },
-    { name: "Gallery", id: "gallery" },
+    { name: "Gallery", id: "/gallery" },
-    { name: "Packages", id: "packages" },
+    { name: "Packages", id: "/packages" },
-    { name: "About", id: "about" },
+    { name: "About", id: "/about" },
-    { name: "Contact", id: "contact" },
+    { name: "Contact", id: "/contact" },
   ];
 
   const footerColumns = [
     {
-      title: "Services",
+      title: "Services",      items: [
-      items: [
         { label: "Kids Party Face Painting", href: "/services" },
         { label: "Festival Face Art", href: "/services" },
         { label: "Corporate Events", href: "/services" },
         { label: "Body Painting", href: "/services" },
+        { label: "Custom Designs", href: "/services" },
       ],
     },
     {
-      title: "Company",
+      title: "Company",      items: [
-      items: [
         { label: "About Us", href: "/about" },
         { label: "Gallery", href: "/gallery" },
         { label: "Packages", href: "/packages" },
+        { label: "FAQ", href: "/" },
         { label: "Contact", href: "/contact" },
       ],
     },
     {
-      title: "Connect",
+      title: "Connect",      items: [
-      items: [
         { label: "Instagram", href: "https://instagram.com" },
         { label: "Facebook", href: "https://facebook.com" },
         { label: "TikTok", href: "https://tiktok.com" },
         { label: "Email", href: "mailto:paintasy@events.com" },
+        { label: "Phone", href: "tel:+15551234567" },
       ],
     },
     {
-      title: "Service Areas",
+      title: "Service Areas",      items: [
-      items: [
         { label: "Local Events", href: "/contact" },
         { label: "Regional Coverage", href: "/contact" },
         { label: "Book Now", href: "/packages" },
@@ -73,102 +72,147 @@ export default function AboutPage() {
     >
       <div id="nav" data-section="nav">
         <NavbarStyleFullscreen
-          navItems={navItems}
           brandName="Paintasy"
+          navItems={navItems}
           bottomLeftText="Creative Face & Body Art"
           bottomRightText="paintasy@events.com"
         />
       </div>
 
-      <div id="about-page-hero" data-section="about-page-hero">
+      <div id="about-main" data-section="about-main" className="mx-auto px-4 md:px-6 lg:px-8 py-16 md:py-24 lg:py-32">
-        <HeroBillboardGallery
-          title="About Paintasy"
-          description="Professional face painting and body art entertainment bringing creativity and joy to events."
-          background={{ variant: "radial-gradient" }}
-          mediaItems={[
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-adult-man-his-30s-that-is-painting-big-canvas-with-lot-brushes-palette-while-sitting-floor-art-studio_662251-323.jpg?_wi=2",
-              imageAlt: "Professional face painter at work",
-            },
-          ]}
-          mediaAnimation="opacity"
-          titleClassName="text-5xl font-extrabold"
-          descriptionClassName="text-lg opacity-90"
-        />
-      </div>
-
-      <div id="about-story" data-section="about-story">
         <MetricSplitMediaAbout
-          title="Our Story & Mission"
+          title="Paintasy: Bringing Color and Joy to Every Celebration"
-          description="Paintasy was founded on the belief that creative entertainment transforms events into unforgettable celebrations. We started with a passion for face painting and body art, and have grown into a professional team dedicated to bringing magic and color to every event we touch.\n\nOur mission is simple: deliver exceptional artistic service, genuine happiness, and professional entertainment that exceeds expectations. From children's birthday parties to corporate celebrations and festival events, we pour our hearts into creating beautiful, memorable experiences."
+          description="Founded on the passion for creative expression and event entertainment, Paintasy has been transforming celebrations into unforgettable experiences. Our team of professional face and body painters combines artistic skill with genuine care for every client. Whether it's a child's first birthday party, a vibrant festival, or a corporate team-building event, we bring color, creativity, and joy to every occasion. With years of experience, professional-grade materials, and a commitment to safety and quality, Paintasy is your trusted partner for professional entertainment."
-          tag="Professional Team"
+          tag="Our Story"
-          tagIcon={Award}
+          tagIcon={Sparkles}
           tagAnimation="slide-up"
-          imageSrc="http://img.b2bpic.net/free-photo/portrait-smiling-adult-man-his-30s-that-is-painting-big-canvas-with-lot-brushes-palette-while-sitting-floor-art-studio_662251-323.jpg?_wi=3"
+          imageSrc="http://img.b2bpic.net/free-photo/young-artist-female-her-20s-art-studio-with-many-tools-painting_662251-1233.jpg?_wi=1"
-          imageAlt="Our professional face painting artist"
+          imageAlt="Paintasy artists working on creative designs"
           mediaAnimation="blur-reveal"
           metrics={[
-            { value: "500+", title: "Events Painted" },
+            { value: "15+", title: "Professional Artists" },
-            { value: "1000+", title: "Happy Faces" },
+            { value: "500+", title: "Events Completed" },
-            { value: "10+", title: "Years Experience" },
+            { value: "1000+", title: "Happy Faces Painted" },
-            { value: "100%", title: "Satisfaction Rate" },
+            { value: "100%", title: "Client Satisfaction" },
           ]}
           metricsAnimation="slide-up"
-          useInvertedBackground={true}
+          useInvertedBackground={false}
-          titleClassName="text-4xl font-extrabold"
+          ariaLabel="About page main section"
-          descriptionClassName="text-lg opacity-90 max-w-2xl"
+          containerClassName="gap-8 lg:gap-12"
+          titleClassName="text-4xl sm:text-5xl lg:text-6xl font-extrabold"
+          descriptionClassName="text-base sm:text-lg opacity-90 max-w-3xl"
         />
       </div>
 
-      <div id="about-values" data-section="about-values">
+      <div id="about-values" data-section="about-values" className="mx-auto px-4 md:px-6 lg:px-8 py-16 md:py-24">
         <FeatureCardTen
-          title="Our Values"
+          title="Our Values & Commitment"
-          description="What drives us in everything we do."
+          description="What drives Paintasy every single day is our dedication to excellence, safety, and customer satisfaction. We believe that creativity should be accessible, affordable, and safe for everyone."
+          tag="Why Choose Paintasy"
+          tagIcon={Palette}
+          tagAnimation="slide-up"
           textboxLayout="default"
           animationType="slide-up"
-          useInvertedBackground={false}
+          useInvertedBackground={true}
           features={[
             {
-              id: "value-1",
+              id: "quality",              title: "Professional Quality",              description: "We use only professional-grade, hypoallergenic face paints and premium materials. Every design is created with attention to detail and artistic excellence.",              media: {
-              title: "Creativity",
+                imageSrc: "http://img.b2bpic.net/free-photo/art-supplies-arranged-table_23-2147854326.jpg?_wi=1",                imageAlt: "Professional face painting supplies"},
-              description:
-                "We believe in artistic expression and creative design. Every face is a canvas.",
-              media: {
-                imageSrc: "http://img.b2bpic.net/free-photo/fun-portrait-with-decorations-face_23-2150749319.jpg?_wi=3",
-                imageAlt: "Creative face painting designs",
-              },
               items: [
-                { icon: Palette, text: "Artistic innovation" },
+                { icon: Star, text: "Premium materials" },
-                { icon: CheckCircle, text: "Unique designs" },
+                { icon: Sparkles, text: "Professional artists" },
+                { icon: Heart, text: "Detail-oriented service" },
               ],
               reverse: false,
             },
             {
-              id: "value-2",
+              id: "safety",              title: "Safety & Hygiene",              description: "Your health and safety are our top priority. We follow strict hygiene protocols, use sanitized tools for each client, and provide hypoallergenic options for sensitive skin.",              media: {
-              title: "Safety & Professionalism",
+                imageSrc: "http://img.b2bpic.net/free-photo/hands-being-washed_23-2149191617.jpg?_wi=1",                imageAlt: "Professional hygiene practices"},
-              description:
-                "We use only hypoallergenic, professional-grade face paints and maintain strict hygiene standards.",
-              media: {
-                imageSrc: "http://img.b2bpic.net/free-photo/dreamy-eyes-woman-smiling-festival_23-2148338055.jpg?_wi=5",
-                imageAlt: "Safe professional face painting",
-              },
               items: [
-                { icon: Shield, text: "Hypoallergenic products" },
+                { icon: Smile, text: "Strict hygiene standards" },
-                { icon: CheckCircle, text: "Safety certified" },
+                { icon: Heart, text: "Hypoallergenic products" },
+                { icon: Target, text: "Health-conscious service" },
               ],
               reverse: true,
             },
+            {
+              id: "creativity",              title: "Unlimited Creativity",              description: "From classic designs to custom creations, we bring imagination to life. Our artists stay current with trends and can create virtually any design you envision.",              media: {
+                imageSrc: "http://img.b2bpic.net/free-photo/artist-woman-painting-portrait-canvas-studio_23-2148937856.jpg?_wi=1",                imageAlt: "Artists creating custom designs"},
+              items: [
+                { icon: Sparkles, text: "Custom designs" },
+                { icon: Zap, text: "Trendy artwork" },
+                { icon: Users, text: "Personalized service" },
+              ],
+              reverse: false,
+            },
           ]}
-          containerClassName="gap-12"
+          buttons={[{ text: "Book Your Event", href: "/packages" }]}
-          containerClassName="gap-12"
+          buttonAnimation="blur-reveal"
+          ariaLabel="About page values section"
+          containerClassName="gap-8 lg:gap-12"
         />
       </div>
 
-      <div id="footer" data-section="footer">
+      <div id="about-team" data-section="about-team" className="mx-auto px-4 md:px-6 lg:px-8 py-16 md:py-24">
+        <TestimonialCardTwo
+          title="Meet Our Community"
+          description="Paintasy is built on the foundation of passionate, talented artists and satisfied customers. Join thousands who've experienced the magic of professional face and body art."
+          tag="Community"
+          tagIcon={Users}
+          tagAnimation="slide-up"
+          textboxLayout="default"
+          animationType="blur-reveal"
+          useInvertedBackground={false}
+          carouselMode="buttons"
+          testimonials={[
+            {
+              id: "team-1",              name: "Aurora Studios",              role: "Professional Artist",              testimonial: "Paintasy gave me the platform to showcase my artistic talent and build a thriving career. I love working with diverse clients and creating magical moments at events.",              imageSrc: "http://img.b2bpic.net/free-photo/portrait-of-smiling-artist-at-studio_23-2149021637.jpg?_wi=1",              imageAlt: "Professional Paintasy artist",              icon: Sparkles,
+            },
+            {
+              id: "team-2",              name: "Creative Collective",              role: "Event Partner",              testimonial: "We partner with Paintasy because they consistently deliver exceptional entertainment. Their artists are professional, reliable, and always go above and beyond.",              imageSrc: "http://img.b2bpic.net/free-photo/group-of-creative-professionals_23-2149112458.jpg?_wi=1",              imageAlt: "Paintasy team at event",              icon: Star,
+            },
+            {
+              id: "testimonial-3",              name: "Sarah Johnson",              role: "Parent",              testimonial: "My daughter talked about her birthday face painting for weeks! Paintasy made her feel so special. We'll definitely book them again for future celebrations.",              imageSrc: "http://img.b2bpic.net/free-photo/happy-family-playing-together_23-2149062749.jpg?_wi=1",              imageAlt: "Happy family with face painted child",              icon: Heart,
+            },
+            {
+              id: "testimonial-4",              name: "Festival Directors",              role: "Festival Organizer",              testimonial: "Paintasy is our go-to entertainment provider. They handle high-volume requests with grace, create stunning designs, and make our festivals memorable.",              imageSrc: "http://img.b2bpic.net/free-photo/diverse-group-enjoying-festival_23-2149156238.jpg?_wi=1",              imageAlt: "Festival crowd enjoying Paintasy services",              icon: Smile,
+            },
+          ]}
+          buttons={[{ text: "Join Our Community", href: "/services" }]}
+          buttonAnimation="blur-reveal"
+          ariaLabel="About page community testimonials"
+          containerClassName="gap-8 lg:gap-12"
+        />
+      </div>
+
+      <div id="about-cta" data-section="about-cta" className="mx-auto px-4 md:px-6 lg:px-8 py-16 md:py-24">
+        <ContactText
+          text="Ready to be part of the Paintasy family? Whether you're looking to book our services or become a professional partner, we'd love to connect with you. Let's create something colorful and magical together!"
+          animationType="background-highlight"
+          background={{ variant: "radial-gradient" }}
+          useInvertedBackground={false}
+          buttons={[
+            { text: "Book Services", href: "/packages" },
+            { text: "Contact Us", href: "/contact" },
+          ]}
+          ariaLabel="About page call-to-action"
+          containerClassName="py-12 sm:py-16 lg:py-20"
+          contentClassName="max-w-3xl mx-auto"
+          textClassName="text-2xl sm:text-3xl lg:text-4xl font-extrabold text-center"
+          buttonContainerClassName="flex flex-col sm:flex-row gap-4 justify-center mt-8"
+        />
+      </div>
+
+      <div id="footer-about" data-section="footer-about" className="mx-auto px-4 md:px-6 lg:px-8">
         <FooterSimple
           columns={footerColumns}
           bottomLeftText="© 2024 Paintasy Face and Body Art. All rights reserved."
           bottomRightText="Professional Event Entertainment | Creative Services"
+          ariaLabel="Site footer with links"
+          containerClassName="gap-8 lg:gap-12"
+          columnsClassName="grid-cols-2 lg:grid-cols-4"
+          columnTitleClassName="font-extrabold text-lg"
+          columnItemClassName="hover:opacity-70 transition-opacity"
         />
       </div>
     </ThemeProvider>

src/app/booking/page.tsx

@@ -0,0 +1,318 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import ContactSplit from '@/components/sections/contact/ContactSplit';
+import FooterSimple from '@/components/sections/footer/FooterSimple';
+import { useState } from 'react';
+import { Heart, Mail, Phone, MapPin, Facebook, Instagram, Twitter } from 'lucide-react';
+
+export default function BookingPage() {
+  const [formData, setFormData] = useState({
+    name: '',
+    email: '',
+    phone: '',
+    eventDate: '',
+    eventType: '',
+    guestCount: '',
+    message: '',
+  });
+
+  const navItems = [
+    { name: "Home", id: "home" },
+    { name: "Services", id: "services" },
+    { name: "Gallery", id: "gallery" },
+    { name: "Packages", id: "packages" },
+    { name: "About", id: "about" },
+    { name: "Booking", id: "booking" },
+    { name: "Contact", id: "contact" },
+  ];
+
+  const footerColumns = [
+    {
+      title: "Services",      items: [
+        { label: "Kids Party Face Painting", href: "/services" },
+        { label: "Festival Face Art", href: "/services" },
+        { label: "Corporate Events", href: "/services" },
+        { label: "Body Painting", href: "/services" },
+        { label: "Custom Designs", href: "/services" },
+      ],
+    },
+    {
+      title: "Company",      items: [
+        { label: "About Us", href: "/about" },
+        { label: "Gallery", href: "/gallery" },
+        { label: "Packages", href: "/packages" },
+        { label: "FAQ", href: "#faq" },
+        { label: "Contact", href: "/contact" },
+      ],
+    },
+    {
+      title: "Connect",      items: [
+        { label: "Instagram", href: "https://instagram.com" },
+        { label: "Facebook", href: "https://facebook.com" },
+        { label: "TikTok", href: "https://tiktok.com" },
+        { label: "Email", href: "mailto:paintasy@events.com" },
+        { label: "Phone", href: "tel:+15551234567" },
+      ],
+    },
+    {
+      title: "Service Areas",      items: [
+        { label: "Local Events", href: "/contact" },
+        { label: "Regional Coverage", href: "/contact" },
+        { label: "Book Now", href: "/booking" },
+        { label: "Get Quote", href: "/contact" },
+      ],
+    },
+  ];
+
+  const handleFormChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement>) => {
+    const { name, value } = e.target;
+    setFormData(prev => ({ ...prev, [name]: value }));
+  };
+
+  const handleSubmit = (e: React.FormEvent) => {
+    e.preventDefault();
+    console.log('Booking form submitted:', formData);
+    alert('Thank you for your booking request! We will contact you soon.');
+    setFormData({
+      name: '',
+      email: '',
+      phone: '',
+      eventDate: '',
+      eventType: '',
+      guestCount: '',
+      message: '',
+    });
+  };
+
+  return (
+    <ThemeProvider
+      defaultButtonVariant="shift-hover"
+      defaultTextAnimation="background-highlight"
+      borderRadius="rounded"
+      contentWidth="compact"
+      sizing="large"
+      background="none"
+      cardStyle="gradient-bordered"
+      primaryButtonStyle="flat"
+      secondaryButtonStyle="radial-glow"
+      headingFontWeight="extrabold"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleFullscreen
+          brandName="Paintasy"
+          navItems={navItems}
+          bottomLeftText="Creative Face & Body Art"
+          bottomRightText="paintasy@events.com"
+        />
+      </div>
+
+      <div id="booking-hero" data-section="booking-hero" className="mx-auto px-4 md:px-6 lg:px-8 py-16 md:py-24 lg:py-32">
+        <div className="max-w-4xl mx-auto">
+          <h1 className="text-4xl md:text-5xl lg:text-6xl font-extrabold mb-6 text-center bg-gradient-to-r from-pink-500 via-purple-500 to-indigo-500 bg-clip-text text-transparent">
+            Book Your Event
+          </h1>
+          <p className="text-lg md:text-xl text-center opacity-80 mb-12 max-w-2xl mx-auto">
+            Request a quote for professional face painting and body art services. Fill out the form below and we'll get back to you with availability and pricing.
+          </p>
+        </div>
+      </div>
+
+      <div id="booking-form" data-section="booking-form" className="mx-auto px-4 md:px-6 lg:px-8 py-12 md:py-16 lg:py-20">
+        <div className="max-w-2xl mx-auto">
+          <div className="rounded-lg p-8 md:p-12 bg-gradient-to-br from-pink-50 via-purple-50 to-indigo-50 border-2 border-purple-200 shadow-lg">
+            <form onSubmit={handleSubmit} className="space-y-6">
+              <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
+                <div>
+                  <label className="block text-sm font-semibold mb-2 text-gray-800">Full Name *</label>
+                  <input
+                    type="text"
+                    name="name"
+                    value={formData.name}
+                    onChange={handleFormChange}
+                    required
+                    placeholder="Your name"
+                    className="w-full px-4 py-3 rounded-lg border-2 border-purple-300 focus:border-purple-500 focus:outline-none transition-colors bg-white text-gray-800 placeholder-gray-500"
+                  />
+                </div>
+                <div>
+                  <label className="block text-sm font-semibold mb-2 text-gray-800">Email Address *</label>
+                  <input
+                    type="email"
+                    name="email"
+                    value={formData.email}
+                    onChange={handleFormChange}
+                    required
+                    placeholder="your@email.com"
+                    className="w-full px-4 py-3 rounded-lg border-2 border-purple-300 focus:border-purple-500 focus:outline-none transition-colors bg-white text-gray-800 placeholder-gray-500"
+                  />
+                </div>
+              </div>
+
+              <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
+                <div>
+                  <label className="block text-sm font-semibold mb-2 text-gray-800">Phone Number *</label>
+                  <input
+                    type="tel"
+                    name="phone"
+                    value={formData.phone}
+                    onChange={handleFormChange}
+                    required
+                    placeholder="(555) 123-4567"
+                    className="w-full px-4 py-3 rounded-lg border-2 border-purple-300 focus:border-purple-500 focus:outline-none transition-colors bg-white text-gray-800 placeholder-gray-500"
+                  />
+                </div>
+                <div>
+                  <label className="block text-sm font-semibold mb-2 text-gray-800">Event Date *</label>
+                  <input
+                    type="date"
+                    name="eventDate"
+                    value={formData.eventDate}
+                    onChange={handleFormChange}
+                    required
+                    className="w-full px-4 py-3 rounded-lg border-2 border-purple-300 focus:border-purple-500 focus:outline-none transition-colors bg-white text-gray-800"
+                  />
+                </div>
+              </div>
+
+              <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
+                <div>
+                  <label className="block text-sm font-semibold mb-2 text-gray-800">Event Type *</label>
+                  <select
+                    name="eventType"
+                    value={formData.eventType}
+                    onChange={handleFormChange}
+                    required
+                    className="w-full px-4 py-3 rounded-lg border-2 border-purple-300 focus:border-purple-500 focus:outline-none transition-colors bg-white text-gray-800"
+                  >
+                    <option value="">Select event type</option>
+                    <option value="birthday-party">Birthday Party</option>
+                    <option value="festival">Festival/Outdoor Event</option>
+                    <option value="corporate">Corporate Event</option>
+                    <option value="wedding">Wedding/Reception</option>
+                    <option value="school-event">School Event</option>
+                    <option value="other">Other</option>
+                  </select>
+                </div>
+                <div>
+                  <label className="block text-sm font-semibold mb-2 text-gray-800">Number of Guests *</label>
+                  <input
+                    type="number"
+                    name="guestCount"
+                    value={formData.guestCount}
+                    onChange={handleFormChange}
+                    required
+                    placeholder="Approximate guest count"
+                    min="1"
+                    className="w-full px-4 py-3 rounded-lg border-2 border-purple-300 focus:border-purple-500 focus:outline-none transition-colors bg-white text-gray-800 placeholder-gray-500"
+                  />
+                </div>
+              </div>
+
+              <div>
+                <label className="block text-sm font-semibold mb-2 text-gray-800">Message / Special Requests</label>
+                <textarea
+                  name="message"
+                  value={formData.message}
+                  onChange={handleFormChange}
+                  placeholder="Tell us about your event and any special requests..."
+                  rows={5}
+                  className="w-full px-4 py-3 rounded-lg border-2 border-purple-300 focus:border-purple-500 focus:outline-none transition-colors bg-white text-gray-800 placeholder-gray-500 resize-none"
+                />
+              </div>
+
+              <button
+                type="submit"
+                className="w-full bg-gradient-to-r from-pink-500 via-purple-500 to-indigo-500 hover:from-pink-600 hover:via-purple-600 hover:to-indigo-600 text-white font-bold py-3 px-6 rounded-lg transition-all duration-300 transform hover:scale-105 shadow-lg text-lg"
+              >
+                Get Your Quote
+              </button>
+            </form>
+          </div>
+        </div>
+      </div>
+
+      <div id="booking-info" data-section="booking-info" className="mx-auto px-4 md:px-6 lg:px-8 py-12 md:py-16 lg:py-20 bg-gradient-to-b from-transparent via-purple-50 to-transparent">
+        <div className="max-w-6xl mx-auto">
+          <h2 className="text-3xl md:text-4xl lg:text-5xl font-extrabold text-center mb-12">Get In Touch</h2>
+          
+          <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
+            <div className="rounded-lg p-8 bg-white border-2 border-pink-200 shadow-lg text-center hover:shadow-xl transition-shadow">
+              <Phone className="w-12 h-12 mx-auto mb-4 text-pink-500" />
+              <h3 className="text-xl font-bold mb-2">Phone</h3>
+              <p className="text-gray-700 mb-4">Call us for quick inquiries</p>
+              <a href="tel:+15551234567" className="text-pink-500 font-semibold hover:text-pink-700 transition-colors">
+                (555) 123-4567
+              </a>
+            </div>
+
+            <div className="rounded-lg p-8 bg-white border-2 border-purple-200 shadow-lg text-center hover:shadow-xl transition-shadow">
+              <Mail className="w-12 h-12 mx-auto mb-4 text-purple-500" />
+              <h3 className="text-xl font-bold mb-2">Email</h3>
+              <p className="text-gray-700 mb-4">Send us your booking details</p>
+              <a href="mailto:paintasy@events.com" className="text-purple-500 font-semibold hover:text-purple-700 transition-colors">
+                paintasy@events.com
+              </a>
+            </div>
+
+            <div className="rounded-lg p-8 bg-white border-2 border-indigo-200 shadow-lg text-center hover:shadow-xl transition-shadow">
+              <MapPin className="w-12 h-12 mx-auto mb-4 text-indigo-500" />
+              <h3 className="text-xl font-bold mb-2">Location</h3>
+              <p className="text-gray-700 mb-4">We service events in your area</p>
+              <p className="text-indigo-500 font-semibold">
+                Regional Coverage Available
+              </p>
+            </div>
+          </div>
+
+          <div className="mt-16 text-center">
+            <h3 className="text-2xl font-bold mb-6">Follow Us On Social Media</h3>
+            <div className="flex justify-center gap-6 flex-wrap">
+              <a
+                href="https://facebook.com"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="inline-flex items-center gap-2 px-6 py-3 rounded-lg bg-blue-500 text-white font-semibold hover:bg-blue-600 transition-colors shadow-lg hover:shadow-xl"
+              >
+                <Facebook className="w-5 h-5" />
+                Facebook
+              </a>
+              <a
+                href="https://instagram.com"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="inline-flex items-center gap-2 px-6 py-3 rounded-lg bg-gradient-to-r from-pink-500 to-purple-500 text-white font-semibold hover:from-pink-600 hover:to-purple-600 transition-colors shadow-lg hover:shadow-xl"
+              >
+                <Instagram className="w-5 h-5" />
+                Instagram
+              </a>
+              <a
+                href="https://tiktok.com"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="inline-flex items-center gap-2 px-6 py-3 rounded-lg bg-gray-900 text-white font-semibold hover:bg-gray-800 transition-colors shadow-lg hover:shadow-xl"
+              >
+                <Twitter className="w-5 h-5" />
+                TikTok
+              </a>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <div id="footer-booking" data-section="footer-booking" className="mx-auto px-4 md:px-6 lg:px-8">
+        <FooterSimple
+          columns={footerColumns}
+          bottomLeftText="© 2024 Paintasy Face and Body Art. All rights reserved."
+          bottomRightText="Professional Event Entertainment | Creative Services"
+          ariaLabel="Site footer with links"
+          containerClassName="gap-8 lg:gap-12"
+          columnsClassName="grid-cols-2 lg:grid-cols-4"
+          columnTitleClassName="font-extrabold text-lg"
+          columnItemClassName="hover:opacity-70 transition-opacity"
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/contact/page.tsx

@@ -1,63 +1,87 @@
 "use client";
 
-import Link from "next/link";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
-import HeroBillboardGallery from "@/components/sections/hero/HeroBillboardGallery";
+import FooterSimple from '@/components/sections/footer/FooterSimple';
-import ContactText from "@/components/sections/contact/ContactText";
+import { useState } from 'react';
-import FaqBase from "@/components/sections/faq/FaqBase";
+import { MessageCircle, Mail, Phone, MapPin, Clock, Facebook, Instagram, Twitter, Linkedin } from 'lucide-react';
-import FooterSimple from "@/components/sections/footer/FooterSimple";
-import { HelpCircle, Mail, Phone, MapPin } from "lucide-react";
 
 export default function ContactPage() {
+  const [formData, setFormData] = useState({
+    name: '',
+    email: '',
+    subject: '',
+    message: '',
+  });
+
+  const [submitted, setSubmitted] = useState(false);
+
   const navItems = [
     { name: "Home", id: "home" },
     { name: "Services", id: "services" },
     { name: "Gallery", id: "gallery" },
     { name: "Packages", id: "packages" },
     { name: "About", id: "about" },
+    { name: "Booking", id: "booking" },
     { name: "Contact", id: "contact" },
   ];
 
   const footerColumns = [
     {
-      title: "Services",
+      title: "Services",      items: [
-      items: [
         { label: "Kids Party Face Painting", href: "/services" },
         { label: "Festival Face Art", href: "/services" },
         { label: "Corporate Events", href: "/services" },
         { label: "Body Painting", href: "/services" },
+        { label: "Custom Designs", href: "/services" },
       ],
     },
     {
-      title: "Company",
+      title: "Company",      items: [
-      items: [
         { label: "About Us", href: "/about" },
         { label: "Gallery", href: "/gallery" },
         { label: "Packages", href: "/packages" },
+        { label: "FAQ", href: "#faq" },
         { label: "Contact", href: "/contact" },
       ],
     },
     {
-      title: "Connect",
+      title: "Connect",      items: [
-      items: [
         { label: "Instagram", href: "https://instagram.com" },
         { label: "Facebook", href: "https://facebook.com" },
         { label: "TikTok", href: "https://tiktok.com" },
         { label: "Email", href: "mailto:paintasy@events.com" },
+        { label: "Phone", href: "tel:+15551234567" },
       ],
     },
     {
-      title: "Service Areas",
+      title: "Service Areas",      items: [
-      items: [
         { label: "Local Events", href: "/contact" },
         { label: "Regional Coverage", href: "/contact" },
-        { label: "Book Now", href: "/packages" },
+        { label: "Book Now", href: "/booking" },
         { label: "Get Quote", href: "/contact" },
       ],
     },
   ];
 
+  const handleFormChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {
+    const { name, value } = e.target;
+    setFormData(prev => ({ ...prev, [name]: value }));
+  };
+
+  const handleSubmit = (e: React.FormEvent) => {
+    e.preventDefault();
+    console.log('Contact form submitted:', formData);
+    setSubmitted(true);
+    setFormData({
+      name: '',
+      email: '',
+      subject: '',
+      message: '',
+    });
+    setTimeout(() => setSubmitted(false), 3000);
+  };
+
   return (
     <ThemeProvider
       defaultButtonVariant="shift-hover"
@@ -73,109 +97,209 @@ export default function ContactPage() {
     >
       <div id="nav" data-section="nav">
         <NavbarStyleFullscreen
-          navItems={navItems}
           brandName="Paintasy"
+          navItems={navItems}
           bottomLeftText="Creative Face & Body Art"
           bottomRightText="paintasy@events.com"
         />
       </div>
 
-      <div id="contact-page-hero" data-section="contact-page-hero">
+      <div id="contact-hero" data-section="contact-hero" className="mx-auto px-4 md:px-6 lg:px-8 py-16 md:py-24 lg:py-32">
-        <HeroBillboardGallery
+        <div className="max-w-4xl mx-auto text-center">
-          title="Get In Touch"
+          <h1 className="text-4xl md:text-5xl lg:text-6xl font-extrabold mb-6 bg-gradient-to-r from-red-500 via-yellow-500 to-pink-500 bg-clip-text text-transparent">
-          description="Ready to book Paintasy for your event? Contact us today and let's create an unforgettable experience."
+            Contact Us
-          background={{ variant: "radial-gradient" }}
+          </h1>
-          buttons={[{ text: "Call Us", href: "tel:+15551234567" }]}
+          <p className="text-lg md:text-xl opacity-80 mb-4 max-w-2xl mx-auto">
-          buttonAnimation="blur-reveal"
+            Have questions or ready to book? We'd love to hear from you! Reach out to our team and let's make your event unforgettable.
-          mediaItems={[
+          </p>
-            {
+        </div>
-              imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-adult-man-his-30s-that-is-painting-big-canvas-with-lot-brushes-palette-while-sitting-floor-art-studio_662251-323.jpg?_wi=4",
-              imageAlt: "Contact Paintasy for your event",
-            },
-          ]}
-          mediaAnimation="opacity"
-          titleClassName="text-5xl font-extrabold"
-          descriptionClassName="text-lg opacity-90"
-        />
       </div>
 
-      <div id="contact-cta" data-section="contact-cta">
+      <div id="contact-content" data-section="contact-content" className="mx-auto px-4 md:px-6 lg:px-8 py-12 md:py-16 lg:py-20">
-        <ContactText
+        <div className="max-w-6xl mx-auto grid grid-cols-1 lg:grid-cols-2 gap-12">
-          text="Ready to add magic to your event? Contact Paintasy Face and Body Art today. We'd love to discuss your event and create an unforgettable experience for your guests. Get your quote or schedule a consultation now!"
+          {/* Contact Form */}
-          animationType="background-highlight"
+          <div className="rounded-lg p-8 md:p-10 bg-gradient-to-br from-blue-50 via-cyan-50 to-teal-50 border-2 border-cyan-300 shadow-lg">
-          background={{ variant: "sparkles-gradient" }}
+            <h2 className="text-3xl font-bold mb-8 text-gray-800">Send Us a Message</h2>
-          useInvertedBackground={false}
+            
-          buttons={[
+            {submitted && (
-            { text: "Email Us", href: "mailto:paintasy@events.com" },
+              <div className="mb-6 p-4 rounded-lg bg-green-100 border-2 border-green-400 text-green-800 font-semibold">
-            { text: "Call +1 (555) 123-4567", href: "tel:+15551234567" },
+                ✓ Thank you! We'll be in touch soon.
-          ]}
+              </div>
-          containerClassName="py-16"
+            )}
-          textClassName="text-3xl font-extrabold text-center"
+
-          buttonContainerClassName="flex flex-col sm:flex-row gap-4 justify-center mt-8"
+            <form onSubmit={handleSubmit} className="space-y-6">
-        />
+              <div>
+                <label className="block text-sm font-semibold mb-2 text-gray-800">Your Name *</label>
+                <input
+                  type="text"
+                  name="name"
+                  value={formData.name}
+                  onChange={handleFormChange}
+                  required
+                  placeholder="John Doe"
+                  className="w-full px-4 py-3 rounded-lg border-2 border-cyan-300 focus:border-cyan-500 focus:outline-none transition-colors bg-white text-gray-800 placeholder-gray-500"
+                />
+              </div>
+
+              <div>
+                <label className="block text-sm font-semibold mb-2 text-gray-800">Email Address *</label>
+                <input
+                  type="email"
+                  name="email"
+                  value={formData.email}
+                  onChange={handleFormChange}
+                  required
+                  placeholder="your@email.com"
+                  className="w-full px-4 py-3 rounded-lg border-2 border-cyan-300 focus:border-cyan-500 focus:outline-none transition-colors bg-white text-gray-800 placeholder-gray-500"
+                />
+              </div>
+
+              <div>
+                <label className="block text-sm font-semibold mb-2 text-gray-800">Subject *</label>
+                <input
+                  type="text"
+                  name="subject"
+                  value={formData.subject}
+                  onChange={handleFormChange}
+                  required
+                  placeholder="How can we help?"
+                  className="w-full px-4 py-3 rounded-lg border-2 border-cyan-300 focus:border-cyan-500 focus:outline-none transition-colors bg-white text-gray-800 placeholder-gray-500"
+                />
+              </div>
+
+              <div>
+                <label className="block text-sm font-semibold mb-2 text-gray-800">Message *</label>
+                <textarea
+                  name="message"
+                  value={formData.message}
+                  onChange={handleFormChange}
+                  required
+                  placeholder="Tell us more about your inquiry..."
+                  rows={6}
+                  className="w-full px-4 py-3 rounded-lg border-2 border-cyan-300 focus:border-cyan-500 focus:outline-none transition-colors bg-white text-gray-800 placeholder-gray-500 resize-none"
+                />
+              </div>
+
+              <button
+                type="submit"
+                className="w-full bg-gradient-to-r from-cyan-500 via-blue-500 to-teal-500 hover:from-cyan-600 hover:via-blue-600 hover:to-teal-600 text-white font-bold py-3 px-6 rounded-lg transition-all duration-300 transform hover:scale-105 shadow-lg text-lg"
+              >
+                Send Message
+              </button>
+            </form>
+          </div>
+
+          {/* Contact Information */}
+          <div className="space-y-8">
+            <div className="rounded-lg p-8 bg-gradient-to-br from-red-50 to-orange-50 border-2 border-red-200 shadow-lg hover:shadow-xl transition-shadow">
+              <div className="flex items-start gap-4">
+                <Phone className="w-8 h-8 text-red-500 flex-shrink-0 mt-1" />
+                <div>
+                  <h3 className="text-lg font-bold text-gray-800 mb-2">Phone</h3>
+                  <a href="tel:+15551234567" className="text-lg font-semibold text-red-600 hover:text-red-700 transition-colors">
+                    (555) 123-4567
+                  </a>
+                  <p className="text-gray-700 mt-1 text-sm">Available Mon-Sun, 9 AM - 6 PM</p>
+                </div>
+              </div>
+            </div>
+
+            <div className="rounded-lg p-8 bg-gradient-to-br from-yellow-50 to-amber-50 border-2 border-yellow-200 shadow-lg hover:shadow-xl transition-shadow">
+              <div className="flex items-start gap-4">
+                <Mail className="w-8 h-8 text-yellow-600 flex-shrink-0 mt-1" />
+                <div>
+                  <h3 className="text-lg font-bold text-gray-800 mb-2">Email</h3>
+                  <a href="mailto:paintasy@events.com" className="text-lg font-semibold text-yellow-700 hover:text-yellow-800 transition-colors">
+                    paintasy@events.com
+                  </a>
+                  <p className="text-gray-700 mt-1 text-sm">We reply within 24 hours</p>
+                </div>
+              </div>
+            </div>
+
+            <div className="rounded-lg p-8 bg-gradient-to-br from-green-50 to-emerald-50 border-2 border-green-200 shadow-lg hover:shadow-xl transition-shadow">
+              <div className="flex items-start gap-4">
+                <MapPin className="w-8 h-8 text-green-600 flex-shrink-0 mt-1" />
+                <div>
+                  <h3 className="text-lg font-bold text-gray-800 mb-2">Service Area</h3>
+                  <p className="text-gray-700 font-semibold">Regional Coverage</p>
+                  <p className="text-gray-700 mt-1 text-sm">We service events throughout the region</p>
+                </div>
+              </div>
+            </div>
+
+            <div className="rounded-lg p-8 bg-gradient-to-br from-purple-50 to-pink-50 border-2 border-purple-200 shadow-lg hover:shadow-xl transition-shadow">
+              <div className="flex items-start gap-4">
+                <Clock className="w-8 h-8 text-purple-600 flex-shrink-0 mt-1" />
+                <div>
+                  <h3 className="text-lg font-bold text-gray-800 mb-2">Hours</h3>
+                  <p className="text-gray-700 text-sm">Monday - Sunday</p>
+                  <p className="text-gray-700 font-semibold text-sm">9:00 AM - 6:00 PM</p>
+                  <p className="text-gray-700 text-sm mt-1">Holiday hours may vary</p>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
       </div>
 
-      <div id="contact-faq" data-section="contact-faq">
+      {/* Social Media Section */}
-        <FaqBase
+      <div id="contact-social" data-section="contact-social" className="mx-auto px-4 md:px-6 lg:px-8 py-12 md:py-16 lg:py-20 bg-gradient-to-r from-pink-100 via-purple-100 to-indigo-100">
-          title="Frequently Asked Questions"
+        <div className="max-w-4xl mx-auto text-center">
-          description="Everything you need to know about booking Paintasy for your event."
+          <h2 className="text-3xl md:text-4xl lg:text-5xl font-extrabold mb-4">Connect With Us</h2>
-          tag="FAQ"
+          <p className="text-lg opacity-80 mb-12">Follow our social media for behind-the-scenes content, event updates, and creative inspiration</p>
-          tagIcon={HelpCircle}
+          
-          tagAnimation="slide-up"
+          <div className="flex justify-center gap-6 flex-wrap">
-          textboxLayout="default"
+            <a
-          animationType="smooth"
+              href="https://facebook.com"
-          faqsAnimation="slide-up"
+              target="_blank"
-          useInvertedBackground={true}
+              rel="noopener noreferrer"
-          showCard={true}
+              className="inline-flex items-center gap-3 px-8 py-4 rounded-lg bg-blue-500 text-white font-bold hover:bg-blue-600 transition-all duration-300 transform hover:scale-110 shadow-lg hover:shadow-xl"
-          faqs={[
+            >
-            {
+              <Facebook className="w-6 h-6" />
-              id: "faq-1",
+              Facebook
-              title: "How far in advance should I book?",
+            </a>
-              content:
+            <a
-                "We recommend booking at least 2-3 weeks in advance to secure your preferred date and time. For large events or peak seasons, 4-6 weeks advance booking is ideal. Last-minute bookings may be available depending on our schedule.",
+              href="https://instagram.com"
-            },
+              target="_blank"
-            {
+              rel="noopener noreferrer"
-              id: "faq-2",
+              className="inline-flex items-center gap-3 px-8 py-4 rounded-lg bg-gradient-to-r from-pink-500 to-purple-500 text-white font-bold hover:from-pink-600 hover:to-purple-600 transition-all duration-300 transform hover:scale-110 shadow-lg hover:shadow-xl"
-              title: "Are your face paints safe for children?",
+            >
-              content:
+              <Instagram className="w-6 h-6" />
-                "Absolutely! We use only professional-grade, hypoallergenic face paints that are non-toxic and dermatologist-tested. All products are safe for sensitive skin. We also practice strict hygiene protocols, using clean brushes and sanitized application tools for each client.",
+              Instagram
-            },
+            </a>
-            {
+            <a
-              id: "faq-3",
+              href="https://tiktok.com"
-              title: "How long does face painting take per person?",
+              target="_blank"
-              content:
+              rel="noopener noreferrer"
-                "Simple designs typically take 3-5 minutes, while more detailed or custom designs take 8-12 minutes. At festivals, we optimize for speed without sacrificing quality. For parties, we allow a bit more time for custom designs and interactions with children.",
+              className="inline-flex items-center gap-3 px-8 py-4 rounded-lg bg-gray-900 text-white font-bold hover:bg-gray-800 transition-all duration-300 transform hover:scale-110 shadow-lg hover:shadow-xl"
-            },
+            >
-            {
+              <Twitter className="w-6 h-6" />
-              id: "faq-4",
+              TikTok
-              title: "What if someone has a skin allergy?",
+            </a>
-              content:
+            <a
-                "We have hypoallergenic options available. Please inform us of any allergies when booking. We're always happy to discuss alternative products or test patches before proceeding with full face painting.",
+              href="https://linkedin.com"
-            },
+              target="_blank"
-            {
+              rel="noopener noreferrer"
-              id: "faq-5",
+              className="inline-flex items-center gap-3 px-8 py-4 rounded-lg bg-blue-700 text-white font-bold hover:bg-blue-800 transition-all duration-300 transform hover:scale-110 shadow-lg hover:shadow-xl"
-              title: "Can you do custom designs?",
+            >
-              content:
+              <Linkedin className="w-6 h-6" />
-                "Yes! We specialize in custom designs for themed parties and corporate events. Please provide theme details or reference images when booking. There may be a small additional fee for very complex custom designs.",
+              LinkedIn
-            },
+            </a>
-            {
+          </div>
-              id: "faq-6",
+        </div>
-              title: "What's included in your packages?",
-              content:
-                "All packages include professional face painting service, setup and teardown, and our artist's materials. Some packages include additional services like temporary tattoos or body painting. Check specific package details for what's included.",
-            },
-          ]}
-          buttons={[{ text: "View Packages", href: "/packages" }]}
-          buttonAnimation="blur-reveal"
-          containerClassName="gap-12"
-        />
       </div>
 
-      <div id="footer" data-section="footer">
+      <div id="footer-contact" data-section="footer-contact" className="mx-auto px-4 md:px-6 lg:px-8">
         <FooterSimple
           columns={footerColumns}
           bottomLeftText="© 2024 Paintasy Face and Body Art. All rights reserved."
           bottomRightText="Professional Event Entertainment | Creative Services"
+          ariaLabel="Site footer with links"
+          containerClassName="gap-8 lg:gap-12"
+          columnsClassName="grid-cols-2 lg:grid-cols-4"
+          columnTitleClassName="font-extrabold text-lg"
+          columnItemClassName="hover:opacity-70 transition-opacity"
         />
       </div>
     </ThemeProvider>

src/app/gallery/page.tsx

@@ -1,57 +1,56 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
-import HeroBillboardGallery from "@/components/sections/hero/HeroBillboardGallery";
+import ProductCardFour from '@/components/sections/product/ProductCardFour';
-import ProductCardFour from "@/components/sections/product/ProductCardFour";
+import ContactText from '@/components/sections/contact/ContactText';
-import FooterSimple from "@/components/sections/footer/FooterSimple";
+import FooterSimple from '@/components/sections/footer/FooterSimple';
-import Link from "next/link";
+import { Camera, Sparkles } from 'lucide-react';
 
 export default function GalleryPage() {
   const navItems = [
     { name: "Home", id: "home" },
     { name: "Services", id: "services" },
-    { name: "Gallery", id: "gallery" },
+    { name: "Gallery", id: "/gallery" },
-    { name: "Packages", id: "packages" },
+    { name: "Packages", id: "/packages" },
     { name: "About", id: "about" },
-    { name: "Contact", id: "contact" },
+    { name: "Contact", id: "/contact" },
   ];
 
   const footerColumns = [
     {
-      title: "Gallery",
+      title: "Services",      items: [
-      items: [
+        { label: "Kids Party Face Painting", href: "/services" },
-        { label: "Kids Designs", href: "#gallery" },
+        { label: "Festival Face Art", href: "/services" },
-        { label: "Festival Art", href: "#gallery" },
+        { label: "Corporate Events", href: "/services" },
-        { label: "Body Painting", href: "#gallery" },
+        { label: "Body Painting", href: "/services" },
-        { label: "Custom Designs", href: "#gallery" },
+        { label: "Custom Designs", href: "/services" },
       ],
     },
     {
-      title: "Services",
+      title: "Company",      items: [
-      items: [
+        { label: "About Us", href: "/about" },
-        { label: "All Services", href: "/services" },
+        { label: "Gallery", href: "/gallery" },
         { label: "Packages", href: "/packages" },
-        { label: "Pricing", href: "/packages" },
+        { label: "FAQ", href: "#faq" },
-        { label: "About", href: "/about" },
+        { label: "Contact", href: "/contact" },
       ],
     },
     {
-      title: "Social Media",
+      title: "Connect",      items: [
-      items: [
         { label: "Instagram", href: "https://instagram.com" },
         { label: "Facebook", href: "https://facebook.com" },
         { label: "TikTok", href: "https://tiktok.com" },
         { label: "Email", href: "mailto:paintasy@events.com" },
+        { label: "Phone", href: "tel:+15551234567" },
       ],
     },
     {
-      title: "Book Now",
+      title: "Service Areas",      items: [
-      items: [
+        { label: "Local Events", href: "/contact" },
-        { label: "View Packages", href: "/packages" },
+        { label: "Regional Coverage", href: "/contact" },
-        { label: "Request Quote", href: "/contact" },
+        { label: "Book Now", href: "/packages" },
-        { label: "Contact Us", href: "/contact" },
+        { label: "Get Quote", href: "/contact" },
-        { label: "FAQ", href: "#faq" },
       ],
     },
   ];
@@ -71,132 +70,83 @@ export default function GalleryPage() {
     >
       <div id="nav" data-section="nav">
         <NavbarStyleFullscreen
-          navItems={navItems}
           brandName="Paintasy"
+          navItems={navItems}
           bottomLeftText="Creative Face & Body Art"
           bottomRightText="paintasy@events.com"
         />
       </div>
 
-      <div id="gallery-page-hero" data-section="gallery-page-hero">
+      <div id="gallery-full" data-section="gallery-full" className="mx-auto px-4 md:px-6 py-20">
-        <HeroBillboardGallery
-          title="Event Photo Gallery"
-          description="Real photos from real events. Browse our portfolio of professional face painting and body art work."
-          background={{ variant: "radial-gradient" }}
-          buttons={[
-            {
-              text: "Book Your Event",
-              href: "/packages",
-            },
-          ]}
-          buttonAnimation="blur-reveal"
-          mediaItems={[
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/hand-holding-brush-close-up_23-2148966902.jpg?_wi=2",
-              imageAlt: "Festival face painting event photography",
-            },
-          ]}
-          mediaAnimation="opacity"
-          titleClassName="text-5xl font-extrabold"
-          descriptionClassName="text-lg opacity-90"
-          ariaLabel="Gallery page hero section"
-        />
-      </div>
-
-      <div id="gallery-showcase" data-section="gallery-showcase">
         <ProductCardFour
-          title="Complete Portfolio"
+          title="Complete Photo Gallery"
-          description="Browse our complete collection of face painting and body art from events throughout the year."
+          description="Explore our full collection of face painting and body art work from events, festivals, and celebrations. Real photos showcasing our professional artistry and creativity."
+          tag="Portfolio"
+          tagIcon={Camera}
+          tagAnimation="slide-up"
           textboxLayout="default"
           animationType="opacity"
-          useInvertedBackground={true}
+          useInvertedBackground={false}
           gridVariant="bento-grid"
           carouselMode="buttons"
           products={[
             {
-              id: "gallery-kids-1",
+              id: "gallery-kids-1",              name: "Butterfly Dreams",              price: "Kids Party",              variant: "Birthday Event",              imageSrc: "http://img.b2bpic.net/free-photo/dreamy-eyes-woman-smiling-festival_23-2148338055.jpg?_wi=1",              imageAlt: "Butterfly face painting design on child"},
-              name: "Kids Face Painting",
-              price: "Colorful Designs",
-              variant: "Birthday Parties",
-              imageSrc: "http://img.b2bpic.net/free-psd/holi-festival-celebration-instagram-posts_23-2151227255.jpg?_wi=2",
-              imageAlt: "Kids birthday party face painting designs",
-            },
             {
-              id: "gallery-festival-1",
+              id: "gallery-kids-2",              name: "Superhero Masks",              price: "Kids Party",              variant: "Birthday Event",              imageSrc: "http://img.b2bpic.net/free-photo/fun-portrait-with-decorations-face_23-2150749319.jpg?_wi=1",              imageAlt: "Superhero themed face painting for children"},
-              name: "Festival Face Art",
-              price: "Creative Artistry",
-              variant: "Outdoor Events",
-              imageSrc: "http://img.b2bpic.net/free-photo/hand-holding-brush-close-up_23-2148966902.jpg?_wi=3",
-              imageAlt: "Festival face painting artwork showcase",
-            },
             {
-              id: "gallery-body-1",
+              id: "gallery-festival-1",              name: "Festival Fantasy",              price: "Festival Art",              variant: "Outdoor Event",              imageSrc: "http://img.b2bpic.net/free-photo/man-covered-different-colors-holi_23-2148337991.jpg?_wi=1",              imageAlt: "Vibrant festival face painting with multiple colors"},
-              name: "Body Painting Art",
-              price: "Professional Service",
-              variant: "Special Events",
-              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-portrait-women-with-all-kinds-body_23-2149159242.jpg?_wi=2",
-              imageAlt: "Professional body art photography",
-            },
             {
-              id: "gallery-custom-1",
+              id: "gallery-festival-2",              name: "Rainbow Celebration",              price: "Festival Art",              variant: "Outdoor Event",              imageSrc: "http://img.b2bpic.net/free-psd/holi-festival-celebration-instagram-posts_23-2151227255.jpg?_wi=1",              imageAlt: "Rainbow colored festival face art"},
-              name: "Custom Designs",
-              price: "Personalized Art",
-              variant: "Themed Events",
-              imageSrc: "http://img.b2bpic.net/free-photo/fun-portrait-with-decorations-face_23-2150749319.jpg?_wi=2",
-              imageAlt: "Custom themed face painting designs",
-            },
             {
-              id: "gallery-kids-2",
+              id: "gallery-body-1",              name: "Body Art Elegance",              price: "Body Painting",              variant: "Special Event",              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-portrait-women-with-all-kinds-body_23-2149159242.jpg?_wi=1",              imageAlt: "Professional body painting artwork"},
-              name: "Princess & Character",
-              price: "Enchanting Designs",
-              variant: "Theme Parties",
-              imageSrc: "http://img.b2bpic.net/free-psd/holi-festival-celebration-instagram-posts_23-2151227255.jpg?_wi=3",
-              imageAlt: "Princess character face painting designs",
-            },
             {
-              id: "gallery-festival-2",
+              id: "gallery-custom-1",              name: "Artistic Creation",              price: "Custom Design",              variant: "Themed Event",              imageSrc: "http://img.b2bpic.net/free-photo/hand-holding-brush-close-up_23-2148966902.jpg?_wi=1",              imageAlt: "Artist applying custom face painting design"},
-              name: "Festival Entertainment",
-              price: "Live Entertainment",
-              variant: "Large Events",
-              imageSrc: "http://img.b2bpic.net/free-photo/hand-holding-brush-close-up_23-2148966902.jpg?_wi=4",
-              imageAlt: "Festival face painter with audience",
-            },
             {
-              id: "gallery-body-2",
+              id: "gallery-kids-3",              name: "Princess Tiara",              price: "Kids Party",              variant: "Birthday Event",              imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-adult-man-his-30s-that-is-painting-big-canvas-with-lot-brushes-palette-while-sitting-floor-art-studio_662251-323.jpg?_wi=1",              imageAlt: "Princess themed face painting on young girl"},
-              name: "Artistic Body Designs",
-              price: "High Impact Art",
-              variant: "Photo Shoots",
-              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-portrait-women-with-all-kinds-body_23-2149159242.jpg?_wi=3",
-              imageAlt: "Artistic body painting photoshoot",
-            },
             {
-              id: "gallery-corporate",
+              id: "gallery-festival-3",              name: "Glitter Dreams",              price: "Festival Art",              variant: "Outdoor Event",              imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-putting-makeup-man_23-2149357796.jpg?_wi=1",              imageAlt: "Glittery festival face painting design"},
-              name: "Corporate Events",
+            {
-              price: "Professional Art",
+              id: "gallery-corporate-1",              name: "Brand Activation",              price: "Corporate Event",              variant: "Professional",              imageSrc: "http://img.b2bpic.net/free-photo/male-dj-party-charge-music-entertainment_23-2149658399.jpg?_wi=1",              imageAlt: "Corporate event face painting for brand activation"},
-              variant: "Team Events",
-              imageSrc: "http://img.b2bpic.net/free-photo/male-dj-party-charge-music-entertainment_23-2149658399.jpg?_wi=3",
-              imageAlt: "Corporate event face painting",
-            },
-          ]}
-          buttons={[
-            {
-              text: "Book Now",
-              href: "/packages",
-            },
           ]}
+          buttons={[{ text: "Book Your Event", href: "/packages" }]}
           buttonAnimation="blur-reveal"
+          ariaLabel="Complete photo gallery with all artworks"
           containerClassName="gap-12"
-          ariaLabel="Photo gallery portfolio section"
+          cardNameClassName=""
+          cardPriceClassName=""
+          cardVariantClassName=""
         />
       </div>
 
-      <div id="gallery-footer" data-section="gallery-footer">
+      <div id="contact-gallery" data-section="contact-gallery" className="mx-auto px-4 md:px-6">
+        <ContactText
+          text="Love what you see? Let's bring these creative designs to your next event! Contact Paintasy today to book your professional face and body art experience."
+          animationType="background-highlight"
+          background={{ variant: "radial-gradient" }}
+          useInvertedBackground={false}
+          buttons={[
+            { text: "Request a Quote", href: "/contact" },
+            { text: "View Packages", href: "/packages" },
+          ]}
+          ariaLabel="Contact section for gallery page"
+          containerClassName="py-16"
+          contentClassName="max-w-3xl mx-auto"
+          textClassName="text-4xl font-extrabold text-center"
+          buttonContainerClassName="flex flex-col sm:flex-row gap-4 justify-center mt-8"
+        />
+      </div>
+
+      <div id="footer-gallery" data-section="footer-gallery" className="mx-auto px-4 md:px-6">
         <FooterSimple
           columns={footerColumns}
-          bottomLeftText="© 2024 Paintasy Face and Body Art."
+          bottomLeftText="© 2024 Paintasy Face and Body Art. All rights reserved."
-          bottomRightText="Authentic Event Photography"
+          bottomRightText="Professional Event Entertainment | Creative Services"
-          ariaLabel="Gallery page footer"
+          ariaLabel="Site footer with links"
           containerClassName="gap-12"
+          columnsClassName="grid-cols-2 lg:grid-cols-4"
+          columnTitleClassName="font-extrabold text-lg"
+          columnItemClassName="hover:opacity-70 transition-opacity"
         />
       </div>
     </ThemeProvider>

src/app/packages/page.tsx

@@ -1,12 +1,14 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
-import HeroBillboardGallery from "@/components/sections/hero/HeroBillboardGallery";
+import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
-import PricingCardFive from "@/components/sections/pricing/PricingCardFive";
+import PricingCardFive from '@/components/sections/pricing/PricingCardFive';
-import ContactText from "@/components/sections/contact/ContactText";
+import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
-import FooterSimple from "@/components/sections/footer/FooterSimple";
+import FaqBase from '@/components/sections/faq/FaqBase';
-import Link from "next/link";
+import ContactText from '@/components/sections/contact/ContactText';
+import FooterSimple from '@/components/sections/footer/FooterSimple';
+import { Sparkles, DollarSign, Check, Zap, Users, Music } from 'lucide-react';
 
 export default function PackagesPage() {
   const navItems = [
@@ -20,39 +22,38 @@ export default function PackagesPage() {
 
   const footerColumns = [
     {
-      title: "Packages",
+      title: "Services",      items: [
-      items: [
+        { label: "Kids Party Face Painting", href: "/services" },
-        { label: "Birthday Packages", href: "#packages" },
+        { label: "Festival Face Art", href: "/services" },
-        { label: "Festival Service", href: "#packages" },
+        { label: "Corporate Events", href: "/services" },
-        { label: "Corporate Events", href: "#packages" },
+        { label: "Body Painting", href: "/services" },
-        { label: "Custom Packages", href: "/contact" },
+        { label: "Custom Designs", href: "/services" },
       ],
     },
     {
-      title: "Services",
+      title: "Company",      items: [
-      items: [
+        { label: "About Us", href: "/about" },
-        { label: "All Services", href: "/services" },
         { label: "Gallery", href: "/gallery" },
-        { label: "About", href: "/about" },
+        { label: "Packages", href: "/packages" },
         { label: "FAQ", href: "#faq" },
+        { label: "Contact", href: "/contact" },
       ],
     },
     {
-      title: "Social",
+      title: "Connect",      items: [
-      items: [
         { label: "Instagram", href: "https://instagram.com" },
         { label: "Facebook", href: "https://facebook.com" },
         { label: "TikTok", href: "https://tiktok.com" },
         { label: "Email", href: "mailto:paintasy@events.com" },
+        { label: "Phone", href: "tel:+15551234567" },
       ],
     },
     {
-      title: "Book Now",
+      title: "Service Areas",      items: [
-      items: [
+        { label: "Local Events", href: "/contact" },
-        { label: "Request Quote", href: "/contact" },
+        { label: "Regional Coverage", href: "/contact" },
-        { label: "Chat with Us", href: "/contact" },
+        { label: "Book Now", href: "/packages" },
-        { label: "Call Now", href: "tel:+15551234567" },
+        { label: "Get Quote", href: "/contact" },
-        { label: "FAQ", href: "#faq" },
       ],
     },
   ];
@@ -72,203 +73,194 @@ export default function PackagesPage() {
     >
       <div id="nav" data-section="nav">
         <NavbarStyleFullscreen
-          navItems={navItems}
           brandName="Paintasy"
+          navItems={navItems}
           bottomLeftText="Creative Face & Body Art"
           bottomRightText="paintasy@events.com"
         />
       </div>
 
-      <div id="packages-page-hero" data-section="packages-page-hero">
+      <div id="packages-hero" data-section="packages-hero" className="mx-auto px-4 md:px-6">
         <HeroBillboardGallery
-          title="Event Packages & Pricing"
+          title="Event Packages & Booking Options"
-          description="Flexible, transparent pricing for every type of event. From intimate celebrations to large festivals, we have the perfect package for you."
+          description="Professional face painting and body art packages designed for every event type. Choose from flexible pricing, customize your experience, and book your entertainment today."
-          background={{ variant: "gradient-bars" }}
+          background={{ variant: "radial-gradient" }}
+          tag="Book Your Entertainment"
+          tagIcon={Sparkles}
+          tagAnimation="slide-up"
           buttons={[
-            {
+            { text: "View Packages", href: "#packages-pricing" },
-              text: "Request a Quote",
+            { text: "Contact Us", href: "/contact" },
-              href: "/contact",
-            },
           ]}
           buttonAnimation="blur-reveal"
           mediaItems={[
             {
-              imageSrc: "http://img.b2bpic.net/free-photo/dreamy-eyes-woman-smiling-festival_23-2148338055.jpg?_wi=4",
+              imageSrc: "http://img.b2bpic.net/free-photo/man-wearing-make-up-woman-wearing-mask_23-2148784326.jpg?_wi=1",              imageAlt: "Professional face painting event entertainment"},
-              imageAlt: "Event face painting packages",
-            },
           ]}
           mediaAnimation="opacity"
-          titleClassName="text-5xl font-extrabold"
-          descriptionClassName="text-lg opacity-90"
           ariaLabel="Packages page hero section"
+          className="min-h-screen"
+          containerClassName="flex flex-col lg:flex-row items-center justify-between gap-12"
+          titleClassName="text-5xl lg:text-6xl font-extrabold leading-tight"
+          descriptionClassName="text-lg lg:text-xl opacity-90 max-w-2xl"
+          buttonContainerClassName="flex flex-col sm:flex-row gap-4 mt-8"
         />
       </div>
 
-      <div id="packages-pricing" data-section="packages-pricing">
+      <div id="packages-pricing" data-section="packages-pricing" className="mx-auto px-4 md:px-6">
         <PricingCardFive
           title="Our Event Packages"
-          description="Simple, flexible pricing tailored to your event needs. All packages include professional service, artistic creativity, and great customer care."
+          description="Transparent, flexible pricing for every event type. All packages include professional service, quality materials, and our commitment to making your event memorable."
+          tag="Flexible Pricing"
+          tagIcon={DollarSign}
+          tagAnimation="slide-up"
           textboxLayout="default"
           animationType="scale-rotate"
           useInvertedBackground={false}
           plans={[
             {
-              id: "pkg-birthday-basic",
+              id: "kids-party-basic",              tag: "Popular",              tagIcon: Users,
-              tag: "Great Start",
+              price: "$150",              period: "per hour",              description: "Perfect for small birthday celebrations with basic designs",              button: { text: "Book Package", href: "/contact" },
-              price: "$150",
+              featuresTitle: "Package Includes",              features: [
-              period: "per hour",
+                "Up to 15 children",                "Colorful, playful designs",                "Face painting only",                "Setup & teardown",                "Artist materials provided"],
-              description: "Perfect for small birthday celebrations",
-              button: {
-                text: "Request Quote",
-                href: "/contact",
-              },
-              featuresTitle: "Includes",
-              features: [
-                "Up to 15 children",
-                "Face painting only",
-                "Colorful themed designs",
-                "Basic design themes",
-                "Professional face paints",
-              ],
             },
             {
-              id: "pkg-birthday-deluxe",
+              id: "kids-party-deluxe",              tag: "Best Value",              tagIcon: Check,
-              tag: "Most Popular",
+              price: "$200",              period: "per 2 hours",              description: "Full party entertainment with premium designs and add-ons",              button: { text: "Book Package", href: "/contact" },
-              price: "$200",
+              featuresTitle: "Package Includes",              features: [
-              period: "per 2 hours",
+                "Up to 25 children",                "Custom themed designs",                "Face painting & temporary tattoos",                "Interactive entertainment",                "Professional quality assured"],
-              description: "Full party entertainment package",
-              button: {
-                text: "Request Quote",
-                href: "/contact",
-              },
-              featuresTitle: "Includes",
-              features: [
-                "Up to 25 children",
-                "Face painting + tattoos",
-                "Custom themed designs",
-                "Interactive entertainment",
-                "Professional service",
-                "Setup & cleanup",
-              ],
             },
             {
-              id: "pkg-birthday-premium",
+              id: "festival-event",              tag: "High-Volume",              tagIcon: Zap,
-              tag: "Best Value",
+              price: "$250",              period: "per 3 hours",              description: "Fast, artistic designs for festivals and outdoor events",              button: { text: "Book Package", href: "/contact" },
-              price: "$280",
+              featuresTitle: "Package Includes",              features: [
-              period: "per 3 hours",
+                "High-capacity crowd service",                "Fast artistic designs",                "Portable setup station",                "Setup & teardown included",                "Multiple artist option available"],
-              description: "Premium party entertainment with extra features",
-              button: {
-                text: "Request Quote",
-                href: "/contact",
-              },
-              featuresTitle: "Includes",
-              features: [
-                "Up to 40 guests",
-                "Face & body painting",
-                "Custom character designs",
-                "Interactive entertainment",
-                "Photo opportunities",
-                "Full setup & cleanup",
-              ],
             },
             {
-              id: "pkg-festival",
+              id: "corporate-event",              tag: "Professional",              tagIcon: Music,
-              tag: "High Volume",
+              price: "$300",              period: "per 4 hours",              description: "Premium service for corporate events and brand activations",              button: { text: "Book Package", href: "/contact" },
-              price: "$250",
+              featuresTitle: "Package Includes",              features: [
-              period: "per 3 hours",
+                "Professional branded designs",                "Custom theme integration",                "Extended hours available",                "Multiple artist coordination",                "Premium materials & finishes"],
-              description: "Fast-paced festival and outdoor event service",
-              button: {
-                text: "Request Quote",
-                href: "/contact",
-              },
-              featuresTitle: "Includes",
-              features: [
-                "High-capacity crowds",
-                "Fast artistic designs",
-                "3-5 minute service per person",
-                "Portable station included",
-                "Setup & teardown",
-                "Professional materials",
-              ],
-            },
-            {
-              id: "pkg-corporate",
-              tag: "Professional",
-              price: "$300",
-              period: "per 3 hours",
-              description: "Corporate team building & brand activation",
-              button: {
-                text: "Request Quote",
-                href: "/contact",
-              },
-              featuresTitle: "Includes",
-              features: [
-                "Professional setup",
-                "Branded design options",
-                "Custom artwork",
-                "Corporate polished service",
-                "Photo-ready designs",
-                "Setup & cleanup included",
-              ],
-            },
-            {
-              id: "pkg-custom",
-              tag: "Premium",
-              price: "Custom",
-              period: "consultation",
-              description: "Fully customized package for unique events",
-              button: {
-                text: "Contact Us",
-                href: "/contact",
-              },
-              featuresTitle: "Services Available",
-              features: [
-                "Full day events",
-                "Multiple artists",
-                "Body painting",
-                "Custom artwork",
-                "Event planning",
-                "Special requests welcome",
-              ],
-            },
-          ]}
-          buttons={[
-            {
-              text: "Schedule Consultation",
-              href: "/contact",
             },
           ]}
+          buttons={[{ text: "Contact for Custom Quote", href: "/contact" }]}
           buttonAnimation="blur-reveal"
+          ariaLabel="Pricing section with package options"
           containerClassName="gap-12"
-          ariaLabel="Pricing section with event packages"
+          cardContentClassName=""
+          planTagClassName=""
+          planPriceClassName=""
         />
       </div>
 
-      <div id="packages-cta" data-section="packages-cta">
+      <div id="packages-details" data-section="packages-details" className="mx-auto px-4 md:px-6">
-        <ContactText
+        <FeatureCardTen
-          text="Don't see your perfect package? We offer fully customized packages for unique events and special requests. Let's create something amazing for your celebration."
+          title="What's Included in Every Package"
-          animationType="background-highlight"
+          description="All Paintasy packages come with professional service, quality materials, and our commitment to your event's success."
-          background={{ variant: "sparkles-gradient" }}
+          tag="Package Details"
+          tagIcon={Check}
+          tagAnimation="slide-up"
+          textboxLayout="default"
+          animationType="slide-up"
           useInvertedBackground={true}
-          buttons={[
+          features={[
             {
-              text: "Request Custom Quote",
+              id: "package-details-1",              title: "Professional Artist Service",              description: "Our trained, experienced face painting artists deliver high-quality designs. We arrive on time, set up professionally, and ensure every guest receives outstanding service.",              media: {
-              href: "/contact",
+                imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-adult-man-his-30s-that-is-painting-big-canvas-with-lot-brushes-palette-while-sitting-floor-art-studio_662251-323.jpg?_wi=1",                imageAlt: "Professional face painting artist at work"},
+              items: [
+                { icon: Sparkles, text: "Trained professionals" },
+                { icon: Check, text: "Punctual & reliable" },
+                { icon: Users, text: "Guest-focused service" },
+              ],
+              reverse: false,
+            },
+            {
+              id: "package-details-2",              title: "Premium Materials & Hygiene",              description: "We use professional-grade, hypoallergenic face paints and follow strict hygiene protocols. Clean brushes, sanitized tools, and safe products for all skin types ensure a worry-free experience.",              media: {
+                imageSrc: "http://img.b2bpic.net/free-photo/hand-holding-brush-close-up_23-2148966902.jpg?_wi=1",                imageAlt: "Professional quality face painting materials"},
+              items: [
+                { icon: Check, text: "Hypoallergenic products" },
+                { icon: Sparkles, text: "Strict hygiene standards" },
+                { icon: Music, text: "Safe for all ages" },
+              ],
+              reverse: true,
             },
           ]}
-          containerClassName="py-16"
+          buttons={[{ text: "Request a Quote", href: "/contact" }]}
-          textClassName="text-3xl font-extrabold text-center"
+          buttonAnimation="blur-reveal"
-          ariaLabel="Custom packages call-to-action section"
+          ariaLabel="Package details and inclusions"
+          containerClassName="gap-12"
+          itemClassName=""
+          mediaWrapperClassName=""
         />
       </div>
 
-      <div id="packages-footer" data-section="packages-footer">
+      <div id="packages-faq" data-section="packages-faq" className="mx-auto px-4 md:px-6">
+        <FaqBase
+          title="Booking & Package FAQs"
+          description="Everything you need to know about our packages and booking process."
+          tag="Questions?"
+          tagIcon={DollarSign}
+          tagAnimation="slide-up"
+          textboxLayout="default"
+          animationType="smooth"
+          faqsAnimation="slide-up"
+          useInvertedBackground={true}
+          showCard={true}
+          faqs={[
+            {
+              id: "booking-faq-1",              title: "How do I book a package?",              content: "Simply click 'Book Package' or 'Contact Us' and fill out the booking form with your event details. We'll confirm availability, discuss any customizations, and finalize the details. You can also call us directly at the phone number provided."},
+            {
+              id: "booking-faq-2",              title: "What is your booking timeline?",              content: "We recommend booking 2-3 weeks in advance for regular events. For large festivals or peak seasons, 4-6 weeks is ideal. Last-minute bookings may be available depending on our schedule—contact us to check availability."},
+            {
+              id: "booking-faq-3",              title: "Do you offer custom package pricing?",              content: "Absolutely! Our packages are flexible. If you need something different—different duration, larger group, or additional services—we can create a custom package tailored to your event. Contact us to discuss your specific needs."},
+            {
+              id: "booking-faq-4",              title: "What's the cancellation or rescheduling policy?",              content: "We offer flexible rescheduling up to 7 days before your event at no charge. Cancellations made 14+ days in advance receive a full refund. Cancellations within 7 days may incur fees. Contact us for specific details."},
+            {
+              id: "booking-faq-5",              title: "Can I add more hours or upgrade my package?",              content: "Yes! You can add additional hours, upgrade designs, or add services like body painting at any time. Additional hours are typically charged at the hourly rate specified in your package. Discuss upgrades when booking or contact us anytime."},
+            {
+              id: "booking-faq-6",              title: "What payment methods do you accept?",              content: "We accept all major credit cards, PayPal, bank transfers, and cash. A deposit is required to secure your booking, with the balance due before the event. Contact us for specific payment details."},
+            {
+              id: "booking-faq-7",              title: "Do you travel to events outside the area?",              content: "Yes, we service regional events! Travel fees may apply for locations outside our standard service area. Contact us with your event location, and we'll provide a custom quote including travel costs."},
+            {
+              id: "booking-faq-8",              title: "Can you work with large groups or multiple artists?",              content: "Definitely! For large events, we can coordinate multiple artists to handle high volume efficiently. This ensures every guest gets painted without excessive wait times. Discuss group sizes when booking."},
+          ]}
+          buttons={[{ text: "Book Now", href: "/contact" }]}
+          buttonAnimation="blur-reveal"
+          ariaLabel="Packages FAQ section"
+          containerClassName="gap-12"
+          accordionClassName=""
+          accordionTitleClassName=""
+        />
+      </div>
+
+      <div id="packages-contact" data-section="packages-contact" className="mx-auto px-4 md:px-6">
+        <ContactText
+          text="Ready to book your event? Let's create an unforgettable experience with Paintasy Face and Body Art. Contact us today to discuss your package, ask questions, and secure your date."
+          animationType="background-highlight"
+          background={{ variant: "radial-gradient" }}
+          useInvertedBackground={false}
+          buttons={[
+            { text: "Get Your Quote", href: "/contact" },
+            { text: "Call Us Now", href: "tel:+15551234567" },
+          ]}
+          ariaLabel="Packages contact call-to-action"
+          containerClassName="py-16"
+          contentClassName="max-w-3xl mx-auto"
+          textClassName="text-4xl font-extrabold text-center"
+          buttonContainerClassName="flex flex-col sm:flex-row gap-4 justify-center mt-8"
+        />
+      </div>
+
+      <div id="packages-footer" data-section="packages-footer" className="mx-auto px-4 md:px-6">
         <FooterSimple
           columns={footerColumns}
-          bottomLeftText="© 2024 Paintasy Face and Body Art."
+          bottomLeftText="© 2024 Paintasy Face and Body Art. All rights reserved."
-          bottomRightText="Simple Transparent Pricing"
+          bottomRightText="Professional Event Entertainment | Creative Services"
-          ariaLabel="Packages page footer"
+          ariaLabel="Site footer with links"
           containerClassName="gap-12"
+          columnsClassName="grid-cols-2 lg:grid-cols-4"
+          columnTitleClassName="font-extrabold text-lg"
+          columnItemClassName="hover:opacity-70 transition-opacity"
         />
       </div>
     </ThemeProvider>

src/app/page.tsx

@@ -13,6 +13,7 @@ import ContactText from '@/components/sections/contact/ContactText';
 import FooterSimple from '@/components/sections/footer/FooterSimple';
 import Link from 'next/link';
 import { Sparkles, Palette, Heart, Smile, Zap, Music, Briefcase, Target, Users, Star, DollarSign, Camera, HelpCircle, Award } from 'lucide-react';
+import Head from 'next/head';
 
 export default function HomePage() {
   const navItems = [
@@ -21,13 +22,13 @@ export default function HomePage() {
     { name: "Gallery", id: "gallery" },
     { name: "Packages", id: "packages" },
     { name: "About", id: "about" },
+    { name: "Booking", id: "booking" },
     { name: "Contact", id: "contact" },
   ];
 
   const footerColumns = [
     {
-      title: "Services",
+      title: "Services",      items: [
-      items: [
         { label: "Kids Party Face Painting", href: "/services" },
         { label: "Festival Face Art", href: "/services" },
         { label: "Corporate Events", href: "/services" },
@@ -36,8 +37,7 @@ export default function HomePage() {
       ],
     },
     {
-      title: "Company",
+      title: "Company",      items: [
-      items: [
         { label: "About Us", href: "/about" },
         { label: "Gallery", href: "/gallery" },
         { label: "Packages", href: "/packages" },
@@ -46,8 +46,7 @@ export default function HomePage() {
       ],
     },
     {
-      title: "Connect",
+      title: "Connect",      items: [
-      items: [
         { label: "Instagram", href: "https://instagram.com" },
         { label: "Facebook", href: "https://facebook.com" },
         { label: "TikTok", href: "https://tiktok.com" },
@@ -56,11 +55,10 @@ export default function HomePage() {
       ],
     },
     {
-      title: "Service Areas",
+      title: "Service Areas",      items: [
-      items: [
         { label: "Local Events", href: "/contact" },
         { label: "Regional Coverage", href: "/contact" },
-        { label: "Book Now", href: "/packages" },
+        { label: "Book Now", href: "/booking" },
         { label: "Get Quote", href: "/contact" },
       ],
     },
@@ -88,39 +86,37 @@ export default function HomePage() {
         />
       </div>
 
-      <div id="hero-home" data-section="hero-home" className="mx-auto px-4 md:px-6">
+      <div id="hero-home" data-section="hero-home" className="mx-auto px-4 md:px-6 lg:px-8">
         <HeroBillboardGallery
-          title="Paintasy Face and Body Art"
+          title="Professional Face Painting & Body Art for Events"
-          description="Professional face painting and body art for parties, festivals, corporate events, and special occasions. Transform your event with creativity and color."
+          description="Transform your event with expert face painting and body art. Paintasy delivers professional, creative entertainment for birthday parties, festivals, corporate events, and special occasions. Book professional face painters for your celebration today."
           background={{ variant: "radial-gradient" }}
           tag="Creative Entertainment"
           tagIcon={Sparkles}
           tagAnimation="slide-up"
           buttons={[
-            { text: "Book Your Event", href: "/packages" },
+            { text: "Book Your Event", href: "/booking" },
             { text: "View Our Gallery", href: "/gallery" },
           ]}
           buttonAnimation="blur-reveal"
           mediaItems={[
             {
-              imageSrc: "http://img.b2bpic.net/free-photo/man-wearing-make-up-woman-wearing-mask_23-2148784326.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/man-wearing-make-up-woman-wearing-mask_23-2148784326.jpg?_wi=2",              imageAlt: "Professional face painting at event"},
-              imageAlt: "Professional face painting at event",
-            },
           ]}
           mediaAnimation="opacity"
-          ariaLabel="Hero section with face painting showcase"
+          ariaLabel="Hero section with professional face painting showcase"
           className="min-h-screen"
-          containerClassName="flex flex-col lg:flex-row items-center justify-between gap-12"
+          containerClassName="flex flex-col lg:flex-row items-center justify-between gap-8 lg:gap-12"
-          titleClassName="text-5xl lg:text-6xl font-extrabold leading-tight"
+          titleClassName="text-4xl sm:text-5xl lg:text-6xl font-extrabold leading-tight"
-          descriptionClassName="text-lg lg:text-xl opacity-90 max-w-2xl"
+          descriptionClassName="text-base sm:text-lg lg:text-xl opacity-90 max-w-2xl"
           buttonContainerClassName="flex flex-col sm:flex-row gap-4 mt-8"
         />
       </div>
 
-      <div id="about-home" data-section="about-home" className="mx-auto px-4 md:px-6">
+      <div id="about-home" data-section="about-home" className="mx-auto px-4 md:px-6 lg:px-8">
         <MetricSplitMediaAbout
-          title="About Paintasy Face and Body Art"
+          title="About Paintasy - Expert Face Painting Services"
-          description="Paintasy brings creativity and color to events with professional face painting and body art. We've been transforming celebrations and creating magical moments for hundreds of happy clients. Our artists are trained professionals dedicated to delivering exceptional service, vibrant designs, and memorable experiences."
+          description="Paintasy brings creativity and color to events with professional face painting and body art services. We've been transforming celebrations and creating magical moments for hundreds of happy clients across the region. Our trained professional artists are dedicated to delivering exceptional service, vibrant designs, and unforgettable experiences for every event."
           tag="Professional Artists"
           tagIcon={Palette}
           tagAnimation="slide-up"
@@ -136,16 +132,16 @@ export default function HomePage() {
           metricsAnimation="slide-up"
           useInvertedBackground={false}
           ariaLabel="About section with company information"
-          containerClassName="gap-12"
+          containerClassName="gap-8 lg:gap-12"
-          titleClassName="text-4xl font-extrabold"
+          titleClassName="text-3xl sm:text-4xl lg:text-5xl font-extrabold"
-          descriptionClassName="text-lg opacity-90 max-w-2xl"
+          descriptionClassName="text-base sm:text-lg opacity-90 max-w-2xl"
         />
       </div>
 
-      <div id="services-home" data-section="services-home" className="mx-auto px-4 md:px-6">
+      <div id="services-home" data-section="services-home" className="mx-auto px-4 md:px-6 lg:px-8">
         <FeatureCardTen
-          title="Our Services"
+          title="Our Face Painting & Body Art Services"
-          description="Professional face painting and body art tailored for every occasion. From intimate birthday parties to large festival events, we deliver creativity and joy."
+          description="Professional face painting and body art services tailored for every occasion. From intimate birthday parties to large festival events, we deliver creativity, joy, and exceptional entertainment."
           tag="Services"
           tagIcon={Palette}
           tagAnimation="slide-up"
@@ -154,13 +150,8 @@ export default function HomePage() {
           useInvertedBackground={true}
           features={[
             {
-              id: "kids-party",
+              id: "kids-party",              title: "Kids Party Face Painting",              description: "Fun, colorful face painting designs perfect for birthday celebrations. Butterflies, superheroes, animals, princesses, and more.",              media: {
-              title: "Kids Party Face Painting",
+                imageSrc: "http://img.b2bpic.net/free-photo/dreamy-eyes-woman-smiling-festival_23-2148338055.jpg?_wi=1",                imageAlt: "Kids party face painting designs"},
-              description: "Fun, colorful designs perfect for birthday celebrations. Butterflies, superheroes, animals, and princesses.",
-              media: {
-                imageSrc: "http://img.b2bpic.net/free-photo/dreamy-eyes-woman-smiling-festival_23-2148338055.jpg?_wi=1",
-                imageAlt: "Kids party face painting designs",
-              },
               items: [
                 { icon: Sparkles, text: "Colorful & playful designs" },
                 { icon: Heart, text: "Safe, child-friendly products" },
@@ -169,13 +160,8 @@ export default function HomePage() {
               reverse: false,
             },
             {
-              id: "festival",
+              id: "festival",              title: "Festival Face Art & Body Painting",              description: "Fast, creative designs perfect for large crowds and outdoor events. Artistic flair meets quick service for maximum event impact.",              media: {
-              title: "Festival Face Art",
+                imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-putting-makeup-man_23-2149357796.jpg?_wi=1",                imageAlt: "Festival face painting artwork"},
-              description: "Fast, creative designs perfect for large crowds and outdoor events. Artistic flair meets quick service.",
-              media: {
-                imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-putting-makeup-man_23-2149357796.jpg?_wi=1",
-                imageAlt: "Festival face painting artwork",
-              },
               items: [
                 { icon: Zap, text: "Fast service for crowds" },
                 { icon: Star, text: "Creative artistic designs" },
@@ -184,13 +170,8 @@ export default function HomePage() {
               reverse: true,
             },
             {
-              id: "corporate",
+              id: "corporate",              title: "Corporate Event Entertainment",              description: "Professional face painting for company parties, brand activations, and team celebrations with branded design options.",              media: {
-              title: "Corporate Event Entertainment",
+                imageSrc: "http://img.b2bpic.net/free-photo/male-dj-party-charge-music-entertainment_23-2149658399.jpg?_wi=1",                imageAlt: "Corporate event face painting"},
-              description: "Professional face painting for company parties, brand activations, and team celebrations.",
-              media: {
-                imageSrc: "http://img.b2bpic.net/free-photo/male-dj-party-charge-music-entertainment_23-2149658399.jpg?_wi=1",
-                imageAlt: "Corporate event face painting",
-              },
               items: [
                 { icon: Briefcase, text: "Professional & polished service" },
                 { icon: Target, text: "Branded design options available" },
@@ -201,15 +182,17 @@ export default function HomePage() {
           ]}
           buttons={[{ text: "Explore All Services", href: "/services" }]}
           buttonAnimation="blur-reveal"
-          ariaLabel="Services section showcasing offerings"
+          ariaLabel="Services section showcasing face painting offerings"
-          containerClassName="gap-12"
+          containerClassName="gap-8 lg:gap-12"
+          itemClassName=""
+          mediaWrapperClassName=""
         />
       </div>
 
-      <div id="packages-home" data-section="packages-home" className="mx-auto px-4 md:px-6">
+      <div id="packages-home" data-section="packages-home" className="mx-auto px-4 md:px-6 lg:px-8">
         <PricingCardFive
-          title="Event Packages"
+          title="Face Painting Event Packages"
-          description="Simple, flexible pricing for parties, festivals, and corporate events. Each package includes professional service and artistic creativity."
+          description="Simple, flexible pricing for face painting services at parties, festivals, and corporate events. Each package includes professional service and artistic creativity."
           tag="Transparent Pricing"
           tagIcon={DollarSign}
           tagAnimation="slide-up"
@@ -218,63 +201,35 @@ export default function HomePage() {
           useInvertedBackground={false}
           plans={[
             {
-              id: "birthday-basic",
+              id: "birthday-basic",              tag: "Popular",              price: "$150",              period: "per hour",              description: "Perfect for small birthday celebrations",              button: { text: "Request Quote", href: "/booking" },
-              tag: "Popular",
+              featuresTitle: "What's Included",              features: [
-              price: "$150",
+                "Up to 15 kids",                "Colorful themed designs",                "Face painting only",                "Basic design themes"],
-              period: "per hour",
-              description: "Perfect for small birthday celebrations",
-              button: { text: "Request Quote", href: "/packages" },
-              featuresTitle: "What's Included",
-              features: [
-                "Up to 15 kids",
-                "Colorful themed designs",
-                "Face painting only",
-                "Basic design themes",
-              ],
             },
             {
-              id: "birthday-deluxe",
+              id: "birthday-deluxe",              tag: "Best Value",              price: "$200",              period: "per 2 hours",              description: "Full party entertainment package",              button: { text: "Request Quote", href: "/booking" },
-              tag: "Best Value",
+              featuresTitle: "What's Included",              features: [
-              price: "$200",
+                "Up to 25 kids",                "Custom themed designs",                "Face & temporary tattoos",                "Interactive entertainment"],
-              period: "per 2 hours",
-              description: "Full party entertainment package",
-              button: { text: "Request Quote", href: "/packages" },
-              featuresTitle: "What's Included",
-              features: [
-                "Up to 25 kids",
-                "Custom themed designs",
-                "Face & temporary tattoos",
-                "Interactive entertainment",
-              ],
             },
             {
-              id: "festival-event",
+              id: "festival-event",              tag: "Flexible",              price: "$250",              period: "per 3 hours",              description: "Festival and outdoor event service",              button: { text: "Request Quote", href: "/booking" },
-              tag: "Flexible",
+              featuresTitle: "What's Included",              features: [
-              price: "$250",
+                "High-capacity crowd service",                "Fast artistic designs",                "Setup & teardown included",                "Portable station"],
-              period: "per 3 hours",
-              description: "Festival and outdoor event service",
-              button: { text: "Request Quote", href: "/packages" },
-              featuresTitle: "What's Included",
-              features: [
-                "High-capacity crowd service",
-                "Fast artistic designs",
-                "Setup & teardown included",
-                "Portable station",
-              ],
             },
           ]}
           buttons={[{ text: "View All Packages", href: "/packages" }]}
           buttonAnimation="blur-reveal"
           ariaLabel="Pricing section with package options"
-          containerClassName="gap-12"
+          containerClassName="gap-8 lg:gap-12"
-          cardClassName="p-8"
+          cardContentClassName=""
+          planTagClassName=""
+          planPriceClassName=""
         />
       </div>
 
-      <div id="testimonials-home" data-section="testimonials-home" className="mx-auto px-4 md:px-6">
+      <div id="testimonials-home" data-section="testimonials-home" className="mx-auto px-4 md:px-6 lg:px-8">
         <TestimonialCardTwo
-          title="What Our Clients Say"
+          title="Client Testimonials - Face Painting Reviews"
-          description="Real testimonials from happy clients who've booked Paintasy for their events."
+          description="Real testimonials from happy clients who've booked Paintasy for their events and celebrations."
           tag="Client Reviews"
           tagIcon={Star}
           tagAnimation="slide-up"
@@ -284,71 +239,37 @@ export default function HomePage() {
           carouselMode="buttons"
           testimonials={[
             {
-              id: "testimonial-1",
+              id: "testimonial-1",              name: "Sarah Johnson",              role: "Parent, Birthday Party Host",              testimonial: "Paintasy was absolutely amazing! The kids loved their face paintings and the artist was so professional and friendly. Our daughter's birthday was unforgettable!",              imageSrc: "http://img.b2bpic.net/free-photo/family-portrait-surprised-father-has-yellow-face-from-paints-cheerful-two-daughters-shows-palms-dirty-with-watercolours-paint-picture-pastime-isolated-lilac-wall-this-is-art_273609-26128.jpg?_wi=1",              imageAlt: "Happy children at birthday party",              icon: Heart,
-              name: "Sarah Johnson",
-              role: "Parent, Birthday Party Host",
-              testimonial: "Paintasy was absolutely amazing! The kids loved their face paintings and the artist was so professional and friendly. Our daughter's birthday was unforgettable!",
-              imageSrc: "http://img.b2bpic.net/free-photo/family-portrait-surprised-father-has-yellow-face-from-paints-cheerful-two-daughters-shows-palms-dirty-with-watercolours-paint-picture-pastime-isolated-lilac-wall-this-is-art_273609-26128.jpg?_wi=1",
-              imageAlt: "Happy children at birthday party",
-              icon: Heart,
             },
             {
-              id: "testimonial-2",
+              id: "testimonial-2",              name: "Marcus Chen",              role: "Festival Organizer",              testimonial: "We hired Paintasy for our community festival and they were fantastic. Quick service, beautiful designs, and the crowd loved it. Booking them again next year!",              imageSrc: "http://img.b2bpic.net/free-photo/man-covered-different-colors-holi_23-2148337991.jpg?_wi=1",              imageAlt: "Festival attendees enjoying face painting",              icon: Smile,
-              name: "Marcus Chen",
-              role: "Festival Organizer",
-              testimonial: "We hired Paintasy for our community festival and they were fantastic. Quick service, beautiful designs, and the crowd loved it. Booking them again next year!",
-              imageSrc: "http://img.b2bpic.net/free-photo/man-covered-different-colors-holi_23-2148337991.jpg?_wi=1",
-              imageAlt: "Festival attendees enjoying face painting",
-              icon: Smile,
             },
             {
-              id: "testimonial-3",
+              id: "testimonial-3",              name: "Emily Rodriguez",              role: "Corporate Event Planner",              testimonial: "Professional, creative, and reliable. Paintasy added the perfect touch of fun to our corporate team building event. Highly recommended!",              imageSrc: "http://img.b2bpic.net/free-photo/group-young-friends-celebrating-new-year_23-2147720468.jpg",              imageAlt: "Corporate event attendees with face art",              icon: Award,
-              name: "Emily Rodriguez",
-              role: "Corporate Event Planner",
-              testimonial: "Professional, creative, and reliable. Paintasy added the perfect touch of fun to our corporate team building event. Highly recommended!",
-              imageSrc: "http://img.b2bpic.net/free-photo/group-young-friends-celebrating-new-year_23-2147720468.jpg",
-              imageAlt: "Corporate event attendees with face art",
-              icon: Award,
             },
             {
-              id: "testimonial-4",
+              id: "testimonial-4",              name: "David Kim",              role: "School Principal",              testimonial: "The face painting station at our school carnival was the highlight! Kids had so much fun, and the artist was fantastic with them. Thank you!",              imageSrc: "http://img.b2bpic.net/free-photo/family-portrait-surprised-father-has-yellow-face-from-paints-cheerful-two-daughters-shows-palms-dirty-with-watercolours-paint-picture-pastime-isolated-lilac-wall-this-is-art_273609-26128.jpg?_wi=2",              imageAlt: "Children enjoying school event face painting",              icon: Sparkles,
-              name: "David Kim",
-              role: "School Principal",
-              testimonial: "The face painting station at our school carnival was the highlight! Kids had so much fun, and the artist was fantastic with them. Thank you!",
-              imageSrc: "http://img.b2bpic.net/free-photo/family-portrait-surprised-father-has-yellow-face-from-paints-cheerful-two-daughters-shows-palms-dirty-with-watercolours-paint-picture-pastime-isolated-lilac-wall-this-is-art_273609-26128.jpg?_wi=2",
-              imageAlt: "Children enjoying school event face painting",
-              icon: Sparkles,
             },
             {
-              id: "testimonial-5",
+              id: "testimonial-5",              name: "Jessica Martinez",              role: "Wedding Planner",              testimonial: "Added Paintasy as entertainment for a children's wedding reception. The kids were thrilled and parents appreciated the care taken with hygiene and safety.",              imageSrc: "http://img.b2bpic.net/free-photo/family-portrait-surprised-father-has-yellow-face-from-paints-cheerful-two-daughters-shows-palms-dirty-with-watercolours-paint-picture-pastime-isolated-lilac-wall-this-is-art_273609-26128.jpg?_wi=3",              imageAlt: "Children's event face painting service",              icon: Heart,
-              name: "Jessica Martinez",
-              role: "Wedding Planner",
-              testimonial: "Added Paintasy as entertainment for a children's wedding reception. The kids were thrilled and parents appreciated the care taken with hygiene and safety.",
-              imageSrc: "http://img.b2bpic.net/free-photo/family-portrait-surprised-father-has-yellow-face-from-paints-cheerful-two-daughters-shows-palms-dirty-with-watercolours-paint-picture-pastime-isolated-lilac-wall-this-is-art_273609-26128.jpg?_wi=3",
-              imageAlt: "Children's event face painting service",
-              icon: Heart,
             },
             {
-              id: "testimonial-6",
+              id: "testimonial-6",              name: "Thomas Wilson",              role: "Event Manager",              testimonial: "From consultation to execution, Paintasy was excellent. They delivered exactly what we envisioned for our community event. A+",              imageSrc: "http://img.b2bpic.net/free-photo/man-covered-different-colors-holi_23-2148337991.jpg?_wi=2",              imageAlt: "Community event face painting",              icon: Star,
-              name: "Thomas Wilson",
-              role: "Event Manager",
-              testimonial: "From consultation to execution, Paintasy was excellent. They delivered exactly what we envisioned for our community event. A+",
-              imageSrc: "http://img.b2bpic.net/free-photo/man-covered-different-colors-holi_23-2148337991.jpg?_wi=2",
-              imageAlt: "Community event face painting",
-              icon: Star,
             },
           ]}
-          buttons={[{ text: "Book Now", href: "/packages" }]}
+          buttons={[{ text: "Book Now", href: "/booking" }]}
           buttonAnimation="blur-reveal"
           ariaLabel="Client testimonials section"
-          containerClassName="gap-12"
+          containerClassName="gap-8 lg:gap-12"
+          imageWrapperClassName=""
+          roleClassName=""
         />
       </div>
 
-      <div id="gallery-preview-home" data-section="gallery-preview-home" className="mx-auto px-4 md:px-6">
+      <div id="gallery-preview-home" data-section="gallery-preview-home" className="mx-auto px-4 md:px-6 lg:px-8">
         <ProductCardFour
-          title="Photo Gallery Showcase"
+          title="Photo Gallery - Face Painting Portfolio"
-          description="Real photos from our events and happy clients. Browse our portfolio of face painting and body art work."
+          description="Real photos from our events and happy clients. Browse our portfolio of professional face painting and body art work."
           tag="Portfolio"
           tagIcon={Camera}
           tagAnimation="slide-up"
@@ -359,48 +280,26 @@ export default function HomePage() {
           carouselMode="buttons"
           products={[
             {
-              id: "gallery-1",
+              id: "gallery-1",              name: "Kids Face Painting",              price: "Colorful Designs",              variant: "Birthday Parties",              imageSrc: "http://img.b2bpic.net/free-psd/holi-festival-celebration-instagram-posts_23-2151227255.jpg?_wi=1",              imageAlt: "Collection of kids face painting designs"},
-              name: "Kids Face Painting",
-              price: "Colorful Designs",
-              variant: "Birthday Parties",
-              imageSrc: "http://img.b2bpic.net/free-psd/holi-festival-celebration-instagram-posts_23-2151227255.jpg?_wi=1",
-              imageAlt: "Collection of kids face painting designs",
-            },
             {
-              id: "gallery-2",
+              id: "gallery-2",              name: "Festival Face Art",              price: "Creative Artistry",              variant: "Outdoor Events",              imageSrc: "http://img.b2bpic.net/free-photo/hand-holding-brush-close-up_23-2148966902.jpg?_wi=1",              imageAlt: "Festival face painting artwork"},
-              name: "Festival Face Art",
-              price: "Creative Artistry",
-              variant: "Outdoor Events",
-              imageSrc: "http://img.b2bpic.net/free-photo/hand-holding-brush-close-up_23-2148966902.jpg?_wi=1",
-              imageAlt: "Festival face painting artwork",
-            },
             {
-              id: "gallery-3",
+              id: "gallery-3",              name: "Body Painting Art",              price: "Professional Service",              variant: "Special Events",              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-portrait-women-with-all-kinds-body_23-2149159242.jpg?_wi=1",              imageAlt: "Professional body art photography"},
-              name: "Body Painting Art",
-              price: "Professional Service",
-              variant: "Special Events",
-              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-portrait-women-with-all-kinds-body_23-2149159242.jpg?_wi=1",
-              imageAlt: "Professional body art photography",
-            },
             {
-              id: "gallery-4",
+              id: "gallery-4",              name: "Custom Designs",              price: "Personalized Art",              variant: "Themed Events",              imageSrc: "http://img.b2bpic.net/free-photo/fun-portrait-with-decorations-face_23-2150749319.jpg?_wi=1",              imageAlt: "Custom themed face painting designs"},
-              name: "Custom Designs",
-              price: "Personalized Art",
-              variant: "Themed Events",
-              imageSrc: "http://img.b2bpic.net/free-photo/fun-portrait-with-decorations-face_23-2150749319.jpg?_wi=1",
-              imageAlt: "Custom themed face painting designs",
-            },
           ]}
           buttons={[{ text: "View Full Gallery", href: "/gallery" }]}
           buttonAnimation="blur-reveal"
           ariaLabel="Photo gallery preview section"
-          containerClassName="gap-12"
+          containerClassName="gap-8 lg:gap-12"
+          cardNameClassName=""
+          cardPriceClassName=""
         />
       </div>
 
-      <div id="faq-home" data-section="faq-home" className="mx-auto px-4 md:px-6">
+      <div id="faq-home" data-section="faq-home" className="mx-auto px-4 md:px-6 lg:px-8">
         <FaqBase
-          title="Frequently Asked Questions"
+          title="Face Painting FAQ - Frequently Asked Questions"
           description="Everything you need to know about booking Paintasy for your event."
           tag="FAQ"
           tagIcon={HelpCircle}
@@ -412,44 +311,28 @@ export default function HomePage() {
           showCard={true}
           faqs={[
             {
-              id: "faq-1",
+              id: "faq-1",              title: "How far in advance should I book face painting services?",              content: "We recommend booking at least 2-3 weeks in advance to secure your preferred date and time. For large events or peak seasons, 4-6 weeks advance booking is ideal. Last-minute bookings may be available depending on our schedule."},
-              title: "How far in advance should I book?",
-              content: "We recommend booking at least 2-3 weeks in advance to secure your preferred date and time. For large events or peak seasons, 4-6 weeks advance booking is ideal. Last-minute bookings may be available depending on our schedule.",
-            },
             {
-              id: "faq-2",
+              id: "faq-2",              title: "Are your face paints safe for children?",              content: "Absolutely! We use only professional-grade, hypoallergenic face paints that are non-toxic and dermatologist-tested. All products are safe for sensitive skin. We also practice strict hygiene protocols, using clean brushes and sanitized application tools for each client."},
-              title: "Are your face paints safe for children?",
-              content: "Absolutely! We use only professional-grade, hypoallergenic face paints that are non-toxic and dermatologist-tested. All products are safe for sensitive skin. We also practice strict hygiene protocols, using clean brushes and sanitized application tools for each client.",
-            },
             {
-              id: "faq-3",
+              id: "faq-3",              title: "How long does face painting take per person?",              content: "Simple designs typically take 3-5 minutes, while more detailed or custom designs take 8-12 minutes. At festivals, we optimize for speed without sacrificing quality. For parties, we allow a bit more time for custom designs and interactions with children."},
-              title: "How long does face painting take per person?",
-              content: "Simple designs typically take 3-5 minutes, while more detailed or custom designs take 8-12 minutes. At festivals, we optimize for speed without sacrificing quality. For parties, we allow a bit more time for custom designs and interactions with children.",
-            },
             {
-              id: "faq-4",
+              id: "faq-4",              title: "What if someone has a skin allergy?",              content: "We have hypoallergenic options available. Please inform us of any allergies when booking. We're always happy to discuss alternative products or test patches before proceeding with full face painting."},
-              title: "What if someone has a skin allergy?",
-              content: "We have hypoallergenic options available. Please inform us of any allergies when booking. We're always happy to discuss alternative products or test patches before proceeding with full face painting.",
-            },
             {
-              id: "faq-5",
+              id: "faq-5",              title: "Can you do custom face painting designs?",              content: "Yes! We specialize in custom face painting designs for themed parties and corporate events. Please provide theme details or reference images when booking. There may be a small additional fee for very complex custom designs."},
-              title: "Can you do custom designs?",
-              content: "Yes! We specialize in custom designs for themed parties and corporate events. Please provide theme details or reference images when booking. There may be a small additional fee for very complex custom designs.",
-            },
             {
-              id: "faq-6",
+              id: "faq-6",              title: "What's included in your face painting packages?",              content: "All packages include professional face painting service, setup and teardown, and our artist's materials. Some packages include additional services like temporary tattoos or body painting. Check specific package details for what's included."},
-              title: "What's included in your packages?",
-              content: "All packages include professional face painting service, setup and teardown, and our artist's materials. Some packages include additional services like temporary tattoos or body painting. Check specific package details for what's included.",
-            },
           ]}
-          buttons={[{ text: "Book Your Event", href: "/packages" }]}
+          buttons={[{ text: "Book Your Event", href: "/booking" }]}
           buttonAnimation="blur-reveal"
           ariaLabel="FAQ section with common questions"
-          containerClassName="gap-12"
+          containerClassName="gap-8 lg:gap-12"
+          accordionClassName=""
+          accordionTitleClassName=""
         />
       </div>
 
-      <div id="contact-home" data-section="contact-home" className="mx-auto px-4 md:px-6">
+      <div id="contact-home" data-section="contact-home" className="mx-auto px-4 md:px-6 lg:px-8">
         <ContactText
           text="Ready to add magic to your event? Get in touch with Paintasy Face and Body Art. We'd love to discuss your event and create an unforgettable experience for your guests."
           animationType="background-highlight"
@@ -460,20 +343,20 @@ export default function HomePage() {
             { text: "Call Us", href: "tel:+15551234567" },
           ]}
           ariaLabel="Contact call-to-action section"
-          containerClassName="py-16"
+          containerClassName="py-12 sm:py-16 lg:py-20"
           contentClassName="max-w-3xl mx-auto"
-          textClassName="text-4xl font-extrabold text-center"
+          textClassName="text-2xl sm:text-3xl lg:text-4xl font-extrabold text-center"
           buttonContainerClassName="flex flex-col sm:flex-row gap-4 justify-center mt-8"
         />
       </div>
 
-      <div id="footer-home" data-section="footer-home" className="mx-auto px-4 md:px-6">
+      <div id="footer-home" data-section="footer-home" className="mx-auto px-4 md:px-6 lg:px-8">
         <FooterSimple
           columns={footerColumns}
           bottomLeftText="© 2024 Paintasy Face and Body Art. All rights reserved."
           bottomRightText="Professional Event Entertainment | Creative Services"
           ariaLabel="Site footer with links"
-          containerClassName="gap-12"
+          containerClassName="gap-8 lg:gap-12"
           columnsClassName="grid-cols-2 lg:grid-cols-4"
           columnTitleClassName="font-extrabold text-lg"
           columnItemClassName="hover:opacity-70 transition-opacity"

src/app/services/page.tsx

@@ -4,52 +4,53 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
 import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
 import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
+import PricingCardFive from '@/components/sections/pricing/PricingCardFive';
+import ContactText from '@/components/sections/contact/ContactText';
 import FooterSimple from '@/components/sections/footer/FooterSimple';
-import Link from 'next/link';
+import { Sparkles, Palette, Heart, Smile, Zap, Music, Briefcase, Target, Users, Star, DollarSign } from 'lucide-react';
-import { Smile, Heart, Sparkles, Zap, Music, Briefcase, Target, Users, Award, Palette, Star, Camera } from 'lucide-react';
 
 export default function ServicesPage() {
   const navItems = [
-    { name: "Home", id: "home" },
+    { name: "Home", id: "/" },
-    { name: "Services", id: "services" },
+    { name: "Services", id: "/services" },
-    { name: "Gallery", id: "gallery" },
+    { name: "Gallery", id: "/gallery" },
-    { name: "Packages", id: "packages" },
+    { name: "Packages", id: "/packages" },
-    { name: "About", id: "about" },
+    { name: "About", id: "/about" },
-    { name: "Contact", id: "contact" },
+    { name: "Contact", id: "/contact" },
   ];
 
   const footerColumns = [
     {
-      title: "Services",
+      title: "Services",      items: [
-      items: [
+        { label: "Kids Party Face Painting", href: "/services" },
-        { label: "Kids Party Face Painting", href: "#service-1" },
+        { label: "Festival Face Art", href: "/services" },
-        { label: "Festival Face Art", href: "#service-2" },
+        { label: "Corporate Events", href: "/services" },
-        { label: "Corporate Events", href: "#service-3" },
+        { label: "Body Painting", href: "/services" },
-        { label: "Body Painting", href: "#service-4" },
+        { label: "Custom Designs", href: "/services" },
       ],
     },
     {
-      title: "Quick Links",
+      title: "Company",      items: [
-      items: [
+        { label: "About Us", href: "/about" },
         { label: "Gallery", href: "/gallery" },
         { label: "Packages", href: "/packages" },
-        { label: "About", href: "/about" },
+        { label: "FAQ", href: "/" },
         { label: "Contact", href: "/contact" },
       ],
     },
     {
-      title: "Connect",
+      title: "Connect",      items: [
-      items: [
         { label: "Instagram", href: "https://instagram.com" },
         { label: "Facebook", href: "https://facebook.com" },
         { label: "TikTok", href: "https://tiktok.com" },
         { label: "Email", href: "mailto:paintasy@events.com" },
+        { label: "Phone", href: "tel:+15551234567" },
       ],
     },
     {
-      title: "Get Started",
+      title: "Service Areas",      items: [
-      items: [
+        { label: "Local Events", href: "/contact" },
-        { label: "View Packages", href: "/packages" },
+        { label: "Regional Coverage", href: "/contact" },
         { label: "Book Now", href: "/packages" },
         { label: "Get Quote", href: "/contact" },
       ],
@@ -78,112 +79,171 @@ export default function ServicesPage() {
         />
       </div>
 
-      <div id="services-page-hero" data-section="services-page-hero" className="mx-auto px-4 md:px-6">
+      <div id="services-hero" data-section="services-hero" className="mx-auto px-4 md:px-6 lg:px-8">
         <HeroBillboardGallery
-          title="Our Services"
+          title="Professional Face Painting & Body Art Services"
-          description="Professional face painting and body art for every occasion. From intimate celebrations to large festival events, we bring creativity and joy to your gathering."
+          description="Paintasy offers comprehensive face painting and body art services for every occasion. From intimate birthday parties to large-scale festivals, our professional artists bring creativity, color, and joy to your event."
-          background={{ variant: "sparkles-gradient" }}
+          background={{ variant: "radial-gradient" }}
-          buttons={[{ text: "Book Now", href: "/packages" }]}
+          tag="All Services"
+          tagIcon={Sparkles}
+          tagAnimation="slide-up"
+          buttons={[
+            { text: "Browse Services", href: "#services-list" },
+            { text: "Get a Quote", href: "/contact" },
+          ]}
           buttonAnimation="blur-reveal"
           mediaItems={[
             {
-              imageSrc: "http://img.b2bpic.net/free-photo/dreamy-eyes-woman-smiling-festival_23-2148338055.jpg?_wi=2",
+              imageSrc: "http://img.b2bpic.net/free-photo/rainbow-face-paint-art_23-2148621847.jpg?_wi=2",              imageAlt: "Vibrant face painting services showcase"},
-              imageAlt: "Professional face painting services",
-            },
           ]}
           mediaAnimation="opacity"
-          ariaLabel="Services page hero section"
+          ariaLabel="Services hero section"
-          titleClassName="text-5xl font-extrabold"
+          className="min-h-screen"
-          descriptionClassName="text-lg opacity-90 max-w-2xl"
+          containerClassName="flex flex-col lg:flex-row items-center justify-between gap-8 lg:gap-12"
+          titleClassName="text-4xl sm:text-5xl lg:text-6xl font-extrabold leading-tight"
+          descriptionClassName="text-base sm:text-lg lg:text-xl opacity-90 max-w-2xl"
+          buttonContainerClassName="flex flex-col sm:flex-row gap-4 mt-8"
         />
       </div>
 
-      <div id="services-detailed" data-section="services-detailed" className="mx-auto px-4 md:px-6">
+      <div id="services-list" data-section="services-list" className="mx-auto px-4 md:px-6 lg:px-8 py-16 md:py-24">
         <FeatureCardTen
-          title="Complete Service Offerings"
+          title="Our Complete Service Menu"
-          description="Each service is tailored to deliver maximum enjoyment and artistic quality."
+          description="Choose from our range of professional face and body art services, each designed for specific occasions and clientele."
+          tag="Services"
+          tagIcon={Palette}
+          tagAnimation="slide-up"
           textboxLayout="default"
           animationType="slide-up"
-          useInvertedBackground={false}
+          useInvertedBackground={true}
           features={[
             {
-              id: "service-1",
+              id: "kids-party",              title: "Kids Party Face Painting",              description: "Fun, safe, and colorful face painting designs perfect for children's birthday parties. From butterflies and animals to superheroes and princesses, we create magical moments for kids. All paints are hypoallergenic and dermatologist-tested.",              media: {
-              title: "Kids Party Face Painting",
+                imageSrc: "http://img.b2bpic.net/free-photo/child-with-colorful-face-paint_23-2148412356.jpg?_wi=1",                imageAlt: "Kids enjoying colorful face painting"},
-              description: "Make birthdays magical with our professional kids' face painting. Our artists create vibrant, playful designs that children absolutely love.",
-              media: {
-                imageSrc: "http://img.b2bpic.net/free-photo/dreamy-eyes-woman-smiling-festival_23-2148338055.jpg?_wi=3",
-                imageAlt: "Kids party face painting showcase",
-              },
               items: [
-                { icon: Smile, text: "Butterfly, animal & character designs" },
+                { icon: Heart, text: "Child-safe products" },
-                { icon: Heart, text: "Safe, child-friendly face paints" },
+                { icon: Smile, text: "Quick, fun designs" },
-                { icon: Sparkles, text: "Quick application, maximum fun" },
+                { icon: Sparkles, text: "Memorable moments" },
-                { icon: Star, text: "Perfect for ages 3-12" },
               ],
               reverse: false,
             },
             {
-              id: "service-2",
+              id: "festival",              title: "Festival & Event Face Art",              description: "Fast, impressive designs for large outdoor events, music festivals, and community gatherings. Our artists excel at high-volume service without compromising quality, perfect for busy festival environments.",              media: {
-              title: "Festival Face Art",
+                imageSrc: "http://img.b2bpic.net/free-photo/festival-face-painting-crowd_23-2148723145.jpg?_wi=1",                imageAlt: "Festival attendees with artistic face painting"},
-              description: "Perfect for outdoor events, festivals, and large gatherings. We specialize in fast, beautiful designs that work for high-capacity crowds.",
-              media: {
-                imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-putting-makeup-man_23-2149357796.jpg?_wi=2",
-                imageAlt: "Festival face art designs",
-              },
               items: [
-                { icon: Zap, text: "3-5 minute turnaround per person" },
+                { icon: Zap, text: "High-volume service" },
-                { icon: Music, text: "Perfect for music festivals & carnivals" },
+                { icon: Star, text: "Professional designs" },
-                { icon: Users, text: "Handles large crowds efficiently" },
+                { icon: Music, text: "Event-perfect timing" },
-                { icon: Palette, text: "Artistic & creative designs" },
               ],
               reverse: true,
             },
             {
-              id: "service-3",
+              id: "corporate",              title: "Corporate Event Entertainment",              description: "Professional face painting for company parties, brand activations, team-building events, and corporate celebrations. We offer branded design options and maintain a polished, professional demeanor throughout.",              media: {
-              title: "Corporate Event Entertainment",
+                imageSrc: "http://img.b2bpic.net/free-photo/corporate-event-entertainment_23-2148945632.jpg?_wi=1",                imageAlt: "Professional corporate event entertainment"},
-              description: "Add a creative touch to company parties, team buildings, and brand activations. Professional service that impresses clients and energizes employees.",
-              media: {
-                imageSrc: "http://img.b2bpic.net/free-photo/male-dj-party-charge-music-entertainment_23-2149658399.jpg?_wi=2",
-                imageAlt: "Corporate event face painting service",
-              },
               items: [
-                { icon: Briefcase, text: "Professional & polished service" },
+                { icon: Briefcase, text: "Professional service" },
-                { icon: Target, text: "Branded design options" },
+                { icon: Target, text: "Branded options" },
-                { icon: Award, text: "Premium quality art" },
+                { icon: Users, text: "Team building" },
-                { icon: Users, text: "Great for team engagement" },
               ],
               reverse: false,
             },
             {
-              id: "service-4",
+              id: "body-art",              title: "Body Painting & Art",              description: "Stunning full-body art and temporary body painting for special events, themed parties, photo shoots, and artistic projects. Our body painting artists create wearable masterpieces that turn heads.",              media: {
-              title: "Professional Body Painting",
+                imageSrc: "http://img.b2bpic.net/free-photo/body-art-painting_23-2149156247.jpg?_wi=1",                imageAlt: "Professional body art and painting"},
-              description: "Artistic body painting for special events, photo shoots, performances, and themed celebrations. Stunning visual art that makes a statement.",
-              media: {
-                imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-being-affectionate-with-cute-cat_23-2149879760.jpg",
-                imageAlt: "Professional body painting artwork",
-              },
               items: [
-                { icon: Palette, text: "Custom artistic designs" },
+                { icon: Sparkles, text: "Artistic mastery" },
-                { icon: Camera, text: "Photography-ready artistry" },
+                { icon: Heart, text: "Creative designs" },
-                { icon: Sparkles, text: "High-impact visual art" },
+                { icon: Star, text: "Photo-worthy art" },
-                { icon: Star, text: "Unforgettable performances" },
+              ],
+              reverse: true,
+            },
+            {
+              id: "custom",              title: "Custom & Themed Designs",              description: "Create personalized face art tailored to your event's theme. Provide us with inspiration and we'll bring your vision to life with custom designs. Perfect for themed parties, cosplay events, and special celebrations.",              media: {
+                imageSrc: "http://img.b2bpic.net/free-photo/custom-themed-face-art_23-2149267841.jpg?_wi=1",                imageAlt: "Creative custom themed face designs"},
+              items: [
+                { icon: Target, text: "Custom designs" },
+                { icon: Palette, text: "Theme-based art" },
+                { icon: Sparkles, text: "Personalized service" },
+              ],
+              reverse: false,
+            },
+            {
+              id: "tattoo",              title: "Temporary Tattoos & Accessories",              description: "Complement face painting with safe, temporary tattoos and artistic body accessories. Great for adding extra flair to any face painting design or standalone service.",              media: {
+                imageSrc: "http://img.b2bpic.net/free-photo/temporary-tattoo-design_23-2149156325.jpg?_wi=1",                imageAlt: "Colorful temporary tattoo designs"},
+              items: [
+                { icon: Heart, text: "Safe temporary tattoos" },
+                { icon: Zap, text: "Quick application" },
+                { icon: Smile, text: "Extra style" },
               ],
               reverse: true,
             },
           ]}
-          buttons={[{ text: "View Packages", href: "/packages" }]}
+          buttons={[{ text: "Book Your Service", href: "/packages" }]}
           buttonAnimation="blur-reveal"
-          containerClassName="gap-12"
+          ariaLabel="Services list with detailed descriptions"
+          containerClassName="gap-8 lg:gap-12"
         />
       </div>
 
-      <div id="services-footer" data-section="services-footer" className="mx-auto px-4 md:px-6">
+      <div id="services-pricing" data-section="services-pricing" className="mx-auto px-4 md:px-6 lg:px-8 py-16 md:py-24">
+        <PricingCardFive
+          title="Service Packages & Pricing"
+          description="Transparent, flexible pricing for all our face painting services. Choose the package that fits your event size and needs."
+          tag="Pricing"
+          tagIcon={DollarSign}
+          tagAnimation="slide-up"
+          textboxLayout="default"
+          animationType="scale-rotate"
+          useInvertedBackground={false}
+          plans={[
+            {
+              id: "starter",              tag: "Entry Level",              price: "$100",              period: "per hour",              description: "Perfect for small gatherings and short events",              button: { text: "Inquire", href: "/contact" },
+              featuresTitle: "Included",              features: [
+                "Up to 10 people",                "Standard designs",                "Face painting only",                "Portable setup"],
+            },
+            {
+              id: "professional",              tag: "Most Popular",              price: "$200",              period: "per 2 hours",              description: "Ideal for birthday parties and medium events",              button: { text: "Book Now", href: "/packages" },
+              featuresTitle: "Included",              features: [
+                "Up to 25 people",                "Custom designs",                "Face & temporary tattoos",                "Professional setup"],
+            },
+            {
+              id: "premium",              tag: "Best Value",              price: "$400",              period: "per 4 hours",              description: "Comprehensive service for large events",              button: { text: "Request Quote", href: "/contact" },
+              featuresTitle: "Included",              features: [
+                "Unlimited guests",                "Premium designs",                "Face, body art & tattoos",                "Setup & teardown"],
+            },
+          ]}
+          buttons={[{ text: "View All Packages", href: "/packages" }]}
+          buttonAnimation="blur-reveal"
+          ariaLabel="Service pricing and packages"
+          containerClassName="gap-8 lg:gap-12"
+        />
+      </div>
+
+      <div id="services-cta" data-section="services-cta" className="mx-auto px-4 md:px-6 lg:px-8 py-16 md:py-24">
+        <ContactText
+          text="Ready to bring creative entertainment to your event? Contact Paintasy today to discuss your service needs, get personalized recommendations, and book your professional face painters."
+          animationType="background-highlight"
+          background={{ variant: "radial-gradient" }}
+          useInvertedBackground={false}
+          buttons={[
+            { text: "Request a Quote", href: "/contact" },
+            { text: "Call Now", href: "tel:+15551234567" },
+          ]}
+          ariaLabel="Services call-to-action"
+          containerClassName="py-12 sm:py-16 lg:py-20"
+          contentClassName="max-w-3xl mx-auto"
+          textClassName="text-2xl sm:text-3xl lg:text-4xl font-extrabold text-center"
+          buttonContainerClassName="flex flex-col sm:flex-row gap-4 justify-center mt-8"
+        />
+      </div>
+
+      <div id="footer-services" data-section="footer-services" className="mx-auto px-4 md:px-6 lg:px-8">
         <FooterSimple
           columns={footerColumns}
-          bottomLeftText="© 2024 Paintasy Face and Body Art."
+          bottomLeftText="© 2024 Paintasy Face and Body Art. All rights reserved."
-          bottomRightText="Professional Event Entertainment"
+          bottomRightText="Professional Event Entertainment | Creative Services"
-          ariaLabel="Services footer with links"
+          ariaLabel="Site footer with links"
-          containerClassName="gap-12"
+          containerClassName="gap-8 lg:gap-12"
           columnsClassName="grid-cols-2 lg:grid-cols-4"
           columnTitleClassName="font-extrabold text-lg"
           columnItemClassName="hover:opacity-70 transition-opacity"