diff --git a/apps/web/package.json b/apps/web/package.json
index 9b7dabd..0cd71e5 100644
--- a/apps/web/package.json
+++ b/apps/web/package.json
@@ -15,6 +15,7 @@
     "@astrojs/rss": "^4.0.18",
     "@astrojs/svelte": "^8.0.4",
     "@civic-source/types": "workspace:*",
+    "@fontsource/public-sans": "^5.2.7",
     "@octokit/rest": "^22.0.1",
     "@tailwindcss/typography": "^0.5.19",
     "@tailwindcss/vite": "^4.2.2",
diff --git a/apps/web/src/layouts/BaseLayout.astro b/apps/web/src/layouts/BaseLayout.astro
index 1b02698..1ab16f9 100644
--- a/apps/web/src/layouts/BaseLayout.astro
+++ b/apps/web/src/layouts/BaseLayout.astro
@@ -1,5 +1,8 @@
 ---
 import '../styles/global.css';
+import '@fontsource/public-sans/400.css';
+import '@fontsource/public-sans/500.css';
+import '@fontsource/public-sans/600.css';
 import ThemeToggle from '../components/ThemeToggle.svelte';
 import SearchBar from '../components/SearchBar.svelte';
 import BackToTop from '../components/BackToTop.svelte';
diff --git a/apps/web/src/pages/index.astro b/apps/web/src/pages/index.astro
index 06f565b..9c33b40 100644
--- a/apps/web/src/pages/index.astro
+++ b/apps/web/src/pages/index.astro
@@ -79,32 +79,41 @@ const base = import.meta.env.BASE_URL;
   title="Home"
   description="Track changes to the United States Code with Git-based version control and diff history."
 >
-  <h1 class="text-navy dark:text-amber">US Code Tracker</h1>
-
-  <p>
-    US Code Tracker converts each release of the United States Code into a Git
-    repository, making it possible to view the precise text that changed between
-    any two releases of federal law.
-  </p>
+  <!-- Hero -->
+  <section class="not-prose py-10 text-center">
+    <p class="mb-3 text-xs font-medium uppercase tracking-widest text-slate dark:text-gray-500">Independent civic tech project</p>
+    <h1 class="mb-4 text-5xl font-semibold tracking-tight text-navy dark:text-amber md:text-6xl" style="letter-spacing: -0.03em; line-height: 1.1">US Code Tracker</h1>
+    <p class="mx-auto mb-8 max-w-md text-lg text-slate dark:text-gray-300">
+      Every change to federal law, tracked through Git.
+    </p>
+    <div class="flex flex-wrap justify-center gap-3">
+      <a href={`${base}browse/`} class="rounded-lg bg-navy px-6 py-2.5 text-sm font-medium text-white transition-colors hover:bg-navy-dark dark:bg-teal dark:hover:bg-teal/80">
+        Browse all titles
+      </a>
+      <a href="#how-it-works" class="rounded-lg border border-gray-300 px-6 py-2.5 text-sm font-medium text-slate transition-colors hover:border-navy hover:text-navy dark:border-gray-700 dark:text-gray-300 dark:hover:border-teal dark:hover:text-teal">
+        How it works
+      </a>
+    </div>
+  </section>
 
-  <!-- Quick stats -->
-  <div class="not-prose my-6 flex flex-wrap gap-4">
-    <div class="rounded-lg border border-teal/30 bg-teal/5 px-5 py-3 text-center font-sans">
-      <p class="text-2xl font-bold text-teal">{titleCount}</p>
-      <p class="mt-0.5 text-xs text-slate dark:text-gray-400">Titles</p>
+  <!-- Stats -->
+  <div class="not-prose flex flex-wrap justify-center gap-8 font-sans">
+    <div class="text-center">
+      <p class="text-3xl font-semibold text-navy dark:text-teal" style="font-variant-numeric: tabular-nums">{titleCount}</p>
+      <p class="mt-1 text-sm text-slate dark:text-gray-400">Titles</p>
     </div>
-    <div class="rounded-lg border border-teal/30 bg-teal/5 px-5 py-3 text-center font-sans">
-      <p class="text-2xl font-bold text-teal">{sectionCount.toLocaleString()}</p>
-      <p class="mt-0.5 text-xs text-slate dark:text-gray-400">Sections</p>
+    <div class="text-center">
+      <p class="text-3xl font-semibold text-navy dark:text-teal" style="font-variant-numeric: tabular-nums">{sectionCount.toLocaleString()}</p>
+      <p class="mt-1 text-sm text-slate dark:text-gray-400">Sections</p>
     </div>
