← back to Ventura Claw

server/public/coming-soon.html

388 lines

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<meta name="theme-color" content="#0e0e10" />
<title>VenturaClaw — Coming soon · One AI command for 67 SaaS tools</title>
<meta name="description" content="VenturaClaw is launching soon. Type one sentence — the AI picks the right SaaS tool from 67 wired-in connectors and runs the action. Drop your email for first-access." />
<meta name="robots" content="index,follow" />
<link rel="canonical" href="https://venturaclaw.com/" />
<meta property="og:type" content="website" />
<meta property="og:title" content="VenturaClaw — Coming soon" />
<meta property="og:description" content="One AI command, 67 connectors, zero workflow building. Launching soon — get on the early-access list." />
<meta property="og:url" content="https://venturaclaw.com/" />
<meta property="og:site_name" content="VenturaClaw" />
<meta name="twitter:card" content="summary_large_image" />
<style>
  :root {
    --bg: #0e0e10;
    --bg-2: #15151a;
    --rule: #2a2a32;
    --ink: #f4f1ea;
    --ink-soft: #d8d2c5;
    --ink-mute: #8b857a;
    --gold: #d4a04a;
    --gold-glow: #e6b96a;
    --good: #6ec081;
    --serif: "Cormorant Garamond", Georgia, serif;
    --mono: "JetBrains Mono", "SFMono-Regular", Menlo, Consolas, monospace;
    --sans: -apple-system, "SF Pro Text", "Inter", system-ui, sans-serif;
    --max: 1100px;
  }
  *, *::before, *::after { box-sizing: border-box; }
  html, body { margin: 0; background: var(--bg); color: var(--ink); font-family: var(--sans); font-weight: 300; }
  a { color: var(--gold); }
  ::selection { background: var(--gold); color: var(--bg); }

  /* topbar */
  .topbar {
    max-width: var(--max);
    margin: 0 auto;
    padding: 22px 28px;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .brand { display: flex; gap: 12px; align-items: center; }
  .logo-dot {
    width: 14px; height: 14px; border-radius: 50%;
    background: radial-gradient(circle at 30% 30%, var(--gold-glow), var(--gold) 60%, #7a5a26);
    box-shadow: 0 0 18px rgba(212, 160, 74, 0.45);
  }
  .brand-name { font-family: var(--serif); font-size: 22px; font-weight: 500; letter-spacing: -0.005em; }
  .brand-name em { font-style: italic; color: var(--gold); }
  .brand-sub { font-family: var(--mono); font-size: 9px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-mute); margin-top: 2px; }
  .status-pill {
    font-family: var(--mono); font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase;
    color: var(--gold); border: 1px solid var(--gold); padding: 8px 14px; border-radius: 999px;
    display: inline-flex; align-items: center; gap: 8px;
  }
  .status-pill::before {
    content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%;
    background: var(--gold-glow); box-shadow: 0 0 10px var(--gold-glow);
    animation: pulse 1.8s infinite;
  }
  @keyframes pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50%      { opacity: 0.55; transform: scale(0.85); }
  }

  /* hero */
  .hero { max-width: var(--max); margin: 56px auto 0; padding: 0 28px; }
  .eyebrow {
    font-family: var(--mono); font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase;
    color: var(--ink-mute); margin-bottom: 22px; display: flex; align-items: center; gap: 10px;
  }
  .eyebrow .dot {
    display: inline-block; width: 6px; height: 6px; border-radius: 50%;
    background: var(--good); box-shadow: 0 0 10px var(--good);
  }
  .headline {
    font-family: var(--serif); font-weight: 400; line-height: 1.05;
    font-size: clamp(46px, 7.5vw, 92px); margin: 0 0 24px; letter-spacing: -0.012em;
  }
  .headline em { font-style: italic; color: var(--gold); }
  .subhead {
    font-size: 19px; line-height: 1.6; color: var(--ink-soft);
    max-width: 720px; margin: 0 0 40px;
  }

  /* soon card */
  .soon-card {
    background: linear-gradient(180deg, var(--bg-2), rgba(21, 21, 26, 0.4));
    border: 1px solid var(--rule);
    border-left: 3px solid var(--gold);
    padding: 32px 36px;
    max-width: 640px;
    margin: 0 0 56px;
  }
  .soon-card h2 {
    font-family: var(--serif); font-weight: 400; font-size: 28px; margin: 0 0 14px; letter-spacing: -0.005em;
  }
  .soon-card p { font-size: 15px; line-height: 1.65; color: var(--ink-soft); margin: 0 0 20px; }
  .soon-card .ml { margin-bottom: 8px; }
  .soon-card form { display: flex; gap: 8px; flex-wrap: wrap; }
  .soon-card input[type=email] {
    flex: 1; min-width: 240px;
    padding: 14px 18px;
    background: var(--bg);
    border: 1px solid var(--rule);
    color: var(--ink);
    font-family: var(--sans); font-size: 14px;
    outline: none;
    transition: border-color 200ms ease;
  }
  .soon-card input[type=email]:focus { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(212, 160, 74, 0.12); }
  .soon-card button {
    background: var(--gold); color: var(--bg);
    border: 0; padding: 14px 22px;
    font-family: var(--mono); font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; font-weight: 600;
    cursor: pointer;
    transition: background 200ms ease;
  }
  .soon-card button:hover { background: var(--gold-glow); }
  .soon-card .ack {
    display: none;
    margin-top: 14px; padding: 12px 14px;
    background: rgba(110, 192, 129, 0.08); border: 1px solid var(--good);
    color: var(--good); font-family: var(--mono); font-size: 11px; letter-spacing: 0.05em;
  }
  .soon-card .ack.show { display: block; }
  .soon-card .alt {
    margin-top: 18px; font-family: var(--mono); font-size: 11px; color: var(--ink-mute); letter-spacing: 0.04em;
  }

  /* services CTA — links to live /services hub */
  .services-cta {
    display: block;
    max-width: 640px;
    margin: 28px 0 0;
    padding: 24px 28px;
    background: linear-gradient(135deg, rgba(212,160,74,0.10) 0%, rgba(212,160,74,0.02) 100%);
    border: 1px solid var(--gold);
    border-left: 3px solid var(--gold);
    color: var(--ink);
    text-decoration: none;
    transition: background 200ms ease, transform 200ms ease;
    position: relative;
    overflow: hidden;
  }
  .services-cta:hover {
    background: linear-gradient(135deg, rgba(212,160,74,0.18) 0%, rgba(212,160,74,0.04) 100%);
    transform: translateX(2px);
  }
  .services-cta::after {
    content: ""; position: absolute; right: -40px; top: -40px;
    width: 120px; height: 120px; border-radius: 50%;
    background: radial-gradient(circle, rgba(212,160,74,0.18), transparent 60%);
    pointer-events: none;
  }
  .services-cta-tag {
    display: inline-block;
    font-family: "JetBrains Mono", "SFMono-Regular", Menlo, monospace;
    font-size: 9px; letter-spacing: 0.18em; text-transform: uppercase;
    color: var(--good); border: 1px solid var(--good); border-radius: 999px;
    padding: 4px 10px; margin-bottom: 12px;
  }
  .services-cta-title {
    display: block;
    font-family: var(--serif); font-weight: 500; font-size: 24px;
    letter-spacing: -0.005em; color: var(--ink); margin-bottom: 8px;
  }
  .services-cta-body {
    display: block;
    font-size: 14px; line-height: 1.55; color: var(--ink-soft); margin-bottom: 14px;
  }
  .services-cta-arrow {
    display: inline-flex; align-items: center; gap: 6px;
    font-family: "JetBrains Mono", "SFMono-Regular", Menlo, monospace;
    font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; font-weight: 600;
    color: var(--gold);
  }

  /* connectors strip — purely visual, no backend */
  .connectors {
    max-width: var(--max); margin: 0 auto 80px; padding: 0 28px;
  }
  .connectors-label {
    font-family: var(--mono); font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase;
    color: var(--ink-mute); margin-bottom: 18px;
  }
  .connectors-label b { color: var(--gold); font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 14px; letter-spacing: 0; text-transform: none; margin-right: 6px; }
  .connector-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 1px;
    background: var(--rule);
    border: 1px solid var(--rule);
  }
  .connector {
    background: var(--bg);
    padding: 14px 16px;
    font-family: var(--mono); font-size: 11px; letter-spacing: 0.05em;
    color: var(--ink-soft);
    transition: background 220ms ease, color 220ms ease;
  }
  .connector b { display: block; font-family: var(--serif); font-weight: 400; font-size: 14px; color: var(--ink); letter-spacing: -0.005em; margin-bottom: 2px; }
  .connector .cat { font-size: 9px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ink-mute); }
  .connector:hover { background: var(--bg-2); color: var(--gold); }

  /* moats — keep three only */
  .moats { max-width: var(--max); margin: 0 auto 80px; padding: 0 28px; }
  .moats h2 { font-family: var(--serif); font-weight: 400; font-size: 38px; margin: 0 0 36px; letter-spacing: -0.005em; }
  .moats h2 em { font-style: italic; color: var(--gold); }
  .moat-grid {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px;
  }
  .moat { background: var(--bg-2); border: 1px solid var(--rule); padding: 28px 26px; }
  .moat-num { font-family: var(--mono); font-size: 11px; color: var(--gold); letter-spacing: 0.18em; margin-bottom: 14px; }
  .moat-title { font-family: var(--serif); font-weight: 500; font-size: 20px; line-height: 1.3; margin-bottom: 12px; letter-spacing: -0.005em; }
  .moat-body { font-size: 14px; line-height: 1.6; color: var(--ink-soft); }

  /* footer */
  footer {
    max-width: var(--max); margin: 0 auto;
    padding: 40px 28px 60px;
    border-top: 1px solid var(--rule);
    font-family: var(--mono); font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase;
    color: var(--ink-mute);
    display: flex; justify-content: space-between; flex-wrap: wrap; gap: 14px;
  }
  footer a { color: var(--ink-mute); text-decoration: none; }
  footer a:hover { color: var(--gold); }
