Marketing: /products family (hosted-checkout, pay-by-link, invoicing) + index

[0xdevcollins]

Why

The Footer "Product" column lists four products (Hosted checkout, Pay by link, Invoices, Global payouts) all pointing to `/#product` hash — they should be standalone pages. `/products/gateway` and `/products/payouts` exist on the `feat/phase-1-checkout-cctp-v2-settlement` branch (PR #136). This issue covers the remaining three: `/products` index, `/products/hosted-checkout`, `/products/pay-by-link`, `/products/invoicing`.

Where it's linked from

• Footer "Product" column (4 items)
• Homepage product strip

Design

Reuse `ProductStoryLayout` (black background, italic display headlines, mono labels). Either build full `*Assembler` components like `GatewayAssembler.tsx` and `PayoutsAssembler.tsx`, or use a simpler content-forward layout like the latter.

Copy per page

/products (index)

One engine. Four ways to use it.

The same primitives — accept, route, settle, notify — power every product on Useroutr. Pick the surface that fits your business.

Four cards (each is a link to the product page):

1. Hosted checkout — Stripe-style branded checkout. USDC + card + bank, one URL. `/products/hosted-checkout`
2. Pay by link — One-link payment requests. No code, no checkout to build. `/products/pay-by-link`
3. Invoicing — Send a PDF invoice, get paid in USDC or fiat. `/products/invoicing`
4. Global payouts — Bulk disbursements to 174 countries. `/products/payouts`

/products/hosted-checkout

H1: Branded checkout. One URL.

Lead: A drop-in payment page that accepts USDC on five chains, cards via Stripe, bank transfers via ACH or SEPA, and fiat on-ramp through MoneyGram. The customer never leaves your brand.

Features:

• Embed via URL or iframe — no SDK required
• Auto-applies your logo, brand color, company name
• Customer picks payment method; you settle in one asset
• Idempotent re-render: customer can refresh during sign without losing state
• Webhook on every state change

API example:
```http
POST /v1/checkout/sessions
{
"amount": 100.00,
"currency": "USD",
"success_url": "https://yourapp.com/thanks",
"metadata": { "order_id": "ord_123" }
}

→ { "url": "https://checkout.useroutr.com/cs_abc123" }
```

/products/pay-by-link

H1: The link is the integration.

Lead: Generate a payment URL with one API call (or one button in the dashboard). Share it on email, Slack, WhatsApp, an invoice, or a QR code. Customers pay — you get a webhook.

Features:

• Fixed amount, open amount, or pick-from-list
• Single-use or multi-use links
• Custom expiry windows
• Per-link conversion stats (views vs. payments)
• QR code generated automatically
• Works with any payment method the customer picks

API example:
```http
POST /v1/payment-links
{
"amount": 25,
"currency": "USD",
"description": "Coffee subscription · April",
"single_use": false,
"expires_at": "2026-06-01T00:00:00Z"
}

→ {
"id": "lnk_abc123",
"url": "https://pay.useroutr.com/abc12345",
"qr_code_url": "data:image/png;base64,..."
}
```

/products/invoicing

H1: Invoices that get paid. In minutes, not weeks.

Lead: Send a PDF invoice with a payment URL baked in. Customer pays in USDC, card, or bank transfer — you reconcile automatically. Built for B2B teams that hate Stripe-style "click here to enable Treasury."

Features:

• PDF + hosted page generated from the same JSON
• Line items, taxes, discounts, partial payments
• Multi-currency: invoice in EUR, settle in USDC
• Automatic dunning: reminders at +3, +7, +14 days overdue
• Webhook on `invoice.paid`, `invoice.overdue`, `invoice.cancelled`
• CSV export for accountants

API example:
```http
POST /v1/invoices
{
"customer_email": "ap@acme.com",
"customer_name": "Acme Inc.",
"line_items": [
{ "description": "April retainer", "qty": 1, "unit_price": 5000, "amount": 5000 }
],
"currency": "USD",
"due_date": "2026-05-31"
}

→ {
"id": "inv_abc123",
"invoice_number": "INV-2026-042",
"pdf_url": "https://...",
"pay_url": "https://pay.useroutr.com/inv_abc123"
}
```

Acceptance criteria

• `/products` index page exists and links to the 4 product pages
• `/products/hosted-checkout` exists with full copy
• `/products/pay-by-link` exists with full copy
• `/products/invoicing` exists with full copy (replaces "Invoicing Assembler Coming Soon" stub)
• Footer "Product" column links update from `/#product` to the new pages
• Each page added to `sitemap.ts`
• Visual consistency with `/products/gateway` and `/products/payouts` (from branch)

[Praizfotos]

@Praizfotos has applied to work on this issue as part of the Stellar Wave Program's 5th wave.

Hello please I'd love to work on this issue make I see food

ℹ️ Repo Maintainers: To accept this application, review their application or assign @Praizfotos to this issue.

[drips-wave]

Congratulations, @Praizfotos! 🎉 Your application was accepted by the repo's maintainers, and the issue is due on June 2, 2026.

🧑‍💻 @Praizfotos: Please resolve the issue such that the repo's maintainers have enough time to review your contribution before the due date. You'll earn Points for completing the issue on-time, which will make you eligible for a share of the Stellar Wave Program's reward pool.

Warning

When opening a PR, please link it to this issue to ensure it gets tracked accurately. Points are awarded when this issue is marked as completed by the maintainer.

🤠 Repo maintainers: Please keep an eye on the contributor's progress and review their work before the due date. You can manage this issue, including adjusting its complexity and points, here.

🌊 Happy Wave 🌊