Bob AI: add something with like phones

Merge version_4 into main

src/app/page.tsx

@@ -9,6 +9,8 @@ import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
 import ContactText from '@/components/sections/contact/ContactText';
 import FooterBase from '@/components/sections/footer/FooterBase';
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
+import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
 
 export default function LandingPage() {
   return (
@@ -167,6 +169,59 @@ export default function LandingPage() {
         />
       </div>
 
+      <div id="feature" data-section="feature">
+        <FeatureCardOne
+          features={[
+            {
+              title: "Fresh Ingredients",
+              description: "We source the freshest ingredients from local farmers to ensure every dish is bursting with flavor.",
+              imageSrc: "https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80",
+            },
+            {
+              title: "Crafted Cuisine",
+              description: "Our chefs are passionate about crafting each dish with care, using traditional techniques and modern flavors.",
+              imageSrc: "https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80",
+            },
+            {
+              title: "Warm Ambiance",
+              description: "Experience the cozy and inviting atmosphere of Buona Tavola, perfect for any occasion.",
+              imageSrc: "https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80",
+            },
+            {
+              title: "Dine in Style",
+              description: "Our elegant dining room offers a sophisticated setting for a memorable meal with friends and family.",
+              imageSrc: "https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80",
+            },
+          ]}
+          carouselMode="buttons"
+          gridVariant="three"
+          animationType="slide"
+          title="Why Choose Buona Tavola?"
+          description="Discover the reasons behind our reputation for excellence in dining."
+          textboxLayout="left"
+          useInvertedBackground="none"
+        />
+      </div>
+
+      <div id="contact" data-section="contact">
+        <ContactSplitForm
+            title="Get in Touch"
+            description="We'd love to hear from you! Whether you have questions about our menu, reservations, or just want to say hello, feel free to reach out."
+            inputs={[
+                { name: "name", type: "text", placeholder: "Your Name", required: true },
+                { name: "email", type: "email", placeholder: "Your Email", required: true },
+                { name: "phone", type: "tel", placeholder: "Your Phone Number", required: true }
+            ]}
+            textarea={{ name: "message", placeholder: "Your Message", rows: 4, required: true }}
+            useInvertedBackground="noInvert"
+            imageSrc="https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80"
+            imageAlt="Buona Tavola Restaurant Interior"
+            mediaPosition="left"
+            buttonText="Send Message"
+            ariaLabel="Contact Buona Tavola"
+        />
+      </div>
+
       <div id="footer" data-section="footer">
         <FooterBase
           logoText="Buona Tavola"

src/app/styles/variables.css

@@ -3,20 +3,20 @@
   /* --vw is set by ThemeProvider */
 
   /* --background: #f5f5f5;;
-  --card: #e0f7fa;;
+  --card: #f3e5f5;;
-  --foreground: #004d40;;
+  --foreground: #4a148c;;
-  --primary-cta: #006064;;
+  --primary-cta: #7b1fa2;;
   --secondary-cta: #ffffff;;
-  --accent: #0288d1;;
+  --accent: #ffc107;;
-  --background-accent: #b2ebf2;; */
+  --background-accent: #ffe0b2;; */
 
-  --background: #bbdefb;;
+  --background: #fce4ec;;
-  --card: #e0f7fa;;
+  --card: #f3e5f5;;
-  --foreground: #004d40;;
+  --foreground: #4a148c;;
-  --primary-cta: #006064;;
+  --primary-cta: #7b1fa2;;
   --secondary-cta: #ffffff;;
-  --accent: #0288d1;;
+  --accent: #ffc107;;
-  --background-accent: #b2ebf2;;
+  --background-accent: #ffe0b2;;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);