From dfbe20b0663d2d3175b31f8472fbd8741051f564 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Sat, 14 Mar 2026 05:42:44 +0000
Subject: [PATCH] Update src/app/packages/page.tsx

---
 src/app/packages/page.tsx | 340 ++++++++++++++++++--------------------
 1 file changed, 165 insertions(+), 175 deletions(-)

diff --git a/src/app/packages/page.tsx b/src/app/packages/page.tsx
index 500208a..989be84 100644
--- a/src/app/packages/page.tsx
+++ b/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 HeroBillboardGallery from "@/components/sections/hero/HeroBillboardGallery";
-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 NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
+import PricingCardFive from '@/components/sections/pricing/PricingCardFive';
+import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
+import FaqBase from '@/components/sections/faq/FaqBase';
+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",
-      items: [
-        { label: "Birthday Packages", href: "#packages" },
-        { label: "Festival Service", href: "#packages" },
-        { label: "Corporate Events", href: "#packages" },
-        { label: "Custom Packages", href: "/contact" },
+      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: "Services",
-      items: [
-        { label: "All Services", href: "/services" },
+      title: "Company",      items: [
+        { label: "About Us", href: "/about" },
         { label: "Gallery", href: "/gallery" },
-        { label: "About", href: "/about" },
+        { label: "Packages", href: "/packages" },
         { label: "FAQ", href: "#faq" },
+        { label: "Contact", href: "/contact" },
       ],
     },
     {
-      title: "Social",
-      items: [
+      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: "Book Now",
-      items: [
-        { label: "Request Quote", href: "/contact" },
-        { label: "Chat with Us", href: "/contact" },
-        { label: "Call Now", href: "tel:+15551234567" },
-        { label: "FAQ", href: "#faq" },
+      title: "Service Areas",      items: [
+        { label: "Local Events", href: "/contact" },
+        { label: "Regional Coverage", href: "/contact" },
+        { label: "Book Now", href: "/packages" },
+        { label: "Get Quote", href: "/contact" },
       ],
     },
   ];
@@ -72,205 +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"
-          description="Flexible, transparent pricing for every type of event. From intimate celebrations to large festivals, we have the perfect package for you."
-          background={{ variant: "gradient-bars" }}
+          title="Event Packages & Booking Options"
+          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: "radial-gradient" }}
+          tag="Book Your Entertainment"
+          tagIcon={Sparkles}
+          tagAnimation="slide-up"
           buttons={[
-            {
-              text: "Request a Quote",
-              href: "/contact",
-            },
+            { text: "View Packages", href: "#packages-pricing" },
+            { text: "Contact Us", href: "/contact" },
           ]}
           buttonAnimation="blur-reveal"
           mediaItems={[
             {
-              imageSrc: "http://img.b2bpic.net/free-photo/dreamy-eyes-woman-smiling-festival_23-2148338055.jpg?_wi=4",
-              imageAlt: "Event face painting packages",
-            },
+              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"},
           ]}
           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",
-              tag: "Great Start",
-              price: "$150",
-              period: "per hour",
-              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: "kids-party-basic",              tag: "Popular",              tagIcon: Users,
+              price: "$150",              period: "per hour",              description: "Perfect for small birthday celebrations with basic designs",              button: { text: "Book Package", href: "/contact" },
+              featuresTitle: "Package Includes",              features: [
+                "Up to 15 children",                "Colorful, playful designs",                "Face painting only",                "Setup & teardown",                "Artist materials provided"],
             },
             {
-              id: "pkg-birthday-deluxe",
-              tag: "Most Popular",
-              price: "$200",
-              period: "per 2 hours",
-              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: "kids-party-deluxe",              tag: "Best Value",              tagIcon: Check,
+              price: "$200",              period: "per 2 hours",              description: "Full party entertainment with premium designs and add-ons",              button: { text: "Book Package", href: "/contact" },
+              featuresTitle: "Package Includes",              features: [
+                "Up to 25 children",                "Custom themed designs",                "Face painting & temporary tattoos",                "Interactive entertainment",                "Professional quality assured"],
             },
             {
-              id: "pkg-birthday-premium",
-              tag: "Best Value",
-              price: "$280",
-              period: "per 3 hours",
-              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: "festival-event",              tag: "High-Volume",              tagIcon: Zap,
+              price: "$250",              period: "per 3 hours",              description: "Fast, artistic designs for festivals and outdoor events",              button: { text: "Book Package", href: "/contact" },
+              featuresTitle: "Package Includes",              features: [
+                "High-capacity crowd service",                "Fast artistic designs",                "Portable setup station",                "Setup & teardown included",                "Multiple artist option available"],
             },
             {
-              id: "pkg-festival",
-              tag: "High Volume",
-              price: "$250",
-              period: "per 3 hours",
-              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",
+              id: "corporate-event",              tag: "Professional",              tagIcon: Music,
+              price: "$300",              period: "per 4 hours",              description: "Premium service for corporate events and brand activations",              button: { text: "Book Package", href: "/contact" },
+              featuresTitle: "Package Includes",              features: [
+                "Professional branded designs",                "Custom theme integration",                "Extended hours available",                "Multiple artist coordination",                "Premium materials & finishes"],
             },
           ]}
+          buttons={[{ text: "Contact for Custom Quote", href: "/contact" }]}
           buttonAnimation="blur-reveal"
+          ariaLabel="Pricing section with package options"
           containerClassName="gap-12"
-          titleClassName="text-4xl font-extrabold"
-          descriptionClassName="text-lg opacity-90"
-          ariaLabel="Pricing section with event packages"
+          cardContentClassName=""
+          planTagClassName=""
+          planPriceClassName=""
         />
       </div>
 
-      <div id="packages-cta" data-section="packages-cta">
-        <ContactText
-          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."
-          animationType="background-highlight"
-          background={{ variant: "sparkles-gradient" }}
+      <div id="packages-details" data-section="packages-details" className="mx-auto px-4 md:px-6">
+        <FeatureCardTen
+          title="What's Included in Every Package"
+          description="All Paintasy packages come with professional service, quality materials, and our commitment to your event's success."
+          tag="Package Details"
+          tagIcon={Check}
+          tagAnimation="slide-up"
+          textboxLayout="default"
+          animationType="slide-up"
           useInvertedBackground={true}
-          buttons={[
+          features={[
             {
-              text: "Request Custom Quote",
-              href: "/contact",
+              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: {
+                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"
-          textClassName="text-3xl font-extrabold text-center"
-          ariaLabel="Custom packages call-to-action section"
+          buttons={[{ text: "Request a Quote", href: "/contact" }]}
+          buttonAnimation="blur-reveal"
+          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."
-          bottomRightText="Simple Transparent Pricing"
-          ariaLabel="Packages page footer"
+          bottomLeftText="© 2024 Paintasy Face and Body Art. All rights reserved."
+          bottomRightText="Professional Event Entertainment | Creative Services"
+          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>