diff --git a/components/layout/footer/footer.tsx b/components/layout/footer/footer.tsx
index eed58c6d1..d20e96d72 100644
--- a/components/layout/footer/footer.tsx
+++ b/components/layout/footer/footer.tsx
@@ -2,6 +2,7 @@
 
 import Logo from 'components/ui/logo/logo';
 import { useTranslations } from 'next-intl';
+import Link from 'next/link';
 
 const Footer = () => {
   const currentYear = new Date().getFullYear();
@@ -10,14 +11,12 @@ const Footer = () => {
 
   return (
     <footer className="border-t border-ui-border bg-app">
-      <div className="mx-auto w-full py-2 px-4 lg:py-3 lg:px-8 2xl:px-16">
-        <div className="flex w-full justify-between items-baseline my-12 transition-colors duration-150">
-          <div className="">
-            <a className="flex flex-initial items-center font-bold md:mr-24" href="/">
-              <Logo />
-            </a>
-          </div>
-          <p>
+      <div className="mx-auto w-full py-4 px-4 lg:py-6 lg:px-8 2xl:px-16 2xl:py-8">
+        <div className="flex flex-col w-full space-y-2 items-center transition-colors duration-150 md:flex-row md:items-baseline md:justify-between md:space-y-0">
+          <Link className="flex flex-initial items-center font-bold md:mr-24" href="/">
+            <Logo />
+          </Link>
+          <p className="text-sm text-low-contrast">
             &copy; {copyrightDate} Kodamera - {t('copyright')}
           </p>
         </div>
diff --git a/components/modules/hero/hero.tsx b/components/modules/hero/hero.tsx
index a91c8f3dc..c7d84eda2 100644
--- a/components/modules/hero/hero.tsx
+++ b/components/modules/hero/hero.tsx
@@ -1,5 +1,3 @@
-'use client'
-
 import dynamic from 'next/dynamic'
 
 const SanityImage = dynamic(() => import('components/ui/sanity-image'))
diff --git a/components/ui/logo/logo.tsx b/components/ui/logo/logo.tsx
index 7af1f5f7d..601c90740 100644
--- a/components/ui/logo/logo.tsx
+++ b/components/ui/logo/logo.tsx
@@ -1,21 +1,24 @@
-const Logo = ({ className = 'w-auto h-8', ...props }) => (
-  <div className="flex items-center space-x-4">
-    <svg
-      xmlns="http://www.w3.org/2000/svg"
-      viewBox="0 0 109 80"
-      className={className}
-      {...props}
-    >
-      <path
-        fill="currentColor"
-        d="M54.6,0C32.8,0,15.1,17.9,15.1,40c0,10.6,4.3,18.1,4.6,18.8h20.6c-0.7-0.5-9.1-6.9-9.1-18.8  c0-13.1,10.5-23.7,23.4-23.7S78,26.9,78,40S67.5,63.7,54.6,63.7H0V80h54.6c21.8,0,39.5-17.9,39.5-40S76.5,0,54.6,0z"
-      />
-      <path
-        fill="currentColor"
-        d="M109,63.7V80H75.3c7.2-3.7,13.2-9.4,17.4-16.3H109z"
-      />
-    </svg>
-  </div>
-)
+const Logo = ({ className = 'w-auto h-8', ...props }) => {  
+  return (
+    <div className="flex items-center space-x-4">
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox="0 0 109 80"
+        className={className}
+        {...props}
+      >
+        <path
+          fill="currentColor"
+          d="M54.6,0C32.8,0,15.1,17.9,15.1,40c0,10.6,4.3,18.1,4.6,18.8h20.6c-0.7-0.5-9.1-6.9-9.1-18.8  c0-13.1,10.5-23.7,23.4-23.7S78,26.9,78,40S67.5,63.7,54.6,63.7H0V80h54.6c21.8,0,39.5-17.9,39.5-40S76.5,0,54.6,0z"
+        />
+        <path
+          fill="currentColor"
+          d="M109,63.7V80H75.3c7.2-3.7,13.2-9.4,17.4-16.3H109z"
+        />
+      </svg>
+      <span className="sr-only">KM Storefront</span>
+    </div>
+  )
+}
 
 export default Logo