diff --git a/src/app/page.tsx b/src/app/page.tsx
index bfdb9d1..283cb90 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -20,7 +20,7 @@ export default function LandingPage() {
       borderRadius="pill"
       contentWidth="medium"
       sizing="mediumLarge"
-      background="noise"
+      background="circleGradient"
       cardStyle="outline"
       primaryButtonStyle="radial-glow"
       secondaryButtonStyle="glass"
@@ -43,14 +43,14 @@ export default function LandingPage() {
         <HeroLogoBillboardSplit
           logoText="OL' TIME BARBER"
           description="Classic cuts. Skilled barbers. A welcoming shop where everyone leaves looking sharp."
-          background={{ variant: "noise" }}
+          background={{ variant: "plain" }}
           buttons={[
             { text: "Book Appointment", href: "#contact" },
             { text: "Call (770) 648-4805", href: "tel:(770) 648-4805" }
           ]}
           buttonAnimation="slide-up"
           layoutOrder="default"
-          imageSrc="http://img.b2bpic.net/free-photo/full-shot-man-getting-haircut_23-2149141753.jpg?_wi=1"
+          imageSrc="http://img.b2bpic.net/free-photo/full-shot-man-getting-haircut_23-2149141753.jpg"
           imageAlt="Ol' Time Barber Shop interior with vintage barbershop chairs"
           mediaAnimation="slide-up"
           frameStyle="card"
@@ -83,7 +83,7 @@ export default function LandingPage() {
           tagIcon={Scissors}
           features={[
             {
-              title: "Traditional Barber Cuts",              description: "Classic, timeless haircuts tailored to your style",              imageSrc: "http://img.b2bpic.net/free-photo/instruments-hairdresser-black-towel_23-2148181901.jpg?_wi=1",              imageAlt: "Professional barber precision haircut",              buttonIcon: ArrowRight
+              title: "Traditional Barber Cuts",              description: "Classic, timeless haircuts tailored to your style",              imageSrc: "http://img.b2bpic.net/free-photo/instruments-hairdresser-black-towel_23-2148181901.jpg",              imageAlt: "Professional barber precision haircut",              buttonIcon: ArrowRight
             },
             {
               title: "Precision Beard Trims",              description: "Expert beard grooming and shaping services",              imageSrc: "http://img.b2bpic.net/free-photo/barber-preparing-shaving-senior-client_23-2148181888.jpg",              imageAlt: "Professional beard trimming service",              buttonIcon: ArrowRight
@@ -92,13 +92,13 @@ export default function LandingPage() {
               title: "Kids Haircuts",              description: "Family-friendly service with expert care for young clients",              imageSrc: "http://img.b2bpic.net/free-photo/young-school-boy-is-getting-trendy-hairstyle-from-expirienced-hairdresser-modern-barbershop_613910-21401.jpg",              imageAlt: "Professional children's haircut service",              buttonIcon: ArrowRight
             },
             {
-              title: "Line Ups & Fades",              description: "Sharp, clean detailing for a polished look",              imageSrc: "http://img.b2bpic.net/free-photo/instruments-hairdresser-black-towel_23-2148181901.jpg?_wi=2",              imageAlt: "Professional fade haircut technique",              buttonIcon: ArrowRight
+              title: "Line Ups & Fades",              description: "Sharp, clean detailing for a polished look",              imageSrc: "http://img.b2bpic.net/free-photo/instruments-hairdresser-black-towel_23-2148181901.jpg",              imageAlt: "Professional fade haircut technique",              buttonIcon: ArrowRight
             },
             {
-              title: "Hair Styling",              description: "Complete styling services for any occasion",              imageSrc: "http://img.b2bpic.net/free-photo/instruments-hairdresser-black-towel_23-2148181901.jpg?_wi=3",              imageAlt: "Professional hair styling service",              buttonIcon: ArrowRight
+              title: "Hair Styling",              description: "Complete styling services for any occasion",              imageSrc: "http://img.b2bpic.net/free-photo/instruments-hairdresser-black-towel_23-2148181901.jpg",              imageAlt: "Professional hair styling service",              buttonIcon: ArrowRight
             },
             {
-              title: "Walk-Ins Welcome",              description: "No appointment needed, just walk in anytime",              imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-getting-haircut_23-2149141753.jpg?_wi=2",              imageAlt: "Welcoming barbershop interior",              buttonIcon: ArrowRight
+              title: "Walk-Ins Welcome",              description: "No appointment needed, just walk in anytime",              imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-getting-haircut_23-2149141753.jpg",              imageAlt: "Welcoming barbershop interior",              buttonIcon: ArrowRight
             }
           ]}
           textboxLayout="default"
@@ -244,4 +244,4 @@ export default function LandingPage() {
       </div>
     </ThemeProvider>
   );
-}
\ No newline at end of file
+}
diff --git a/src/components/shared/SvgTextLogo/SvgTextLogo.tsx b/src/components/shared/SvgTextLogo/SvgTextLogo.tsx
index f214190..af1ad86 100644
--- a/src/components/shared/SvgTextLogo/SvgTextLogo.tsx
+++ b/src/components/shared/SvgTextLogo/SvgTextLogo.tsx
@@ -1,51 +1,48 @@
-"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;
+  textClassName?: string;
+  containerClassName?: 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 = '',
+  textClassName = '',
+  containerClassName = ''
+}) => {
   return (
-    <svg
-      ref={svgRef}
-      viewBox={viewBox}
-      className={cls("w-full", className)}
-      style={{ aspectRatio: aspectRatio }}
-      preserveAspectRatio="none"
-      role="img"
-      aria-label={`${logoText} logo`}
-    >
-      <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"
-        }}
+    <div className={`flex items-center justify-center ${containerClassName}`}>
+      <svg
+        viewBox="0 0 800 200"
+        className={`w-full h-auto ${className}`}
+        preserveAspectRatio="xMidYMid meet"
       >
-        {logoText}
-      </text>
-    </svg>
+        <defs>
+          <linearGradient id="textGradient" x1="0%" y1="0%" x2="100%" y2="100%">
+            <stop offset="0%" stopColor="#ff6b6b" />
+            <stop offset="50%" stopColor="#4ecdc4" />
+            <stop offset="100%" stopColor="#ffe66d" />
+          </linearGradient>
+        </defs>
+        <text
+          x="50%"
+          y="50%"
+          textAnchor="middle"
+          dominantBaseline="middle"
+          className={textClassName}
+          fill="url(#textGradient)"
+          fontSize="120"
+          fontWeight="bold"
+          letterSpacing="2"
+        >
+          {text}
+        </text>
+      </svg>
+    </div>
   );
-});
-
-SvgTextLogo.displayName = "SvgTextLogo";
+};
 
 export default SvgTextLogo;