diff --git a/client/src/components/Layout.scss b/client/src/components/Layout.scss
index 52aaa63..851a84f 100644
--- a/client/src/components/Layout.scss
+++ b/client/src/components/Layout.scss
@@ -19,24 +19,13 @@
   &__logo {
     display: inline-flex;
     align-items: center;
-    gap: 0.65rem;
     font-weight: 600;
     letter-spacing: -0.02em;
     font-size: 1.05rem;
   }
 
-  &__logo-img {
-    width: 36px;
-    height: 36px;
-    object-fit: contain;
-    flex-shrink: 0;
-    background: transparent;
-  }
-
   &__logo-text {
-    @media (max-width: 420px) {
-      // logo mark is enough on very small screens
-    }
+    color: var(--text);
   }
 
   &__mark {
@@ -156,8 +145,7 @@
       width: 40px;
       height: 40px;
       object-fit: contain;
-      border-radius: 8px;
-      background: #000;
+      background: transparent;
       flex-shrink: 0;
     }
   }
diff --git a/client/src/components/Layout.tsx b/client/src/components/Layout.tsx
index a67750c..fe3b4b4 100644
--- a/client/src/components/Layout.tsx
+++ b/client/src/components/Layout.tsx
@@ -36,14 +36,7 @@ export function Layout() {
       <header className="site-header">
         <div className="container site-header__inner">
           <Link to="/" className="site-header__logo" aria-label={`${name} home`}>
-            <img
-              src="/logo.png"
-              alt={name}
-              className="site-header__logo-img"
-              width={36}
-              height={36}
-              decoding="async"
-            />
+            <span className="site-header__logo-text">jmartgraphix</span>
           </Link>
           <button
             className="site-header__burger"