From 393022d1fdebd318d6c16102a2ce3fd3f25f87f2 Mon Sep 17 00:00:00 2001
From: Himanshu Gupta <thinktank.himanshu@gmail.com>
Date: Sun, 23 Aug 2026 02:32:07 +0530
Subject: [PATCH 1/2] feat(web): polish homepage wordmark

---
 web/app/_directions/craft-nav.tsx |  3 --
 web/app/_directions/craft.tsx     | 12 +++++--
 web/app/craft.css                 | 54 ++++++++++++++++++-------------
 3 files changed, 41 insertions(+), 28 deletions(-)

diff --git a/web/app/_directions/craft-nav.tsx b/web/app/_directions/craft-nav.tsx
index 8308e1a..bf49662 100644
--- a/web/app/_directions/craft-nav.tsx
+++ b/web/app/_directions/craft-nav.tsx
@@ -34,9 +34,6 @@ export function CraftNav() {
             width='36'
             height='36'
           />
-          <span className='craft-nav-wordmark'>
-            video2<span>ctx</span>
-          </span>
         </a>
 
         <nav
diff --git a/web/app/_directions/craft.tsx b/web/app/_directions/craft.tsx
index 076f869..7478f4c 100644
--- a/web/app/_directions/craft.tsx
+++ b/web/app/_directions/craft.tsx
@@ -124,7 +124,14 @@ export function CraftDirection() {
           </span>
         </a>
         <h1>
-          <span className='craft-hero-brand'>video2ctx</span>
+          <span className='craft-hero-brand' aria-label='video2ctx'>
+            <span className='craft-hero-brand-video' aria-hidden='true'>
+              video2
+            </span>
+            <span className='craft-hero-brand-ctx' aria-hidden='true'>
+              ctx
+            </span>
+          </span>
           <span className='craft-hero-claim'>
             Video in.{' '}
             <FlickeringPixelText className='craft-context-word'>
@@ -135,8 +142,7 @@ export function CraftDirection() {
         </h1>
         <p className='craft-sub'>
           Everything your agent needs to understand videos.
-          <br />
-          100% open source.
+          <span className='craft-open-source'>100% open source.</span>
         </p>
         <CraftDemo />
       </section>
diff --git a/web/app/craft.css b/web/app/craft.css
index 416a2b6..10cd985 100644
--- a/web/app/craft.css
+++ b/web/app/craft.css
@@ -75,18 +75,19 @@ html:has(.craft) body {
 
 .craft-nav-inner {
   min-height: 3.25rem;
-  padding: var(--space-2xs) var(--space-2xs) var(--space-2xs) var(--space-md);
+  padding: var(--space-2xs) var(--space-2xs) var(--space-2xs) var(--space-xs);
   border: 1px solid var(--rule);
   border-radius: var(--radius-home-pill);
   background: color-mix(in oklch, var(--paper-raised) 82%, transparent);
   backdrop-filter: blur(0.75rem);
   display: grid;
-  grid-template-columns: auto minmax(0, 1fr) auto;
+  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
   align-items: center;
   gap: clamp(var(--space-md), 3vw, var(--space-2xl));
 }
 
 .craft-nav-brand {
+  justify-self: start;
   color: var(--ink);
   display: inline-flex;
   align-items: center;
@@ -99,20 +100,6 @@ html:has(.craft) body {
   display: block;
 }
 
-.craft-nav-wordmark {
-  font-size: 0.9rem;
-  font-weight: 670;
-  letter-spacing: -0.035em;
-}
-
-.craft-nav-wordmark > span {
-  margin-left: 0.08em;
-  font-family: var(--font-home-pixel);
-  font-size: 1.04em;
-  font-weight: 500;
-  letter-spacing: 0;
-}
-
 .craft-nav-links {
   display: flex;
   align-items: center;
@@ -146,6 +133,7 @@ html:has(.craft) body {
 }
 
 .craft-nav-actions {
+  justify-self: end;
   display: flex;
   align-items: center;
   gap: var(--space-xs);
@@ -592,14 +580,24 @@ html:has(.craft) body {
 }
 
 .craft-hero-brand {
-  margin-bottom: var(--space-md);
-  display: block;
-  color: var(--accent);
+  width: fit-content;
+  margin: 0 auto clamp(var(--space-lg), 3vh, var(--space-xl));
+  display: flex;
+  align-items: baseline;
+  color: var(--ink);
+  font-family: var(--font-home-body);
+  font-size: clamp(1.15rem, 2.2vw, 1.45rem);
+  font-weight: 670;
+  letter-spacing: -0.04em;
+  line-height: 1;
+}
+
+.craft-hero-brand-ctx {
+  margin-left: 0.08em;
   font-family: var(--font-home-pixel);
-  font-size: clamp(0.78rem, 1.6vw, 0.95rem);
+  font-size: 1.04em;
   font-weight: 500;
-  letter-spacing: 0.045em;
-  line-height: 1;
+  letter-spacing: 0;
 }
 
 .craft-hero-claim {
@@ -644,6 +642,18 @@ html:has(.craft) body {
   text-wrap: balance;
 }
 
+.craft-open-source {
+  margin-top: var(--space-xs);
+  color: var(--ink-muted);
+  display: block;
+  font-family: var(--font-home-mono);
+  font-size: 0.72rem;
+  font-weight: 540;
+  font-variant-numeric: tabular-nums;
+  letter-spacing: 0.01em;
+  line-height: 1.35;
+}
+
 /* ------------------------------------------------------------------ form */
 
 .craft-demo {

From fb753fb1dcd3e8e794406cd1e1d1bb18df141dbc Mon Sep 17 00:00:00 2001
From: Himanshu Gupta <thinktank.himanshu@gmail.com>
Date: Sun, 23 Aug 2026 02:34:26 +0530
Subject: [PATCH 2/2] chore: refine homepage copy and ignores

---
 .gitignore                    | 1 +
 web/app/_directions/craft.tsx | 2 +-
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/.gitignore b/.gitignore
index 04d85e1..2ff48e2 100644
--- a/.gitignore
+++ b/.gitignore
@@ -7,6 +7,7 @@ dist/
 *.cpuprofile
 *.tgz
 .DS_Store
+.claude/
 .env*
 !.env.example
 .dev.vars*
diff --git a/web/app/_directions/craft.tsx b/web/app/_directions/craft.tsx
index 7478f4c..2921df1 100644
--- a/web/app/_directions/craft.tsx
+++ b/web/app/_directions/craft.tsx
@@ -142,7 +142,7 @@ export function CraftDirection() {
         </h1>
         <p className='craft-sub'>
           Everything your agent needs to understand videos.
-          <span className='craft-open-source'>100% open source.</span>
+          <span className='craft-open-source'>100% open source</span>
         </p>
         <CraftDemo />
       </section>