added on WebSTLs (webstls.com) at 2026-07-01 22:27:00
| 1 | <!-- ── Top navigation ────────────────────────────────────────── --> | |
| 2 | <header class="landing-nav"> | |
| 3 | <div class="landing-nav-inner"> | |
| 4 | <a href="index.cgi" class="flex items-center gap-3" style="text-decoration:none"> | |
| 5 | <div class="brand-mark"><span>WS</span></div> | |
| 6 | <div class="brand-text"> | |
| 7 | <span class="brand-name">WebSTLs</span> | |
| 8 | <span class="brand-sub">Creator Platform</span> | |
| 9 | </div> | |
| 10 | </a> | |
| 11 | <nav class="links"> | |
| 12 | <a href="features.cgi">Features</a> | |
| 13 | <a href="tour.cgi">Tour</a> | |
| 14 | <a href="why.cgi">Why WebSTLs</a> | |
| 15 | <a href="pricing.cgi">Pricing</a> | |
| 16 | <a href="faq.cgi">FAQ</a> | |
| 17 | <a href="about.cgi">About</a> | |
| 18 | </nav> | |
| 19 | <div class="auth-actions"> | |
| 20 | <a href="login.cgi" class="btn btn-ghost btn-sm">Sign in</a> | |
| 21 | <a href="signup.cgi" class="btn btn-primary btn-sm">Start free trial</a> | |
| 22 | </div> | |
| 23 | </div> | |
| 24 | </header> | |
| 25 | ||
| 26 | <!-- ── Hero ───────────────────────────────────────────────────── --> | |
| 27 | <section class="hero"> | |
| 28 | <div class="hero-grid-bg"></div> | |
| 29 | <div class="hero-glow-1"></div> | |
| 30 | <div class="hero-glow-2"></div> | |
| 31 | <div class="hero-glow-3"></div> | |
| 32 | ||
| 33 | <div class="hero-inner"> | |
| 34 | <div> | |
| 35 | <span class="hero-pill"> | |
| 36 | <span class="dot"></span> Cross-marketplace publishing · Branded storefront · A/B testing | |
| 37 | </span> | |
| 38 | <h1 class="hero-title" style="font-size:clamp(28px,4.2vw,52px);line-height:1.12;letter-spacing:-0.02em;max-width:780px"> | |
| 39 | No more spending hours copy-pasting listings. <span class="grad">WebSTLs pushes your 3D models to the top marketplaces with one click.</span> | |
| 40 | </h1> | |
| 41 | <p class="hero-sub" style="max-width:680px"> | |
| 42 | List once. Push everywhere. Edit once — updates flow to every connected platform. Plus run your own branded | |
| 43 | storefront with A/B testing, bundles, promotions, and full analytics. Keep your customers, your data, and your time. | |
| 44 | </p> | |
| 45 | <div class="hero-cta"> | |
| 46 | <a href="signup.cgi" class="btn btn-primary btn-lg">Start free trial</a> | |
| 47 | <a href="#features" class="btn btn-secondary btn-lg">See the platform</a> | |
| 48 | </div> | |
| 49 | <div class="hero-trust"> | |
| 50 | <div class="hero-trust-item"> | |
| 51 | <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="20 6 9 17 4 12"/></svg> | |
| 52 | No credit card required | |
| 53 | </div> | |
| 54 | <div class="hero-trust-item"> | |
| 55 | <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="20 6 9 17 4 12"/></svg> | |
| 56 | SOC 2 in progress · 2FA · audit log | |
| 57 | </div> | |
| 58 | <div class="hero-trust-item"> | |
| 59 | <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="20 6 9 17 4 12"/></svg> | |
| 60 | You own the customer relationship | |
| 61 | </div> | |
| 62 | </div> | |
| 63 | </div> | |
| 64 | ||
| 65 | <!-- Hero visual: stacked floating dashboard cards --> | |
| 66 | <div class="hero-visual"> | |
| 67 | <div class="float-card fc-1"> | |
| 68 | <div class="flex justify-between items-center mb-1"> | |
| 69 | <span class="text-xs text-dim" style="letter-spacing:1.5px;text-transform:uppercase">Revenue · MTD</span> | |
| 70 | <span class="pill success" style="padding:2px 8px;font-size:10px">+18.4%</span> | |
| 71 | </div> | |
| 72 | <div style="font-family:var(--font-display);font-size:28px;font-weight:700;color:#fff">\$8,142.60</div> | |
| 73 | <svg class="spark mt-1" data-points="14,18,16,22,28,24,32,40,38,44,52,58" style="height:60px" data-eyebrow="Revenue trend" data-prefix="\$" data-fulllabels="Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec"></svg> | |
| 74 | </div> | |
| 75 | ||
| 76 | <div class="float-card fc-2"> | |
| 77 | <div class="text-xs text-dim mb-2" style="letter-spacing:1.5px;text-transform:uppercase">Publishing queue</div> | |
| 78 | <div class="flex items-center gap-3 mb-1"> | |
| 79 | <span class="dot-status green"></span> | |
| 80 | <span class="text-sm fw-600">Cults3D</span> | |
| 81 | <span class="text-xs text-dim" style="margin-left:auto">live · 87 models</span> | |
| 82 | </div> | |
| 83 | <div class="flex items-center gap-3 mb-1"> | |
| 84 | <span class="dot-status green"></span> | |
| 85 | <span class="text-sm fw-600">MyMiniFactory</span> | |
| 86 | <span class="text-xs text-dim" style="margin-left:auto">live · 64 models</span> | |
| 87 | </div> | |
| 88 | <div class="flex items-center gap-3 mb-1"> | |
| 89 | <span class="dot-status yellow"></span> | |
| 90 | <span class="text-sm fw-600">Patreon</span> | |
| 91 | <span class="text-xs text-dim" style="margin-left:auto">syncing…</span> | |
| 92 | </div> | |
| 93 | <div class="flex items-center gap-3"> | |
| 94 | <span class="dot-status green"></span> | |
| 95 | <span class="text-sm fw-600">Gumroad</span> | |
| 96 | <span class="text-xs text-dim" style="margin-left:auto">live · 91 models</span> | |
| 97 | </div> | |
| 98 | </div> | |
| 99 | ||
| 100 | <div class="float-card fc-3"> | |
| 101 | <div class="flex items-center justify-between mb-2"> | |
| 102 | <span class="text-xs text-dim" style="letter-spacing:1.5px;text-transform:uppercase">A/B Test · Hero variant</span> | |
| 103 | <span class="pill brand" style="padding:2px 8px;font-size:10px">RUNNING</span> | |
| 104 | </div> | |
| 105 | <div class="flex justify-between mb-1"> | |
| 106 | <span class="text-sm">Variant A</span> | |
| 107 | <span class="text-sm fw-600 tabular">3.42%</span> | |
| 108 | </div> | |
| 109 | <div class="progress mb-2"><div class="progress-fill" style="width:62%"></div></div> | |
| 110 | <div class="flex justify-between mb-1"> | |
| 111 | <span class="text-sm">Variant B</span> | |
| 112 | <span class="text-sm fw-600 tabular text-success">5.18%</span> | |
| 113 | </div> | |
| 114 | <div class="progress"><div class="progress-fill" style="width:94%;background:linear-gradient(130deg,#16a34a,#22c55e)"></div></div> | |
| 115 | <div class="text-xs text-dim mt-1">Confidence 96.4% — winning</div> | |
| 116 | </div> | |
| 117 | </div> | |
| 118 | </div> | |
| 119 | </section> | |
| 120 | ||
| 121 | ||
| 122 | <!-- ── What you save vs the rest ────────────────────────────── --> | |
| 123 | <section class="section" style="padding:48px 24px 24px"> | |
| 124 | <div style="max-width:920px;margin:0 auto"> | |
| 125 | <div style="text-align:center;font-size:11px;text-transform:uppercase;letter-spacing:2px;color:#94a3b8;font-weight:700;margin-bottom:8px">Why 3D creators switch</div> | |
| 126 | <h2 style="text-align:center;font-size:clamp(22px,2.8vw,30px);margin:0 0 28px;font-weight:700">Keep the reach. Keep your customers. Keep your margin.</h2> | |
| 127 | <div style="display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px"> | |
| 128 | <div style="background:rgba(148,163,184,0.06);border:1px solid rgba(148,163,184,0.15);border-radius:12px;padding:22px"> | |
| 129 | <div style="font-size:10px;text-transform:uppercase;letter-spacing:1.5px;color:#94a3b8;font-weight:700;margin-bottom:14px">Most creator platforms</div> | |
| 130 | <ul style="list-style:none;padding:0;margin:0;font-size:13px;color:#cbd5e1;line-height:1.7"> | |
| 131 | <li style="display:flex;gap:8px;margin-bottom:6px"><span style="color:#94a3b8;flex-shrink:0">×</span><span>15–30% commission on every marketplace sale</span></li> | |
| 132 | <li style="display:flex;gap:8px;margin-bottom:6px"><span style="color:#94a3b8;flex-shrink:0">×</span><span>Marketplace owns the customer relationship</span></li> | |
| 133 | <li style="display:flex;gap:8px;margin-bottom:6px"><span style="color:#94a3b8;flex-shrink:0">×</span><span>Manual copy-paste across every platform</span></li> | |
| 134 | <li style="display:flex;gap:8px;margin-bottom:6px"><span style="color:#94a3b8;flex-shrink:0">×</span><span>No A/B testing, no bundles, no promotions</span></li> | |
| 135 | <li style="display:flex;gap:8px;margin-bottom:0"><span style="color:#94a3b8;flex-shrink:0">×</span><span>Generic listing page — no brand of your own</span></li> | |
| 136 | </ul> | |
| 137 | </div> | |
| 138 | <div style="background:linear-gradient(135deg,rgba(99,102,241,0.10) 0%,rgba(124,58,237,0.10) 100%);border:1px solid rgba(124,58,237,0.4);border-radius:12px;padding:22px"> | |
| 139 | <div style="font-size:10px;text-transform:uppercase;letter-spacing:1.5px;color:#a78bfa;font-weight:700;margin-bottom:14px">WebSTLs</div> | |
| 140 | <ul style="list-style:none;padding:0;margin:0;font-size:13px;color:#e6ecf6;line-height:1.7"> | |
| 141 | <li style="display:flex;gap:8px;margin-bottom:6px"><span style="color:#22c55e;flex-shrink:0">✓</span><span>Push once, list everywhere — one console</span></li> | |
| 142 | <li style="display:flex;gap:8px;margin-bottom:6px"><span style="color:#22c55e;flex-shrink:0">✓</span><span>You own customer emails, data, and the relationship</span></li> | |
| 143 | <li style="display:flex;gap:8px;margin-bottom:6px"><span style="color:#22c55e;flex-shrink:0">✓</span><span>Edit once — updates every connected platform</span></li> | |
| 144 | <li style="display:flex;gap:8px;margin-bottom:6px"><span style="color:#22c55e;flex-shrink:0">✓</span><span>A/B testing, bundles, promotions — built in</span></li> | |
| 145 | <li style="display:flex;gap:8px;margin-bottom:0"><span style="color:#22c55e;flex-shrink:0">✓</span><span>Branded storefront under your own domain</span></li> | |
| 146 | </ul> | |
| 147 | </div> | |
| 148 | </div> | |
| 149 | </div> | |
| 150 | </section> | |
| 151 | ||
| 152 | <!-- ── Logo / platform strip ─────────────────────────────────── --> | |
| 153 | <section class="section" style="padding-top:0"> | |
| 154 | <div class="card" style="padding:28px 32px;display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap"> | |
| 155 | <div class="text-xs text-dim" style="letter-spacing:2px;text-transform:uppercase;font-weight:700">Publishes to</div> | |
| 156 | <div class="flex items-center gap-6" style="flex-wrap:wrap;font-family:var(--font-display);color:var(--col-text-2);font-size:18px;letter-spacing:1px"> | |
| 157 | <span>Cults3D</span><span class="text-dim">·</span> | |
| 158 | <span>MyMiniFactory</span><span class="text-dim">·</span> | |
| 159 | <span>Patreon</span><span class="text-dim">·</span> | |
| 160 | <span>Gumroad</span><span class="text-dim">·</span> | |
| 161 | <span>Payhip</span><span class="text-dim">·</span> | |
| 162 | <span>Ko‑fi</span><span class="text-dim">·</span> | |
| 163 | <span>MakerWorld</span><span class="text-dim">·</span> | |
| 164 | <span>Printables</span> | |
| 165 | </div> | |
| 166 | </div> | |
| 167 | </section> | |
| 168 | ||
| 169 | ||
| 170 | <!-- ── Feature grid ──────────────────────────────────────────── --> | |
| 171 | <section class="section" id="features"> | |
| 172 | <span class="section-eyebrow">One Platform · Four Modules</span> | |
| 173 | <h2 class="section-title">Built for the way <span class="grad">3D creators actually work.</span></h2> | |
| 174 | <p class="section-sub"> | |
| 175 | Every module is designed and built together — no retrofitted features, no | |
| 176 | forced migrations later. We reveal them in stages so you can adopt at your | |
| 177 | own pace, but the whole system is wired up from day one. | |
| 178 | </p> | |
| 179 | ||
| 180 | <div class="feature-grid"> | |
| 181 | <div class="feature"> | |
| 182 | <div class="feature-icon"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 2 11 13"/><path d="m22 2-7 20-4-9-9-4 20-7Z"/></svg></div> | |
| 183 | <div class="feature-title">Cross‑Platform Publishing</div> | |
| 184 | <p class="feature-desc">One upload. Push to the top marketplaces with per‑platform overrides for title, description, price, tags and category. Retries, queue, audit log, all built in.</p> | |
| 185 | </div> | |
| 186 | <div class="feature"> | |
| 187 | <div class="feature-icon"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="m3 9 1-5h16l1 5"/><path d="M5 9v11a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V9"/><path d="M9 21V13h6v8"/></svg></div> | |
| 188 | <div class="feature-title">Branded Storefront</div> | |
| 189 | <p class="feature-desc">Your own subdomain or custom domain. Page builder with theme templates. Stripe Connect payouts. Buyer accounts. Custom checkout. Refunds and disputes handled.</p> | |
| 190 | </div> | |
| 191 | <div class="feature"> | |
| 192 | <div class="feature-icon"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 12h-4l-3 9L9 3l-3 9H2"/></svg></div> | |
| 193 | <div class="feature-title">Optimization Suite</div> | |
| 194 | <span class="feature-tag">Live</span> | |
| 195 | <p class="feature-desc">A/B test whole pages with one-click duplication. MVT block tests — pick a page, name your slots, paste <code>{{slot:hero}}</code> tokens. Layout + theme swap by variant. Price-bandit experiments. Van Westendorp surveys. All with Bayesian stats, not vibes.</p> | |
| 196 | </div> | |
| 197 | <div class="feature"> | |
| 198 | <div class="feature-icon"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 3v18h18"/><path d="m7 14 4-4 4 4 5-5"/></svg></div> | |
| 199 | <div class="feature-title">Cross‑Platform Analytics</div> | |
| 200 | <p class="feature-desc">Unified revenue across every channel. Top performers across stores. Funnel analysis. Tax‑ready CSV. No more juggling spreadsheets.</p> | |
| 201 | </div> | |
| 202 | <div class="feature"> | |
| 203 | <div class="feature-icon"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/></svg></div> | |
| 204 | <div class="feature-title">Pooled‑Data Recommendations</div> | |
| 205 | <span class="feature-tag">Phase 5</span> | |
| 206 | <p class="feature-desc">Anonymized benchmarking against your peer segment. The platform tells you which themes, prices, and tags actually convert in your category.</p> | |
| 207 | </div> | |
| 208 | <div class="feature"> | |
| 209 | <div class="feature-icon"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10Z"/><path d="m9 12 2 2 4-4"/></svg></div> | |
| 210 | <div class="feature-title">Operations‑Grade Trust</div> | |
| 211 | <p class="feature-desc">2FA, encrypted OAuth tokens, AES‑256 file storage, audit logging, ClamAV scanning, automated backups, real status page. Built like infrastructure, not a side project.</p> | |
| 212 | </div> | |
| 213 | </div> | |
| 214 | </section> | |
| 215 | ||
| 216 | ||
| 217 | <!-- ── Module deep‑dive: Publishing ──────────────────────────── --> | |
| 218 | <section class="section" id="publishing"> | |
| 219 | <div class="dash-grid" style="align-items:center"> | |
| 220 | <div> | |
| 221 | <span class="section-eyebrow">Publishing Module</span> | |
| 222 | <h2 class="section-title" style="font-size:38px">Upload once. <span class="grad">Sell everywhere.</span></h2> | |
| 223 | <p class="section-sub" style="margin-bottom:24px"> | |
| 224 | Connect your platforms with OAuth in two clicks. WebSTLs pushes new models to | |
| 225 | every channel, watches health continuously, and queues work automatically when | |
| 226 | a marketplace is having a bad day. You get one queue, one inbox, one truth. | |
| 227 | </p> | |
| 228 | <ul class="price-list" style="margin:0 0 28px"> | |
| 229 | <li><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg> Per‑platform overrides for title, description, pricing</li> | |
| 230 | <li><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg> Circuit breakers + auto‑recovery when an API misbehaves</li> | |
| 231 | <li><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg> Browser extension for non‑API platforms (MakerWorld, Printables, Thangs)</li> | |
| 232 | <li><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg> Cross‑platform comment & review inbox</li> | |
| 233 | </ul> | |
| 234 | <a href="signup.cgi" class="btn btn-primary">Try Publishing free →</a> | |
| 235 | </div> | |
| 236 | ||
| 237 | <div class="card card-elevated" style="padding:0;overflow:hidden"> | |
| 238 | <div style="padding:18px 22px;border-bottom:1px solid var(--col-border);display:flex;align-items:center;justify-content:space-between"> | |
| 239 | <div class="flex items-center gap-3"> | |
| 240 | <div class="module-icon" style="width:30px;height:30px"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 2 11 13"/><path d="m22 2-7 20-4-9-9-4 20-7Z"/></svg></div> | |
| 241 | <span class="module-title">Publishing Queue</span> | |
| 242 | </div> | |
| 243 | <span class="pill brand">7 in flight</span> | |
| 244 | </div> | |
| 245 | <div class="table-wrap" style="border:none;border-radius:0"> | |
| 246 | <table class="table"> | |
| 247 | <thead><tr><th>Model</th><th>Platform</th><th>Status</th><th class="num">Updated</th></tr></thead> | |
| 248 | <tbody> | |
| 249 | <tr><td><strong>Dragon Lord MK‑II</strong></td><td>Cults3D</td><td><span class="pill success"><span class="dot-status green"></span>Live</span></td><td class="num text-dim">2m</td></tr> | |
| 250 | <tr><td><strong>Dragon Lord MK‑II</strong></td><td>MyMiniFactory</td><td><span class="pill warning"><span class="dot-status yellow"></span>Publishing</span></td><td class="num text-dim">2m</td></tr> | |
| 251 | <tr><td><strong>Skirmisher Set Vol.4</strong></td><td>Gumroad</td><td><span class="pill success"><span class="dot-status green"></span>Live</span></td><td class="num text-dim">8m</td></tr> | |
| 252 | <tr><td><strong>Skirmisher Set Vol.4</strong></td><td>Patreon</td><td><span class="pill info">Queued</span></td><td class="num text-dim">8m</td></tr> | |
| 253 | <tr><td><strong>Bridge Terrain Pack</strong></td><td>Cults3D</td><td><span class="pill danger"><span class="dot-status red"></span>Retry 1/5</span></td><td class="num text-dim">12m</td></tr> | |
| 254 | </tbody> | |
| 255 | </table> | |
| 256 | </div> | |
| 257 | </div> | |
| 258 | </div> | |
| 259 | </section> | |
| 260 | ||
| 261 | ||
| 262 | <!-- ── Storefront strip ──────────────────────────────────────── --> | |
| 263 | <section class="section" id="storefront"> | |
| 264 | <div class="dash-grid" style="grid-template-columns:1fr 1fr;align-items:center"> | |
| 265 | <div class="card card-elevated" style="padding:0;overflow:hidden"> | |
| 266 | <div style="height:280px;background:linear-gradient(160deg, #0d1224 0%, #1a1142 100%);position:relative;overflow:hidden"> | |
| 267 | <div style="position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,0.06) 1px, transparent 1px);background-size:32px 32px"></div> | |
| 268 | <div style="position:absolute;top:24px;left:24px;color:#fff;font-family:var(--font-display);font-size:22px;font-weight:600">demo-studio.example</div> | |
| 269 | <div style="position:absolute;top:54px;left:24px;color:var(--col-text-3);font-size:12px">Custom domain · SSL active</div> | |
| 270 | <div style="position:absolute;bottom:24px;left:24px;right:24px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px"> | |
| 271 | <div style="aspect-ratio:1;background:url('assets/images/3.webp') center/cover;border-radius:10px;border:1px solid rgba(255,255,255,0.1)"></div> | |
| 272 | <div style="aspect-ratio:1;background:url('assets/images/7.webp') center/cover;border-radius:10px;border:1px solid rgba(255,255,255,0.1)"></div> | |
| 273 | <div style="aspect-ratio:1;background:url('assets/images/12.webp') center/cover;border-radius:10px;border:1px solid rgba(255,255,255,0.1)"></div> | |
| 274 | </div> | |
| 275 | </div> | |
| 276 | <div style="padding:18px 22px;display:flex;justify-content:space-between;align-items:center"> | |
| 277 | <div> | |
| 278 | <div class="text-xs text-dim" style="letter-spacing:1.5px;text-transform:uppercase">Today's revenue</div> | |
| 279 | <div style="font-family:var(--font-display);font-size:24px;font-weight:700;color:#fff">\$1,284.00</div> | |
| 280 | </div> | |
| 281 | <div> | |
| 282 | <div class="text-xs text-dim" style="letter-spacing:1.5px;text-transform:uppercase">Conversion</div> | |
| 283 | <div style="font-family:var(--font-display);font-size:24px;font-weight:700;color:var(--col-success)">5.4%</div> | |
| 284 | </div> | |
| 285 | <div> | |
| 286 | <div class="text-xs text-dim" style="letter-spacing:1.5px;text-transform:uppercase">Visitors</div> | |
| 287 | <div style="font-family:var(--font-display);font-size:24px;font-weight:700;color:#fff">2,418</div> | |
| 288 | </div> | |
| 289 | </div> | |
| 290 | </div> | |
| 291 | ||
| 292 | <div> | |
| 293 | <span class="section-eyebrow">Storefront Module</span> | |
| 294 | <h2 class="section-title" style="font-size:38px">Your store, <span class="grad">your customer relationship.</span></h2> | |
| 295 | <p class="section-sub" style="margin-bottom:24px"> | |
| 296 | Marketplaces own your audience. We don't. WebSTLs gives you a fully branded | |
| 297 | storefront with your own domain, customer accounts, email lists, and Stripe | |
| 298 | Connect payouts — so when a customer buys from you, they're <em>actually</em> | |
| 299 | your customer. | |
| 300 | </p> | |
| 301 | <ul class="price-list" style="margin:0 0 28px"> | |
| 302 | <li><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg> Drag‑and‑drop page builder + theme templates</li> | |
| 303 | <li><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg> Subdomain + custom domain w/ free SSL</li> | |
| 304 | <li><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg> Buyer accounts, instant downloads, license enforcement</li> | |
| 305 | <li><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"><polyline points="20 6 9 17 4 12"/></svg> Stripe Connect Express — payouts straight to your bank</li> | |
| 306 | </ul> | |
| 307 | <a href="signup.cgi" class="btn btn-primary">Launch your storefront →</a> | |
| 308 | </div> | |
| 309 | </div> | |
| 310 | </section> | |
| 311 | ||
| 312 | ||
| 313 | <!-- ── Optimization stats strip ──────────────────────────────── --> | |
| 314 | <section class="section" id="optimize"> | |
| 315 | <span class="section-eyebrow">Optimization Suite</span> | |
| 316 | <h2 class="section-title">No more guessing prices. <span class="grad">Run the math.</span></h2> | |
| 317 | <p class="section-sub"> | |
| 318 | The same A/B testing, MVT, and price discovery tools that big DTC (direct-to-consumer) brands pay | |
| 319 | \$499/month for — wired natively into your storefront. No tag managers. No | |
| 320 | JavaScript snippets. No statistics PhD required. | |
| 321 | </p> | |
| 322 | ||
| 323 | <div class="dash-grid-3"> | |
| 324 | <div class="card card-elevated"> | |
| 325 | <div class="card-head"><div class="card-title"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 12h-4l-3 9L9 3l-3 9H2"/></svg>A/B + MVT engine</div></div> | |
| 326 | <p class="text-secondary text-sm">A/B between whole pages (one-click duplicate). MVT block tests with named slots on a single page. Layout + theme variant swap. Bayesian confidence reported honestly — ties go to the control.</p> | |
| 327 | <div class="mt-3" style="background:var(--col-surface-2);border-radius:10px;padding:14px;border:1px solid var(--col-border)"> | |
| 328 | <div class="flex justify-between mb-1"><span class="text-xs text-dim">Variant A · Original page</span><span class="tabular text-sm">3.42%</span></div> | |
| 329 | <div class="progress mb-2"><div class="progress-fill" style="width:48%"></div></div> | |
| 330 | <div class="flex justify-between mb-1"><span class="text-xs text-dim">Variant B · Duplicated page (edited)</span><span class="tabular text-sm text-success">5.18%</span></div> | |
| 331 | <div class="progress"><div class="progress-fill" style="width:74%;background:var(--grad-success)"></div></div> | |
| 332 | </div> | |
| 333 | </div> | |
| 334 | ||
| 335 | <div class="card card-elevated"> | |
| 336 | <div class="card-head"><div class="card-title"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="12" y1="1" x2="12" y2="23"/><path d="M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6"/></svg> Price discovery</div></div> | |
| 337 | <p class="text-secondary text-sm">Van Westendorp surveys to your audience. Automated global price tests with creator‑defined rules. Promotional discount triggers when sales velocity dips.</p> | |
| 338 | <div class="mt-3" style="background:var(--col-surface-2);border-radius:10px;padding:14px;border:1px solid var(--col-border)"> | |
| 339 | <div class="flex justify-between mb-1"><span class="text-xs text-dim">Optimal price band</span><span class="text-xs text-brand fw-700">\$11.50 – \$14.00</span></div> | |
| 340 | <div style="height:6px;background:var(--col-surface-3);border-radius:999px;position:relative;overflow:hidden;margin:8px 0"> | |
| 341 | <div style="position:absolute;top:0;left:35%;right:25%;bottom:0;background:var(--grad-success);border-radius:999px"></div> | |
| 342 | </div> | |
| 343 | <div class="flex justify-between text-xs text-dim"><span>\$5</span><span>\$10</span><span>\$15</span><span>\$20</span></div> | |
| 344 | </div> | |
| 345 | </div> | |
| 346 | ||
| 347 | <div class="card card-elevated"> | |
| 348 | <div class="card-head"><div class="card-title"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 3v3M12 18v3M3 12h3M18 12h3M5.6 5.6l2.1 2.1M16.3 16.3l2.1 2.1M5.6 18.4l2.1-2.1M16.3 7.7l2.1-2.1"/></svg> Pooled‑data recommendations</div></div> | |
| 349 | <p class="text-secondary text-sm">Anonymized benchmarking from every WebSTLs store. The platform tells you which template, tag, or bundle structure outperforms in your peer segment.</p> | |
| 350 | <div class="mt-3" style="background:rgba(124,58,237,0.10);border:1px solid rgba(124,58,237,0.3);border-radius:10px;padding:14px"> | |
| 351 | <div class="text-xs" style="color:var(--col-violet-bright);font-weight:700;letter-spacing:1px;text-transform:uppercase;margin-bottom:6px">Recommendation</div> | |
| 352 | <div class="text-sm" style="color:#fff">Stores in <strong>Miniatures · \$5–15</strong> see <strong>+12.4%</strong> conversion when adding 3 product images. You currently have 2.</div> | |
| 353 | </div> | |
| 354 | </div> | |
| 355 | </div> | |
| 356 | </section> | |
| 357 | ||
| 358 | ||
| 359 | <!-- ── Pricing ───────────────────────────────────────────────── --> | |
| 360 | <section class="section" id="pricing"> | |
| 361 | <span class="section-eyebrow">Pricing</span> | |
| 362 | <h2 class="section-title">Honest pricing. <span class="grad">No transaction shenanigans.</span></h2> | |
| 363 | <p class="section-sub">All tiers include audit log, 2FA, encrypted file storage, status page, and email support. Storefront tiers add Stripe Connect for direct payouts.</p> | |
| 364 | ||
| 365 | [if:$has_promo] | |
| 366 | <!-- Active promo marquee. Mirrors the banner on /pricing.cgi so a | |
| 367 | visitor who scrolls into the landing pricing block sees the | |
| 368 | deal without leaving the page. Driven by Promotions.pm's | |
| 369 | active_plan_promo(). --> | |
| 370 | <div style="display:flex;align-items:center;gap:14px;justify-content:center;padding:14px 22px;margin:0 auto 22px;max-width:760px;border-radius:14px;background:linear-gradient(135deg,rgba(34,197,94,0.10),rgba(124,58,237,0.10));border:1px solid rgba(34,197,94,0.40);flex-wrap:wrap"> | |
| 371 | <span style="display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:rgba(34,197,94,0.18);color:#86efac;font-size:11px;font-weight:800;letter-spacing:1.5px;text-transform:uppercase"> | |
| 372 | <svg viewBox="0 0 24 24" width="12" height="12" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg> | |
| 373 | Limited-time | |
| 374 | </span> | |
| 375 | <div style="color:#fff;font-size:14px;font-weight:600">$promo_label with code | |
| 376 | <code style="background:rgba(255,255,255,0.10);padding:3px 9px;border-radius:6px;font-family:var(--font-mono,monospace);font-weight:700;letter-spacing:0.5px">$promo_code</code> | |
| 377 | </div> | |
| 378 | </div> | |
| 379 | [/if] | |
| 380 | ||
| 381 | <div class="pricing-grid"> | |
| 382 | [loop:@plans] | |
| 383 | <div class="price-card[if:$loop1.is_featured] featured[/if]"> | |
| 384 | <div class="price-tier">[$loop1.display_name]</div> | |
| 385 | <div class="price-amt">[$loop1.price_display]<span class="per"> /mo</span></div> | |
| 386 | [if:$loop1.has_tagline]<div class="price-desc">[$loop1.tagline]</div>[/if] | |
| 387 | [if:$loop1.promo_active]<div style="margin-top:10px;padding:8px 12px;border-radius:8px;background:rgba(34,197,94,0.10);border:1px solid rgba(34,197,94,0.30);color:#86efac;font-size:11.5px;line-height:1.5">[$loop1.promo_card_line]</div>[/if] | |
| 388 | <ul class="price-list"> | |
| 389 | [$loop1.bullets_html] | |
| 390 | </ul> | |
| 391 | [if:$loop1.is_featured]<a href="[$loop1.cta_href]" class="btn btn-primary btn-block" style="margin-top:auto">[$loop1.cta_label]</a>[/if] | |
| 392 | [if:$loop1.not_featured]<a href="[$loop1.cta_href]" class="btn btn-secondary btn-block" style="margin-top:auto">[$loop1.cta_label]</a>[/if] | |
| 393 | </div> | |
| 394 | [/loop] | |
| 395 | </div> | |
| 396 | </section> | |
| 397 | ||
| 398 | ||
| 399 | <!-- ── CTA ───────────────────────────────────────────────────── --> | |
| 400 | <section class="section"> | |
| 401 | <div class="card-glow card" style="text-align:center;padding:64px 32px"> | |
| 402 | <h2 class="section-title" style="margin:0 auto 16px">Ready to operate <span class="grad">like a real business?</span></h2> | |
| 403 | <p class="section-sub" style="margin: 0 auto 32px">Start free trial. No credit card. Connect your first marketplace in 60 seconds.</p> | |
| 404 | <div class="flex justify-center gap-3"> | |
| 405 | <a href="signup.cgi" class="btn btn-primary btn-lg">Start free trial</a> | |
| 406 | <a href="dashboard.cgi" class="btn btn-secondary btn-lg">Tour the dashboard</a> | |
| 407 | </div> | |
| 408 | </div> | |
| 409 | </section> | |
| 410 | ||
| 411 | ||
| 412 | <!-- ── Footer ────────────────────────────────────────────────── --> | |
| 413 | <footer class="site-foot"> | |
| 414 | <div class="foot-grid"> | |
| 415 | <div class="foot-col"> | |
| 416 | <div class="flex items-center gap-3 mb-2"> | |
| 417 | <div class="brand-mark" style="width:32px;height:32px;font-size:15px">W<span>S</span></div> | |
| 418 | <div class="brand-text"><span class="brand-name">WebSTLs</span></div> | |
| 419 | </div> | |
| 420 | <p class="text-sm text-secondary" style="max-width:340px">The operating system for 3D creators. Publish, sell, and optimize from one console.</p> | |
| 421 | <div class="text-xs text-dim mt-3" style="letter-spacing:1.5px;text-transform:uppercase">All systems operational · <a href="status.cgi" style="color:var(--col-success)">status →</a></div> | |
| 422 | </div> | |
| 423 | <div class="foot-col"> | |
| 424 | <h5>Platform</h5> | |
| 425 | <ul> | |
| 426 | <li><a href="features.cgi">Features</a></li> | |
| 427 | <li><a href="tour.cgi">Tour</a></li> | |
| 428 | <li><a href="why.cgi">Why WebSTLs</a></li> | |
| 429 | <li><a href="pricing.cgi">Pricing</a></li> | |
| 430 | <li><a href="faq.cgi">FAQ</a></li> | |
| 431 | </ul> | |
| 432 | </div> | |
| 433 | <div class="foot-col"> | |
| 434 | <h5>Company</h5> | |
| 435 | <ul> | |
| 436 | <li><a href="about.cgi">About</a></li> | |
| 437 | <li><a href="contact.cgi">Contact</a></li> | |
| 438 | </ul> | |
| 439 | </div> | |
| 440 | <div class="foot-col"> | |
| 441 | <h5>Legal & Trust</h5> | |
| 442 | <ul> | |
| 443 | <li><a href="privacy.cgi">Privacy</a></li> | |
| 444 | <li><a href="terms.cgi">Terms of Service</a></li> | |
| 445 | </ul> | |
| 446 | </div> | |
| 447 | </div> | |
| 448 | <div class="foot-bottom"> | |
| 449 | <span>© 2026 WebSTLs, Inc. All rights reserved.</span> | |
| 450 | <span>Made for creators who treat this like a business.</span> | |
| 451 | </div> | |
| 452 | </footer> |