Merge version_2 into main

Merge version_2 into main

src/app/gin/page.tsx

@@ -0,0 +1,235 @@
+"use client";
+
+import { useState } from "react";
+import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
+import ProductCardOne from '@/components/sections/product/ProductCardOne';
+import ContactCTA from '@/components/sections/contact/ContactCTA';
+import FooterCard from '@/components/sections/footer/FooterCard';
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import { Mail, MapPin, Phone, Zap } from 'lucide-react';
+import Link from 'next/link';
+
+const ginProducts = [
+  { id: "gin-1", name: "Tanqueray London Dry Gin", price: "$49.99", imageSrc: "https://images.unsplash.com/photo-1510812431401-41d2cab2707c?w=500&h=500&fit=crop&_wi=1", imageAlt: "Tanqueray London Dry Gin bottle" },
+  { id: "gin-2", name: "Bombay Sapphire Premium Gin", price: "$54.99", imageSrc: "https://images.unsplash.com/photo-1608603175141-b4e7ca6b9cc3?w=500&h=500&fit=crop&_wi=1", imageAlt: "Bombay Sapphire Premium Gin bottle" },
+  { id: "gin-3", name: "Gordon's London Dry Gin", price: "$45.99", imageSrc: "https://images.unsplash.com/photo-1608270861620-7c80b66ce398?w=500&h=500&fit=crop&_wi=1", imageAlt: "Gordon's London Dry Gin bottle" },
+  { id: "gin-4", name: "Hendrick's Cucumber Gin", price: "$59.99", imageSrc: "https://images.unsplash.com/photo-1599199810694-f3fc466b249b?w=500&h=500&fit=crop&_wi=1", imageAlt: "Hendrick's Cucumber Gin bottle" },
+  { id: "gin-5", name: "Beefeater London Dry Gin", price: "$52.99", imageSrc: "https://images.unsplash.com/photo-1608603175141-b4e7ca6b9cc3?w=500&h=500&fit=crop&_wi=2", imageAlt: "Beefeater London Dry Gin bottle" },
+  { id: "gin-6", name: "Seagram's Extra Dry Gin", price: "$44.99", imageSrc: "https://images.unsplash.com/photo-1510812431401-41d2cab2707c?w=500&h=500&fit=crop&_wi=2", imageAlt: "Seagram's Extra Dry Gin bottle" },
+  { id: "gin-7", name: "Junipero Premium Gin", price: "$62.99", imageSrc: "https://images.unsplash.com/photo-1608270861620-7c80b66ce398?w=500&h=500&fit=crop&_wi=2", imageAlt: "Junipero Premium Gin bottle" },
+  { id: "gin-8", name: "Tanqueray No. Ten", price: "$64.99", imageSrc: "https://images.unsplash.com/photo-1599199810694-f3fc466b249b?w=500&h=500&fit=crop&_wi=2", imageAlt: "Tanqueray No. Ten bottle" },
+  { id: "gin-9", name: "Bombay Dry Gin", price: "$48.99", imageSrc: "https://images.unsplash.com/photo-1510812431401-41d2cab2707c?w=500&h=500&fit=crop&_wi=3", imageAlt: "Bombay Dry Gin bottle" },
+  { id: "gin-10", name: "Whitley Neill Gin", price: "$55.99", imageSrc: "https://images.unsplash.com/photo-1608603175141-b4e7ca6b9cc3?w=500&h=500&fit=crop&_wi=3", imageAlt: "Whitley Neill Gin bottle" },
+  { id: "gin-11", name: "Darnley's London Dry", price: "$51.99", imageSrc: "https://images.unsplash.com/photo-1608270861620-7c80b66ce398?w=500&h=500&fit=crop&_wi=3", imageAlt: "Darnley's London Dry Gin bottle" },
+  { id: "gin-12", name: "Gin Mare Mediterranean", price: "$67.99", imageSrc: "https://images.unsplash.com/photo-1599199810694-f3fc466b249b?w=500&h=500&fit=crop&_wi=3", imageAlt: "Gin Mare Mediterranean Gin bottle" },
+  { id: "gin-13", name: "Filliers Dry Gin 28", price: "$56.99", imageSrc: "https://images.unsplash.com/photo-1510812431401-41d2cab2707c?w=500&h=500&fit=crop&_wi=4", imageAlt: "Filliers Dry Gin 28 bottle" },
+  { id: "gin-14", name: "Hayman's Old Tom Gin", price: "$58.99", imageSrc: "https://images.unsplash.com/photo-1608603175141-b4e7ca6b9cc3?w=500&h=500&fit=crop&_wi=4", imageAlt: "Hayman's Old Tom Gin bottle" },
+  { id: "gin-15", name: "The Botanist Premium", price: "$65.99", imageSrc: "https://images.unsplash.com/photo-1608270861620-7c80b66ce398?w=500&h=500&fit=crop&_wi=4", imageAlt: "The Botanist Premium Gin bottle" },
+  { id: "gin-16", name: "Star of Bombay Gin", price: "$69.99", imageSrc: "https://images.unsplash.com/photo-1599199810694-f3fc466b249b?w=500&h=500&fit=crop&_wi=4", imageAlt: "Star of Bombay Gin bottle" },
+  { id: "gin-17", name: "Greenalls Original Gin", price: "$46.99", imageSrc: "https://images.unsplash.com/photo-1510812431401-41d2cab2707c?w=500&h=500&fit=crop&_wi=5", imageAlt: "Greenalls Original Gin bottle" },
+  { id: "gin-18", name: "Citadelle Gin", price: "$61.99", imageSrc: "https://images.unsplash.com/photo-1608603175141-b4e7ca6b9cc3?w=500&h=500&fit=crop&_wi=5", imageAlt: "Citadelle Gin bottle" },
+  { id: "gin-19", name: "Leopold's American Gin", price: "$63.99", imageSrc: "https://images.unsplash.com/photo-1608270861620-7c80b66ce398?w=500&h=500&fit=crop&_wi=5", imageAlt: "Leopold's American Gin bottle" },
+  { id: "gin-20", name: "Monkey 47 Schwarzwald", price: "$79.99", imageSrc: "https://images.unsplash.com/photo-1599199810694-f3fc466b249b?w=500&h=500&fit=crop&_wi=5", imageAlt: "Monkey 47 Schwarzwald Gin bottle" },
+  { id: "gin-21", name: "Bols Genever Gin", price: "$50.99", imageSrc: "https://images.unsplash.com/photo-1510812431401-41d2cab2707c?w=500&h=500&fit=crop&_wi=6", imageAlt: "Bols Genever Gin bottle" },
+  { id: "gin-22", name: "Tanqueray Rangpur", price: "$53.99", imageSrc: "https://images.unsplash.com/photo-1608603175141-b4e7ca6b9cc3?w=500&h=500&fit=crop&_wi=6", imageAlt: "Tanqueray Rangpur bottle" },
+  { id: "gin-23", name: "Empress Indigo Gin", price: "$66.99", imageSrc: "https://images.unsplash.com/photo-1608270861620-7c80b66ce398?w=500&h=500&fit=crop&_wi=6", imageAlt: "Empress Indigo Gin bottle" },
+  { id: "gin-24", name: "Sipsmith London Dry", price: "$62.99", imageSrc: "https://images.unsplash.com/photo-1599199810694-f3fc466b249b?w=500&h=500&fit=crop&_wi=6", imageAlt: "Sipsmith London Dry Gin bottle" },
+  { id: "gin-25", name: "Bombay Original Dry", price: "$47.99", imageSrc: "https://images.unsplash.com/photo-1510812431401-41d2cab2707c?w=500&h=500&fit=crop&_wi=7", imageAlt: "Bombay Original Dry Gin bottle" },
+  { id: "gin-26", name: "Roku Japanese Gin", price: "$68.99", imageSrc: "https://images.unsplash.com/photo-1608603175141-b4e7ca6b9cc3?w=500&h=500&fit=crop&_wi=7", imageAlt: "Roku Japanese Gin bottle" },
+  { id: "gin-27", name: "Four Pillars Rare", price: "$71.99", imageSrc: "https://images.unsplash.com/photo-1608270861620-7c80b66ce398?w=500&h=500&fit=crop&_wi=7", imageAlt: "Four Pillars Rare Gin bottle" },
+  { id: "gin-28", name: "Bafferts London Dry", price: "$52.99", imageSrc: "https://images.unsplash.com/photo-1599199810694-f3fc466b249b?w=500&h=500&fit=crop&_wi=7", imageAlt: "Bafferts London Dry Gin bottle" },
+  { id: "gin-29", name: "Sloane's Dry Gin", price: "$49.99", imageSrc: "https://images.unsplash.com/photo-1510812431401-41d2cab2707c?w=500&h=500&fit=crop&_wi=8", imageAlt: "Sloane's Dry Gin bottle" },
+  { id: "gin-30", name: "Malfy Gin Con Limone", price: "$57.99", imageSrc: "https://images.unsplash.com/photo-1608603175141-b4e7ca6b9cc3?w=500&h=500&fit=crop&_wi=8", imageAlt: "Malfy Gin Con Limone bottle" },
+  { id: "gin-31", name: "Brooker's London Dry", price: "$51.99", imageSrc: "https://images.unsplash.com/photo-1608270861620-7c80b66ce398?w=500&h=500&fit=crop&_wi=8", imageAlt: "Brooker's London Dry Gin bottle" },
+  { id: "gin-32", name: "Luxardo Dry Gin", price: "$64.99", imageSrc: "https://images.unsplash.com/photo-1599199810694-f3fc466b249b?w=500&h=500&fit=crop&_wi=8", imageAlt: "Luxardo Dry Gin bottle" },
+  { id: "gin-33", name: "M&H Peaky Blinder", price: "$73.99", imageSrc: "https://images.unsplash.com/photo-1510812431401-41d2cab2707c?w=500&h=500&fit=crop&_wi=9", imageAlt: "M&H Peaky Blinder Gin bottle" },
+  { id: "gin-34", name: "Warner Edwards Gin", price: "$59.99", imageSrc: "https://images.unsplash.com/photo-1608603175141-b4e7ca6b9cc3?w=500&h=500&fit=crop&_wi=9", imageAlt: "Warner Edwards Gin bottle" },
+  { id: "gin-35", name: "Fords Gin London Dry", price: "$58.99", imageSrc: "https://images.unsplash.com/photo-1608270861620-7c80b66ce398?w=500&h=500&fit=crop&_wi=9", imageAlt: "Fords Gin London Dry bottle" },
+  { id: "gin-36", name: "The Tarquin's London Dry", price: "$60.99", imageSrc: "https://images.unsplash.com/photo-1599199810694-f3fc466b249b?w=500&h=500&fit=crop&_wi=9", imageAlt: "The Tarquin's London Dry Gin bottle" },
+  { id: "gin-37", name: "Mombasa Club London Dry", price: "$55.99", imageSrc: "https://images.unsplash.com/photo-1510812431401-41d2cab2707c?w=500&h=500&fit=crop&_wi=10", imageAlt: "Mombasa Club London Dry Gin bottle" },
+];
+
+export default function GinCollection() {
+  const [selectedProduct, setSelectedProduct] = useState<typeof ginProducts[0] | null>(null);
+  const [cartItems, setCartItems] = useState<Array<any>>([]);
+  const [quantity, setQuantity] = useState(1);
+
+  const handleAddToCart = () => {
+    if (selectedProduct) {
+      const existingItem = cartItems.find(item => item.id === selectedProduct.id);
+      if (existingItem) {
+        setCartItems(cartItems.map(item =>
+          item.id === selectedProduct.id
+            ? { ...item, quantity: item.quantity + quantity }
+            : item
+        ));
+      } else {
+        setCartItems([...cartItems, { ...selectedProduct, quantity }]);
+      }
+      setQuantity(1);
+      setSelectedProduct(null);
+    }
+  };
+
+  const handleQuantityChange = (amount: number) => {
+    const newQuantity = quantity + amount;
+    if (newQuantity > 0) {
+      setQuantity(newQuantity);
+    }
+  };
+
+  return (
+    <ThemeProvider
+      defaultButtonVariant="elastic-effect"
+      defaultTextAnimation="background-highlight"
+      borderRadius="pill"
+      contentWidth="mediumLarge"
+      sizing="largeSmallSizeMediumTitles"
+      background="grid"
+      cardStyle="layered-gradient"
+      primaryButtonStyle="primary-glow"
+      secondaryButtonStyle="layered"
+      headingFontWeight="bold"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarLayoutFloatingInline
+          brandName="Super Liquor Paihia"
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Gin Collection", id: "/gin" },
+            { name: "Specials", id: "specials" },
+            { name: "Selection", id: "selection" },
+            { name: "Contact", id: "contact" },
+          ]}
+          button={{
+            text: "Call Now",            href: "tel:0994558333"
+          }}
+          animateOnLoad={true}
+        />
+      </div>
+
+      <div id="gin-collection" data-section="gin-collection" className="min-h-screen py-16">
+        <div className="max-w-7xl mx-auto px-4">
+          <div className="mb-12">
+            <h1 className="text-5xl font-bold mb-4">Premium Gin Collection</h1>
+            <p className="text-xl text-foreground/80">Explore our extensive range of 37 premium gins from around the world</p>
+          </div>
+
+          {selectedProduct ? (
+            <div className="fixed inset-0 bg-black/50 flex items-center justify-center z-50 p-4">
+              <div className="bg-card rounded-lg p-8 max-w-lg w-full">
+                <button
+                  onClick={() => setSelectedProduct(null)}
+                  className="float-right text-2xl font-bold text-foreground hover:text-accent"
+                >
+                  ×
+                </button>
+                <div className="mb-6">
+                  <img
+                    src={selectedProduct.imageSrc}
+                    alt={selectedProduct.imageAlt}
+                    className="w-full h-80 object-cover rounded-lg mb-4"
+                  />
+                  <h2 className="text-2xl font-bold mb-2">{selectedProduct.name}</h2>
+                  <p className="text-3xl font-bold text-primary-cta mb-6">{selectedProduct.price}</p>
+                </div>
+
+                <div className="mb-6">
+                  <label className="block text-sm font-medium mb-2">Quantity</label>
+                  <div className="flex items-center gap-4">
+                    <button
+                      onClick={() => handleQuantityChange(-1)}
+                      className="px-4 py-2 bg-secondary-cta rounded-lg hover:opacity-80"
+                    >
+                      −
+                    </button>
+                    <span className="text-2xl font-bold w-12 text-center">{quantity}</span>
+                    <button
+                      onClick={() => handleQuantityChange(1)}
+                      className="px-4 py-2 bg-secondary-cta rounded-lg hover:opacity-80"
+                    >
+                      +
+                    </button>
+                  </div>
+                </div>
+
+                <button
+                  onClick={handleAddToCart}
+                  className="w-full bg-primary-cta text-white py-3 rounded-lg font-bold hover:opacity-90 mb-2"
+                >
+                  Add to Cart
+                </button>
+                <button
+                  onClick={() => setSelectedProduct(null)}
+                  className="w-full bg-secondary-cta text-foreground py-3 rounded-lg font-bold hover:opacity-90"
+                >
+                  Close
+                </button>
+              </div>
+            </div>
+          ) : null}
+
+          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 mb-12">
+            {ginProducts.map((product) => (
+              <div key={product.id} className="bg-card rounded-lg overflow-hidden hover:shadow-lg transition-shadow">
+                <img
+                  src={product.imageSrc}
+                  alt={product.imageAlt}
+                  className="w-full h-64 object-cover"
+                />
+                <div className="p-4">
+                  <h3 className="text-lg font-bold mb-2">{product.name}</h3>
+                  <p className="text-2xl font-bold text-primary-cta mb-4">{product.price}</p>
+                  <button
+                    onClick={() => setSelectedProduct(product)}
+                    className="w-full bg-primary-cta text-white py-2 rounded-lg font-bold hover:opacity-90"
+                  >
+                    View & Add to Cart
+                  </button>
+                </div>
+              </div>
+            ))}
+          </div>
+        </div>
+      </div>
+
+      <div id="contact" data-section="contact">
+        <ContactCTA
+          tag="Get in Touch"
+          tagIcon={Phone}
+          tagAnimation="slide-up"
+          title="Questions About Our Gin Selection?"
+          description="Our expert staff can help you find the perfect gin for your taste preferences. Call us, visit in person, or send us a message."
+          buttons={[
+            { text: "Call 09 945 8333", href: "tel:0994558333" },
+            { text: "Get Directions", href: "https://maps.google.com/?q=14+Marsden+Road+Paihia+0200+New+Zealand" },
+          ]}
+          buttonAnimation="slide-up"
+          background={{ variant: "animated-grid" }}
+          useInvertedBackground={false}
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterCard
+          logoText="Super Liquor Paihia"
+          copyrightText="© 2025 Super Liquor Paihia | 14 Marsden Road, Paihia 0200 | Ph: 09 945 8333"
+          socialLinks={[
+            {
+              icon: Phone,
+              href: "tel:0994558333",              ariaLabel: "Call us"
+            },
+            {
+              icon: MapPin,
+              href: "https://maps.google.com/?q=14+Marsden+Road+Paihia+0200+New+Zealand",              ariaLabel: "Get directions"
+            },
+            {
+              icon: Mail,
+              href: "mailto:info@superliquorpaihia.co.nz",              ariaLabel: "Send email"
+            },
+          ]}
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/layout.tsx