-    <div class="rounded-lg border border-teal/30 bg-teal/5 px-5 py-3 text-center font-sans">
-      <p class="text-2xl font-bold text-teal">PL 119-73</p>
-      <p class="mt-0.5 text-xs text-slate dark:text-gray-400">Current through</p>
+    <div class="text-center">
+      <p class="text-3xl font-semibold text-navy dark:text-teal">PL 119-73</p>
+      <p class="mt-1 text-sm text-slate dark:text-gray-400">Current through</p>
     </div>
     {releasePointCount > 0 && (
-      <div class="rounded-lg border border-amber/30 bg-amber/5 px-5 py-3 text-center font-sans">
-        <p class="text-2xl font-bold text-amber">{releasePointCount}</p>
-        <p class="mt-0.5 text-xs text-slate dark:text-gray-400">Historical versions</p>
+      <div class="text-center">
+        <p class="text-3xl font-semibold text-amber" style="font-variant-numeric: tabular-nums">{releasePointCount}</p>
+        <p class="mt-1 text-sm text-slate dark:text-gray-400">Historical versions</p>
       </div>
     )}
   </div>
@@ -112,7 +121,12 @@ const base = import.meta.env.BASE_URL;
     Data syncs weekly from the Office of the Law Revision Counsel.
   </p>
 
-  <h2>What this project does</h2>
+  <p class="not-prose mb-4 text-sm leading-relaxed text-slate dark:text-gray-400 font-sans">
+    US Code Tracker converts each release of the United States Code into a Git
+    repository, making it possible to view the precise text that changed between
+    any two releases of federal law.
+  </p>
+  <h2 id="how-it-works">What this project does</h2>
   <ul class="not-prose my-4 space-y-2 font-sans text-sm text-gray-700 dark:text-gray-300">
     <li class="flex items-start gap-2">
       <span class="mt-0.5 text-teal" aria-hidden="true">&#x2193;</span>
diff --git a/apps/web/src/styles/global.css b/apps/web/src/styles/global.css
index 63965af..7a94a11 100644
--- a/apps/web/src/styles/global.css
+++ b/apps/web/src/styles/global.css
@@ -5,7 +5,7 @@
 
 @theme {
   --font-serif: "Georgia", "Times New Roman", serif;
-  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
+  --font-sans: "Public Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
   /* USWDS-influenced civic palette */
   --color-navy: #1A4480;
   --color-navy-dark: #112F4E;
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 5ca99f5..4be66a7 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -56,6 +56,9 @@ importers:
       '@civic-source/types':
         specifier: workspace:*
         version: link:../../packages/types
+      '@fontsource/public-sans':
+        specifier: ^5.2.7
+        version: 5.2.7
       '@octokit/rest':
         specifier: ^22.0.1
         version: 22.0.1
@@ -608,6 +611,9 @@ packages:
     resolution: {integrity: sha512-iH1B076HoAshH1mLpHMgwdGeTs0CYwL0SPMkGuSebZrwBp16v415e9NZXg2jtrqPVQjf6IANe2Vtlr5KswtcZQ==}
     engines: {node: ^20.19.0 || ^22.13.0 || >=24}
 
+  '@fontsource/public-sans@5.2.7':
+    resolution: {integrity: sha512-pVttDr3HvhVIt2x6sZJfZKksNEpq23C1JCHTQwT9KWJdmFRdNeRM8gQftq8uP72sPW+p3Ku9x8HPk2E392DFvg==}
+
   '@humanfs/core@0.19.1':
     resolution: {integrity: sha512-5DyQ4+1JEUzejeK1JGICcideyfUbGixgS9jNgex5nqkW+cY7WZhxBigmieN5Qnw9ZosSNVC9KQKyb+GUaGyKUA==}
     engines: {node: '>=18.18.0'}
@@ -3502,6 +3508,8 @@ snapshots:
       '@eslint/core': 1.1.1
       levn: 0.4.1
 
+  '@fontsource/public-sans@5.2.7': {}
+
   '@humanfs/core@0.19.1': {}
 
   '@humanfs/node@0.16.7':