From c1943f209e1112a03c373117e680999b0790e4e6 Mon Sep 17 00:00:00 2001
From: Zach Hawtof <zhawtof@gmail.com>
Date: Tue, 19 May 2026 18:29:35 -0400
Subject: [PATCH] Hero: tighten height so repo grid peeks above the fold

The hero was claiming the entire viewport on common desktop sizes,
leaving nothing else visible until scroll. Combined "TOOLS FOR" onto
one line, shrank the headline scale (9vw / 7.5rem max), loosened
leading from 0.85 to 0.92 so the stacked-3d shadow on SLACK clears
"+ AGENTS." at the smaller size, and trimmed section padding and
inter-block margins.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 src/components/Hero.astro | 15 +++++++--------
 1 file changed, 7 insertions(+), 8 deletions(-)

diff --git a/src/components/Hero.astro b/src/components/Hero.astro
index 50e27a7..a2b8f39 100644
--- a/src/components/Hero.astro
+++ b/src/components/Hero.astro
@@ -43,7 +43,7 @@ const QUICK_START_CMD = 'npx degit tightknitai/slack-hono-template my-slack-app'
     </div>
   </div>
 
-  <div class="relative mx-auto max-w-7xl px-6 pt-16 pb-20 lg:px-10 lg:pt-24 lg:pb-28">
+  <div class="relative mx-auto max-w-7xl px-6 pt-10 pb-12 lg:px-10 lg:pt-14 lg:pb-16">
     {
       showSlackDevDay && (
         <div class="mb-5">
@@ -71,7 +71,7 @@ const QUICK_START_CMD = 'npx degit tightknitai/slack-hono-template my-slack-app'
       )
     }
 
-    <div class="mb-8 inline-flex items-center gap-3">
+    <div class="mb-5 inline-flex items-center gap-3">
       <span class="bg-pink inline-block h-2.5 w-2.5 animate-pulse"></span>
       <span class="text-ink/70 font-mono text-[12px] tracking-[0.18em] uppercase">
         for teams building on slack · open source
@@ -79,15 +79,14 @@ const QUICK_START_CMD = 'npx degit tightknitai/slack-hono-template my-slack-app'
     </div>
 
     <h1
-      class="font-display mb-2 text-[clamp(3.5rem,12vw,10rem)] leading-[0.85] font-bold tracking-[-0.04em]"
+      class="font-display mb-2 text-[clamp(2.75rem,9vw,7.5rem)] leading-[0.92] font-bold tracking-[-0.04em]"
     >
-      <span class="block">TOOLS</span>
-      <span class="block">FOR</span>
+      <span class="block">TOOLS FOR</span>
       <span class="stacked-3d block">SLACK</span>
       <span class="block">+ AGENTS.</span>
     </h1>
 
-    <p class="text-ink/85 mt-10 max-w-2xl text-lg leading-snug font-medium lg:text-xl">
+    <p class="text-ink/85 mt-6 max-w-2xl text-lg leading-snug font-medium lg:text-xl">
       Open source libraries, agents, and developer tools shipped by
       <a
         href="https://tightknit.ai"
@@ -98,7 +97,7 @@ const QUICK_START_CMD = 'npx degit tightknitai/slack-hono-template my-slack-app'
       >. Built in TypeScript. Made to be forked.
     </p>
 
-    <div class="mt-10 flex flex-wrap items-center gap-4">
+    <div class="mt-6 flex flex-wrap items-center gap-4">
       <a href="#repos" class="brutal-btn">
         <span>browse repos</span>
         <span aria-hidden="true">↓</span>
@@ -114,7 +113,7 @@ const QUICK_START_CMD = 'npx degit tightknitai/slack-hono-template my-slack-app'
       </a>
     </div>
 
-    <div class="mt-10 max-w-2xl">
+    <div class="mt-6 max-w-2xl">
       <div class="text-ink/60 mb-2 font-mono text-[11px] tracking-[0.18em] uppercase">
         // ship a slack app in 60 seconds
       </div>