Broaden hero headline for general crypto merchants.

Replace How it works with tier cards, nav link, and managed setup pricing copy.

css/styles.css

@@ -361,50 +361,6 @@ a:hover {
   margin-bottom: 0;
 }
 
-.pillars {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 0.625rem;
-  margin: 0;
-  padding: 0;
-  list-style: none;
-}
-
-.privacy-features {
-  display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(11.5rem, 1fr));
-  gap: 0.625rem;
-}
-
-.pillar {
-  display: inline-flex;
-  align-items: center;
-  gap: 0.375rem;
-  padding: 0.5rem 0.875rem;
-  border: 1px solid var(--border);
-  border-radius: 999px;
-  background: var(--surface);
-  font-size: 0.8125rem;
-  font-weight: 500;
-  color: var(--text);
-  white-space: nowrap;
-}
-
-.pillar__dot {
-  width: 0.375rem;
-  height: 0.375rem;
-  border-radius: 50%;
-  flex-shrink: 0;
-}
-
-.pillar:nth-child(odd) .pillar__dot {
-  background: var(--brand);
-}
-
-.pillar:nth-child(even) .pillar__dot {
-  background: var(--accent);
-}
-
 .features-grid {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
@@ -462,57 +418,46 @@ a:hover {
   margin-top: 0.375rem;
 }
 
-.steps {
+.tiers {
   display: grid;
-  grid-template-columns: repeat(3, 1fr);
+  grid-template-columns: repeat(2, 1fr);
   gap: 1.25rem;
-  margin: 0;
-  padding: 0;
-  list-style: none;
-  counter-reset: step;
 }
 
 @media (max-width: 48rem) {
-  .steps {
+  .tiers {
     grid-template-columns: 1fr;
   }
 }
 
-.step {
+.tier-card {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
   padding: 1.5rem;
   border: 1px solid var(--border);
   border-radius: var(--radius-lg);
   background: var(--surface);
 }
 
-.step::before {
+.tier-card h3 {
-  counter-increment: step;
+  margin: 0 0 0.75rem;
-  content: counter(step);
+  font-size: 1.0625rem;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 2rem;
-  height: 2rem;
-  margin-bottom: 1rem;
-  border-radius: 50%;
-  background: var(--brand);
-  color: #fff;
-  font-size: 0.875rem;
-  font-weight: 700;
-}
-
-.step h3 {
-  margin: 0 0 0.5rem;
-  font-size: 1rem;
   font-weight: 600;
 }
 
-.step p {
+.tier-card p {
-  margin: 0;
+  flex: 1;
+  margin: 0 0 1.25rem;
   font-size: 0.9375rem;
   color: var(--muted);
 }
 
+.tier-card p strong {
+  color: var(--text);
+  font-weight: 600;
+}
+
 .roadmap {
   display: grid;
   grid-template-columns: repeat(3, 1fr);

index.html

@@ -38,6 +38,7 @@
         </a>
         <nav class="site-nav" aria-label="Main">
           <a href="#features">Features</a>
+          <a href="#get-started">Get started</a>
           <a href="#gallery">Gallery</a>
           <a href="#demo">Live demo</a>
           <a href="#source">Open source</a>
@@ -53,10 +54,10 @@
         <div class="container hero__inner">
           <div class="hero__content">
             <p class="hero__badge">Free &amp; open source</p>
-            <h1>Privacy-first, self-hosted crypto commerce</h1>
+            <h1>Self-hosted crypto shop for your business</h1>
             <p class="hero__sub">
               Complete, privacy-focused crypto e-commerce solution. Built with a
-              mission to support the crypto economy.
+              mission to grow the crypto economy.
             </p>
             <div class="hero__actions">
               <a class="btn btn--primary" href="#features">See features</a>
@@ -79,67 +80,12 @@
             NullCart is a free, open-source crypto shop you host yourself. You
             run it on your server with built-in non-custodial wallets - no
             payment processors in the middle. Buyers pay in crypto without
-            accounts, and the storefront runs without JavaScript. You manage
+            accounts, and the storefront works without JavaScript. You manage
             products and orders from a merchant CMS, on clearnet and Tor.
           </p>
         </div>
       </section>
 
-      <section class="section" id="privacy">
-        <div class="container">
-          <h2 class="section__title">Privacy features</h2>
-          <p class="section__lead">
-            Privacy at every layer of the buyer experience.
-          </p>
-          <ul class="pillars privacy-features">
-            <li class="pillar">
-              <span class="pillar__dot" aria-hidden="true"></span> Free and open
-              source
-            </li>
-            <li class="pillar">
-              <span class="pillar__dot" aria-hidden="true"></span> No JS on
-              buyer shop
-            </li>
-            <li class="pillar">
-              <span class="pillar__dot" aria-hidden="true"></span> No buyer
-              accounts
-            </li>
-            <li class="pillar">
-              <span class="pillar__dot" aria-hidden="true"></span> Non-custodial
-              wallets
-            </li>
-            <li class="pillar">
-              <span class="pillar__dot" aria-hidden="true"></span> Monero
-              supported
-            </li>
-            <li class="pillar">
-              <span class="pillar__dot" aria-hidden="true"></span> Zero
-              third-party processors
-            </li>
-            <li class="pillar">
-              <span class="pillar__dot" aria-hidden="true"></span> Own wallet
-              integration
-            </li>
-            <li class="pillar">
-              <span class="pillar__dot" aria-hidden="true"></span> Encrypted
-              sensitive data
-            </li>
-            <li class="pillar">
-              <span class="pillar__dot" aria-hidden="true"></span> Auto order
-              data wipe
-            </li>
-            <li class="pillar">
-              <span class="pillar__dot" aria-hidden="true"></span> Self-hosted
-              clearnet + onion
-            </li>
-            <li class="pillar">
-              <span class="pillar__dot" aria-hidden="true"></span> SimpleX
-              merchant alerts
-            </li>
-          </ul>
-        </div>
-      </section>
-
       <section class="section section--border" id="features">
         <div class="container">
           <h2 class="section__title">Features</h2>
@@ -160,17 +106,61 @@
               </svg>
               <h3>Privacy by design</h3>
               <p class="feature-card__lead">
-                Your buyers don't need accounts. Your shop doesn't hoard their
+                Privacy at every layer of the buyer experience. Your buyers
-                data.
+                don't need accounts, and your shop doesn't hoard their data.
+              </p>
+              <ul>
+                <li>Free and open source</li>
+                <li>Buyer shop works without JavaScript</li>
+                <li>Works in Tor Browser strictest security mode</li>
+                <li>
+                  No buyer accounts - orders open with a private access token
+                </li>
+                <li>Non-custodial shop wallets</li>
+                <li>Monero supported</li>
+                <li>Encrypted sensitive data at rest</li>
+                <li>Automatic order data wipe</li>
+                <li>Self-hosted clearnet and Tor onion</li>
+                <li>SimpleX merchant alerts</li>
+              </ul>
+            </article>
+
+            <article class="feature-card">
+              <svg
+                class="feature-card__icon"
+                viewBox="0 0 24 24"
+                fill="none"
+                stroke="currentColor"
+                stroke-width="2"
+                aria-hidden="true"
+              >
+                <rect x="3" y="3" width="18" height="18" rx="2" />
+                <path d="M3 9h18M9 21V9" />
+              </svg>
+              <h3>E-commerce features</h3>
+              <p class="feature-card__lead">
+                A full storefront for digital and physical goods - catalog,
+                cart, checkout, and fulfillment.
               </p>
               <ul>
                 <li>
-                  No JavaScript on the buyer shop - no client-side scripts
+                  Product catalog, categories, and variants with image galleries
                 </li>
-                <li>Works in Tor Browser strictest security mode</li>
+                <li>Shopping cart, checkout, and discount codes</li>
                 <li>
-                  No sign-up or profiles - orders open with a private access
+                  Auto-deliver digital goods and quote shipping for physical
-                  token
+                  orders
+                </li>
+                <li>
+                  Order tracking, live payment status, and per-order buyer chat
+                </li>
+                <li>Custom branding - your logo, favicon, and shop name</li>
+                <li>
+                  Shop blog for product spotlights, how-tos, and SEO-friendly
+                  content
+                </li>
+                <li>
+                  Prices shown in fiat, paid in crypto with live exchange rates
                 </li>
               </ul>
             </article>
@@ -203,42 +193,6 @@
               </ul>
             </article>
 
-            <article class="feature-card">
-              <svg
-                class="feature-card__icon"
-                viewBox="0 0 24 24"
-                fill="none"
-                stroke="currentColor"
-                stroke-width="2"
-                aria-hidden="true"
-              >
-                <rect x="3" y="3" width="18" height="18" rx="2" />
-                <path d="M3 9h18M9 21V9" />
-              </svg>
-              <h3>E-commerce features</h3>
-              <p class="feature-card__lead">
-                A full storefront for digital and physical goods - catalog,
-                cart, checkout, and fulfillment.
-              </p>
-              <ul>
-                <li>
-                  Product catalog, categories, and variants with image galleries
-                </li>
-                <li>Shopping cart, checkout, and discount codes</li>
-                <li>
-                  Auto-deliver digital goods and quote shipping for physical
-                  orders
-                </li>
-                <li>
-                  Order tracking, live payment status, and per-order buyer chat
-                </li>
-                <li>Custom branding - your logo, favicon, and shop name</li>
-                <li>
-                  Prices shown in fiat, paid in crypto with live exchange rates
-                </li>
-              </ul>
-            </article>
-
             <article class="feature-card">
               <svg
                 class="feature-card__icon"
@@ -268,32 +222,42 @@
         </div>
       </section>
 
-      <section class="section">
+      <section class="section section--border" id="get-started">
         <div class="container">
-          <h2 class="section__title">How it works</h2>
+          <h2 class="section__title">Get started</h2>
           <p class="section__lead">
-            Three steps from zero to selling with crypto.
+            Launch on your own server: install from the guide, or get one-time
+            help if you are not comfortable with VPS and DNS yourself.
           </p>
-          <ol class="steps">
+          <div class="tiers">
-            <li class="step">
+            <article class="tier-card">
-              <h3>Deploy</h3>
+              <h3>Self-hosted</h3>
               <p>
-                Clone the repo, configure your server, and go live on HTTPS and
+                Full NullCart is free and open source. Use the deployment guide
-                Tor.
+                in the repository to install on your VPS with HTTPS and Tor. You
+                handle provisioning, DNS, and updates.
               </p>
-            </li>
+              <a
-            <li class="step">
+                class="btn btn--primary"
-              <h3>Set up your shop</h3>
+                href="https://git.nobswebdev.com/nobswebdev/nullcart"
-              <p>Add products in the CMS and upload your branding.</p>
+                target="_blank"
-            </li>
+                rel="noopener noreferrer"
-            <li class="step">
+                >Repository</a
-              <h3>Sell</h3>
+              >
+            </article>
+            <article class="tier-card">
+              <h3>Managed setup</h3>
               <p>
-                Buyers pay in crypto. You fulfill orders, chat when needed, and
+                We will setup everything for you if you are not comfortable with
-                get notified via SimpleX.
+                servers yourself or you want to hand over this task to us.
+                <strong>$25 USD</strong> paid in Monero covers our help to make
+                your shop up and running. VPS and domain are paid separately.
+                Optional upgrade to the latest version later:
+                <strong>$25 USD</strong> in Monero if you ever need it.
               </p>
-            </li>
+              <a class="btn btn--primary" href="#contact">Contact</a>
-          </ol>
+            </article>
+          </div>
         </div>
       </section>
 
@@ -603,9 +567,7 @@
       <section class="section section--border" id="instances">
         <div class="container">
           <h2 class="section__title">Instances</h2>
-          <p class="section__lead">
+          <p class="section__lead">NullCart shops hosted by the community.</p>
-            NullCart shops hosted by the community.
-          </p>
           <ul class="instances-list">
             <li>
               <article class="instance-card">
@@ -647,9 +609,7 @@
       <section class="section section--border" id="contact">
         <div class="container">
           <h2 class="section__title">Contact</h2>
-          <p class="section__lead">
+          <p class="section__lead">Need help? Have questions? Reach out.</p>
-            Questions, feedback, or collaboration - reach out.
-          </p>
           <div class="contact-grid">
             <div class="contact-card">
               <h3>Email</h3>
@@ -674,6 +634,7 @@
         <p class="site-footer__copy">&copy; 2026 NullCart by nobswebdev.</p>
         <nav class="site-footer__nav" aria-label="Footer">
           <a href="#features">Features</a>
+          <a href="#get-started">Get started</a>
           <a href="#gallery">Gallery</a>
           <a href="#demo">Demo</a>
           <a href="#source">Open source</a>