Merge version_1 into main

Merge version_1 into main

src/app/page.tsx

@@ -10,7 +10,7 @@ import TestimonialCardFifteen from '@/components/sections/testimonial/Testimonia
 import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
 import ContactCTA from '@/components/sections/contact/ContactCTA';
 import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
-import { Award, Home, Leaf, MapPin, Music, Star, TreePine, Users } from 'lucide-react';
+import { Award, Home, Leaf, MapPin, Music, Star, TreePine, Users, Coffee } from 'lucide-react';
 
 export default function LandingPage() {
   return (
@@ -71,7 +71,7 @@ export default function LandingPage() {
       <div id="experience" data-section="experience">
         <MetricSplitMediaAbout
           tag="Our Story"
-          tagIcon={Leaf}
+          tagIcon={Coffee}
           tagAnimation="slide-up"
           title="Where Coffee Meets Nature"
           description="The Magnolia Café offers a peaceful escape from the city's rush. Surrounded by lush greenery and artistic interiors, it is a place where friends gather, conversations flow, and every cup of coffee feels special. Our commitment to quality, warm ambience, and exceptional food makes us the perfect destination for both relaxed moments and memorable gatherings."
@@ -82,6 +82,7 @@ export default function LandingPage() {
           imageSrc="http://img.b2bpic.net/free-photo/portrait-happy-woman-cafe-with-phone-juice_1303-9909.jpg"
           imageAlt="The Magnolia beautiful outdoor garden seating"
           mediaAnimation="blur-reveal"
+          metricsAnimation="slide-up"
           useInvertedBackground={false}
         />
       </div>

src/components/shared/SvgTextLogo/SvgTextLogo.tsx

@@ -1,51 +1,30 @@
-"use client";
-
-import { memo } from "react";
-import useSvgTextLogo from "./useSvgTextLogo";
-import { cls } from "@/lib/utils";
+import React from 'react';
 
 interface SvgTextLogoProps {
-  logoText: string;
-  adjustHeightFactor?: number;
-  verticalAlign?: "top" | "center";
+  text: string;
   className?: string;
 }
 
-const SvgTextLogo = memo<SvgTextLogoProps>(function SvgTextLogo({
-  logoText,
-  adjustHeightFactor,
-  verticalAlign = "top",
-  className = "",
-}) {
-  const { svgRef, textRef, viewBox, aspectRatio } = useSvgTextLogo(logoText, false, adjustHeightFactor);
-
+const SvgTextLogo: React.FC<SvgTextLogoProps> = ({ text, className = '' }) => {
   return (
     <svg
-      ref={svgRef}
-      viewBox={viewBox}
-      className={cls("w-full", className)}
-      style={{ aspectRatio: aspectRatio }}
-      preserveAspectRatio="none"
-      role="img"
-      aria-label={`${logoText} logo`}
+      viewBox="0 0 300 100"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
     >
       <text
-        ref={textRef}
-        x="0"
-        y={verticalAlign === "center" ? "50%" : "0"}
-        className="font-bold fill-current"
-        style={{
-          fontSize: "20px",
-          letterSpacing: "-0.02em",
-          dominantBaseline: verticalAlign === "center" ? "middle" : "text-before-edge"
-        }}
+        x="50%"
+        y="50%"
+        textAnchor="middle"
+        dominantBaseline="central"
+        fontSize="48"
+        fontWeight="bold"
+        fill="currentColor"
       >
-        {logoText}
+        {text}
       </text>
     </svg>
   );
-});
+};
 
-SvgTextLogo.displayName = "SvgTextLogo";
-
-export default SvgTextLogo;
+export default SvgTextLogo;