Update src/app/page.tsx

Merge version_1 into main

src/app/page.tsx

@@ -9,6 +9,7 @@ import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
 import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
 import ProductCardThree from '@/components/sections/product/ProductCardThree';
 import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
+import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
 import TextAbout from '@/components/sections/about/TextAbout';
 
 export default function LandingPage() {
@@ -31,7 +32,7 @@ export default function LandingPage() {
       navItems={[
         { name: "Ritual", id: "hero" },
         { name: "Craft", id: "experience" },
-        { name: "Menu", id: "products" },
+        { name: "About", id: "about" },
         { name: "Location", id: "contact" },
       ]}
       brandName="WOLFØX MADRID"
@@ -63,6 +64,16 @@ export default function LandingPage() {
     />
   </div>
 
+  <div id="about" data-section="about">
+      <TextSplitAbout
+      useInvertedBackground={true}
+      title="About WOLFØX"
+      description={[
+        "Founded in the heart of Madrid, WOLFØX is more than a café; it's a sanctuary for coffee purists.",        "Our beans are meticulously sourced and roasted in small batches to honor the craft.",        "Whether you're starting your morning ritual or seeking a quiet respite, we invite you to experience the difference of intentional coffee."
+      ]}
+    />
+  </div>
+
   <div id="products" data-section="products">
       <ProductCardThree
       textboxLayout="split"
@@ -133,6 +144,7 @@ export default function LandingPage() {
         {
           title: "Navigation",          items: [
             { label: "Ritual", href: "#hero" },
+            { label: "About", href: "#about" },
             { label: "Location", href: "#contact" }
           ]
         },