From 01e656320099f7defb1cbb04f2f4fc9bd7ff0a70 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Sat, 14 Mar 2026 05:24:43 +0000
Subject: [PATCH] Switch to version 1: modified src/app/packages/page.tsx

---
 src/app/packages/page.tsx | 287 +++++++++++++++++++++++---------------
 1 file changed, 176 insertions(+), 111 deletions(-)

diff --git a/src/app/packages/page.tsx b/src/app/packages/page.tsx
index b703df2..500208a 100644
--- a/src/app/packages/page.tsx
+++ b/src/app/packages/page.tsx
@@ -1,13 +1,12 @@
 "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 ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
-import ContactText from '@/components/sections/contact/ContactText';
-import FooterSimple from '@/components/sections/footer/FooterSimple';
-import { Sparkles, DollarSign, HelpCircle } from 'lucide-react';
+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";
 
 export default function PackagesPage() {
   const navItems = [
@@ -21,46 +20,43 @@ export default function PackagesPage() {
 
   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: "Packages",
+      items: [
+        { label: "Birthday Packages", href: "#packages" },
+        { label: "Festival Service", href: "#packages" },
+        { label: "Corporate Events", href: "#packages" },
+        { label: "Custom Packages", href: "/contact" },
       ],
     },
     {
-      title: "Company",      items: [
-        { label: "About Us", href: "/about" },
+      title: "Services",
+      items: [
+        { label: "All Services", href: "/services" },
         { label: "Gallery", href: "/gallery" },
-        { label: "Packages", href: "/packages" },
+        { label: "About", href: "/about" },
         { label: "FAQ", href: "#faq" },
-        { label: "Contact", href: "/contact" },
       ],
     },
     {
-      title: "Connect",      items: [
+      title: "Social",
+      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: "/packages" },
-        { label: "Get Quote", href: "/contact" },
+      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" },
       ],
     },
   ];
 
-  const handleBookingSubmit = (data: Record<string, string>) => {
-    console.log("Booking inquiry submitted:", data);
-  };
-
   return (
     <ThemeProvider
       defaultButtonVariant="shift-hover"
@@ -76,136 +72,205 @@ export default function PackagesPage() {
     >
       <div id="nav" data-section="nav">
         <NavbarStyleFullscreen
-          brandName="Paintasy"
           navItems={navItems}
+          brandName="Paintasy"
           bottomLeftText="Creative Face & Body Art"
           bottomRightText="paintasy@events.com"
         />
       </div>
 
-      <div id="hero-packages" data-section="hero-packages" className="mx-auto px-4 md:px-6">
+      <div id="packages-page-hero" data-section="packages-page-hero">
         <HeroBillboardGallery
-          title="Event Packages & Booking"
-          description="Simple, flexible pricing for parties, festivals, and corporate events. Each package includes professional service and artistic creativity. Book your event today!"
-          background={{ variant: "radial-gradient" }}
-          tag="Transparent Pricing"
-          tagIcon={Sparkles}
-          tagAnimation="slide-up"
+          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" }}
           buttons={[
-            { text: "View Packages", href: "#pricing" },
-            { text: "Get a Custom Quote", href: "#booking-form" },
+            {
+              text: "Request a Quote",
+              href: "/contact",
+            },
           ]}
           buttonAnimation="blur-reveal"
           mediaItems={[
             {
-              imageSrc: "http://img.b2bpic.net/free-photo/happy-excited-children-sitting-down-floor-hugging-celebrating-child-birthday-party_231208-3661.jpg",              imageAlt: "Happy kids at a party with face painting"},
+              imageSrc: "http://img.b2bpic.net/free-photo/dreamy-eyes-woman-smiling-festival_23-2148338055.jpg?_wi=4",
+              imageAlt: "Event face painting packages",
+            },
           ]}
           mediaAnimation="opacity"
-          ariaLabel="Packages and booking 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"
+          titleClassName="text-5xl font-extrabold"
+          descriptionClassName="text-lg opacity-90"
+          ariaLabel="Packages page hero section"
         />
       </div>
 
-      <div id="pricing" data-section="pricing" className="mx-auto px-4 md:px-6">
+      <div id="packages-pricing" data-section="packages-pricing">
         <PricingCardFive
-          title="Choose Your Package"
-          description="Select the package that best fits your event needs. All packages include professional service, setup, and our artist's materials. Custom packages available upon request."
-          tag="Transparent Pricing"
-          tagIcon={DollarSign}
-          tagAnimation="slide-up"
+          title="Our Event Packages"
+          description="Simple, flexible pricing tailored to your event needs. All packages include professional service, artistic creativity, and great customer care."
           textboxLayout="default"
           animationType="scale-rotate"
           useInvertedBackground={false}
           plans={[
             {
-              id: "birthday-basic",              tag: "Popular",              price: "$150",              period: "per hour",              description: "Perfect for small birthday celebrations",              button: { text: "Request Quote", href: "#booking-form" },
-              featuresTitle: "What's Included",              features: [
-                "Up to 15 kids",                "Colorful themed designs",                "Face painting only",                "Basic design themes",                "Professional artist"],
+              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: "birthday-deluxe",              tag: "Best Value",              price: "$200",              period: "per 2 hours",              description: "Full party entertainment package",              button: { text: "Request Quote", href: "#booking-form" },
-              featuresTitle: "What's Included",              features: [
-                "Up to 25 kids",                "Custom themed designs",                "Face & temporary tattoos",                "Interactive entertainment",                "Professional artist",                "Setup & teardown"],
+              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: "festival-event",              tag: "Flexible",              price: "$250",              period: "per 3 hours",              description: "Festival and outdoor event service",              button: { text: "Request Quote", href: "#booking-form" },
-              featuresTitle: "What's Included",              features: [
-                "High-capacity crowd service",                "Fast artistic designs",                "Setup & teardown included",                "Portable station",                "5-10 min per person",                "Weather-resistant setup"],
+              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: "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",
             },
           ]}
-          buttons={[{ text: "Get Custom Package", href: "#booking-form" }]}
           buttonAnimation="blur-reveal"
-          ariaLabel="Event packages pricing section"
-          containerClassName="gap-12"
-          titleClassName="text-4xl font-extrabold"
-          descriptionClassName="text-lg opacity-90 max-w-3xl"
-          cardClassName="p-8"
-        />
-      </div>
-
-      <div id="booking-form" data-section="booking-form" className="mx-auto px-4 md:px-6">
-        <ContactSplitForm
-          title="Book Your Event"
-          description="Fill out the form below to request a booking or get a custom quote. We'll get back to you within 24 hours with pricing and availability."
-          useInvertedBackground={true}
-          inputs={[
-            { name: "fullName", type: "text", placeholder: "Your Full Name", required: true },
-            { name: "email", type: "email", placeholder: "Your Email Address", required: true },
-            { name: "phone", type: "tel", placeholder: "Your Phone Number", required: true },
-            { name: "eventDate", type: "date", placeholder: "Event Date", required: true },
-            { name: "eventType", type: "text", placeholder: "Event Type (Birthday, Festival, Corporate, etc.)", required: true },
-            { name: "guestCount", type: "number", placeholder: "Expected Number of Guests", required: true },
-            { name: "location", type: "text", placeholder: "Event Location", required: true },
-          ]}
-          textarea={{
-            name: "eventDetails",            placeholder: "Tell us about your event - theme, special requests, design preferences, or any other details you'd like us to know.",            rows: 6,
-            required: false,
-          }}
-          buttonText="Request Booking"
-          onSubmit={handleBookingSubmit}
-          mediaPosition="right"
-          imageSrc="http://img.b2bpic.net/free-photo/dreamy-eyes-woman-smiling-festival_23-2148338055.jpg?_wi=1"
-          imageAlt="Face painting booking inquiry"
-          mediaAnimation="opacity"
-          ariaLabel="Booking form section"
           containerClassName="gap-12"
           titleClassName="text-4xl font-extrabold"
           descriptionClassName="text-lg opacity-90"
+          ariaLabel="Pricing section with event packages"
         />
       </div>
 
-      <div id="cta-packages" data-section="cta-packages" className="mx-auto px-4 md:px-6">
+      <div id="packages-cta" data-section="packages-cta">
         <ContactText
-          text="Ready to make your event unforgettable? Browse our packages above or contact us for a custom quote. We're excited to bring creative face painting to your celebration!"
+          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: "radial-gradient" }}
-          useInvertedBackground={false}
+          background={{ variant: "sparkles-gradient" }}
+          useInvertedBackground={true}
           buttons={[
-            { text: "Send a Message", href: "#booking-form" },
-            { text: "Call Us", href: "tel:+15551234567" },
+            {
+              text: "Request Custom Quote",
+              href: "/contact",
+            },
           ]}
-          ariaLabel="Call-to-action for bookings"
           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"
+          textClassName="text-3xl font-extrabold text-center"
+          ariaLabel="Custom packages call-to-action section"
         />
       </div>
 
-      <div id="footer-packages" data-section="footer-packages" className="mx-auto px-4 md:px-6">
+      <div id="packages-footer" data-section="packages-footer">
         <FooterSimple
           columns={footerColumns}
-          bottomLeftText="© 2024 Paintasy Face and Body Art. All rights reserved."
-          bottomRightText="Professional Event Entertainment | Creative Services"
-          ariaLabel="Site footer with links"
+          bottomLeftText="© 2024 Paintasy Face and Body Art."
+          bottomRightText="Simple Transparent Pricing"
+          ariaLabel="Packages page footer"
           containerClassName="gap-12"
-          columnsClassName="grid-cols-2 lg:grid-cols-4"
-          columnTitleClassName="font-extrabold text-lg"
-          columnItemClassName="hover:opacity-70 transition-opacity"
         />
       </div>
     </ThemeProvider>