site: move the landing page to the cloud module (#37)

The landing page sells BearDrive Cloud, so it now lives in the private cloud module (web/landing, served by the hub at / for signed-out visitors) instead of this repo. A self-hosted hub should never serve "Start free" CTAs pointing at our managed service, and marketing for the paid product doesn't belong in the AGPL tree. Rebuilt there as an Astro site on the webapp's own design tokens, so the landing and the app stop drifting apart visually. Doc pointers updated to the new location. Claude-Session: https://claude.ai/code/session_01RA5pQH92cxk5SfiYJeTUjK Co-authored-by: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-08-25 08:08:08 +02:00 · 2026-07-19 16:58:45 -07:00
parent d835c18e6b
commit 19da7dc890
8 changed files with 7 additions and 805 deletions
@@ -60,7 +60,8 @@ writers whose activity is attributed and measured.
 1. `README.md` — the repo front door: first-90-seconds test (what is it,
   who is it for, why now, time-to-first-wow), positioning line, badges,
   quickstart friction, screenshot/demo presence.
-2. `website/` — the landing page: headline/subhead, category claim, CTA
+2. `cloud/web/landing/` — the landing page (cloud-only; served by the hub at
+   its root for signed-out visitors): headline/subhead, category claim, CTA
   hierarchy (self-host vs cloud), social proof, pricing posture.
 3. `plugin/` — the Claude Code plugin + skill: as a distribution channel
   (marketplace install → team onboarding loop → does a teammate's first
@@ -51,9 +51,9 @@ Draft copy is ready to paste; adjust voice as you like.
   - T1: `bdrive share wiki/findings.md` → open the public URL.
   Tools: `vhs` (charmbracelet) or QuickTime + gifski. Put the result at
   `docs/assets/demo.gif` and add it above the fold in README.
-9. **Verify beardrive.ai serves the updated landing page** (the repo's
-   `website/` — including the new `assets/insights.png`) after the next
-   deploy.
+9. **Verify beardrive.ai serves the updated landing page** (now
+   `cloud/web/landing/`, served by the hub itself at `/` for signed-out
+   visitors) after the next deploy.

 ## P2 — when you're ready to be seen (launch window)

@@ -10,7 +10,8 @@ agent never scores its own work.
 Everything GTM-relevant that lives in this repo:

 - `README.md` (positioning, quickstart, time-to-wow, demo assets plan)
- `website/` (headline, category claim, CTAs, pricing posture copy)
+- `cloud/web/landing/` (headline, category claim, CTAs, pricing posture copy —
+  cloud-only, served by the hub at its root for signed-out visitors)
 - `docs/` (self-host guide, quickstart, a launch plan, a metrics plan)
 - Community surface: `CONTRIBUTING.md`, `.github/` issue/PR templates,
  `CHANGELOG.md` or release-notes convention, a public `ROADMAP.md`
@@ -1,641 +0,0 @@
-<!doctype html>
-<html lang="en">
-<head>
-<meta charset="utf-8">
-<meta name="viewport" content="width=device-width, initial-scale=1">
-<title>BearDrive — Google Drive for AI agents</title>
-<meta name="description" content="Google Drive for AI agents: one synced folder for your whole team. Share any file as a public URL; give every agent the same memory, so your agent knows what their agent knows. Managed cloud, or self-host the open-source hub in one binary.">
-<meta property="og:title" content="BearDrive — Google Drive for AI agents">
-<meta property="og:description" content="One synced folder for humans and agents: files become public URLs for people, and shared memory for every teammate's agent. Open source, self-host in one binary.">
-<meta property="og:type" content="website">
-<meta property="og:image" content="https://raw.githubusercontent.com/runbear-io/beardrive/main/website/assets/insights.png">
-<meta property="og:image:width" content="2720">
-<meta property="og:image:height" content="1700">
-<meta name="twitter:card" content="summary_large_image">
-<meta property="og:url" content="https://beardrive.ai">
-<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>&#128059;</text></svg>">
-<style>
-:root {
-  --bg: #121212;
-  --panel: #171717;
-  --card: #1c1c1c;
-  --border: #2e2e2e;
-  --border-strong: #404040;
-  --text: #fafafa;
-  --text-dim: #a0a0a0;
-  --text-faint: #707070;
-  --brand: #f5a623;
-  --brand-deep: #6b4a00;
-  --brand-dark: #c9871a;
-  --mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
-}
-* { box-sizing: border-box; }
-html { scroll-behavior: smooth; }
-body {
-  margin: 0;
-  background: var(--bg);
-  color: var(--text);
-  font: 15.5px/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
-  -webkit-font-smoothing: antialiased;
-}
-a { color: var(--brand); text-decoration: none; }
-.wrap { max-width: 1120px; margin: 0 auto; padding: 0 24px; }
-
-/* ---- buttons ---- */
-.btn {
-  display: inline-flex; align-items: center; gap: 7px;
-  padding: 8px 16px; border-radius: 6px;
-  background: var(--brand); color: #1a1200 !important;
-  font-weight: 600; font-size: 14px; line-height: 1.4;
-  border: 1px solid transparent; cursor: pointer; font-family: inherit;
-  transition: background .15s;
-}
-.btn:hover { background: #ffb955; }
-.btn.ghost {
-  background: var(--card); color: var(--text) !important;
-  border: 1px solid var(--border-strong);
-}
-.btn.ghost:hover { background: #242424; border-color: #555; }
-
-/* ---- nav ---- */
-nav {
-  position: sticky; top: 0; z-index: 20;
-  background: color-mix(in srgb, var(--bg) 85%, transparent);
-  backdrop-filter: blur(12px);
-  border-bottom: 1px solid var(--border);
-}
-nav .wrap { display: flex; align-items: center; gap: 30px; height: 60px; }
-.logo { font-weight: 700; font-size: 16px; color: var(--text); display: flex; align-items: center; gap: 8px; }
-nav .links { display: flex; gap: 24px; margin-left: auto; align-items: center; font-size: 14px; }
-nav .links > a { color: var(--text-dim); }
-nav .links > a:hover { color: var(--text); }
-
-/* ---- hero ---- */
-.hero { padding: 96px 0 40px; text-align: center; position: relative; overflow: hidden; }
-.hero::before { /* faint green glow behind the hero, supabase-style */
-  content: ""; position: absolute; inset: auto 0 0 0; height: 480px; top: 0;
-  background: radial-gradient(600px 280px at 50% 0%, rgba(245,166,35,.10), transparent 70%);
-  pointer-events: none;
-}
-.pill {
-  display: inline-flex; align-items: center; gap: 8px;
-  font-size: 13px; color: var(--text-dim);
-  border: 1px solid var(--border); border-radius: 99px;
-  padding: 5px 14px 5px 8px; margin-bottom: 28px;
-  background: var(--panel);
-}
-.pill .dot {
-  background: rgba(245,166,35,.15); color: var(--brand);
-  font-size: 11.5px; font-weight: 650; padding: 2px 9px; border-radius: 99px;
-}
-h1 {
-  font-size: clamp(38px, 5.6vw, 64px);
-  line-height: 1.06; letter-spacing: -.025em;
-  margin: 0 0 24px; font-weight: 700;
-}
-h1 .green {
-  display: block;
-  background: linear-gradient(90deg, #f5a623 30%, #ffd27d);
-  -webkit-background-clip: text; background-clip: text; color: transparent;
-}
-.hero .sub {
-  font-size: 17.5px; color: var(--text-dim);
-  max-width: 40em; margin: 0 auto 34px;
-}
-.hero .sub b { color: var(--text); font-weight: 550; }
-.cta-row { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; align-items: center; }
-.install {
-  display: flex; align-items: center; gap: 10px;
-  font: 13px/1 var(--mono);
-  background: var(--panel); border: 1px solid var(--border);
-  border-radius: 6px; padding: 10px 14px; color: var(--text-dim);
-  cursor: pointer; margin-top: 0;
-}
-.install:hover { border-color: var(--border-strong); color: var(--text); }
-.install .dollar { color: var(--brand); user-select: none; }
-.install .copied { color: var(--brand); }
-
-/* ---- terminal ---- */
-.term-wrap { padding: 44px 0 26px; position: relative; }
-.term {
-  max-width: 780px; margin: 0 auto;
-  background: #101010; border: 1px solid var(--border); border-radius: 10px;
-  box-shadow: 0 0 0 1px rgba(245,166,35,.05), 0 30px 80px rgba(0,0,0,.6);
-  overflow: hidden; text-align: left;
-}
-.term-bar {
-  display: flex; align-items: center; gap: 7px; padding: 11px 14px;
-  border-bottom: 1px solid #222;
-}
-.term-bar i { width: 10px; height: 10px; border-radius: 50%; background: #323232; }
-.term-bar span { margin-left: 10px; font: 11.5px var(--mono); color: var(--text-faint); }
-.term pre {
-  margin: 0; padding: 20px 22px 24px;
-  font: 13px/1.8 var(--mono);
-  color: #d0d0d0; white-space: pre-wrap; word-break: break-all;
-  min-height: 296px;
-}
-.term .p { color: var(--brand); }
-.term .ok { color: var(--brand); }
-.term .dim { color: var(--text-faint); }
-.term .url { color: #6fbfff; text-decoration: underline; }
-.term .cursor { display: inline-block; width: 8px; height: 15px; background: #d0d0d0; vertical-align: -2px; animation: blink 1.1s steps(1) infinite; }
-@keyframes blink { 50% { opacity: 0; } }
-
-/* ---- storage strip ---- */
-.strip { padding: 34px 0 64px; text-align: center; }
-.strip p { font-size: 13px; color: var(--text-faint); margin: 0 0 18px; }
-.strip .names {
-  display: flex; gap: 14px 34px; justify-content: center; flex-wrap: wrap;
-  font: 14px var(--mono); color: var(--text-dim);
-}
-.strip .names span { opacity: .85; }
-
-/* ---- sections ---- */
-section { padding: 84px 0; border-top: 1px solid var(--border); }
-.kicker {
-  font: 600 12.5px var(--mono); letter-spacing: .06em;
-  color: var(--brand); margin: 0 0 14px;
-}
-h2 { font-size: clamp(26px, 3.2vw, 34px); margin: 0 0 12px; letter-spacing: -.02em; line-height: 1.2; font-weight: 650; }
-.lede { font-size: 16.5px; color: var(--text-dim); max-width: 44em; margin: 0 0 44px; }
-.lede b { color: var(--text); font-weight: 550; }
-
-/* bento cards */
-.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px; }
-.card {
-  background: var(--panel); border: 1px solid var(--border); border-radius: 10px;
-  padding: 22px 22px 20px;
-  transition: border-color .15s, background .15s;
-}
-.card:hover { border-color: #3a3a3a; background: #191919; }
-.card .ico {
-  width: 38px; height: 38px; border-radius: 8px;
-  display: flex; align-items: center; justify-content: center;
-  background: var(--card); border: 1px solid var(--border);
-  font-size: 17px; margin-bottom: 16px;
-}
-.card p { margin: 0; font-size: 14px; color: var(--text-dim); }
-.card p b { color: var(--text); font-weight: 600; }
-.card p code, .arch-note code, .oss-card li code {
-  font: 12px var(--mono); background: var(--card);
-  border: 1px solid var(--border); border-radius: 4px; padding: 1.5px 5px;
-  color: var(--text-dim);
-}
-.card.wide { grid-column: 1 / -1; }
-
-/* steps row */
-.stepnum {
-  font: 600 12px var(--mono); color: var(--brand);
-  margin-bottom: 12px; display: block;
-}
-
-/* architecture strip */
-.arch {
-  margin-top: 16px; padding: 24px 26px 20px;
-  background: #101010; border: 1px solid var(--border); border-radius: 10px;
-  font: 12.5px/1.9 var(--mono); color: var(--text-dim);
-  overflow-x: auto; white-space: pre;
-}
-.arch b { color: var(--text); font-weight: 600; }
-.arch .a { color: var(--brand); }
-
-/* claude section */
-.claude { display: flex; gap: 52px; align-items: flex-start; flex-wrap: wrap; }
-.claude .copy { flex: 1 1 380px; }
-.claude .demo { flex: 1 1 400px; min-width: 0; }
-.chat {
-  background: var(--panel); border: 1px solid var(--border); border-radius: 10px;
-  padding: 22px; font-size: 14px;
-}
-.chat .msg { margin-bottom: 16px; }
-.chat .msg:last-child { margin-bottom: 0; }
-.chat .who { font: 600 11px var(--mono); letter-spacing: .05em; text-transform: uppercase; color: var(--text-faint); margin-bottom: 5px; }
-.chat .msg.claude .who { color: var(--brand); }
-.chat .bubble { color: var(--text-dim); }
-.chat .bubble code { font: 12px var(--mono); background: var(--card); border: 1px solid var(--border); border-radius: 4px; padding: 1.5px 5px; }
-.chat .bubble .url { color: #6fbfff; }
-.claude ul { padding-left: 0; list-style: none; color: var(--text-dim); font-size: 14.5px; margin: 22px 0 26px; }
-.claude ul li { margin-bottom: 14px; padding-left: 24px; position: relative; }
-.claude ul li::before { content: "✓"; position: absolute; left: 0; color: var(--brand); font-weight: 600; }
-.claude ul b { color: var(--text); font-weight: 600; }
-
-/* auto-share reply mock */
-.autoshare { text-align: center; }
-.autoshare .lede { margin-left: auto; margin-right: auto; }
-.reply {
-  max-width: 660px; margin: 6px auto 0; text-align: left;
-  background: #101010; border: 1px solid var(--border); border-radius: 10px;
-  box-shadow: 0 0 0 1px rgba(245,166,35,.05), 0 24px 64px rgba(0,0,0,.55);
-  overflow: hidden;
-}
-.reply-line {
-  padding: 24px 26px; font: 15px/1.7 var(--mono); color: var(--text);
-  display: flex; gap: 13px; align-items: baseline;
-}
-.reply-dot { color: var(--brand); font-size: 11px; line-height: 1.7; }
-.reply-path { color: #6fbfff; word-break: break-all; }
-.reply-link {
-  color: var(--brand); text-decoration: none; cursor: pointer;
-  padding: 1px 4px; border-radius: 5px; transition: background .15s;
-}
-.reply-link:hover { background: rgba(245,166,35,.16); }
-.reply-cap {
-  border-top: 1px solid #1e1e1e; background: #0c0c0c;
-  padding: 13px 26px; font: 12.5px/1.6 var(--mono); color: var(--text-faint);
-}
-.reply-cap code {
-  font: 11.5px var(--mono); background: var(--card);
-  border: 1px solid var(--border); border-radius: 4px; padding: 1px 5px; color: var(--text-dim);
-}
-
-/* open source / cloud */
-.oss { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 16px; }
-.oss-card {
-  background: var(--panel); border: 1px solid var(--border); border-radius: 10px;
-  padding: 28px 26px;
-}
-.oss-card.cloud {
-  border-color: var(--brand-deep);
-  background: linear-gradient(180deg, rgba(245,166,35,.07), var(--panel) 60%);
-}
-.oss-card h3 { margin: 0 0 4px; font-size: 19px; letter-spacing: -.01em; }
-.oss-card .tag { font: 12px var(--mono); color: var(--text-faint); margin-bottom: 20px; }
-.oss-card ul { list-style: none; padding: 0; margin: 0 0 26px; }
-.oss-card li { padding: 6px 0 6px 24px; font-size: 14px; color: var(--text-dim); position: relative; }
-.oss-card li::before { content: "✓"; position: absolute; left: 0; color: var(--brand); font-weight: 600; }
-/* closing CTA */
-.closer { text-align: center; padding: 96px 0; }
-.closer h2 { font-size: clamp(28px, 4vw, 44px); margin-bottom: 10px; }
-.closer h2 .green {
-  background: linear-gradient(90deg, #f5a623 30%, #ffd27d);
-  -webkit-background-clip: text; background-clip: text; color: transparent;
-}
-.closer p { color: var(--text-dim); margin: 0 0 30px; }
-
-/* footer */
-footer { border-top: 1px solid var(--border); padding: 36px 0 52px; font-size: 13.5px; color: var(--text-faint); }
-footer .wrap { display: flex; gap: 24px; flex-wrap: wrap; align-items: center; }
-footer .links { margin-left: auto; display: flex; gap: 22px; }
-footer a { color: var(--text-dim); }
-footer a:hover { color: var(--text); }
-
-@media (max-width: 720px) {
-  .hero { padding: 60px 0 24px; }
-  section { padding: 60px 0; }
-  nav .links > a:not(.btn) { display: none; }
-}
-@media (prefers-reduced-motion: reduce) {
-  .term .cursor { animation: none; }
-}
-</style>
-</head>
-<body>
-
-<nav>
-  <div class="wrap">
-    <a class="logo" href="#">🐻 BearDrive</a>
-    <div class="links">
-      <a href="#how">How it works</a>
-      <a href="#features">Features</a>
-      <a href="#claude">Claude Code</a>
-      <a href="#get">Open source</a>
-      <a href="https://github.com/runbear-io/beardrive" title="GitHub">GitHub</a>
-      <a href="https://app.beardrive.ai/auth/login">Log in</a>
-      <a class="btn" href="https://app.beardrive.ai/auth/signup">Sign up free</a>
-    </div>
-  </div>
-</nav>
-
-<header class="hero">
-  <div class="wrap">
-    <div class="pill"><span class="dot">Open source</span> AGPL-3.0 · single Go binary · on Homebrew</div>
-    <h1>Google Drive for AI agents.<span class="green">Your agent knows what their agent knows.</span></h1>
-    <p class="sub">One synced folder for your whole team — humans and agents.
-    <b>Share any file with people</b> as a public URL; <b>give every agent the same
-    memory</b>, synced across machines in seconds. Real files. <b>Use the managed cloud</b>, or self-host the whole thing in one Go binary.</p>
-    <div class="cta-row">
-      <a class="btn" href="https://app.beardrive.ai/auth/signup">Start free →</a>
-      <a class="btn ghost" href="#get">Self-host it</a>
-      <button class="install" id="install" title="Copy">
-        <span class="dollar">$</span>
-        <span id="install-cmd">brew install runbear-io/tap/beardrive</span>
-      </button>
-    </div>
-  </div>
-  <div class="term-wrap wrap">
-    <div class="term" aria-label="Terminal demo">
-      <div class="term-bar"><i></i><i></i><i></i><span>~/acme-wiki</span></div>
-      <pre id="term-body"></pre>
-    </div>
-  </div>
-  <div class="strip">
-    <p>Your hub stores on the object storage you already have</p>
-    <div class="names">
-      <span>Amazon S3</span><span>Google Cloud Storage</span><span>Cloudflare R2</span>
-      <span>MinIO</span><span>any folder</span>
-    </div>
-  </div>
-</header>
-
-<section id="how">
-  <div class="wrap">
-    <p class="kicker">HOW IT WORKS</p>
-    <h2>One command per project. That's the integration.</h2>
-    <p class="lede">BearDrive mounts any folder as a synced volume. Your agents just
-    write files — every editor, every tool, every agent already knows how to do that.</p>
-    <div class="grid">
-      <div class="card"><span class="stepnum">01</span>
-        <p><b>Init the folder.</b> <code>bdrive init</code> connects the project and
-        starts a background daemon. Teammates run the same command and converge on
-        the same files within seconds.</p>
-      </div>
-      <div class="card"><span class="stepnum">02</span>
-        <p><b>Agents write, everyone sees — including their agents.</b> Claude writes
-        <code>wiki/report.md</code> on your machine; moments later it's in every
-        teammate's folder, where their own agent reads it — attributed, versioned,
-        kept forever.</p>
-      </div>
-      <div class="card"><span class="stepnum">03</span>
-        <p><b>Share by URL.</b> <code>bdrive share wiki/report.md</code> prints a
-        public link that renders the file as a page — always the latest synced
-        version, no account needed, revocable any time.</p>
-        <img src="assets/share.png" alt="A shared markdown runbook rendered as a public page" loading="lazy" style="display:block;width:100%;margin-top:12px;border-radius:8px;border:1px solid rgba(255,255,255,.09)">
-      </div>
-      <div class="card wide">
-        <div class="arch"><b>your folder</b>  ←scan/materialize→  <b>local volume</b>  ←push/pull→  <span class="a">a BearDrive hub (on S3 / GCS / R2 / a folder)</span>
-<span class="dim">real files                per-device journals,      devices converge through the hub's dumb storage:
-every tool works          content-addressed blobs    append-only, no locks, offline-safe</span></div>
-      </div>
-      <div class="card wide" style="padding:0;overflow:hidden">
-        <img src="assets/browse.png" alt="The hub web UI browsing a project — per-file agent read counts, heat dots, and the folder's change feed" loading="lazy" style="display:block;width:100%">
-      </div>
-    </div>
-  </div>
-</section>
-
-<section id="autoshare" class="autoshare">
-  <div class="wrap">
-    <p class="kicker">SHARE WITHOUT A SHARE STEP</p>
-    <h2>The link is born with the file.</h2>
-    <p class="lede">The moment your agent writes a file, the path in its reply is
-    already a clickable, members-only hub link. You didn't run a command, you didn't
-    copy a path — any teammate who's signed in opens it in one click, rendered and at
-    the latest version. It's gated to your project, so it's safe to paste in any
-    internal channel.</p>
-    <div class="reply" aria-label="Example agent reply with an auto-generated hub link">
-      <div class="reply-line">
-        <span class="reply-dot">●</span>
-        <span>Deal page written to <span class="reply-path">shared/wiki/deals/motive.md</span> <span class="reply-link" role="link" tabindex="0" title="Opens for signed-in teammates on the project">🔗</span></span>
-      </div>
-      <div class="reply-cap">↑ your agent's own reply — the <span class="reply-link" style="cursor:default">🔗</span> is a live hub link it added automatically. No <code>bdrive share</code>, no copy-paste, nobody asking you to resend it.</div>
-    </div>
-  </div>
-</section>
-
-<section id="why">
-  <div class="wrap">
-    <p class="kicker">WHY BEARDRIVE</p>
-    <h2>Two superpowers, one folder.</h2>
-    <div class="grid" style="grid-template-columns:repeat(auto-fit,minmax(340px,1fr))">
-      <div class="card"><div class="ico">🧠</div>
-        <p style="font-size:15px"><b>Share context across agents.</b> The folder is shared
-        memory. What your agent learns today — findings, plans, decisions, notes —
-        is on your teammate's disk in seconds, so <b>their agent starts tomorrow's
-        session already knowing it</b>. Context stops being siloed per laptop;
-        every agent on the team reads from, and writes to, the same brain.</p>
-      </div>
-      <div class="card"><div class="ico">🧑‍🤝‍🧑</div>
-        <p style="font-size:15px"><b>Share files with people.</b> Anything in the folder is a
-        <code>bdrive share</code> away from being a public URL that renders as a page —
-        markdown, HTML, PDFs. No accounts for viewers, no "can you re-send that?",
-        always the latest version, revocable any time. Dropbox-link simplicity for
-        everything your team produces.</p>
-      </div>
-      <div class="card"><div class="ico">📊</div>
-        <p style="font-size:15px"><b>See what your agents actually read.</b> Every change is
-        attributed to the human, agent, or device that made it — and BearDrive's Insights
-        show which files your agents lean on and which "hot but stale" docs the team relies
-        on that nobody maintains. Agents aren't just users of the folder; they're measured.</p>
-      </div>
-    </div>
-    <p style="margin-top:28px"><img src="assets/insights.png" alt="BearDrive Insights — every file plotted by agent and human reads versus staleness" loading="lazy" style="width:100%;border-radius:12px;border:1px solid rgba(255,255,255,.09)"></p>
-  </div>
-</section>
-
-<section id="features">
-  <div class="wrap">
-    <p class="kicker">FEATURES</p>
-    <h2>Built for teams where half the "members" are agents.</h2>
-    <p class="lede">Sync is table stakes. What agent teams actually need is
-    <b>provenance</b>, <b>shareability</b>, and a security model that assumes files
-    are written by software.</p>
-    <div class="grid">
-      <div class="card"><div class="ico">📁</div>
-        <p><b>Real files, zero lock-in.</b> Not a virtual filesystem, not an API. A
-        normal folder on disk — grep it, open it in your editor, point any agent at
-        it. Stop syncing any time; the files stay.</p>
-      </div>
-      <div class="card"><div class="ico">🕘</div>
-        <p><b>Every change tracked, forever.</b> Who changed each file, when, from
-        which device — every past version viewable and downloadable. An agent
-        overwriting your doc is an annoyance, not a loss.</p>
-      </div>
-      <div class="card"><div class="ico">🔒</div>
-        <p><b>Gated links your agents hand you.</b> When Claude writes or updates a
-        file, it drops a link right beside the path — a hub link that only opens for
-        signed-in teammates on the project. Safe to paste in any internal channel;
-        the turn-start hook teaches every agent to do it automatically.</p>
-      </div>
-      <div class="card"><div class="ico">🔗</div>
-        <p><b>Public share links.</b> Need it truly public? Any synced file becomes a
-        rendered page at an unguessable URL: HTML as a page, markdown Obsidian-style,
-        PDFs inline. Sandboxed, rate-limited, living until you revoke it.</p>
-      </div>
-      <div class="card"><div class="ico">👥</div>
-        <p><b>Teams &amp; organizations.</b> Projects belong to your org; only
-        members see or sync them. Invite a teammate with one expiring link.
-        Accounts, device registry, and history come built in.</p>
-      </div>
-      <div class="card"><div class="ico">📴</div>
-        <p><b>Offline-first, conflict-safe.</b> Append-only journals and
-        deterministic replay: devices converge without a coordination server, and
-        concurrent edits keep both versions as conflict copies.</p>
-      </div>
-      <div class="card"><div class="ico">🪣</div>
-        <p><b>Bring your own storage.</b> Your hub is backed by S3, GCS, R2,
-        MinIO, or a plain shared directory — nothing but dumb object storage.
-        Clients sync through the hub over HTTPS and never hold cloud
-        credentials at all.</p>
-      </div>
-    </div>
-  </div>
-</section>
-
-<section id="claude">
-  <div class="wrap claude">
-    <div class="copy">
-      <p class="kicker">CLAUDE CODE &amp; COWORK</p>
-      <h2>Your agents become fluent in it.</h2>
-      <ul>
-        <li><b>/beardrive:install</b> sets a whole team project up
-        conversationally: CLI, sign-in, project, and sync hooks — one plugin that
-        works the same in Claude Code and Claude Cowork.</li>
-        <li><b>Hooks keep everything fresh</b> — a pull when you submit a prompt
-        (Claude reads the team's latest files) and an async push after every edit
-        (artifacts hit the server seconds after Claude writes them). Works for
-        every teammate, plugin or not.</li>
-        <li><b>Every file it writes comes with a link</b> — the turn-start hook
-        teaches Claude to drop a gated hub link beside any synced path it mentions,
-        so "share this report with the team" just works.</li>
-      </ul>
-      <a class="btn ghost" href="https://github.com/runbear-io/beardrive/tree/main/plugin">Explore the plugin →</a>
-    </div>
-    <div class="demo chat">
-      <div class="msg"><div class="who">You, to your Claude</div>
-        <div class="bubble">Write up the Q3 findings and share them with the team.</div>
-      </div>
-      <div class="msg claude"><div class="who">Your Claude</div>
-        <div class="bubble">Done — I saved the report to <code>wiki/q3-findings.md</code>.
-        It's already syncing to the team; here's the link (sign-in required, so
-        it's safe to paste anywhere):<br><br>
-        <span class="url">https://acme-hub.example/p-1a2b3c4d/wiki/q3-findings.md</span><br><br>
-        Say the word if you need a public link for someone outside the team.</div>
-      </div>
-      <div class="msg"><div class="who">Your teammate, to their Claude</div>
-        <div class="bubble">What did we learn from the Q3 numbers?</div>
-      </div>
-      <div class="msg claude"><div class="who">Their Claude</div>
-        <div class="bubble">Per <code>wiki/q3-findings.md</code> — synced to this machine
-        four minutes ago — churn concentrated in self-serve accounts, and…</div>
-      </div>
-    </div>
-  </div>
-</section>
-
-<section id="get">
-  <div class="wrap">
-    <p class="kicker">GET BEARDRIVE</p>
-    <h2>Self-host everything. Or let us run it.</h2>
-    <p class="lede">The entire product is open source under AGPL-3.0 — server, teams,
-    history, share links, <b>nothing held back</b>. Or skip the buckets entirely —
-    BearDrive Cloud is live at app.beardrive.ai.</p>
-    <div class="oss">
-      <div class="oss-card">
-        <h3>Open source</h3>
-        <div class="tag">AGPL-3.0 · free forever · your infrastructure</div>
-        <ul>
-          <li>The complete server — teams included</li>
-          <li>One binary: <code>bdrive web</code> is the viewer, uploads, and sync hub</li>
-          <li>Any storage: S3 / GCS / R2 / MinIO / a folder</li>
-          <li>File-backed registries — no database to run</li>
-        </ul>
-        <div class="cta-row" style="justify-content:flex-start">
-          <a class="btn" href="https://github.com/runbear-io/beardrive">View on GitHub</a>
-          <a class="btn ghost" href="https://github.com/runbear-io/beardrive/blob/main/docs/self-hosting.md">Self-hosting guide</a>
-        </div>
-      </div>
-      <div class="oss-card cloud">
-        <h3>BearDrive Cloud</h3>
-        <div class="tag">app.beardrive.ai · managed hosting · live now</div>
-        <ul>
-          <li>Zero setup — sign up, <code>bdrive login</code>, and go</li>
-          <li>Managed storage, backups, and support handled for you</li>
-          <li>Funds the open source project</li>
-        </ul>
-        <div class="cta-row" style="justify-content:flex-start">
-          <a class="btn" href="https://app.beardrive.ai/auth/signup">Start free →</a>
-          <a class="btn ghost" href="https://app.beardrive.ai/auth/login">Log in</a>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-<section class="closer">
-  <div class="wrap">
-    <h2>Share files. Share context.<br><span class="green">Cloud or self-hosted.</span></h2>
-    <p>Sign up for the managed cloud and go, or brew install and self-host in one binary. Files travel to people as URLs; context travels to every agent on the team.</p>
-    <div class="cta-row">
-      <a class="btn" href="https://app.beardrive.ai/auth/signup">Start free →</a>
-      <a class="btn ghost" href="https://github.com/runbear-io/beardrive">Self-host on GitHub</a>
-      <button class="install" id="install2" title="Copy">
-        <span class="dollar">$</span>
-        <span id="install-cmd2">brew install runbear-io/tap/beardrive</span>
-      </button>
-    </div>
-  </div>
-</section>
-
-<footer>
-  <div class="wrap">
-    <span>🐻 BearDrive — © 2026 <a href="https://runbear.io">Runbear, Inc.</a> · AGPL-3.0</span>
-    <div class="links">
-      <a href="https://github.com/runbear-io/beardrive">GitHub</a>
-      <a href="https://github.com/runbear-io/beardrive#readme">Docs</a>
-      <a href="https://github.com/runbear-io/beardrive/blob/main/LICENSE">License</a>
-    </div>
-  </div>
-</footer>
-
-<script>
-/* copy-to-clipboard on both install commands */
-for (const [btn, cmd] of [["install", "install-cmd"], ["install2", "install-cmd2"]]) {
-  document.getElementById(btn).addEventListener("click", async () => {
-    const el = document.getElementById(cmd);
-    try {
-      await navigator.clipboard.writeText(el.textContent);
-      const old = el.textContent;
-      el.textContent = "copied!";
-      el.classList.add("copied");
-      setTimeout(() => { el.textContent = old; el.classList.remove("copied"); }, 1200);
-    } catch { /* clipboard unavailable */ }
-  });
-}
-
-/* typed terminal demo */
-const LINES = [
-  { t: "$ ", cls: "p" }, { t: "bdrive init\n", type: true },
-  { t: "✓", cls: "ok" }, { t: " project ", cls: "dim" }, { t: "acme-wiki" },
-  { t: " syncing → your team's hub\n\n", cls: "dim" },
-  { t: "  (your agent writes wiki/q3-report.md…)\n\n", cls: "dim", pause: 900 },
-  { t: "$ ", cls: "p" }, { t: "bdrive status\n", type: true },
-  { t: "  daemon:   running\n  files:    142 (3.4 MiB)\n  pending:  0 — everything synced\n\n", cls: "dim" },
-  { t: "$ ", cls: "p" }, { t: "bdrive share wiki/q3-report.md\n", type: true },
-  { t: "https://acme-hub.example/s/1aad3327224e408d\n", cls: "url" },
-  { t: "  anyone can open it — no account needed\n", cls: "dim" },
-];
-const body = document.getElementById("term-body");
-const reduced = matchMedia("(prefers-reduced-motion: reduce)").matches;
-const cursor = document.createElement("span");
-cursor.className = "cursor";
-
-async function play() {
-  if (reduced) {
-    for (const l of LINES) append(l.t, l.cls);
-    return;
-  }
-  body.appendChild(cursor);
-  for (const l of LINES) {
-    if (l.pause) await sleep(l.pause);
-    if (l.type) {
-      for (const ch of l.t) { append(ch, l.cls); await sleep(34); }
-      await sleep(250);
-    } else {
-      append(l.t, l.cls);
-      await sleep(120);
-    }
-  }
-  cursor.remove();
-}
-function append(text, cls) {
-  const s = document.createElement("span");
-  if (cls) s.className = cls;
-  s.textContent = text;
-  body.insertBefore(s, reduced ? null : cursor);
-}
-const sleep = (ms) => new Promise((r) => setTimeout(r, ms));
-play();
-</script>
-</body>
-</html>
@@ -1,159 +0,0 @@
-<!doctype html>
-<html lang="en">
-<head>
-<meta charset="utf-8">
-<meta name="viewport" content="width=device-width, initial-scale=1">
-<title>BearDrive — accent theme candidates</title>
-<style>
-* { box-sizing: border-box; }
-body {
-  margin: 0; background: #0c0c0c; color: #fafafa;
-  font: 15px/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
-  -webkit-font-smoothing: antialiased;
-  padding: 40px 24px 80px;
-}
-h1 { text-align: center; font-size: 22px; margin: 0 0 6px; }
-.note { text-align: center; color: #909090; font-size: 13.5px; margin: 0 0 36px; }
-.themes { max-width: 1240px; margin: 0 auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(360px, 1fr)); gap: 22px; }
-
-.theme {
-  --bg: #121212; --panel: #171717; --card: #1c1c1c; --border: #2e2e2e;
-  --dim: #a0a0a0; --faint: #707070;
-  background: var(--bg); border: 1px solid var(--border); border-radius: 14px;
-  overflow: hidden; position: relative;
-}
-.theme .glow {
-  position: absolute; inset: 0 0 auto 0; height: 220px;
-  background: radial-gradient(420px 200px at 50% 0%, var(--glow), transparent 70%);
-  pointer-events: none;
-}
-.head { padding: 14px 20px; border-bottom: 1px solid var(--border); display: flex; align-items: baseline; gap: 10px; }
-.head b { font-size: 15px; }
-.head span { font-size: 12px; color: var(--faint); }
-.head .hex { margin-left: auto; font: 11.5px ui-monospace, Menlo, monospace; color: var(--dim); }
-
-.mini { padding: 30px 26px 26px; text-align: center; position: relative; }
-.pill {
-  display: inline-flex; align-items: center; gap: 7px;
-  font-size: 11.5px; color: var(--dim);
-  border: 1px solid var(--border); border-radius: 99px;
-  padding: 4px 12px 4px 6px; margin-bottom: 18px; background: var(--panel);
-}
-.pill .dot { background: var(--accent-soft); color: var(--accent); font-size: 10px; font-weight: 650; padding: 2px 8px; border-radius: 99px; }
-.mini h2 { font-size: 25px; line-height: 1.12; letter-spacing: -.02em; margin: 0 0 12px; font-weight: 700; }
-.mini h2 .g {
-  display: block;
-  background: linear-gradient(90deg, var(--accent) 30%, var(--accent-2));
-  -webkit-background-clip: text; background-clip: text; color: transparent;
-}
-.mini p { font-size: 13px; color: var(--dim); margin: 0 0 18px; }
-.row { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; margin-bottom: 20px; }
-.btn {
-  padding: 7px 14px; border-radius: 6px; background: var(--accent);
-  color: var(--btn-text); font-weight: 600; font-size: 12.5px; border: none;
-}
-.btn.ghost { background: var(--card); color: #fafafa; border: 1px solid #404040; }
-.term {
-  text-align: left; background: #101010; border: 1px solid var(--border); border-radius: 8px;
-  padding: 13px 15px; font: 11.5px/1.75 ui-monospace, Menlo, monospace; color: #d0d0d0;
-}
-.term .p { color: var(--accent); }
-.term .dim { color: var(--faint); }
-.term .url { color: #6fbfff; text-decoration: underline; }
-.verdict { padding: 14px 20px 18px; border-top: 1px solid var(--border); font-size: 12.5px; color: var(--dim); }
-.verdict b { color: #fafafa; }
-</style>
-</head>
-<body>
-<h1>BearDrive accent themes</h1>
-<p class="note">Same layout, one variable changed. Scroll — the verdict under each card is the honest trade-off.</p>
-<div class="themes">
-
-  <div class="theme" style="--accent:#f5a623; --accent-2:#ffd27d; --accent-soft:rgba(245,166,35,.15); --glow:rgba(245,166,35,.10); --btn-text:#1a1200">
-    <div class="glow"></div>
-    <div class="head"><b>🍯 Honey</b><span>warm amber</span><span class="hex">#f5a623</span></div>
-    <div class="mini">
-      <div class="pill"><span class="dot">Open source</span> AGPL-3.0 · on Homebrew</div>
-      <h2>A shared drive for your AI agents.<span class="g">Synced in seconds. Tracked forever.</span></h2>
-      <p>Real files. Self-hostable in one binary.</p>
-      <div class="row"><button class="btn">Start syncing</button><button class="btn ghost">GitHub</button></div>
-      <div class="term"><span class="p">$</span> bdrive share wiki/q3-report.html
-<span class="url">https://beardrive.ai/s/1aad3327…</span>
-<span class="dim">  anyone can open it — no account needed</span></div>
-    </div>
-    <div class="verdict"><b>The bear-brand pick.</b> Honey is literally on-brand, warm and
-    optimistic, and almost untouched in dev tools — instantly distinguishable from
-    Supabase/Linear/Vercel. Risk: amber reads "warning" in some UI contexts.</div>
-  </div>
-
-  <div class="theme" style="--accent:#fa8072; --accent-2:#ffb4a8; --accent-soft:rgba(250,128,114,.15); --glow:rgba(250,128,114,.10); --btn-text:#2a0c08">
-    <div class="glow"></div>
-    <div class="head"><b>🐟 Salmon</b><span>warm coral</span><span class="hex">#fa8072</span></div>
-    <div class="mini">
-      <div class="pill"><span class="dot">Open source</span> AGPL-3.0 · on Homebrew</div>
-      <h2>A shared drive for your AI agents.<span class="g">Synced in seconds. Tracked forever.</span></h2>
-      <p>Real files. Self-hostable in one binary.</p>
-      <div class="row"><button class="btn">Start syncing</button><button class="btn ghost">GitHub</button></div>
-      <div class="term"><span class="p">$</span> bdrive share wiki/q3-report.html
-<span class="url">https://beardrive.ai/s/1aad3327…</span>
-<span class="dim">  anyone can open it — no account needed</span></div>
-    </div>
-    <div class="verdict"><b>The playful pick.</b> Bears eat salmon — a wink insiders get.
-    Friendly and modern (Claude/Anthropic-adjacent warmth). Risk: coral can read
-    consumer-y rather than infrastructure-y.</div>
-  </div>
-
-  <div class="theme" style="--accent:#7dd3fc; --accent-2:#c5ecff; --accent-soft:rgba(125,211,252,.14); --glow:rgba(125,211,252,.09); --btn-text:#06202e">
-    <div class="glow"></div>
-    <div class="head"><b>🧊 Glacier</b><span>polar ice blue</span><span class="hex">#7dd3fc</span></div>
-    <div class="mini">
-      <div class="pill"><span class="dot">Open source</span> AGPL-3.0 · on Homebrew</div>
-      <h2>A shared drive for your AI agents.<span class="g">Synced in seconds. Tracked forever.</span></h2>
-      <p>Real files. Self-hostable in one binary.</p>
-      <div class="row"><button class="btn">Start syncing</button><button class="btn ghost">GitHub</button></div>
-      <div class="term"><span class="p">$</span> bdrive share wiki/q3-report.html
-<span class="url">https://beardrive.ai/s/1aad3327…</span>
-<span class="dim">  anyone can open it — no account needed</span></div>
-    </div>
-    <div class="verdict"><b>The calm-infrastructure pick.</b> Polar-bear cool, Tailscale-like
-    trustworthiness, great contrast on black. Risk: blue is the most crowded color
-    in dev tools (GitHub, Docker, Stripe) — safe but forgettable.</div>
-  </div>
-
-  <div class="theme" style="--accent:#a882ff; --accent-2:#d3c1ff; --accent-soft:rgba(168,130,255,.15); --glow:rgba(168,130,255,.10); --btn-text:#170d2e">
-    <div class="glow"></div>
-    <div class="head"><b>🔮 Violet</b><span>the product's own accent</span><span class="hex">#a882ff</span></div>
-    <div class="mini">
-      <div class="pill"><span class="dot">Open source</span> AGPL-3.0 · on Homebrew</div>
-      <h2>A shared drive for your AI agents.<span class="g">Synced in seconds. Tracked forever.</span></h2>
-      <p>Real files. Self-hostable in one binary.</p>
-      <div class="row"><button class="btn">Start syncing</button><button class="btn ghost">GitHub</button></div>
-      <div class="term"><span class="p">$</span> bdrive share wiki/q3-report.html
-<span class="url">https://beardrive.ai/s/1aad3327…</span>
-<span class="dim">  anyone can open it — no account needed</span></div>
-    </div>
-    <div class="verdict"><b>The consistency pick.</b> Your web viewer already uses this violet —
-    landing page, product, and share pages would feel like one thing. Risk: violet-on-dark
-    is the Linear/Obsidian look, i.e. the "too general" you flagged.</div>
-  </div>
-
-  <div class="theme" style="--accent:#3ecf8e; --accent-2:#7edfb6; --accent-soft:rgba(62,207,142,.15); --glow:rgba(62,207,142,.10); --btn-text:#0b0b0b">
-    <div class="glow"></div>
-    <div class="head"><b>🌲 Current</b><span>Supabase green (as-is)</span><span class="hex">#3ecf8e</span></div>
-    <div class="mini">
-      <div class="pill"><span class="dot">Open source</span> AGPL-3.0 · on Homebrew</div>
-      <h2>A shared drive for your AI agents.<span class="g">Synced in seconds. Tracked forever.</span></h2>
-      <p>Real files. Self-hostable in one binary.</p>
-      <div class="row"><button class="btn">Start syncing</button><button class="btn ghost">GitHub</button></div>
-      <div class="term"><span class="p">$</span> bdrive share wiki/q3-report.html
-<span class="url">https://beardrive.ai/s/1aad3327…</span>
-<span class="dim">  anyone can open it — no account needed</span></div>
-    </div>
-    <div class="verdict"><b>The status quo.</b> Proven legibility and OSS-community coding
-    ("green = open source" thanks to Supabase). Risk: it's <i>their</i> green — you'd
-    forever look like a Supabase product.</div>
-  </div>
-
-</div>
-</body>
-</html>