</style>
</head>
<body>

<header class="topbar">
  <div class="brand">
    <div class="logo-dot"></div>
    <div>
      <div class="brand-name">Ventura<em>Claw</em></div>
      <div class="brand-sub">Connected Operations</div>
    </div>
  </div>
  <div class="status-pill">Coming soon</div>
</header>

<main>
  <section class="hero">
    <div class="eyebrow"><span class="dot"></span><span>Public launch in development · early-access list open</span></div>
    <h1 class="headline">Don't build the workflow.<br>Just <em>ask for the result.</em></h1>
    <p class="subhead">
      Every other automation tool sells the canvas — the boxes, the arrows, the if/then. VenturaClaw sells the outcome. Type what you want — <em>"refund order 1234 on Shopify," "post in #launch on Slack," "purge the homepage cache"</em> — and the AI picks the right connector and runs it. 67 wired in. Encrypted per-user keys. Approval queue on the dangerous stuff. Audit trail on everything.
    </p>

    <div class="soon-card">
      <h2>Drop your email — we'll ping you on launch.</h2>
      <p class="ml">Limited early-access spots. No spam, no newsletter, one email when the door opens.</p>
      <form id="ws" action="mailto:info@venturaclaw.com" method="GET" enctype="text/plain">
        <input type="email" name="subject" placeholder="you@example.com" required>
        <button type="submit">Get notified →</button>
      </form>
      <div class="ack" id="ack" role="status" aria-live="polite">Thanks — we'll be in touch.</div>
      <p class="alt">Or email <a href="mailto:info@venturaclaw.com">info@venturaclaw.com</a> with "early access" in the subject.</p>
    </div>

    <a href="/services" class="services-cta">
      <span class="services-cta-tag">Live now · free</span>
      <span class="services-cta-title">📋 Small-Business Services Hub</span>
      <span class="services-cta-body">LLC formation. DBA. EIN. BOI filing. Sales tax permits. Trademark search. 30 services across 6 categories — most free, the rest a small flat fee. Plus an AI assistant that answers anything about starting your business.</span>
      <span class="services-cta-arrow">Open the hub →</span>
    </a>
  </section>

  <section class="connectors">
    <div class="connectors-label"><b>67</b> connectors pre-wired · ready on day one</div>
    <div class="connector-grid">
      <div class="connector"><b>Stripe</b><span class="cat">Payments</span></div>
      <div class="connector"><b>Shopify</b><span class="cat">Commerce</span></div>
      <div class="connector"><b>Slack</b><span class="cat">Messaging</span></div>
      <div class="connector"><b>Cloudflare</b><span class="cat">Infra</span></div>
      <div class="connector"><b>HubSpot</b><span class="cat">CRM</span></div>
      <div class="connector"><b>Notion</b><span class="cat">Docs</span></div>
      <div class="connector"><b>Discord</b><span class="cat">Community</span></div>
      <div class="connector"><b>Google Workspace</b><span class="cat">Productivity</span></div>
      <div class="connector"><b>Mailchimp</b><span class="cat">Email</span></div>
      <div class="connector"><b>SendGrid</b><span class="cat">Email</span></div>
      <div class="connector"><b>Twilio</b><span class="cat">SMS / voice</span></div>
      <div class="connector"><b>Zendesk</b><span class="cat">Support</span></div>
      <div class="connector"><b>Intercom</b><span class="cat">Support</span></div>
      <div class="connector"><b>Linear</b><span class="cat">Project mgmt</span></div>
      <div class="connector"><b>Jira</b><span class="cat">Project mgmt</span></div>
      <div class="connector"><b>GitHub</b><span class="cat">Code</span></div>
      <div class="connector"><b>GitLab</b><span class="cat">Code</span></div>
      <div class="connector"><b>Vercel</b><span class="cat">Deploy</span></div>
      <div class="connector"><b>Netlify</b><span class="cat">Deploy</span></div>
      <div class="connector"><b>AWS</b><span class="cat">Infra</span></div>
      <div class="connector"><b>Google Cloud</b><span class="cat">Infra</span></div>
      <div class="connector"><b>Azure</b><span class="cat">Infra</span></div>
      <div class="connector"><b>DigitalOcean</b><span class="cat">Infra</span></div>
      <div class="connector"><b>Datadog</b><span class="cat">Observability</span></div>
      <div class="connector"><b>Sentry</b><span class="cat">Errors</span></div>
      <div class="connector"><b>PagerDuty</b><span class="cat">On-call</span></div>
      <div class="connector"><b>Asana</b><span class="cat">Project mgmt</span></div>
      <div class="connector"><b>Trello</b><span class="cat">Project mgmt</span></div>
      <div class="connector"><b>Monday</b><span class="cat">Project mgmt</span></div>
      <div class="connector"><b>Salesforce</b><span class="cat">CRM</span></div>
      <div class="connector"><b>Pipedrive</b><span class="cat">CRM</span></div>
      <div class="connector"><b>Zoho CRM</b><span class="cat">CRM</span></div>
      <div class="connector"><b>QuickBooks</b><span class="cat">Accounting</span></div>
      <div class="connector"><b>Xero</b><span class="cat">Accounting</span></div>
      <div class="connector"><b>FreshBooks</b><span class="cat">Accounting</span></div>
      <div class="connector"><b>Square</b><span class="cat">Payments</span></div>
      <div class="connector"><b>PayPal</b><span class="cat">Payments</span></div>
      <div class="connector"><b>Plaid</b><span class="cat">Banking</span></div>
      <div class="connector"><b>Airtable</b><span class="cat">Database</span></div>
      <div class="connector"><b>Coda</b><span class="cat">Docs</span></div>
      <div class="connector"><b>Calendly</b><span class="cat">Scheduling</span></div>
      <div class="connector"><b>Zoom</b><span class="cat">Meetings</span></div>
      <div class="connector"><b>Google Meet</b><span class="cat">Meetings</span></div>
      <div class="connector"><b>Microsoft Teams</b><span class="cat">Meetings</span></div>
      <div class="connector"><b>Dropbox</b><span class="cat">Files</span></div>
      <div class="connector"><b>Box</b><span class="cat">Files</span></div>
      <div class="connector"><b>OneDrive</b><span class="cat">Files</span></div>
      <div class="connector"><b>Figma</b><span class="cat">Design</span></div>
      <div class="connector"><b>Webflow</b><span class="cat">Web</span></div>
      <div class="connector"><b>WordPress</b><span class="cat">CMS</span></div>
      <div class="connector"><b>Ghost</b><span class="cat">Publishing</span></div>
      <div class="connector"><b>Substack</b><span class="cat">Newsletter</span></div>
      <div class="connector"><b>Buffer</b><span class="cat">Social</span></div>
      <div class="connector"><b>Hootsuite</b><span class="cat">Social</span></div>
      <div class="connector"><b>ElevenLabs</b><span class="cat">Voice AI</span></div>
      <div class="connector"><b>OpenAI</b><span class="cat">LLM</span></div>
      <div class="connector"><b>Anthropic</b><span class="cat">LLM</span></div>
    </div>
  </section>

  <section class="moats">
    <h2>What makes it <em>different.</em></h2>
    <div class="moat-grid">
      <div class="moat">
        <div class="moat-num">01</div>
        <div class="moat-title">Encrypted at rest, by default.</div>
        <div class="moat-body">Every API key and OAuth token is wrapped in AES-256-GCM with a versioned key envelope. Rotate the master key and old data still decrypts via dual-read until the next save sweep. Plaintext never touches disk.</div>
      </div>
      <div class="moat">
        <div class="moat-num">02</div>
        <div class="moat-title">Sensitive actions wait for approval.</div>
        <div class="moat-body">Refunds over a threshold, mass deletes, DNS edits — these don't fire until a second human signs off in the approval queue. The AI proposes; a person disposes. Audit-logged either way.</div>
      </div>
      <div class="moat">
        <div class="moat-num">03</div>
        <div class="moat-title">Audit trail on every fired action.</div>
        <div class="moat-body">Who asked, what model routed it, which connector ran, what arguments fired, what came back. Append-only. Exportable. The "tell me everything that happened on Stripe last week" dashboard is the same query the auditor runs.</div>
      </div>
    </div>
  </section>
</main>

<footer>
  <span>© 2026 VenturaClaw · Steve Abrams</span>
  <span>
    <a href="/services">Services</a> ·
    <a href="/how-it-works">How it works</a> ·
    <a href="/connectors">Connectors</a> ·
    <a href="/docs">API docs</a> ·
    <a href="/legal-notice">Legal</a> ·
    <a href="/privacy">Privacy</a> ·
    <a href="/terms">Terms</a> ·
    <a href="mailto:info@venturaclaw.com">info@venturaclaw.com</a>
  </span>
</footer>

<script>
  // Soft mailto fallback — if the user hits "Get notified" on a device with
  // no mail client, the form action still does *something*. The ack box only
  // shows if mailto returns control to the page (i.e. handler exists).
  document.getElementById('ws').addEventListener('submit', function() {
    setTimeout(function(){
      var ack = document.getElementById('ack');
      if (ack) ack.classList.add('show');
    }, 200);
  });
</script>
</body>
</html>