Oliver/my-biz
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: verticals ticker with images + links, Empire pricing card, Agentic vertical, AGENTS.md updated

Browse Source
This commit is contained in:
oliver
2026-04-24 16:13:51 -03:00
parent 1ed58b4b33
commit 32fe8a4073
1 changed files with 182 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files
index.html
+179 -59
View File
@@ -753,11 +753,17 @@
/* ── PRICING ── */ /* ── PRICING ── */
.pricing-grid { .pricing-grid {
display: grid; display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 1px; gap: 1px;
background: var(--border); background: var(--border);
border: 1px solid var(--border); border: 1px solid var(--border);
max-width: 820px; }
.pricing-setup {
font-size: 0.76rem;
color: var(--gold);
letter-spacing: 0.04em;
font-weight: 600;
margin-bottom: 20px;
} }
.pricing-card { .pricing-card {
@@ -991,6 +997,54 @@
background-clip: text; background-clip: text;
} }
/* ── VERTICALS TICKER ── */
.vtick-wrap {
overflow: hidden;
margin: 0 -8vw;
padding: 0 0 8px;
}
.vtick-card {
display: inline-flex;
flex-direction: column;
text-decoration: none;
width: 200px;
margin: 0 10px;
border-radius: 8px;
overflow: hidden;
background: var(--card);
box-shadow: 0 2px 10px rgba(62, 39, 35, 0.12);
transition:
transform 0.25s,
box-shadow 0.25s;
vertical-align: top;
}
.vtick-card:hover {
transform: translateY(-6px);
box-shadow: 0 8px 24px var(--gold-glow);
}
.vtick-img {
width: 100%;
height: 130px;
object-fit: cover;
display: block;
}
.vtick-body {
padding: 11px 13px 13px;
}
.vtick-name {
font-family: Georgia, "Times New Roman", serif;
font-size: 0.88rem;
font-weight: 700;
color: var(--white);
margin-bottom: 5px;
}
.vtick-tag {
font-size: 0.62rem;
text-transform: uppercase;
letter-spacing: 0.08em;
color: var(--gold);
}
/* ── FOOTER ── */ /* ── FOOTER ── */
footer { footer {
background: var(--bg-deep); background: var(--bg-deep);
@@ -1279,9 +1333,6 @@
#modal-box { #modal-box {
padding: 40px 28px; padding: 40px 28px;
} }
.pricing-grid {
max-width: 100%;
}
} }
@media (max-width: 480px) { @media (max-width: 480px) {
.hero h1 { .hero h1 {
@@ -1492,68 +1543,108 @@
your exact challenges. No generalists. No guessing. Just experts your exact challenges. No generalists. No guessing. Just experts
who get it. who get it.
</p> </p>
<div <div class="vtick-wrap" data-mf-ticker data-mf-ticker-speed="55">
class="verticals-grid" <span>
data-mf-stagger-animation="fade-up" <a
data-mf-stagger-gap="90" class="vtick-card"
data-mf-stagger-duration="650" href="https://ngo.my-biz.app"
data-mf-stagger-distance="40" target="_blank"
data-mf-stagger-easing="ease-out-cubic" rel="noopener"
data-mf-stagger-once="true"
>
<div class="vertical-card">
<span class="vertical-icon">&#127757;</span>
<div class="vertical-name">NGO &amp; Non-Profit</div>
<p class="vertical-desc">
Grant tracking, donor management, project accounting,
and compliance reporting &mdash; built for organizations
that answer to their mission, not just their margin.
</p>
<span class="vertical-tag"
>Donor CRM &middot; Grant Accounting &middot; Impact
Reports</span
> >
<img
class="vtick-img"
src="https://images.unsplash.com/photo-1559027615-cd4628902d4a?w=600&q=80&auto=format&fit=crop"
alt="NGO &amp; Non-Profit"
/>
<div class="vtick-body">
<div class="vtick-name">NGO &amp; Non-Profit</div>
<div class="vtick-tag">
Donor CRM &middot; Impact Reports
</div> </div>
<div class="vertical-card">
<span class="vertical-icon">&#128640;</span>
<div class="vertical-name">Startups</div>
<p class="vertical-desc">
Move fast without breaking your books. From your first
invoice to Series A due diligence, we set up systems
that grow with you and impress every investor.
</p>
<span class="vertical-tag"
>Invoicing &middot; CRM &middot; Equity-Ready
Reporting</span
>
</div> </div>
<div class="vertical-card"> </a>
<span class="vertical-icon">&#127981;</span> </span>
<div class="vertical-name">Manufacturing</div> <span>
<p class="vertical-desc"> <a
Bills of materials, production orders, real-time class="vtick-card"
inventory, and quality control &mdash; everything on the href="https://startups.my-biz.app"
floor finally reflected in your numbers. target="_blank"
</p> rel="noopener"
<span class="vertical-tag"
>MRP &middot; Inventory &middot; Purchase &middot;
Quality</span
> >
<img
class="vtick-img"
src="https://images.unsplash.com/photo-1522202176988-66273c2fd55f?w=600&q=80&auto=format&fit=crop"
alt="Startups"
/>
<div class="vtick-body">
<div class="vtick-name">Startups</div>
<div class="vtick-tag">
Invoicing &middot; CRM &middot; Reporting
</div> </div>
<div class="vertical-card"> </div>
<span class="vertical-icon">&#127869;&#65039;</span> </a>
<div class="vertical-name">Restaurants</div> </span>
<p class="vertical-desc"> <span>
From tableside POS to supplier invoices to staff <a
scheduling &mdash; keep the kitchen and the books class="vtick-card"
running smoothly, even on your busiest Saturday night. href="https://manufacturing.my-biz.app"
</p> target="_blank"
<span class="vertical-tag" rel="noopener"
>POS &middot; Supplier Mgmt &middot; Payroll &middot;
Food Cost</span
> >
<img
class="vtick-img"
src="https://images.unsplash.com/photo-1565793298595-6a879b1d9492?w=600&q=80&auto=format&fit=crop"
alt="Manufacturing"
/>
<div class="vtick-body">
<div class="vtick-name">Manufacturing</div>
<div class="vtick-tag">
MRP &middot; Inventory &middot; Quality
</div> </div>
</div> </div>
</a>
</span>
<span>
<a
class="vtick-card"
href="https://restaurants.my-biz.app"
target="_blank"
rel="noopener"
>
<img
class="vtick-img"
src="https://images.unsplash.com/photo-1414235077428-338989a2e8c0?w=600&q=80&auto=format&fit=crop"
alt="Restaurants"
/>
<div class="vtick-body">
<div class="vtick-name">Restaurants</div>
<div class="vtick-tag">
POS &middot; Payroll &middot; Food Cost
</div>
</div>
</a>
</span>
<span>
<a
class="vtick-card"
href="https://agentic.my-biz.app"
target="_blank"
rel="noopener"
>
<img
class="vtick-img"
src="https://images.unsplash.com/photo-1620712943543-bcc4688e7485?w=600&q=80&auto=format&fit=crop"
alt="Agentic Businesses"
/>
<div class="vtick-body">
<div class="vtick-name">Agentic Businesses</div>
<div class="vtick-tag">
AI &middot; Automation &middot; Agents
</div>
</div>
</a>
</span>
</div>
</section> </section>
<!-- NEWS --> <!-- NEWS -->
@@ -1731,6 +1822,35 @@
</ul> </ul>
<a class="pricing-cta open-modal" href="#">Get Started</a> <a class="pricing-cta open-modal" href="#">Get Started</a>
</div> </div>
<div
class="pricing-card"
data-mf-animation="fade-left"
data-mf-animation-duration="750"
data-mf-animation-distance="40"
data-mf-animation-easing="ease-out-cubic"
data-mf-animation-once="true"
>
<div class="pricing-plan">Empire</div>
<div class="pricing-price">$750</div>
<div class="pricing-period">
per year &middot; billed annually
</div>
<div class="pricing-setup">+ $500 one-time setup fee</div>
<p class="pricing-quote">
&ldquo;My house! My horse! My server!&rdquo;
</p>
<ul class="pricing-features">
<li>Everything in On the Rise</li>
<li>Self-hosted on your server or VPS</li>
<li>We install &amp; maintain the software</li>
<li>
Full data sovereignty &mdash; you own everything
</li>
<li>Unlimited users</li>
<li>Dedicated support line</li>
</ul>
<a class="pricing-cta open-modal" href="#">Get Started</a>
</div>
</div> </div>
</section> </section>