# Smart Wallets (WaaS) product page

**Route:** `/products/wallets`  
**Production URL:** `https://tatum.io/products/wallets`  
**Next.js page:** `src/app/wallets/page.tsx`  
**Browsable docs (AI / agents):** `/products/wallets.md` — raw markdown (`Content-Type: text/markdown`), no HTML chrome  
**Content negotiation:** `GET /products/wallets` with `Accept: text/markdown` returns the same markdown (per [Cloudflare Markdown for Agents](https://developers.cloudflare.com/fundamentals/reference/markdown-for-agents/))

Marketing page for Tatum Smart Wallets (Wallet-as-a-Service). Content is migrated from Webflow HTML embeds and rendered through the shared embed pipeline used by other product routes.

## Page structure

The route composes three HTML embed sections inside `SiteShell` (nav + footer + global contact modal):

| Section | Embed file | Contents |
|---------|------------|----------|
| Hero | `src/content/embeds/wallets/hero.html` | Headline, **Get in Touch** CTA, SOC2/ISO badges, G2 rating, interactive phone demo |
| Body 1 | `src/content/embeds/wallets/body-1.html` | Logo strip, differentiation grid, supported chains, production flow, enterprise security band |
| Body 2 | `src/content/embeds/wallets/body-2.html` | SDK install block, case-study grid, bottom CTA band |

Metadata (title, description, OG image) lives in `src/app/wallets/page.tsx`.

## Hero — interactive phone demo

The hero includes a self-contained wallet UI mock inside `#waas-hero-phone-embed`:

- **Wallet home** — balance, asset list, activity sheet (Send / Buy / Receive)
- **Send flow** — asset picker + recipient field
- **Receive flow** — network selector (BTC, ETH, Tron, USDT, SOL) with copyable deposit address
- **Buy flow** — asset selector

All demo data is static (no live API calls). JavaScript is inline in `hero.html` and bundled at build time.

Primary CTA opens the shared contact modal via `#waas-contact-modal` and `data-waas-contact-open`.

## Body 1 — sales narrative

Sections inside `#waas-s1-embed`:

1. **Trusted by** — partner logo strip (Elliptic, Instapay, Chainalysis, Anchorage Digital, Zengo)
2. **What makes Tatum different** — three feature cards + supported blockchains grid (13 chains)
3. **How wallets work in production** — four-step SDK integration flow
4. **Enterprise Grade Security** — SOC/ISO + CertiK trust band, 99.99% availability callout

## Body 2 — developer + proof + CTA

Sections inside `#waas-calc-root` and `#waas-s3-root`:

1. **Build with the Smart Wallets SDK** — `npm install @tatumio/wallet-sdk`, links to [GitHub](https://github.com/tatumio/wallet-sdk) and [npm](https://www.npmjs.com/package/@tatumio/wallet-sdk)
2. **Pricing calculator** — hidden (`#waas-calculator { display: none !important }`). See [Re-enabling the calculator](#re-enabling-the-calculator) below.
3. **Trusted by teams** — four case-study tiles (Hex Trust, Zengo, CryptoSlam, Elliptic)
4. **Launch Smart Wallets at scale** — closing CTA band with **Get in Touch**

## Contact modal (shared)

The lead form is **not** in the wallets embeds. It is loaded globally from `src/content/embeds/shared/contact-modal.html` via `SiteShell`.

- Trigger: any element with `data-waas-contact-open` or `#waas-open-contact`
- Also linked from site nav (**Book a Demo**)
- Submits to `POST /forms/api/zoho-contact` (Webflow-hosted form proxy on production)
- Captures UTM params + referrer in `sessionStorage` (`tatum_crm_utm_v1`)
- Honeypot field: `waas_hp`

## Editing embeds

Embed HTML lives under `src/content/embeds/wallets/`. After any edit, rebundle before build or deploy:

```bash
node scripts/bundle-embeds.mjs
# or rely on predev / prebuild hooks:
npm run dev
npm run build
```

`scripts/bundle-embeds.mjs` writes `src/lib/embed-bundles.generated.ts` (auto-generated — do not edit by hand).

Agent markdown docs are bundled the same way:

```bash
node scripts/bundle-markdown.mjs
```

This writes `src/lib/markdown-bundles.generated.ts` from `WALLETS.md` (runs automatically on `npm run dev` / `npm run build`).

### Webflow source sync

Unlike the Data API page, there is no sync shell script yet for wallets embeds. If you maintain canonical HTML in a parent `HTML Embeds/` folder, copy files manually:

| Source (typical Webflow export) | Destination |
|---------------------------------|-------------|
| WaaS hero embed | `src/content/embeds/wallets/hero.html` |
| WaaS section 1 | `src/content/embeds/wallets/body-1.html` |
| WaaS section 2 + section 3 | `src/content/embeds/wallets/body-2.html` |

Then run `node scripts/bundle-embeds.mjs`.

## Re-enabling the calculator

The WaaS pricing calculator in `body-2.html` is intentionally hidden:

```css
#waas-calculator { display: none !important; }
```

To show it again:

1. Remove that rule from the `<style>` block in `body-2.html`
2. Remove the `hidden` attribute from `<section id="waas-calculator">`
3. Rebundle embeds

Calculator logic uses credit quotas from the pricing sheet (`CREDITS_PER_WALLET = 11000`, `CREDITS_PER_TX = 16320`) and drives a tier slider with monthly / yearly / 2-year billing tabs.

## Local preview

```bash
npm run dev
```

Open [http://localhost:3012/products/wallets](http://localhost:3012/products/wallets).

## Crawl & indexing

| URL | Google | AI agents |
|-----|--------|-----------|
| `/products/wallets` | **Indexed** (HTML) — also serves markdown when `Accept: text/markdown` |
| `/products/wallets.md` | **Not indexed** — direct markdown URL with `X-Robots-Tag: noindex` |
| `/products/api/*` | **Not indexed** — `X-Robots-Tag: noindex` on the response |

This app is mounted at `/products` on the main Webflow site. The supplemental sitemap (`/products/sitemap.xml`) is owned by this repo; link it from Webflow’s **root** `robots.txt` (see [WEBFLOW.md](./WEBFLOW.md)).

The HTML product page exposes `<link rel="alternate" type="text/markdown" href="…/wallets.md">` so agents can discover the raw doc without it competing in search results.

No environment variables are required for this page (unlike Price API).

## Deployment

Deployed with the rest of the app to Webflow Cloud at mount path `/products`. See [WEBFLOW.md](./WEBFLOW.md).

## Related links

| Resource | URL |
|----------|-----|
| Smart Wallets SDK (npm) | https://www.npmjs.com/package/@tatumio/wallet-sdk |
| Smart Wallets SDK (GitHub) | https://github.com/tatumio/wallet-sdk |
| Tatum docs | https://docs.tatum.io |
| G2 reviews | https://www.g2.com/products/tatum/reviews |