Pricing table snippet

<!-- Pricing snippet · generated with Build on Vibe · buildonvibe.site/tools/free/pricing-snippet -->
<section class="pricing">
  <div class="tier">
    <div class="tier__name">Free</div>
    <div class="tier__price"><span class="tier__amount">$0</span><span class="tier__interval">/mo</span></div>
    <p class="tier__blurb">For your first three shipped ideas.</p>
    <ul class="tier__features">
      <li>3 active projects</li>
      <li>12-step build workspace</li>
      <li>AI prompt packs (starter)</li>
      <li>Community access</li>
    </ul>
    <a class="tier__cta" href="#">Start free</a>
  </div>
  <div class="tier tier--highlight">
    <div class="tier__name">Pro</div>
    <div class="tier__price"><span class="tier__amount">$19</span><span class="tier__interval">/mo</span></div>
    <p class="tier__blurb">For founders shipping monthly.</p>
    <ul class="tier__features">
      <li>Unlimited projects</li>
      <li>Full prompt library</li>
      <li>Data export & portability</li>
      <li>Email support</li>
    </ul>
    <a class="tier__cta" href="#">Go Pro</a>
  </div>
  <div class="tier">
    <div class="tier__name">Studio</div>
    <div class="tier__price"><span class="tier__amount">$79</span><span class="tier__interval">/mo</span></div>
    <p class="tier__blurb">For teams of 2–5 building together.</p>
    <ul class="tier__features">
      <li>Everything in Pro</li>
      <li>5 seats</li>
      <li>Shared workspace + roll-ups</li>
      <li>Priority support</li>
    </ul>
    <a class="tier__cta" href="#">Talk to us</a>
  </div>
</section>

<style>
.pricing{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem;max-width:1080px;margin:2rem auto;padding:0 1rem;font-family:system-ui,sans-serif}
.tier{border:1px solid #e5e7eb;border-radius:16px;padding:1.5rem;background:#fff;display:flex;flex-direction:column}
.tier--highlight{border-color:#f97316;box-shadow:0 8px 24px -8px rgba(249,115,22,.25)}
.tier__name{font-size:.75rem;text-transform:uppercase;letter-spacing:.15em;color:#f97316;font-weight:600}
.tier__price{margin:.75rem 0}
.tier__amount{font-size:2.5rem;font-weight:700;letter-spacing:-.02em}
.tier__interval{color:#6b7280;margin-left:.25rem}
.tier__blurb{color:#4b5563;font-size:.9rem;margin:0 0 1rem}
.tier__features{list-style:none;padding:0;margin:0 0 1.5rem;font-size:.9rem;color:#374151;flex:1}
.tier__features li{padding:.35rem 0;border-top:1px solid #f3f4f6}
.tier__features li:first-child{border-top:0}
.tier__cta{margin-top:auto;background:#f97316;color:#fff;text-decoration:none;text-align:center;padding:.75rem 1rem;border-radius:10px;font-weight:600}
.tier--highlight .tier__cta{background:#ea580c}
</style>