forgedock 1.0.17 → 1.0.18

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (131) hide show
  1. package/README.md +34 -1
  2. package/bin/cross-publish.mjs +344 -0
  3. package/bin/forgedock.mjs +229 -17
  4. package/commands/autopilot.md +77 -0
  5. package/commands/design-bench.md +176 -0
  6. package/commands/design-render-critique-loop.md +103 -0
  7. package/commands/design.md +259 -0
  8. package/commands/issue.md +7 -3
  9. package/commands/orchestrate.md +121 -0
  10. package/commands/qa-sweep.md +37 -2
  11. package/commands/quality-gate.md +30 -0
  12. package/commands/review-pr-staging.md +158 -2
  13. package/commands/test-gate.md +929 -0
  14. package/commands/work-on/build/implement.md +5 -3
  15. package/commands/work-on.md +53 -3
  16. package/docs/CI.md +177 -0
  17. package/docs/FORGE-PROTOCOL.md +324 -0
  18. package/docs/articles/b-vs-c-baseline.md +210 -0
  19. package/docs/articles/full-abc-benchmark.md +205 -0
  20. package/docs/articles/selective-spec-loading-token-savings.md +140 -0
  21. package/docs/design/abc-benchmark.md +195 -0
  22. package/docs/design/design-architect-rationale.md +123 -0
  23. package/docs/design/design-memory.md +61 -0
  24. package/docs/design/design-spec-schema.md +248 -0
  25. package/docs/design/design-system-lint.md +150 -0
  26. package/docs/design/divergent-generation.md +106 -0
  27. package/docs/design/effects-appropriateness.md +133 -0
  28. package/docs/design/fixtures/briefs/README.md +47 -0
  29. package/docs/design/fixtures/briefs/cadence.md +39 -0
  30. package/docs/design/fixtures/briefs/plume.md +39 -0
  31. package/docs/design/fixtures/briefs/slipstream.md +39 -0
  32. package/docs/design/fixtures/briefs/tender.md +39 -0
  33. package/docs/design/fixtures/briefs/voltage.md +39 -0
  34. package/docs/design/fixtures/runs/b-vs-c-baseline/cadence/arm-b/run-1.html +364 -0
  35. package/docs/design/fixtures/runs/b-vs-c-baseline/cadence/arm-b/run-2.html +420 -0
  36. package/docs/design/fixtures/runs/b-vs-c-baseline/cadence/arm-b/run-3.html +506 -0
  37. package/docs/design/fixtures/runs/b-vs-c-baseline/plume/arm-b/run-1.html +611 -0
  38. package/docs/design/fixtures/runs/b-vs-c-baseline/plume/arm-b/run-2.html +594 -0
  39. package/docs/design/fixtures/runs/b-vs-c-baseline/plume/arm-b/run-3.html +817 -0
  40. package/docs/design/fixtures/runs/b-vs-c-baseline/runs.json +175 -0
  41. package/docs/design/fixtures/runs/b-vs-c-baseline/scorecard.json +138 -0
  42. package/docs/design/fixtures/runs/b-vs-c-baseline/slipstream/arm-b/run-1.html +373 -0
  43. package/docs/design/fixtures/runs/b-vs-c-baseline/slipstream/arm-b/run-2.html +398 -0
  44. package/docs/design/fixtures/runs/b-vs-c-baseline/slipstream/arm-b/run-3.html +595 -0
  45. package/docs/design/fixtures/runs/b-vs-c-baseline/tender/arm-b/run-1.html +531 -0
  46. package/docs/design/fixtures/runs/b-vs-c-baseline/tender/arm-b/run-2.html +565 -0
  47. package/docs/design/fixtures/runs/b-vs-c-baseline/tender/arm-b/run-3.html +674 -0
  48. package/docs/design/fixtures/runs/b-vs-c-baseline/voltage/arm-b/run-1.html +388 -0
  49. package/docs/design/fixtures/runs/b-vs-c-baseline/voltage/arm-b/run-2.html +463 -0
  50. package/docs/design/fixtures/runs/b-vs-c-baseline/voltage/arm-b/run-3.html +568 -0
  51. package/docs/design/fixtures/runs/full-abc/cadence/arm-a/run-1.html +562 -0
  52. package/docs/design/fixtures/runs/full-abc/cadence/arm-a/run-2.html +618 -0
  53. package/docs/design/fixtures/runs/full-abc/cadence/arm-a/run-3.html +618 -0
  54. package/docs/design/fixtures/runs/full-abc/cadence/arm-b/run-1.html +364 -0
  55. package/docs/design/fixtures/runs/full-abc/cadence/arm-b/run-2.html +420 -0
  56. package/docs/design/fixtures/runs/full-abc/cadence/arm-b/run-3.html +506 -0
  57. package/docs/design/fixtures/runs/full-abc/plume/arm-a/run-1.html +527 -0
  58. package/docs/design/fixtures/runs/full-abc/plume/arm-a/run-2.html +445 -0
  59. package/docs/design/fixtures/runs/full-abc/plume/arm-a/run-3.html +483 -0
  60. package/docs/design/fixtures/runs/full-abc/plume/arm-b/run-1.html +611 -0
  61. package/docs/design/fixtures/runs/full-abc/plume/arm-b/run-2.html +594 -0
  62. package/docs/design/fixtures/runs/full-abc/plume/arm-b/run-3.html +817 -0
  63. package/docs/design/fixtures/runs/full-abc/runs.json +190 -0
  64. package/docs/design/fixtures/runs/full-abc/scorecard.json +144 -0
  65. package/docs/design/fixtures/runs/full-abc/slipstream/arm-a/run-1.html +496 -0
  66. package/docs/design/fixtures/runs/full-abc/slipstream/arm-a/run-2.html +447 -0
  67. package/docs/design/fixtures/runs/full-abc/slipstream/arm-a/run-3.html +564 -0
  68. package/docs/design/fixtures/runs/full-abc/slipstream/arm-b/run-1.html +373 -0
  69. package/docs/design/fixtures/runs/full-abc/slipstream/arm-b/run-2.html +398 -0
  70. package/docs/design/fixtures/runs/full-abc/slipstream/arm-b/run-3.html +595 -0
  71. package/docs/design/fixtures/runs/full-abc/tender/arm-a/run-1.html +622 -0
  72. package/docs/design/fixtures/runs/full-abc/tender/arm-a/run-2.html +475 -0
  73. package/docs/design/fixtures/runs/full-abc/tender/arm-a/run-3.html +660 -0
  74. package/docs/design/fixtures/runs/full-abc/tender/arm-b/run-1.html +531 -0
  75. package/docs/design/fixtures/runs/full-abc/tender/arm-b/run-2.html +565 -0
  76. package/docs/design/fixtures/runs/full-abc/tender/arm-b/run-3.html +674 -0
  77. package/docs/design/fixtures/runs/full-abc/voltage/arm-a/run-1.html +525 -0
  78. package/docs/design/fixtures/runs/full-abc/voltage/arm-a/run-2.html +446 -0
  79. package/docs/design/fixtures/runs/full-abc/voltage/arm-a/run-3.html +463 -0
  80. package/docs/design/fixtures/runs/full-abc/voltage/arm-b/run-1.html +388 -0
  81. package/docs/design/fixtures/runs/full-abc/voltage/arm-b/run-2.html +463 -0
  82. package/docs/design/fixtures/runs/full-abc/voltage/arm-b/run-3.html +568 -0
  83. package/docs/design/fixtures/runs/full-abc-opus/cadence/arm-a/run-1.html +1068 -0
  84. package/docs/design/fixtures/runs/full-abc-opus/cadence/arm-a/run-2.html +1423 -0
  85. package/docs/design/fixtures/runs/full-abc-opus/cadence/arm-a/run-3.html +1245 -0
  86. package/docs/design/fixtures/runs/full-abc-opus/cadence/arm-b/run-1.html +305 -0
  87. package/docs/design/fixtures/runs/full-abc-opus/cadence/arm-b/run-2.html +327 -0
  88. package/docs/design/fixtures/runs/full-abc-opus/cadence/arm-b/run-3.html +428 -0
  89. package/docs/design/fixtures/runs/full-abc-opus/plume/arm-a/run-1.html +1270 -0
  90. package/docs/design/fixtures/runs/full-abc-opus/plume/arm-a/run-2.html +1172 -0
  91. package/docs/design/fixtures/runs/full-abc-opus/plume/arm-a/run-3.html +1532 -0
  92. package/docs/design/fixtures/runs/full-abc-opus/plume/arm-b/run-1.html +315 -0
  93. package/docs/design/fixtures/runs/full-abc-opus/plume/arm-b/run-2.html +342 -0
  94. package/docs/design/fixtures/runs/full-abc-opus/plume/arm-b/run-3.html +353 -0
  95. package/docs/design/fixtures/runs/full-abc-opus/runs.json +190 -0
  96. package/docs/design/fixtures/runs/full-abc-opus/scorecard.json +144 -0
  97. package/docs/design/fixtures/runs/full-abc-opus/slipstream/arm-a/run-1.html +345 -0
  98. package/docs/design/fixtures/runs/full-abc-opus/slipstream/arm-a/run-2.html +396 -0
  99. package/docs/design/fixtures/runs/full-abc-opus/slipstream/arm-a/run-3.html +502 -0
  100. package/docs/design/fixtures/runs/full-abc-opus/slipstream/arm-b/run-1.html +408 -0
  101. package/docs/design/fixtures/runs/full-abc-opus/slipstream/arm-b/run-2.html +446 -0
  102. package/docs/design/fixtures/runs/full-abc-opus/slipstream/arm-b/run-3.html +496 -0
  103. package/docs/design/fixtures/runs/full-abc-opus/tender/arm-a/run-1.html +813 -0
  104. package/docs/design/fixtures/runs/full-abc-opus/tender/arm-a/run-2.html +711 -0
  105. package/docs/design/fixtures/runs/full-abc-opus/tender/arm-a/run-3.html +721 -0
  106. package/docs/design/fixtures/runs/full-abc-opus/tender/arm-b/run-1.html +280 -0
  107. package/docs/design/fixtures/runs/full-abc-opus/tender/arm-b/run-2.html +291 -0
  108. package/docs/design/fixtures/runs/full-abc-opus/tender/arm-b/run-3.html +366 -0
  109. package/docs/design/fixtures/runs/full-abc-opus/voltage/arm-a/run-1.html +1010 -0
  110. package/docs/design/fixtures/runs/full-abc-opus/voltage/arm-a/run-2.html +836 -0
  111. package/docs/design/fixtures/runs/full-abc-opus/voltage/arm-a/run-3.html +930 -0
  112. package/docs/design/fixtures/runs/full-abc-opus/voltage/arm-b/run-1.html +407 -0
  113. package/docs/design/fixtures/runs/full-abc-opus/voltage/arm-b/run-2.html +396 -0
  114. package/docs/design/fixtures/runs/full-abc-opus/voltage/arm-b/run-3.html +529 -0
  115. package/docs/design/foundations/brutalist.css +294 -0
  116. package/docs/design/foundations/editorial.css +300 -0
  117. package/docs/design/foundations/minimal-luxury.css +295 -0
  118. package/docs/design/foundations/technical.css +293 -0
  119. package/docs/design/foundations/warm-photo.css +299 -0
  120. package/docs/design/reference-corpus.md +1726 -0
  121. package/docs/design/render-critique-loop.md +57 -0
  122. package/docs/spec-graph-schema.md +397 -0
  123. package/package.json +1 -1
  124. package/scripts/bench-scorecard.mjs +239 -0
  125. package/scripts/build-spec-graph.mjs +509 -0
  126. package/scripts/classify-lane.sh +0 -7
  127. package/scripts/design-system-lint.mjs +993 -0
  128. package/scripts/graph-query.sh +486 -0
  129. package/scripts/transition-label.sh +10 -2
  130. package/scripts/validate-spec-graph.sh +423 -0
  131. package/templates/workflows/forgedock-review.yml +96 -0