@@ -1,57 +1,28 @@
 import type { Metadata } from "next";
-import { Halant } from "next/font/google";
+import { Geist, Geist_Mono } from "next/font/google";
-import { Inter } from "next/font/google";
-import { Montserrat } from "next/font/google";
 import "./globals.css";
-import { ServiceWrapper } from "@/components/ServiceWrapper";
-import Tag from "@/tag/Tag";
 
-const halant = Halant({
+const geist = Geist({
-  variable: "--font-halant",  subsets: ["latin"],
+  variable: "--font-geist-sans",  subsets: ["latin"],
-  weight: ["300", "400", "500", "600", "700"],
 });
 
-const inter = Inter({
+const geistMono = Geist_Mono({
-  variable: "--font-inter",  subsets: ["latin"],
+  variable: "--font-geist-mono",  subsets: ["latin"],
-});
-
-const montserrat = Montserrat({
-  variable: "--font-montserrat",  subsets: ["latin"],
 });
 
 export const metadata: Metadata = {
-  title: "Super Liquor Paihia | Local Bottle Shop Bay of Islands",  description: "Premium liquor store in Paihia with beer, wine, spirits, and ready-to-drink beverages. Convenient location, fast service, great prices. Call 09 945 8333.",  keywords: "liquor store Paihia, bottle shop Paihia, alcohol Bay of Islands, beer wine spirits Paihia, liquor near me",  metadataBase: new URL("https://www.superliquorpaihia.co.nz"),
+  title: "Super Liquor Paihia | Local Bottle Shop Bay of Islands",  description: "Great prices. Friendly service. Cold drinks ready to go. Your local bottle shop in Paihia, Bay of Islands. Open daily 10 AM - 9 PM."};
-  alternates: {
-    canonical: "https://www.superliquorpaihia.co.nz"},
-  openGraph: {
-    title: "Super Liquor Paihia | Your Local Bottle Shop",    description: "Quality alcohol, friendly service, convenient location. Cold drinks ready to go. Open daily 10 AM - 9 PM.",    url: "https://www.superliquorpaihia.co.nz",    siteName: "Super Liquor Paihia",    images: [
-      {
-        url: "http://img.b2bpic.net/free-photo/confident-bartender-standing-bar-counter_107420-94857.jpg",        alt: "Super Liquor Paihia storefront"},
-    ],
-    type: "website"},
-  twitter: {
-    card: "summary_large_image",    title: "Super Liquor Paihia | Local Bottle Shop",    description: "Great prices. Friendly service. Cold drinks ready. Visit us in Paihia!",    images: ["http://img.b2bpic.net/free-photo/confident-bartender-standing-bar-counter_107420-94857.jpg"],
-  },
-  robots: {
-    index: true,
-    follow: true,
-  },
-};
 
 export default function RootLayout({
   children,
-}: Readonly<{
+}: {
   children: React.ReactNode;
-}>) {
+}) {
   return (
     <html lang="en" suppressHydrationWarning>
-      <ServiceWrapper>
+      <body className={`${geist.variable} ${geistMono.variable}`}>
-        <body
+        {children}
-          className={`${halant.variable} ${inter.variable} ${montserrat.variable} antialiased`}
+      
-        >
-          <Tag />
-          {children}
-        
         <script
           dangerouslySetInnerHTML={{
             __html: `
@@ -1419,7 +1390,6 @@ export default function RootLayout({
           }}
         />
       </body>
-      </ServiceWrapper>
     </html>
   );
 }

src/app/page.tsx

@@ -11,8 +11,34 @@ import ContactCTA from '@/components/sections/contact/ContactCTA';
 import FooterCard from '@/components/sections/footer/FooterCard';
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import { Beer, Leaf, Mail, MapPin, Package, Phone, Quote, ShoppingCart, Star, Wine, Zap } from 'lucide-react';
+import { useEffect, useState } from 'react';
 
 export default function LandingPage() {
+  const [isMobile, setIsMobile] = useState(false);
+  const [stickyVisible, setStickyVisible] = useState(true);
+  const [lastScrollY, setLastScrollY] = useState(0);
+
+  useEffect(() => {
+    const handleResize = () => {
+      setIsMobile(window.innerWidth < 768);
+    };
+
+    const handleScroll = () => {
+      const currentScrollY = window.scrollY;
+      setStickyVisible(currentScrollY < lastScrollY || currentScrollY < 100);
+      setLastScrollY(currentScrollY);
+    };
+
+    handleResize();
+    window.addEventListener('resize', handleResize);
+    window.addEventListener('scroll', handleScroll, { passive: true });
+
+    return () => {
+      window.removeEventListener('resize', handleResize);
+      window.removeEventListener('scroll', handleScroll);
+    };
+  }, [lastScrollY]);
+
   return (
     <ThemeProvider
       defaultButtonVariant="elastic-effect"
@@ -36,11 +62,33 @@ export default function LandingPage() {
             { name: "Contact", id: "contact" },
           ]}
           button={{
-            text: "Call Now",            href: "tel:0994558333"}}
+            text: "Call Now",            href: "tel:0994558333"
+          }}
           animateOnLoad={true}
         />
       </div>
 
+      {isMobile && stickyVisible && (
+        <div className="fixed bottom-0 left-0 right-0 z-40 bg-gradient-to-t from-card via-card to-transparent backdrop-blur-md border-t border-accent/20 p-3 flex gap-2 animate-in fade-in slide-in-from-bottom-2 duration-300">
+          <a
+            href="tel:0994558333"
+            className="flex-1 flex items-center justify-center gap-2 px-4 py-3 bg-primary-cta text-background rounded-full font-semibold text-sm hover:shadow-lg transition-all duration-300 hover:scale-105"
+          >
+            <Phone className="w-4 h-4" />
+            <span>Call</span>
+          </a>
+          <a
+            href="https://maps.google.com/?q=14+Marsden+Road+Paihia+0200+New+Zealand"
+            target="_blank"
+            rel="noopener noreferrer"
+            className="flex-1 flex items-center justify-center gap-2 px-4 py-3 bg-secondary-cta text-foreground rounded-full font-semibold text-sm hover:shadow-lg transition-all duration-300 hover:scale-105 border border-accent/30"
+          >
+            <MapPin className="w-4 h-4" />
+            <span>Directions</span>
+          </a>
+        </div>
+      )}
+
       <div id="hero" data-section="hero">
         <HeroSplitTestimonial
           title="Your Local Bottle Shop in Paihia"
@@ -60,13 +108,16 @@ export default function LandingPage() {
           testimonials={[
             {
               name: "Sarah Mitchell",              handle: "Tourist from Auckland",              testimonial: "Great friendly service and excellent selection. Found exactly what I needed!",              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/girl-sitting-table-holding-mobile-phone-indoors_171337-17096.jpg"},
+              imageSrc: "http://img.b2bpic.net/free-photo/girl-sitting-table-holding-mobile-phone-indoors_171337-17096.jpg"
+            },
             {
               name: "James Wilson",              handle: "Local Resident",              testimonial: "Best bottle shop in Paihia. Always quick service and competitive prices.",              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/happy-man-with-thumbs-up_1187-3144.jpg"},
+              imageSrc: "http://img.b2bpic.net/free-photo/happy-man-with-thumbs-up_1187-3144.jpg"
+            },
             {
               name: "Emma Davis",              handle: "Holiday Visitor",              testimonial: "Convenient location and friendly staff made my stay in Paihia perfect.",              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/cheerful-fashionable-young-model-woman-making-selfie-alp-mountains-wearing-dress-leather-jacket-sunglasses-backpack_291049-83.jpg"},
+              imageSrc: "http://img.b2bpic.net/free-photo/cheerful-fashionable-young-model-woman-making-selfie-alp-mountains-wearing-dress-leather-jacket-sunglasses-backpack_291049-83.jpg"
+            },
           ]}
           testimonialRotationInterval={5000}
           useInvertedBackground={false}
@@ -82,13 +133,17 @@ export default function LandingPage() {
           tagAnimation="slide-up"
           metrics={[
             {
-              id: "1",              title: "4.0 ★ Google Rating",              subtitle: "Verified customer reviews",              category: "Reputation",              value: "43+ Reviews"},
+              id: "1",              title: "4.0 ★ Google Rating",              subtitle: "Verified customer reviews",              category: "Reputation",              value: "43+ Reviews"
+            },
             {
-              id: "2",              title: "Fast Friendly Service",              subtitle: "Quick transactions guaranteed",              category: "Experience",              value: "In & Out"},
+              id: "2",              title: "Fast Friendly Service",              subtitle: "Quick transactions guaranteed",              category: "Experience",              value: "In & Out"
+            },
             {
-              id: "3",              title: "Convenient Location",              subtitle: "Walking distance from hotels",              category: "Location",              value: "Central Paihia"},
+              id: "3",              title: "Convenient Location",              subtitle: "Walking distance from hotels",              category: "Location",              value: "Central Paihia"
+            },
             {
-              id: "4",              title: "Cold Drinks Ready",              subtitle: "Refreshment on demand",              category: "Service",              value: "Always Stocked"},
+              id: "4",              title: "Cold Drinks Ready",              subtitle: "Refreshment on demand",              category: "Service",              value: "Always Stocked"
+            },
           ]}
           animationType="slide-up"
           textboxLayout="default"
@@ -97,7 +152,32 @@ export default function LandingPage() {
         />
       </div>
 
-      <div id="specials" data-section="specials">
+      <div id="specials" data-section="specials" className="relative">
+        <style>{`
+          @keyframes swipe {
+            0% { transform: translateX(0); }
+            100% { transform: translateX(-100%); }
+          }
+          .swipe-container {
+            overflow-x: auto;
+            scroll-snap-type: x mandatory;
+            -webkit-overflow-scrolling: touch;
+          }
+          .swipe-container > * {
+            scroll-snap-align: start;
+          }
+          .product-card-glass {
+            background: rgba(255, 255, 255, 0.1);
+            backdrop-filter: blur(12px);
+            border: 1px solid rgba(255, 255, 255, 0.2);
+            transition: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
+          }
+          .product-card-glass:hover {
+            background: rgba(255, 255, 255, 0.15);
+            transform: translateY(-8px);
+            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
+          }
+        `}</style>
         <ProductCardOne
           title="Weekly Specials & Deals"
           description="Check out our latest promotions and exclusive in-store offers"
@@ -106,11 +186,14 @@ export default function LandingPage() {
           tagAnimation="slide-up"
           products={[
             {
-              id: "1",              name: "Beer Selection Specials",              price: "From $15.99",              imageSrc: "http://img.b2bpic.net/free-photo/top-view-beer-bottles-with-chips_23-2148673798.jpg",              imageAlt: "Beer specials selection"},
+              id: "1",              name: "Beer Selection Specials",              price: "From $15.99",              imageSrc: "http://img.b2bpic.net/free-photo/top-view-beer-bottles-with-chips_23-2148673798.jpg?_wi=1",              imageAlt: "Beer specials selection"
+            },
             {
-              id: "2",              name: "Premium Wine Promotions",              price: "From $22.99",              imageSrc: "http://img.b2bpic.net/free-photo/tray-with-wine-bottle-stoppers-beside_23-2148414202.jpg",              imageAlt: "Wine selection deals"},
+              id: "2",              name: "Premium Wine Promotions",              price: "From $22.99",              imageSrc: "http://img.b2bpic.net/free-photo/tray-with-wine-bottle-stoppers-beside_23-2148414202.jpg?_wi=1",              imageAlt: "Wine selection deals"
+            },
             {
-              id: "3",              name: "Spirit Deals",              price: "From $29.99",              imageSrc: "http://img.b2bpic.net/free-photo/front-view-tasty-american-beer-assortment_23-2148907595.jpg",              imageAlt: "Spirits promotion"},
+              id: "3",              name: "Spirit Deals",              price: "From $29.99",              imageSrc: "http://img.b2bpic.net/free-photo/front-view-tasty-american-beer-assortment_23-2148907595.jpg?_wi=1",              imageAlt: "Spirits promotion"
+            },
           ]}
           gridVariant="three-columns-all-equal-width"
           animationType="slide-up"
@@ -119,6 +202,7 @@ export default function LandingPage() {
           buttons={[
             { text: "View All Specials", href: "tel:0994558333" },
           ]}
+          cardClassName="product-card-glass"
         />
       </div>
 
@@ -132,26 +216,34 @@ export default function LandingPage() {
           features={[
             {
               icon: Beer,
-              title: "Beer & Cider",              description: "Craft, local, and international beers. Ice-cold ciders ready to go."},
+              title: "Beer & Cider",              description: "Craft, local, and international beers. Ice-cold ciders ready to go."
+            },
             {
               icon: Wine,
-              title: "Wine Selection",              description: "Red, white, and rosé wines from premium local and imported vineyards."},
+              title: "Wine Selection",              description: "Red, white, and rosé wines from premium local and imported vineyards."
+            },
             {
               icon: Wine,
-              title: "Spirits & Liqueurs",              description: "Whisky, vodka, rum, gin, and premium liqueurs for every taste."},
+              title: "Spirits & Liqueurs",              description: "Whisky, vodka, rum, gin, and premium liqueurs for every taste."
+            },
             {
               icon: Zap,
-              title: "Ready-to-Drink",              description: "Pre-mixed cocktails and convenient RTD beverages for quick purchases."},
+              title: "Ready-to-Drink",              description: "Pre-mixed cocktails and convenient RTD beverages for quick purchases."
+            },
             {
               icon: MapPin,
-              title: "Local Favourites",              description: "Supporting local breweries and distilleries from Bay of Islands region."},
+              title: "Local Favourites",              description: "Supporting local breweries and distilleries from Bay of Islands region."
+            },
             {
               icon: Leaf,
-              title: "Wellness Options",              description: "Low-alcohol and alcohol-free alternatives for mindful choices."},
+              title: "Wellness Options",              description: "Low-alcohol and alcohol-free alternatives for mindful choices."
+            },
           ]}
           animationType="slide-up"
           textboxLayout="default"
           useInvertedBackground={false}
+          cardClassName="group relative bg-gradient-to-br from-card via-background to-background-accent border border-accent/20 rounded-xl p-6 transition-all duration-500 hover:shadow-2xl hover:border-accent/50 overflow-hidden"
+          gradientClassName="bg-gradient-to-r from-primary-cta/20 via-secondary-cta/20 to-accent/20 opacity-0 group-hover:opacity-100 transition-opacity duration-500"
         />
       </div>
 
@@ -168,6 +260,7 @@ export default function LandingPage() {
           imageAlt="Ready to drink beverages display"
           mediaAnimation="blur-reveal"
           useInvertedBackground={false}
+          cardClassName="backdrop-blur-xl bg-gradient-to-br from-card/90 via-background/80 to-background-accent/70 border border-accent/30"
         />
       </div>
 
@@ -202,6 +295,7 @@ export default function LandingPage() {
           textboxLayout="default"
           useInvertedBackground={false}
           carouselMode="buttons"
+          cardClassName="backdrop-blur-lg bg-gradient-to-br from-card/80 via-background/70 to-background-accent/60 border border-accent/25 shadow-lg hover:shadow-2xl transition-all duration-500 hover:border-accent/50"
         />
       </div>
 
@@ -219,6 +313,7 @@ export default function LandingPage() {
           buttonAnimation="slide-up"
           background={{ variant: "animated-grid" }}
           useInvertedBackground={false}
+          contentClassName="backdrop-blur-xl bg-gradient-to-br from-card/90 via-background/80 to-background-accent/70 border border-accent/30 shadow-2xl"
         />
       </div>
 
@@ -229,13 +324,16 @@ export default function LandingPage() {
           socialLinks={[
             {
               icon: Phone,
-              href: "tel:0994558333",              ariaLabel: "Call us"},
+              href: "tel:0994558333",              ariaLabel: "Call us"
+            },
             {
               icon: MapPin,
-              href: "https://maps.google.com/?q=14+Marsden+Road+Paihia+0200+New+Zealand",              ariaLabel: "Get directions"},
+              href: "https://maps.google.com/?q=14+Marsden+Road+Paihia+0200+New+Zealand",              ariaLabel: "Get directions"
+            },
             {
               icon: Mail,
-              href: "mailto:info@superliquorpaihia.co.nz",              ariaLabel: "Send email"},
+              href: "mailto:info@superliquorpaihia.co.nz",              ariaLabel: "Send email"
+            },
           ]}
         />
       </div>

src/app/products/page.tsx

@@ -0,0 +1,209 @@
+"use client";
+
+import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
+import FooterCard from '@/components/sections/footer/FooterCard';
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import { Mail, MapPin, Phone } from 'lucide-react';
+import { useState, useMemo } from 'react';
+
+const CATEGORIES = [
+  "Beer",  "Craft Beer",  "Wine",  "Champagne",  "Gin",  "Vodka",  "Rum",  "Whisky",  "Tequila",  "Liqueurs",  "RTDs",  "Premixed Drinks",  "Low Alcohol",  "Mixers",  "Specials"];
+
+const SAMPLE_PRODUCTS = [
+  { id: "1", name: "Corona Extra", category: "Beer", price: "$3.99", rating: 4.5, reviewCount: "256" },
+  { id: "2", name: "Heineken Premium", category: "Beer", price: "$4.49", rating: 4.3, reviewCount: "189" },
+  { id: "3", name: "Tuatara Pale Ale", category: "Craft Beer", price: "$7.99", rating: 4.8, reviewCount: "342" },
+  { id: "4", name: "Hobbiton Brewing IPA", category: "Craft Beer", price: "$8.49", rating: 4.7, reviewCount: "218" },
+  { id: "5", name: "Marlborough Sauvignon Blanc", category: "Wine", price: "$18.99", rating: 4.6, reviewCount: "512" },
+  { id: "6", name: "Penfolds Shiraz", category: "Wine", price: "$22.99", rating: 4.5, reviewCount: "387" },
+  { id: "7", name: "Champagne Moët", category: "Champagne", price: "$54.99", rating: 4.9, reviewCount: "421" },
+  { id: "8", name: "Gordon's Gin", category: "Gin", price: "$29.99", rating: 4.4, reviewCount: "267" },
+  { id: "9", name: "Tanqueray Gin", category: "Gin", price: "$32.99", rating: 4.5, reviewCount: "198" },
+  { id: "10", name: "Vodka Smirnoff", category: "Vodka", price: "$24.99", rating: 4.2, reviewCount: "310" },
+  { id: "11", name: "Bacardi Rum", category: "Rum", price: "$28.99", rating: 4.3, reviewCount: "276" },
+  { id: "12", name: "Johnnie Walker Red", category: "Whisky", price: "$35.99", rating: 4.4, reviewCount: "445" },
+  { id: "13", name: "Jack Daniel's", category: "Whisky", price: "$42.99", rating: 4.6, reviewCount: "678" },
+  { id: "14", name: "José Cuervo Tequila", category: "Tequila", price: "$26.99", rating: 4.2, reviewCount: "156" },
+  { id: "15", name: "Kahlúa Liqueur", category: "Liqueurs", price: "$19.99", rating: 4.5, reviewCount: "203" },
+  { id: "16", name: "Baileys Irish Cream", category: "Liqueurs", price: "$22.99", rating: 4.7, reviewCount: "534" },
+  { id: "17", name: "Pre-mixed Mojito", category: "RTDs", price: "$5.99", rating: 4.1, reviewCount: "89" },
+  { id: "18", name: "Ready-made Margarita", category: "Premixed Drinks", price: "$6.49", rating: 4.2, reviewCount: "112" },
+  { id: "19", name: "Skinny Lemonade", category: "Low Alcohol", price: "$4.99", rating: 4.3, reviewCount: "145" },
+  { id: "20", name: "Fever-Tree Tonic", category: "Mixers", price: "$3.99", rating: 4.6, reviewCount: "267" },
+];
+
+export default function ProductsPage() {
+  const [selectedCategory, setSelectedCategory] = useState("All");
+  const [searchTerm, setSearchTerm] = useState("");
+
+  const filteredProducts = useMemo(() => {
+    return SAMPLE_PRODUCTS.filter(product => {
+      const matchesCategory = selectedCategory === "All" || product.category === selectedCategory;
+      const matchesSearch = product.name.toLowerCase().includes(searchTerm.toLowerCase());
+      return matchesCategory && matchesSearch;
+    });
+  }, [selectedCategory, searchTerm]);
+
+  return (
+    <ThemeProvider
+      defaultButtonVariant="elastic-effect"
+      defaultTextAnimation="background-highlight"
+      borderRadius="pill"
+      contentWidth="mediumLarge"
+      sizing="largeSmallSizeMediumTitles"
+      background="grid"
+      cardStyle="layered-gradient"
+      primaryButtonStyle="primary-glow"
+      secondaryButtonStyle="layered"
+      headingFontWeight="bold"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarLayoutFloatingInline
+          brandName="Super Liquor Paihia"
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Shop", id: "/products" },
+            { name: "Specials", id: "/#specials" },
+            { name: "Selection", id: "/#selection" },
+            { name: "Contact", id: "/#contact" },
+          ]}
+          button={{
+            text: "Call Now",            href: "tel:0994558333"
+          }}
+          animateOnLoad={true}
+        />
+      </div>
+
+      <main className="min-h-screen bg-background py-20">
+        <div className="w-full max-w-7xl mx-auto px-4 md:px-6">
+          {/* Page Header */}
+          <div className="mb-12 text-center">
+            <h1 className="text-4xl md:text-5xl font-bold text-foreground mb-3">
+              Product Catalog
+            </h1>
+            <p className="text-lg text-foreground/80">
+              Discover our complete selection of premium beverages
+            </p>
+          </div>
+
+          {/* Search Bar */}
+          <div className="mb-8">
+            <input
+              type="text"
+              placeholder="Search products..."
+              value={searchTerm}
+              onChange={(e) => setSearchTerm(e.target.value)}
+              className="w-full px-4 py-3 rounded-lg bg-card border border-accent/20 text-foreground placeholder-foreground/50 focus:outline-none focus:border-accent"
+            />
+          </div>
+
+          {/* Categories Filter */}
+          <div className="mb-12 flex flex-wrap gap-3">
+            <button
+              onClick={() => setSelectedCategory("All")}
+              className={`px-4 py-2 rounded-full font-medium transition-all ${
+                selectedCategory === "All"
+                  ? "bg-primary-cta text-background"
+                  : "bg-card text-foreground border border-accent/20 hover:border-accent"
+              }`}
+            >
+              All Categories
+            </button>
+            {CATEGORIES.map((category) => (
+              <button
+                key={category}
+                onClick={() => setSelectedCategory(category)}
+                className={`px-4 py-2 rounded-full font-medium transition-all ${
+                  selectedCategory === category
+                    ? "bg-primary-cta text-background"
+                    : "bg-card text-foreground border border-accent/20 hover:border-accent"
+                }`}
+              >
+                {category}
+              </button>
+            ))}
+          </div>
+
+          {/* Products Grid */}
+          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
+            {filteredProducts.map((product) => (
+              <div
+                key={product.id}
+                className="bg-card rounded-lg overflow-hidden border border-accent/10 hover:border-accent/30 transition-all hover:shadow-lg"
+              >
+                <div className="aspect-square bg-gradient-to-br from-accent to-background-accent flex items-center justify-center">
+                  <div className="text-center text-foreground/60">
+                    <p className="text-sm font-medium mb-1">Product Image</p>
+                    <p className="text-xs text-foreground/40">{product.category}</p>
+                  </div>
+                </div>
+                <div className="p-4">
+                  <p className="text-xs text-accent font-semibold mb-1 uppercase">
+                    {product.category}
+                  </p>
+                  <h3 className="text-lg font-semibold text-foreground mb-2 line-clamp-2">
+                    {product.name}
+                  </h3>
+                  <div className="flex items-center justify-between mb-3">
+                    <span className="text-2xl font-bold text-primary-cta">
+                      {product.price}
+                    </span>
+                    <div className="flex items-center gap-1">
+                      <span className="text-sm font-medium text-foreground">
+                        {product.rating}
+                      </span>
+                      <span className="text-sm text-foreground/60">★</span>
+                    </div>
+                  </div>
+                  <p className="text-xs text-foreground/60 mb-3">
+                    {product.reviewCount} reviews
+                  </p>
+                  <button className="w-full py-2 bg-primary-cta text-background rounded-lg font-medium hover:opacity-90 transition-opacity">
+                    View Details
+                  </button>
+                </div>
+              </div>
+            ))}
+          </div>
+
+          {/* No Results */}
+          {filteredProducts.length === 0 && (
+            <div className="text-center py-12">
+              <p className="text-lg text-foreground/60">
+                No products found matching your search.
+              </p>
+            </div>
+          )}
+
+          {/* Results Count */}
+          <div className="mt-8 text-center text-foreground/60">
+            <p className="text-sm">
+              Showing {filteredProducts.length} of {SAMPLE_PRODUCTS.length} products
+            </p>
+          </div>
+        </div>
+      </main>
+
+      <div id="footer" data-section="footer">
+        <FooterCard
+          logoText="Super Liquor Paihia"
+          copyrightText="© 2025 Super Liquor Paihia | 14 Marsden Road, Paihia 0200 | Ph: 09 945 8333"
+          socialLinks={[
+            {
+              icon: Phone,
+              href: "tel:0994558333",              ariaLabel: "Call us"
+            },
+            {
+              icon: MapPin,
+              href: "https://maps.google.com/?q=14+Marsden+Road+Paihia+0200+New+Zealand",              ariaLabel: "Get directions"
+            },
+            {
+              icon: Mail,
+              href: "mailto:info@superliquorpaihia.co.nz",              ariaLabel: "Send email"
+            },
+          ]}
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/specials/page.tsx

@@ -0,0 +1,186 @@
+"use client";
+
+import { useState } from 'react';
+import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
+import ProductCardThree from '@/components/sections/product/ProductCardThree';
+import ContactCTA from '@/components/sections/contact/ContactCTA';
+import FooterCard from '@/components/sections/footer/FooterCard';
+import ProductCart from '@/components/ecommerce/cart/ProductCart';
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import { Mail, MapPin, Phone, ShoppingCart, Zap } from 'lucide-react';
+
+interface CartItem {
+  id: string;
+  name: string;
+  price: string;
+  quantity: number;
+  imageSrc: string;
+  imageAlt?: string;
+}
+
+export default function SpecialsPage() {
+  const [cartOpen, setCartOpen] = useState(false);
+  const [cartItems, setCartItems] = useState<CartItem[]>([]);
+
+  const handleAddToCart = (product: { id: string; name: string; price: string; imageSrc: string; imageAlt?: string }, quantity: number) => {
+    const existingItem = cartItems.find(item => item.id === product.id);
+    if (existingItem) {
+      setCartItems(cartItems.map(item => 
+        item.id === product.id 
+          ? { ...item, quantity: item.quantity + quantity }
+          : item
+      ));
+    } else {
+      setCartItems([...cartItems, { ...product, quantity }]);
+    }
+  };
+
+  const handleQuantityChange = (id: string, quantity: number) => {
+    if (quantity > 0) {
+      setCartItems(cartItems.map(item => 
+        item.id === id ? { ...item, quantity } : item
+      ));
+    }
+  };
+
+  const handleRemoveItem = (id: string) => {
+    setCartItems(cartItems.filter(item => item.id !== id));
+  };
+
+  const total = cartItems.reduce((sum, item) => {
+    const price = parseFloat(item.price.replace('$', '').replace(/,/g, ''));
+    return sum + (price * item.quantity);
+  }, 0).toFixed(2);
+
+  return (
+    <ThemeProvider
+      defaultButtonVariant="elastic-effect"
+      defaultTextAnimation="background-highlight"
+      borderRadius="pill"
+      contentWidth="mediumLarge"
+      sizing="largeSmallSizeMediumTitles"
+      background="grid"
+      cardStyle="layered-gradient"
+      primaryButtonStyle="primary-glow"
+      secondaryButtonStyle="layered"
+      headingFontWeight="bold"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarLayoutFloatingInline
+          brandName="Super Liquor Paihia"
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Specials", id: "/specials" },
+            { name: "Selection", id: "selection" },
+            { name: "Contact", id: "contact" },
+          ]}
+          button={{
+            text: "Call Now",            href: "tel:0994558333"
+          }}
+          animateOnLoad={true}
+        />
+      </div>
+
+      <div id="specials" data-section="specials">
+        <ProductCardThree
+          title="Weekly Specials & Deals"
+          description="Explore our latest promotions and exclusive in-store offers. Add items to cart and checkout with ease."
+          tag="Limited Time Offers"
+          tagIcon={Zap}
+          tagAnimation="slide-up"
+          products={[
+            {
+              id: "1",              name: "Craft Beer Pack - 6 Pack",              price: "$23.99",              imageSrc: "http://img.b2bpic.net/free-photo/top-view-beer-bottles-with-chips_23-2148673798.jpg?_wi=2",              imageAlt: "Craft beer 6-pack special",              onProductClick: () => console.log('Beer pack clicked'),
+              onQuantityChange: (qty) => handleAddToCart({ id: "1", name: "Craft Beer Pack - 6 Pack", price: "$23.99", imageSrc: "http://img.b2bpic.net/free-photo/top-view-beer-bottles-with-chips_23-2148673798.jpg?_wi=3", imageAlt: "Craft beer 6-pack special" }, qty),
+              initialQuantity: 1
+            },
+            {
+              id: "2",              name: "Premium Red Wine Selection",              price: "$34.99",              imageSrc: "http://img.b2bpic.net/free-photo/tray-with-wine-bottle-stoppers-beside_23-2148414202.jpg?_wi=2",              imageAlt: "Premium wine promotion",              onProductClick: () => console.log('Wine clicked'),
+              onQuantityChange: (qty) => handleAddToCart({ id: "2", name: "Premium Red Wine Selection", price: "$34.99", imageSrc: "http://img.b2bpic.net/free-photo/tray-with-wine-bottle-stoppers-beside_23-2148414202.jpg?_wi=3", imageAlt: "Premium wine promotion" }, qty),
+              initialQuantity: 1
+            },
+            {
+              id: "3",              name: "Whisky Collection Bundle",              price: "$89.99",              imageSrc: "http://img.b2bpic.net/free-photo/front-view-tasty-american-beer-assortment_23-2148907595.jpg?_wi=2",              imageAlt: "Whisky bundle special",              onProductClick: () => console.log('Whisky clicked'),
+              onQuantityChange: (qty) => handleAddToCart({ id: "3", name: "Whisky Collection Bundle", price: "$89.99", imageSrc: "http://img.b2bpic.net/free-photo/front-view-tasty-american-beer-assortment_23-2148907595.jpg?_wi=3", imageAlt: "Whisky bundle special" }, qty),
+              initialQuantity: 1
+            },
+            {
+              id: "4",              name: "Vodka Premium Brands",              price: "$44.99",              imageSrc: "http://img.b2bpic.net/free-photo/top-view-beer-bottles-with-chips_23-2148673798.jpg?_wi=4",              imageAlt: "Premium vodka selection",              onProductClick: () => console.log('Vodka clicked'),
+              onQuantityChange: (qty) => handleAddToCart({ id: "4", name: "Vodka Premium Brands", price: "$44.99", imageSrc: "http://img.b2bpic.net/free-photo/top-view-beer-bottles-with-chips_23-2148673798.jpg?_wi=5", imageAlt: "Premium vodka selection" }, qty),
+              initialQuantity: 1
+            },
+            {
+              id: "5",              name: "Local Brewery Selection",              price: "$28.99",              imageSrc: "http://img.b2bpic.net/free-photo/tray-with-wine-bottle-stoppers-beside_23-2148414202.jpg?_wi=4",              imageAlt: "Local brewery pack",              onProductClick: () => console.log('Local brewery clicked'),
+              onQuantityChange: (qty) => handleAddToCart({ id: "5", name: "Local Brewery Selection", price: "$28.99", imageSrc: "http://img.b2bpic.net/free-photo/tray-with-wine-bottle-stoppers-beside_23-2148414202.jpg?_wi=5", imageAlt: "Local brewery pack" }, qty),
+              initialQuantity: 1
+            },
+            {
+              id: "6",              name: "Gin & Tonic Bundle",              price: "$52.99",              imageSrc: "http://img.b2bpic.net/free-photo/front-view-tasty-american-beer-assortment_23-2148907595.jpg?_wi=4",              imageAlt: "Gin and tonic bundle",              onProductClick: () => console.log('Gin bundle clicked'),
+              onQuantityChange: (qty) => handleAddToCart({ id: "6", name: "Gin & Tonic Bundle", price: "$52.99", imageSrc: "http://img.b2bpic.net/free-photo/front-view-tasty-american-beer-assortment_23-2148907595.jpg?_wi=5", imageAlt: "Gin and tonic bundle" }, qty),
+              initialQuantity: 1
+            },
+          ]}
+          gridVariant="three-columns-all-equal-width"
+          animationType="slide-up"
+          textboxLayout="default"
+          useInvertedBackground={false}
+          buttons={[
+            { text: "View Cart", onClick: () => setCartOpen(true) },
+          ]}
+        />
+      </div>
+
+      <ProductCart
+        isOpen={cartOpen}
+        onClose={() => setCartOpen(false)}
+        items={cartItems}
+        onQuantityChange={handleQuantityChange}
+        onRemove={handleRemoveItem}
+        total={`$${total}`}
+        buttons={[
+          { text: "Checkout", onClick: () => { setCartOpen(false); alert('Checkout functionality coming soon!'); } },
+          { text: "Continue Shopping", onClick: () => setCartOpen(false) }
+        ]}
+        title="Shopping Cart"
+      />
+
+      <div id="contact" data-section="contact">
+        <ContactCTA
+          tag="Ready to Order?"
+          tagIcon={Phone}
+          tagAnimation="slide-up"
+          title="Call to Complete Your Order"
+          description="For immediate assistance with your purchase or to place a custom order, call us directly. Our team is ready to help you get exactly what you need."
+          buttons={[
+            { text: "Call 09 945 8333", href: "tel:0994558333" },
+            { text: "Get Directions", href: "https://maps.google.com/?q=14+Marsden+Road+Paihia+0200+New+Zealand" },
+          ]}
+          buttonAnimation="slide-up"
+          background={{ variant: "animated-grid" }}
+          useInvertedBackground={false}
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterCard
+          logoText="Super Liquor Paihia"
+          copyrightText="© 2025 Super Liquor Paihia | 14 Marsden Road, Paihia 0200 | Ph: 09 945 8333"
+          socialLinks={[
+            {
+              icon: Phone,
+              href: "tel:0994558333",              ariaLabel: "Call us"
+            },
+            {
+              icon: MapPin,
+              href: "https://maps.google.com/?q=14+Marsden+Road+Paihia+0200+New+Zealand",              ariaLabel: "Get directions"
+            },
+            {
+              icon: Mail,
+              href: "mailto:info@superliquorpaihia.co.nz",              ariaLabel: "Send email"
+            },
+          ]}
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #f7f6f7;
+  --background: #0a0a0a;
-  --card: #ffffff;
+  --card: #1a1a1a;
-  --foreground: #1b0c25;
+  --foreground: #f0f0f0;
-  --primary-cta: #1b0c25;
+  --primary-cta: #d4af37;
   --primary-cta-text: #f7f6f7;
-  --secondary-cta: #ffffff;
+  --secondary-cta: #8b7355;
   --secondary-cta-text: #1b0c25;
-  --accent: #ff93e4;
+  --accent: #d4af37;
-  --background-accent: #e8a8c3;
+  --background-accent: #2a2a2a;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);