diff --git a/src/app/page.tsx b/src/app/page.tsx
index f02acf0..55ec42d 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -21,7 +21,7 @@ export default function LandingPage() {
       borderRadius="rounded"
       contentWidth="mediumLarge"
       sizing="large"
-      background="floatingGradient"
+      background="circleGradient"
       cardStyle="solid"
       primaryButtonStyle="radial-glow"
       secondaryButtonStyle="layered"
@@ -47,7 +47,7 @@ export default function LandingPage() {
         <HeroSplitKpi
           title="Travel the World with Confidence"
           description="Visa processing, air tickets, and luxury tours handled by professionals who deliver fast responses, expert guidance, and successful travel experiences. From UK visas to Schengen documentation, we handle your travel paperwork with precision."
-          background={{ variant: "floatingGradient" }}
+          background={{ variant: "glowing-orb" }}
           kpis={[
             { value: "15+", label: "Years Travel Expertise" },
             { value: "98%", label: "Visa Approval Rate" },
@@ -84,6 +84,7 @@ export default function LandingPage() {
           imageSrc="http://img.b2bpic.net/free-photo/business-professionals-using-analytics-reports-papers-review-progress_482257-122889.jpg"
           imageAlt="Travel agency expertise and professional team"
           mediaAnimation="blur-reveal"
+          metricsAnimation="slide-up"
         />
       </div>
 
diff --git a/src/components/shared/SvgTextLogo/SvgTextLogo.tsx b/src/components/shared/SvgTextLogo/SvgTextLogo.tsx
index f214190..91dab49 100644
--- a/src/components/shared/SvgTextLogo/SvgTextLogo.tsx
+++ b/src/components/shared/SvgTextLogo/SvgTextLogo.tsx
@@ -1,51 +1,49 @@
-"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;
+  size?: number;
+  fill?: string;
+  fontFamily?: string;
+  fontSize?: number;
+  fontWeight?: number | string;
+  letterSpacing?: number;
   className?: string;
 }
 
-const SvgTextLogo = memo<SvgTextLogoProps>(function SvgTextLogo({
-  logoText,
-  adjustHeightFactor,
-  verticalAlign = "top",
-  className = "",
-}) {
-  const { svgRef, textRef, viewBox, aspectRatio } = useSvgTextLogo(logoText, false, adjustHeightFactor);
-
+export const SvgTextLogo: React.FC<SvgTextLogoProps> = ({
+  text,
+  size = 200,
+  fill = 'currentColor',
+  fontFamily = 'system-ui, -apple-system, sans-serif',
+  fontSize = 24,
+  fontWeight = 700,
+  letterSpacing = 0,
+  className = '',
+}) => {
   return (
     <svg
-      ref={svgRef}
-      viewBox={viewBox}
-      className={cls("w-full", className)}
-      style={{ aspectRatio: aspectRatio }}
-      preserveAspectRatio="none"
-      role="img"
-      aria-label={`${logoText} logo`}
+      width={size}
+      height={size}
+      viewBox={`0 0 ${size} ${size}`}
+      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={size / 2}
+        y={size / 2}
+        textAnchor="middle"
+        dominantBaseline="middle"
+        fill={fill}
+        fontFamily={fontFamily}
+        fontSize={fontSize}
+        fontWeight={fontWeight}
+        letterSpacing={letterSpacing}
       >
-        {logoText}
+        {text}
       </text>
     </svg>
   );
-});
-
-SvgTextLogo.displayName = "SvgTextLogo";
+};
 
 export default SvgTextLogo;