Add landing page design spec

Reclamation aesthetic: amber/gold on black void, Chakra Petch + IBM Plex Mono.
Rewind logo (CSS-only rotating ring with glowing center).
Single-page: logo, tagline, pitch, GitHub CTA, three properties, footer.
Deploy target: clawbackprotocol.org via Cloudflare Pages.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: Reeseysan

docs/superpowers/specs/2026-04-03-clawback-landing-design.md

@@ -0,0 +1,153 @@
+# Clawback Protocol — Landing Page Design Spec
+
+**Date:** 2026-04-03
+**Status:** Approved
+**Author:** Maurice + Claude
+
+---
+
+## Overview
+
+Short, single-page landing site for the Clawback Protocol project. Deployed to `clawbackprotocol.org` via Cloudflare Pages. Pure static HTML/CSS — no framework, no build step.
+
+**Purpose:** Introduce the protocol, communicate its value, and link to the GitHub repo. Not a docs site. Not a marketing funnel. A single focused page that delivers a message and provides one action.
+
+---
+
+## Tone & Aesthetic
+
+**Direction:** "The Reclamation" — empowering, assertive but not hostile. Data sovereignty as a right, not a grievance.
+
+**Palette:**
+- Background: `#050505` (near-black void)
+- Text: `#d4d4d4` (primary), `#888` (secondary), `#666` (muted), `#333`/`#444` (ghost)
+- Accent: `#f59e0b` (amber/gold) — warmth, authority, reclamation
+- Accent dark: `#b45309` (deep amber, for gradients)
+- Borders: `#1a1a1a`
+
+**Typography:**
+- Display/headings: Chakra Petch (700, 600) — geometric, digital, bold
+- Body/monospace: IBM Plex Mono (300, 400, 500, 600)
+- Both loaded via Google Fonts
+
+**Texture:** Subtle SVG noise grain overlay (same technique as S2N site). No scan lines — Clawback has its own identity, distinct from the S2N parent brand.
+
+---
+
+## Logo
+
+**Concept:** "The Rewind" — a circular arrow with a glowing center point. Represents data being pulled back to its origin. Reclamation as an action.
+
+**Implementation:** Pure CSS, no images.
+- Outer ring: 120x120px, 3px border, amber gradient (top/right solid `#f59e0b`, bottom `#b45309`)
+- Arrow head: CSS triangle positioned at the ring's break point, rotated -45deg
+- Center dot: 10px circle, `#f59e0b`, with `box-shadow` glow (20px + 40px spread)
+- Animation: `slow-spin` — 20s linear infinite rotation on the ring. Subtle, not distracting.
+
+**Wordmark:** Below the logo mark.
+- "CLAWBACK" — Chakra Petch 700, 42px, letter-spacing 6px, uppercase, near-white `#f5f5f5`
+- "PROTOCOL" — Chakra Petch 600, 13px, letter-spacing 10px, uppercase, ghost `#444`
+
+---
+
+## Page Structure
+
+The entire page is one scroll. Six sections, top to bottom:
+
+### 1. Hero (full viewport)
+
+Contains all primary content centered vertically:
+
+- **Logo mark** (the rewind symbol, animated)
+- **Wordmark** ("CLAWBACK" / "PROTOCOL")
+- **Tagline:** "You shared it. You can unshare it." — Chakra Petch 600, clamp(24px, 4vw, 36px), amber `#f59e0b`
+- **Pitch paragraph:** One paragraph, 15px, muted `#888`, max-width 520px:
+  > "Cryptographic data revocation using Proxy Re-Encryption. When you revoke access, the broker's keys are destroyed and the data becomes **mathematically inaccessible** — not by policy, by proof."
+- **CTA button:** "View on GitHub →" — amber background, black text, IBM Plex Mono 14px, uppercase, links to `https://github.com/clawback-protocol/spec`
+
+**Ambient effect:** Radial gradient glow behind the logo area — `rgba(245,158,11,0.08)`, 500px circle, centered at 25% from top.
+
+### 2. Properties Strip
+
+Three columns, separated by 1px `#1a1a1a` borders. Max-width 900px centered.
+
+| Property | Icon | Description |
+|----------|------|-------------|
+| Provable Deletion | ∅ | HMAC-signed destruction receipts. Deletion is verifiable, not promissory. |
+| Zero-Trust Broker | ø | Broker re-encrypts but never decrypts. Umbral PRE ensures cryptographic blindness. |
+| Instant Revocation | ← | Revoke any share, any time. Key fragments destroyed immediately. |
+
+Icons are unicode characters rendered in Chakra Petch 700, 28px, amber.
+
+### 3. Footer
+
+Single line, centered:
+- "AGPLv3 · Second 2 None LLC · GitHub"
+- S2N links to `https://second2none.net`
+- GitHub links to `https://github.com/clawback-protocol/spec`
+- Copyright: "© 2026 Second 2 None LLC"
+
+---
+
+## Meta Tags
+
+```html
+<title>Clawback Protocol — Cryptographic Data Revocation</title>
+<meta name="description" content="You shared it. You can unshare it. Cryptographically enforced, revocable data sharing with provable destruction.">
+<meta property="og:title" content="Clawback Protocol">
+<meta property="og:description" content="You shared it. You can unshare it.">
+<meta property="og:url" content="https://clawbackprotocol.org">
+<meta name="twitter:card" content="summary_large_image">
+<meta name="twitter:site" content="@ClawbackHQ">
+```
+
+OG image: not included in this build (no image assets). Can be added later.
+
+---
+
+## Responsive Behavior
+
+- **Desktop (>768px):** Properties in 3-column grid, logo at 120px, wordmark at 42px
+- **Mobile (≤768px):** Properties stack to 1 column, logo stays 120px, wordmark drops to 28px with tighter letter-spacing, hero padding reduces
+
+---
+
+## Deployment
+
+- **Host:** Cloudflare Pages, connected to the `clawback-site` GitHub repo
+- **Domain:** `clawbackprotocol.org`
+- **Build:** None — static HTML served directly
+- **Headers:** `_headers` file with HSTS, X-Frame-Options DENY, no FLoC, no-sniff
+
+---
+
+## Files
+
+```
+clawback-site/
+├── index.html        ← The landing page
+├── _headers          ← Cloudflare security headers
+└── docs/             ← Specs (not deployed, just for reference)
+```
+
+---
+
+## What's Intentionally Excluded
+
+- No nav bar (single page, nowhere to navigate)
+- No "How it works" section (that's the spec repo's job)
+- No email signup or contact form (privacy-first — no data collection)
+- No analytics, cookies, or tracking of any kind
+- No JavaScript beyond what CSS can't do (the logo spin is CSS)
+- No framework, no build tooling, no dependencies
+
+---
+
+## Links
+
+| Target | URL |
+|--------|-----|
+| GitHub repo | `https://github.com/clawback-protocol/spec` |
+| Domain | `https://clawbackprotocol.org` |
+| Parent company | `https://second2none.net` |
+| Twitter/X | `@ClawbackHQ` |