Merge version_3 into main

Merge version_3 into main

src/app/layout.tsx

@@ -1407,4 +1407,4 @@ export default function RootLayout({
       </ServiceWrapper>
     </html>
   );
-}
+}

src/app/page.tsx

@@ -6,9 +6,19 @@ import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
 import ProductCardOne from '@/components/sections/product/ProductCardOne';
 import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
 import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
-import { Smartphone, UtensilsCrossed, Zap } from "lucide-react";
+import { Smartphone, UtensilsCrossed, Zap, Bell, FileText } from "lucide-react";
 
 export default function LandingPage() {
+  const handleServerCall = () => {
+    alert("Server call notification sent to restaurant tablet!");
+    console.log("Server call notification sent");
+  };
+
+  const handleBillingRequest = () => {
+    alert("Billing request notification sent to restaurant tablet!");
+    console.log("Billing request notification sent");
+  };
+
   return (
     <ThemeProvider
       defaultButtonVariant="expand-hover"
@@ -26,7 +36,7 @@ export default function LandingPage() {
         <NavbarStyleFullscreen
           navItems={[
             { name: "Menu", id: "menu" },
-            { name: "About", id: "about" },
+            { name: "Features", id: "features" },
             { name: "Contact", id: "contact" }
           ]}
           brandName="Digital Menu"
@@ -99,15 +109,15 @@ export default function LandingPage() {
           tagAnimation="slide-up"
           features={[
             {
-              id: "1",              title: "Browse & Order",              author: "Menu",              description: "Explore our full menu with high-quality photography, detailed ingredient lists, and allergen information. Order directly from your table.",              tags: ["Menu", "Ordering", "Food"],
+              id: "1",              title: "Browse & Order in 30 Seconds",              author: "Menu",              description: "Explore our full menu with high-quality photography, detailed ingredient lists, and allergen information. Order directly from your table.",              tags: ["Menu", "Ordering", "Food"],
               imageSrc: "http://img.b2bpic.net/free-photo/grilled-chicken-breast-with-potato-greens-spices-sauces-side-view_141793-3740.jpg?_wi=2",              imageAlt: "Menu browsing interface"
             },
             {
-              id: "2",              title: "Request Your Bill",              author: "Billing",              description: "Request your bill instantly with a single tap. Our staff receives the notification immediately and brings your check promptly.",              tags: ["Billing", "Payment", "Service"],
+              id: "2",              title: "Get Your Check in 2 Minutes",              author: "Billing",              description: "Request your bill instantly with a single tap. Our staff receives the notification immediately on our tablet system and brings your check promptly. No waiting, no signal needed.",              tags: ["Billing", "Payment", "Service"],
               imageSrc: "http://img.b2bpic.net/free-photo/smiling-barista-using-digital-tablet-while-working-bar_637285-3367.jpg",              imageAlt: "Billing request interface"
             },
             {
-              id: "3",              title: "Call a Server",              author: "Service",              description: "Need assistance? Tap to call a staff member. Server notifications arrive instantly on our tablet system for immediate response.",              tags: ["Service", "Support", "Staff"],
+              id: "3",              title: "Call a Server in Seconds",              author: "Service",              description: "Need assistance? Tap to call a staff member. Server notifications arrive instantly on our tablet system for immediate response to any requests or questions.",              tags: ["Service", "Support", "Staff"],
               imageSrc: "http://img.b2bpic.net/free-photo/closeup-waiter-taking-order-touchpad-while-talking-guest-pub_637285-2460.jpg",              imageAlt: "Server call interface"
             }
           ]}
@@ -117,6 +127,56 @@ export default function LandingPage() {
         />
       </div>
 
+      <div id="contact" data-section="contact">
+        <div className="w-full py-20 px-6 md:px-10 bg-gradient-to-br from-background via-card to-background">
+          <div className="max-w-4xl mx-auto">
+            <div className="grid grid-cols-1 md:grid-cols-2 gap-8">
+              <div className="flex flex-col justify-center space-y-6">
+                <div>
+                  <h2 className="text-4xl md:text-5xl font-bold mb-4 text-foreground">Need Assistance?</h2>
+                  <p className="text-lg text-foreground/70">Use these quick action buttons to communicate with our restaurant staff instantly through our tablet notification system.</p>
+                </div>
+                <div className="space-y-4">
+                  <button
+                    onClick={handleServerCall}
+                    className="w-full flex items-center justify-center gap-3 px-6 py-4 bg-primary-cta text-primary-cta-text rounded-full font-semibold hover:shadow-lg transition-all duration-300 text-lg"
+                  >
+                    <Bell className="w-6 h-6" />
+                    Call a Server
+                  </button>
+                  <button
+                    onClick={handleBillingRequest}
+                    className="w-full flex items-center justify-center gap-3 px-6 py-4 bg-secondary-cta text-secondary-cta-text rounded-full font-semibold hover:shadow-lg transition-all duration-300 text-lg border-2 border-primary-cta"
+                  >
+                    <FileText className="w-6 h-6" />
+                    Request Billing
+                  </button>
+                </div>
+              </div>
+              <div className="flex flex-col justify-center space-y-6">
+                <div className="bg-card rounded-2xl p-8 space-y-4">
+                  <h3 className="text-2xl font-bold text-foreground">How It Works</h3>
+                  <ul className="space-y-3 text-foreground/70">
+                    <li className="flex gap-3">
+                      <span className="text-primary-cta font-bold">1.</span>
+                      <span>Tap "Call a Server" and a notification appears instantly on our tablet at the host stand.</span>
+                    </li>
+                    <li className="flex gap-3">
+                      <span className="text-primary-cta font-bold">2.</span>
+                      <span>Our staff receives your request immediately and responds within seconds.</span>
+                    </li>
+                    <li className="flex gap-3">
+                      <span className="text-primary-cta font-bold">3.</span>
+                      <span>Tap "Request Billing" when ready to pay, and your check arrives promptly.</span>
+                    </li>
+                  </ul>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
       <div id="footer" data-section="footer">
         <FooterLogoEmphasis
           logoText="Digital Menu"
@@ -130,7 +190,7 @@ export default function LandingPage() {
             {
               items: [
                 { label: "About Us", href: "#" },
-                { label: "Contact", href: "#" }
+                { label: "Contact", href: "#contact" }
               ]
             },
             {
@@ -144,4 +204,4 @@ export default function LandingPage() {
       </div>
     </ThemeProvider>
   );
-}
+}