@@ -0,0 +1,420 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
+ <title>Cadence — Transactional & Marketing Email API</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="preconnect" href="https://fonts.googleapis.com" />
9
+ <link href="https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=DM+Mono:wght@400;500&display=swap" rel="stylesheet" />
10
+ <style>
11
+ body { font-family: 'DM Sans', sans-serif; }
12
+ code, pre, .mono { font-family: 'DM Mono', monospace; }
13
+ .hero-bg {
14
+ background: #fff8f0;
15
+ }
16
+ .code-surface {
17
+ background: #1c1917;
18
+ color: #e7e5e4;
19
+ }
20
+ .kw { color: #fb923c; }
21
+ .str { color: #86efac; }
22
+ .fn { color: #c4b5fd; }
23
+ .pr { color: #7dd3fc; }
24
+ .cm { color: #78716c; }
25
+ .pl { color: #e7e5e4; }
26
+ .pill {
27
+ display: inline-block;
28
+ background: #fff;
29
+ border: 1.5px solid #e7e5e4;
30
+ border-radius: 9999px;
31
+ padding: 2px 12px;
32
+ font-size: 12px;
33
+ font-weight: 500;
34
+ }
35
+ .section-label {
36
+ font-size: 11px;
37
+ font-weight: 600;
38
+ letter-spacing: 0.12em;
39
+ text-transform: uppercase;
40
+ color: #ea580c;
41
+ }
42
+ .tab-active {
43
+ background: #fff;
44
+ box-shadow: 0 1px 3px rgba(0,0,0,0.08);
45
+ color: #1c1917;
46
+ }
47
+ .tab-inactive {
48
+ color: #78716c;
49
+ }
50
+ .feature-icon {
51
+ width: 44px; height: 44px;
52
+ border-radius: 10px;
53
+ display: flex; align-items: center; justify-content: center;
54
+ }
55
+ .wave-divider {
56
+ width: 100%; overflow: hidden; line-height: 0;
57
+ }
58
+ </style>
59
+ </head>
60
+ <body class="bg-stone-50 text-stone-900 antialiased">
61
+
62
+ <!-- Nav -->
63
+ <nav class="bg-white border-b border-stone-200 sticky top-0 z-50">
64
+ <div class="max-w-7xl mx-auto px-6 h-16 flex items-center justify-between">
65
+ <div class="flex items-center gap-10">
66
+ <div class="flex items-center gap-2">
67
+ <div class="w-7 h-7 bg-orange-500 rounded-md flex items-center justify-center">
68
+ <svg class="w-4 h-4 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2.5"><path stroke-linecap="round" stroke-linejoin="round" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" /></svg>
69
+ </div>
70
+ <span class="font-semibold text-stone-900 text-lg">Cadence</span>
71
+ </div>
72
+ <div class="hidden md:flex items-center gap-7 text-sm text-stone-500 font-medium">
73
+ <a href="#" class="hover:text-stone-900 transition-colors">Documentation</a>
74
+ <a href="#" class="hover:text-stone-900 transition-colors">API Reference</a>
75
+ <a href="#" class="hover:text-stone-900 transition-colors">Templates</a>
76
+ <a href="#" class="hover:text-stone-900 transition-colors">Pricing</a>
77
+ <a href="#" class="hover:text-stone-900 transition-colors">Changelog</a>
78
+ </div>
79
+ </div>
80
+ <div class="flex items-center gap-3">
81
+ <a href="#" class="text-sm text-stone-500 font-medium hover:text-stone-900">Log in</a>
82
+ <a href="#" class="text-sm bg-orange-500 hover:bg-orange-600 text-white font-semibold px-4 py-2 rounded-lg transition-colors shadow-sm">Get started</a>
83
+ </div>
84
+ </div>
85
+ </nav>
86
+
87
+ <!-- Hero -->
88
+ <section class="hero-bg px-6 pt-20 pb-0 overflow-hidden">
89
+ <div class="max-w-7xl mx-auto">
90
+
91
+ <div class="text-center mb-14">
92
+ <div class="inline-flex items-center gap-2 bg-orange-50 text-orange-700 border border-orange-200 rounded-full px-3 py-1.5 text-xs font-medium mb-6">
93
+ <svg class="w-3.5 h-3.5" fill="currentColor" viewBox="0 0 20 20"><path fill-rule="evenodd" d="M11.3 1.046A1 1 0 0112 2v5h4a1 1 0 01.82 1.573l-7 10A1 1 0 018 18v-5H4a1 1 0 01-.82-1.573l7-10a1 1 0 011.12-.38z" clip-rule="evenodd" /></svg>
94
+ 4.2 billion emails delivered last year
95
+ </div>
96
+ <h1 class="text-6xl font-bold text-stone-900 leading-[1.08] tracking-tight mb-6 max-w-3xl mx-auto">
97
+ Email from your app,<br />
98
+ <span class="text-orange-500">without the ops burden.</span>
99
+ </h1>
100
+ <p class="text-xl text-stone-500 max-w-2xl mx-auto leading-relaxed mb-10">
101
+ Cadence is the email API for engineering teams who want reliable delivery and a dashboard their marketing team can actually use. Transactional, marketing, or both.
102
+ </p>
103
+ <div class="flex flex-col sm:flex-row gap-3 justify-center items-center">
104
+ <a href="#" class="w-full sm:w-auto bg-orange-500 hover:bg-orange-600 text-white font-semibold px-7 py-3.5 rounded-xl text-base transition-colors shadow-md shadow-orange-200">Get your API key →</a>
105
+ <a href="#" class="w-full sm:w-auto bg-white hover:bg-stone-50 text-stone-700 font-medium px-7 py-3.5 rounded-xl text-base border border-stone-200 transition-colors">See the docs</a>
106
+ </div>
107
+ <p class="text-sm text-stone-400 mt-4">Free up to 5,000 emails/month. No credit card needed.</p>
108
+ </div>
109
+
110
+ <!-- Big code panel -->
111
+ <div class="max-w-4xl mx-auto">
112
+ <div class="bg-white rounded-t-2xl border border-stone-200 border-b-0 shadow-xl">
113
+ <!-- Tab bar -->
114
+ <div class="flex gap-1 px-4 pt-4 pb-0">
115
+ <button class="tab-active mono text-xs px-4 py-2 rounded-t-lg">TypeScript</button>
116
+ <button class="tab-inactive mono text-xs px-4 py-2 rounded-t-lg hover:text-stone-700">Python</button>
117
+ <button class="tab-inactive mono text-xs px-4 py-2 rounded-t-lg hover:text-stone-700">Go</button>
118
+ <button class="tab-inactive mono text-xs px-4 py-2 rounded-t-lg hover:text-stone-700">Ruby</button>
119
+ <button class="tab-inactive mono text-xs px-4 py-2 rounded-t-lg hover:text-stone-700">cURL</button>
120
+ </div>
121
+ <div class="border-t border-stone-100 mx-4"></div>
122
+ </div>
123
+ <div class="code-surface rounded-b-2xl shadow-xl overflow-x-auto">
124
+ <div class="flex items-center gap-2 px-5 py-3 border-b border-stone-700/50">
125
+ <div class="w-3 h-3 rounded-full bg-red-500/70"></div>
126
+ <div class="w-3 h-3 rounded-full bg-yellow-500/70"></div>
127
+ <div class="w-3 h-3 rounded-full bg-green-500/70"></div>
128
+ <span class="ml-2 text-xs text-stone-500 mono">send-order-confirmation.ts</span>
129
+ </div>
130
+ <pre class="px-6 py-5 text-sm mono leading-7 overflow-x-auto"><code><span class="kw">import</span> <span class="pl">{ Cadence } </span><span class="kw">from</span> <span class="str">'@cadence/sdk'</span><span class="pl">;</span>
131
+
132
+ <span class="cm">// Initialize once — reuse across your app</span>
133
+ <span class="kw">const</span> <span class="pl">cadence = </span><span class="kw">new</span> <span class="fn">Cadence</span><span class="pl">({ apiKey: process.env.</span><span class="pr">CADENCE_API_KEY</span> <span class="pl">});</span>
134
+
135
+ <span class="cm">// In your order handler:</span>
136
+ <span class="kw">async function</span> <span class="fn">onOrderPlaced</span><span class="pl">(order: Order) {</span>
137
+ <span class="kw">const</span> <span class="pl">result = </span><span class="kw">await</span> <span class="pl">cadence.email.</span><span class="fn">send</span><span class="pl">({</span>
138
+ <span class="pr">to</span><span class="pl">: order.customer.email,</span>
139
+ <span class="pr">from</span><span class="pl">: </span><span class="str">'orders@acmecorp.com'</span><span class="pl">,</span>
140
+ <span class="pr">template</span><span class="pl">: </span><span class="str">'order-confirmed'</span><span class="pl">,</span>
141
+ <span class="pr">data</span><span class="pl">: {</span>
142
+ <span class="pr">orderNumber</span><span class="pl">: order.id,</span>
143
+ <span class="pr">items</span><span class="pl">: order.lineItems,</span>
144
+ <span class="pr">total</span><span class="pl">: order.total,</span>
145
+ <span class="pr">trackingUrl</span><span class="pl">: order.tracking,</span>
146
+ <span class="pl">},</span>
147
+ <span class="cm">// Safe to retry — won't duplicate-send</span>
148
+ <span class="pr">idempotencyKey</span><span class="pl">: </span><span class="str">`order-confirm-</span><span class="pl">${order.id}</span><span class="str">`</span><span class="pl">,</span>
149
+ <span class="pl">});</span>
150
+
151
+ <span class="cm">// { id: 'msg_01HX...', status: 'queued', estimatedDelivery: '...' }</span>
152
+ <span class="pl">console.</span><span class="fn">log</span><span class="pl">(</span><span class="str">'Email queued:'</span><span class="pl">, result.id);</span>
153
+ <span class="pl">}</span></code></pre>
154
+ </div>
155
+ </div>
156
+ </div>
157
+ </section>
158
+
159
+ <!-- Stats -->
160
+ <section class="bg-stone-900 text-white py-14 px-6">
161
+ <div class="max-w-7xl mx-auto grid grid-cols-2 md:grid-cols-4 gap-10 text-center">
162
+ <div>
163
+ <div class="text-4xl font-bold text-orange-400 mb-1">4.2B</div>
164
+ <div class="text-sm text-stone-400">Emails sent / year</div>
165
+ </div>
166
+ <div>
167
+ <div class="text-4xl font-bold text-orange-400 mb-1">99.97%</div>
168
+ <div class="text-sm text-stone-400">Deliverability rate</div>
169
+ </div>
170
+ <div>
171
+ <div class="text-4xl font-bold text-orange-400 mb-1">3,000+</div>
172
+ <div class="text-sm text-stone-400">Production teams</div>
173
+ </div>
174
+ <div>
175
+ <div class="text-4xl font-bold text-orange-400 mb-1">11</div>
176
+ <div class="text-sm text-stone-400">Official SDKs</div>
177
+ </div>
178
+ </div>
179
+ </section>
180
+
181
+ <!-- Deliverability section -->
182
+ <section class="py-24 px-6 bg-white">
183
+ <div class="max-w-7xl mx-auto">
184
+ <div class="grid lg:grid-cols-2 gap-16 items-center">
185
+ <div>
186
+ <div class="section-label mb-4">Deliverability</div>
187
+ <h2 class="text-4xl font-bold mb-5 leading-snug">Inbox placement isn't magic. It's engineering.</h2>
188
+ <p class="text-stone-500 leading-relaxed mb-8 text-lg">Most email problems — bounces, spam classification, blocked domains — come from skipping the hard infrastructure work. Cadence handles all of it, for every account, from the first send.</p>
189
+ <div class="space-y-6">
190
+ <div class="flex gap-4">
191
+ <div class="feature-icon bg-orange-50 shrink-0">
192
+ <svg class="w-5 h-5 text-orange-500" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path stroke-linecap="round" stroke-linejoin="round" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z" /></svg>
193
+ </div>
194
+ <div>
195
+ <div class="font-semibold mb-1">SPF, DKIM, and DMARC — guided setup</div>
196
+ <div class="text-stone-500 text-sm leading-relaxed">We walk you through exactly which DNS records to set, verify them, and alert you if they drift.</div>
197
+ </div>
198
+ </div>
199
+ <div class="flex gap-4">
200
+ <div class="feature-icon bg-orange-50 shrink-0">
201
+ <svg class="w-5 h-5 text-orange-500" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path stroke-linecap="round" stroke-linejoin="round" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" /></svg>
202
+ </div>
203
+ <div>
204
+ <div class="font-semibold mb-1">Automatic suppression handling</div>
205
+ <div class="text-stone-500 text-sm leading-relaxed">Hard bounces, spam complaints, and unsubscribes are captured by webhook and suppressed immediately. You never re-send to a bad address.</div>
206
+ </div>
207
+ </div>
208
+ <div class="flex gap-4">
209
+ <div class="feature-icon bg-orange-50 shrink-0">
210
+ <svg class="w-5 h-5 text-orange-500" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path stroke-linecap="round" stroke-linejoin="round" d="M16 8v8m-4-5v5m-4-2v2m-2 4h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z" /></svg>
211
+ </div>
212
+ <div>
213
+ <div class="font-semibold mb-1">IP warm-up managed automatically</div>
214
+ <div class="text-stone-500 text-sm leading-relaxed">New senders are ramped on shared pools before moving to dedicated IPs. No spreadsheet. No guessing.</div>
215
+ </div>
216
+ </div>
217
+ </div>
218
+ </div>
219
+
220
+ <!-- Visual card -->
221
+ <div class="bg-stone-50 rounded-2xl border border-stone-200 p-8">
222
+ <div class="text-sm font-semibold text-stone-700 mb-5">Deliverability status — last 30 days</div>
223
+ <div class="space-y-4">
224
+ <div>
225
+ <div class="flex justify-between text-sm mb-1.5">
226
+ <span class="text-stone-600">Delivered to inbox</span>
227
+ <span class="font-semibold text-stone-900">99.97%</span>
228
+ </div>
229
+ <div class="h-2.5 bg-stone-200 rounded-full overflow-hidden">
230
+ <div class="h-full bg-orange-500 rounded-full" style="width:99.97%"></div>
231
+ </div>
232
+ </div>
233
+ <div>
234
+ <div class="flex justify-between text-sm mb-1.5">
235
+ <span class="text-stone-600">Hard bounce rate</span>
236
+ <span class="font-semibold text-stone-900">0.02%</span>
237
+ </div>
238
+ <div class="h-2.5 bg-stone-200 rounded-full overflow-hidden">
239
+ <div class="h-full bg-green-400 rounded-full" style="width:0.02%"></div>
240
+ </div>
241
+ </div>
242
+ <div>
243
+ <div class="flex justify-between text-sm mb-1.5">
244
+ <span class="text-stone-600">Spam complaint rate</span>
245
+ <span class="font-semibold text-stone-900">0.008%</span>
246
+ </div>
247
+ <div class="h-2.5 bg-stone-200 rounded-full overflow-hidden">
248
+ <div class="h-full bg-green-400 rounded-full" style="width:0.008%"></div>
249
+ </div>
250
+ </div>
251
+ </div>
252
+
253
+ <div class="mt-8 border-t border-stone-200 pt-6 space-y-3">
254
+ <div class="flex items-center gap-3 text-sm">
255
+ <div class="w-2 h-2 rounded-full bg-green-500"></div>
256
+ <span class="text-stone-600">SPF</span><span class="text-green-600 font-medium ml-auto">Verified</span>
257
+ </div>
258
+ <div class="flex items-center gap-3 text-sm">
259
+ <div class="w-2 h-2 rounded-full bg-green-500"></div>
260
+ <span class="text-stone-600">DKIM</span><span class="text-green-600 font-medium ml-auto">Verified</span>
261
+ </div>
262
+ <div class="flex items-center gap-3 text-sm">
263
+ <div class="w-2 h-2 rounded-full bg-green-500"></div>
264
+ <span class="text-stone-600">DMARC</span><span class="text-green-600 font-medium ml-auto">p=reject enforced</span>
265
+ </div>
266
+ <div class="flex items-center gap-3 text-sm">
267
+ <div class="w-2 h-2 rounded-full bg-green-500"></div>
268
+ <span class="text-stone-600">Suppression list</span><span class="text-green-600 font-medium ml-auto">Active</span>
269
+ </div>
270
+ </div>
271
+ </div>
272
+ </div>
273
+ </div>
274
+ </section>
275
+
276
+ <!-- For both teams -->
277
+ <section class="py-24 px-6 bg-stone-50">
278
+ <div class="max-w-7xl mx-auto">
279
+ <div class="text-center mb-16">
280
+ <div class="section-label mb-4">For everyone on the team</div>
281
+ <h2 class="text-4xl font-bold mb-4">Engineers wire it up. Everyone else runs it.</h2>
282
+ <p class="text-stone-500 max-w-2xl mx-auto text-lg">The API gives engineers full control over when and how email is sent. The dashboard gives non-engineers full control over what's in it — without needing a deploy.</p>
283
+ </div>
284
+
285
+ <div class="grid md:grid-cols-2 gap-6">
286
+ <div class="bg-white border border-stone-200 rounded-2xl p-8 shadow-sm">
287
+ <div class="w-12 h-12 bg-stone-900 rounded-xl flex items-center justify-center mb-5">
288
+ <svg class="w-6 h-6 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5"><path stroke-linecap="round" stroke-linejoin="round" d="M10 20l4-16m4 4l4 4-4 4M6 16l-4-4 4-4" /></svg>
289
+ </div>
290
+ <h3 class="text-xl font-semibold mb-2">Built for engineers</h3>
291
+ <p class="text-stone-500 mb-6 text-sm leading-relaxed">REST API with idiomatic SDKs, predictable errors, and the primitives you expect from production infrastructure.</p>
292
+ <ul class="space-y-2.5 text-sm text-stone-600">
293
+ <li class="flex gap-2"><span class="text-orange-500 font-bold">→</span> Node, Python, Go, Ruby, PHP, Elixir, Java SDKs</li>
294
+ <li class="flex gap-2"><span class="text-orange-500 font-bold">→</span> Idempotency keys for safe retries</li>
295
+ <li class="flex gap-2"><span class="text-orange-500 font-bold">→</span> Webhooks for delivery events</li>
296
+ <li class="flex gap-2"><span class="text-orange-500 font-bold">→</span> React Email template support</li>
297
+ <li class="flex gap-2"><span class="text-orange-500 font-bold">→</span> Scheduled sends via API parameter</li>
298
+ <li class="flex gap-2"><span class="text-orange-500 font-bold">→</span> Test mode — sends captured, not delivered</li>
299
+ </ul>
300
+ </div>
301
+
302
+ <div class="bg-white border border-stone-200 rounded-2xl p-8 shadow-sm">
303
+ <div class="w-12 h-12 bg-orange-500 rounded-xl flex items-center justify-center mb-5">
304
+ <svg class="w-6 h-6 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5"><path stroke-linecap="round" stroke-linejoin="round" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z" /></svg>
305
+ </div>
306
+ <h3 class="text-xl font-semibold mb-2">Built for content teams</h3>
307
+ <p class="text-stone-500 mb-6 text-sm leading-relaxed">Write and manage emails directly in the dashboard. Preview with real data. Schedule campaigns. No code changes, no deployments.</p>
308
+ <ul class="space-y-2.5 text-sm text-stone-600">
309
+ <li class="flex gap-2"><span class="text-orange-500 font-bold">→</span> Visual template editor with live preview</li>
310
+ <li class="flex gap-2"><span class="text-orange-500 font-bold">→</span> Preview with real subscriber data</li>
311
+ <li class="flex gap-2"><span class="text-orange-500 font-bold">→</span> Schedule or send campaigns immediately</li>
312
+ <li class="flex gap-2"><span class="text-orange-500 font-bold">→</span> Per-campaign analytics: opens, clicks, bounces</li>
313
+ <li class="flex gap-2"><span class="text-orange-500 font-bold">→</span> Template version history and rollback</li>
314
+ <li class="flex gap-2"><span class="text-orange-500 font-bold">→</span> Role-based access — separate from API keys</li>
315
+ </ul>
316
+ </div>
317
+ </div>
318
+ </div>
319
+ </section>
320
+
321
+ <!-- Analytics -->
322
+ <section class="py-24 px-6 bg-white">
323
+ <div class="max-w-7xl mx-auto">
324
+ <div class="grid lg:grid-cols-2 gap-16 items-center">
325
+ <!-- Mock analytics widget -->
326
+ <div class="bg-stone-50 border border-stone-200 rounded-2xl p-8">
327
+ <div class="flex items-center justify-between mb-6">
328
+ <div class="font-semibold text-stone-900">order-confirmed</div>
329
+ <div class="pill text-stone-500">Last 7 days</div>
330
+ </div>
331
+ <div class="grid grid-cols-2 gap-4 mb-8">
332
+ <div class="bg-white border border-stone-200 rounded-xl p-4">
333
+ <div class="text-2xl font-bold text-stone-900 mb-0.5">24,821</div>
334
+ <div class="text-sm text-stone-500">Delivered</div>
335
+ <div class="text-xs text-green-600 mt-1">↑ 12% vs last week</div>
336
+ </div>
337
+ <div class="bg-white border border-stone-200 rounded-xl p-4">
338
+ <div class="text-2xl font-bold text-stone-900 mb-0.5">68.4%</div>
339
+ <div class="text-sm text-stone-500">Open rate</div>
340
+ <div class="text-xs text-green-600 mt-1">↑ 3.1% vs last week</div>
341
+ </div>
342
+ <div class="bg-white border border-stone-200 rounded-xl p-4">
343
+ <div class="text-2xl font-bold text-stone-900 mb-0.5">22.7%</div>
344
+ <div class="text-sm text-stone-500">Click rate</div>
345
+ <div class="text-xs text-stone-400 mt-1">→ Stable</div>
346
+ </div>
347
+ <div class="bg-white border border-stone-200 rounded-xl p-4">
348
+ <div class="text-2xl font-bold text-stone-900 mb-0.5">0.03%</div>
349
+ <div class="text-sm text-stone-500">Bounce rate</div>
350
+ <div class="text-xs text-green-600 mt-1">↓ Below threshold</div>
351
+ </div>
352
+ </div>
353
+ <!-- Fake mini chart bars -->
354
+ <div class="flex items-end gap-1.5 h-16">
355
+ <div class="bg-orange-200 rounded-sm flex-1" style="height:45%"></div>
356
+ <div class="bg-orange-300 rounded-sm flex-1" style="height:60%"></div>
357
+ <div class="bg-orange-400 rounded-sm flex-1" style="height:55%"></div>
358
+ <div class="bg-orange-500 rounded-sm flex-1" style="height:80%"></div>
359
+ <div class="bg-orange-400 rounded-sm flex-1" style="height:75%"></div>
360
+ <div class="bg-orange-300 rounded-sm flex-1" style="height:90%"></div>
361
+ <div class="bg-orange-500 rounded-sm flex-1" style="height:100%"></div>
362
+ </div>
363
+ <div class="flex justify-between text-xs text-stone-400 mt-2">
364
+ <span>Mon</span><span>Tue</span><span>Wed</span><span>Thu</span><span>Fri</span><span>Sat</span><span>Sun</span>
365
+ </div>
366
+ </div>
367
+
368
+ <div>
369
+ <div class="section-label mb-4">Analytics</div>
370
+ <h2 class="text-4xl font-bold mb-5 leading-snug">Know exactly what happened to every email.</h2>
371
+ <p class="text-stone-500 leading-relaxed mb-6 text-lg">Opens, clicks, deliveries, and bounces tracked per message and per template. Stream all events to your data warehouse via webhooks, or query via the Events API.</p>
372
+ <ul class="space-y-4 text-stone-700">
373
+ <li class="flex gap-3 items-start">
374
+ <svg class="w-5 h-5 text-orange-500 mt-0.5 shrink-0" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12" /></svg>
375
+ <span>Per-message status — delivered, bounced, opened, clicked, unsubscribed</span>
376
+ </li>
377
+ <li class="flex gap-3 items-start">
378
+ <svg class="w-5 h-5 text-orange-500 mt-0.5 shrink-0" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12" /></svg>
379
+ <span>Template-level aggregates — roll up performance across all sends for a template</span>
380
+ </li>
381
+ <li class="flex gap-3 items-start">
382
+ <svg class="w-5 h-5 text-orange-500 mt-0.5 shrink-0" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12" /></svg>
383
+ <span>Webhook delivery for all events — pipe to Segment, Amplitude, or your own pipeline</span>
384
+ </li>
385
+ <li class="flex gap-3 items-start">
386
+ <svg class="w-5 h-5 text-orange-500 mt-0.5 shrink-0" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12" /></svg>
387
+ <span>30-day event log with full metadata — timestamps, user agents, IP addresses</span>
388
+ </li>
389
+ </ul>
390
+ </div>
391
+ </div>
392
+ </div>
393
+ </section>
394
+
395
+ <!-- CTA -->
396
+ <section class="bg-stone-900 py-24 px-6">
397
+ <div class="max-w-3xl mx-auto text-center">
398
+ <h2 class="text-4xl font-bold text-white mb-4">Send your first email in under five minutes.</h2>
399
+ <p class="text-stone-400 text-lg mb-10">Free plan includes 5,000 emails per month. No credit card. No SMTP setup. No warm-up spreadsheet.</p>
400
+ <a href="#" class="inline-block bg-orange-500 hover:bg-orange-400 text-white font-bold px-10 py-4 rounded-xl text-base transition-colors shadow-lg shadow-orange-900/40">Get your API key →</a>
401
+ <p class="text-stone-600 text-sm mt-5">Trusted by 3,000+ engineering teams in production</p>
402
+ </div>
403
+ </section>
404
+
405
+ <!-- Footer -->
406
+ <footer class="bg-stone-950 text-stone-500 py-10 px-6">
407
+ <div class="max-w-7xl mx-auto flex flex-col md:flex-row items-center justify-between gap-4 text-sm">
408
+ <span class="font-semibold text-stone-300">Cadence</span>
409
+ <div class="flex gap-6">
410
+ <a href="#" class="hover:text-stone-300">Docs</a>
411
+ <a href="#" class="hover:text-stone-300">Status</a>
412
+ <a href="#" class="hover:text-stone-300">Privacy</a>
413
+ <a href="#" class="hover:text-stone-300">Terms</a>
414
+ <a href="#" class="hover:text-stone-300">Security</a>
415
+ </div>
416
+ </div>
417
+ </footer>
418
+
419
+ </body>
420
+ </html>