pricing: 3 plans (Trainee/Junior/Senior) + monthly/yearly toggle + remove startup discount
This commit is contained in:
Oliver
+317
-130
@@ -793,44 +793,97 @@
|
||||
/* ══════════════════════════════════════════════════════════
|
||||
PRICING
|
||||
══════════════════════════════════════════════════════════ */
|
||||
.pricing-card {
|
||||
max-width: 420px;
|
||||
.pricing-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 20px;
|
||||
max-width: 960px;
|
||||
margin: 0 auto;
|
||||
align-items: start;
|
||||
}
|
||||
.pricing-card {
|
||||
background: var(--bg-card);
|
||||
border: 1px solid var(--border-hi);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: var(--radius-card);
|
||||
padding: 44px 40px;
|
||||
padding: 36px 28px;
|
||||
text-align: center;
|
||||
box-shadow: var(--shadow);
|
||||
position: relative;
|
||||
transition: border-color 0.2s, transform 0.2s;
|
||||
}
|
||||
.pricing-card.featured {
|
||||
border-color: var(--accent);
|
||||
background: linear-gradient(180deg, rgba(79, 142, 247, 0.06) 0%, var(--bg-card) 100%);
|
||||
transform: scale(1.04);
|
||||
}
|
||||
.pricing-badge {
|
||||
position: absolute;
|
||||
top: -11px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
background: var(--accent);
|
||||
color: #fff;
|
||||
font-size: 11px;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.04em;
|
||||
padding: 3px 18px;
|
||||
border-radius: 20px;
|
||||
}
|
||||
.pricing-plan-name {
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.06em;
|
||||
color: var(--accent);
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.pricing-amount {
|
||||
font-size: 3rem;
|
||||
font-weight: 800;
|
||||
color: var(--text);
|
||||
line-height: 1;
|
||||
}
|
||||
.pricing-amount span {
|
||||
font-size: 1rem;
|
||||
.pricing-amount .pricing-currency { font-size: 1.4rem; vertical-align: super; }
|
||||
.pricing-period {
|
||||
font-size: 0.9rem;
|
||||
font-weight: 500;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
.pricing-term {
|
||||
font-size: 13px;
|
||||
.pricing-yearly-bonus {
|
||||
display: none;
|
||||
font-size: 12px;
|
||||
color: var(--success);
|
||||
font-weight: 600;
|
||||
margin-top: 4px;
|
||||
}
|
||||
.pricing-yearly-bonus.show { display: block; }
|
||||
.pricing-plan-desc {
|
||||
font-size: 12px;
|
||||
color: var(--text-muted);
|
||||
margin: 6px 0 20px;
|
||||
margin: 10px 0 14px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
.pricing-plan-quota {
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
color: var(--text);
|
||||
padding: 8px 0;
|
||||
border-top: 1px solid var(--border);
|
||||
border-bottom: 1px solid var(--border);
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
.pricing-perks {
|
||||
list-style: none;
|
||||
text-align: left;
|
||||
margin: 20px 0 28px;
|
||||
margin: 14px 0 24px;
|
||||
}
|
||||
.pricing-perks li {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 10px;
|
||||
padding: 6px 0;
|
||||
font-size: 14px;
|
||||
gap: 8px;
|
||||
padding: 4px 0;
|
||||
font-size: 13px;
|
||||
color: var(--text);
|
||||
}
|
||||
.pricing-perks li svg {
|
||||
@@ -838,12 +891,79 @@
|
||||
margin-top: 3px;
|
||||
color: var(--success);
|
||||
}
|
||||
|
||||
.pricing-extra {
|
||||
font-size: 12px;
|
||||
.pricing-perks li.muted {
|
||||
color: var(--text-muted);
|
||||
margin-top: 14px;
|
||||
line-height: 1.6;
|
||||
}
|
||||
.pricing-perks li.muted svg {
|
||||
color: var(--text-muted);
|
||||
opacity: 0.4;
|
||||
}
|
||||
|
||||
/* ── Billing toggle ─────────────────────────────── */
|
||||
.pricing-billing-toggle {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 14px;
|
||||
margin-bottom: 36px;
|
||||
}
|
||||
.billing-label {
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: var(--text-muted);
|
||||
transition: color 0.2s;
|
||||
}
|
||||
.billing-label.active { color: var(--text); }
|
||||
.toggle-switch {
|
||||
position: relative;
|
||||
width: 48px;
|
||||
height: 26px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.toggle-switch input {
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
.toggle-slider {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background: var(--border);
|
||||
border-radius: 26px;
|
||||
transition: background 0.2s;
|
||||
}
|
||||
.toggle-slider::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 3px;
|
||||
top: 3px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border-radius: 50%;
|
||||
background: var(--text);
|
||||
transition: transform 0.2s;
|
||||
}
|
||||
.toggle-switch input:checked + .toggle-slider {
|
||||
background: var(--accent);
|
||||
}
|
||||
.toggle-switch input:checked + .toggle-slider::before {
|
||||
transform: translateX(22px);
|
||||
background: #fff;
|
||||
}
|
||||
.billing-save-badge {
|
||||
font-size: 11px;
|
||||
font-weight: 700;
|
||||
color: var(--success);
|
||||
background: rgba(63, 201, 126, 0.12);
|
||||
padding: 2px 10px;
|
||||
border-radius: 20px;
|
||||
display: none;
|
||||
}
|
||||
.billing-save-badge.show { display: inline; }
|
||||
|
||||
@media (max-width: 900px) {
|
||||
.pricing-grid { grid-template-columns: 1fr; max-width: 420px; }
|
||||
.pricing-card.featured { transform: none; }
|
||||
}
|
||||
|
||||
/* ══════════════════════════════════════════════════════════
|
||||
@@ -937,62 +1057,45 @@
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
/* ── Pricing discount (strikethrough + badge) ─────────── */
|
||||
.pricing-original {
|
||||
font-size: 1.2rem;
|
||||
text-decoration: line-through;
|
||||
color: var(--text-muted);
|
||||
font-weight: 500;
|
||||
margin-right: 6px;
|
||||
opacity: 0.6;
|
||||
}
|
||||
.pricing-discounted {
|
||||
font-size: inherit;
|
||||
color: var(--success);
|
||||
}
|
||||
.pricing-discount-badge {
|
||||
display: inline-flex;
|
||||
/* ── Signup plan badges ──────────────────────────── */
|
||||
.signup-pricing-plans {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
padding: 4px 12px;
|
||||
background: rgba(63, 201, 126, 0.12);
|
||||
border: 1px solid rgba(63, 201, 126, 0.3);
|
||||
border-radius: 20px;
|
||||
justify-content: center;
|
||||
gap: 12px;
|
||||
flex-wrap: wrap;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
.signup-plan {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
background: var(--bg-inner);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 12px;
|
||||
padding: 10px 18px;
|
||||
min-width: 90px;
|
||||
transition: border-color 0.2s;
|
||||
}
|
||||
.signup-plan.featured {
|
||||
border-color: var(--accent);
|
||||
background: linear-gradient(180deg, rgba(79, 142, 247, 0.06) 0%, var(--bg-inner) 100%);
|
||||
}
|
||||
.signup-plan-name {
|
||||
font-size: 11px;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
color: var(--accent);
|
||||
}
|
||||
.signup-plan-price {
|
||||
font-size: 20px;
|
||||
font-weight: 800;
|
||||
color: var(--text);
|
||||
}
|
||||
.signup-pricing-badge .signup-pricing-term {
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
color: var(--success);
|
||||
margin: 6px 0 8px;
|
||||
}
|
||||
.pricing-amount {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
justify-content: center;
|
||||
gap: 2px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.pricing-amount .pricing-original {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
.pricing-amount .pricing-discounted {
|
||||
font-size: 3rem;
|
||||
font-weight: 800;
|
||||
}
|
||||
.signup-pricing-amount {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
justify-content: center;
|
||||
gap: 2px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.signup-pricing-amount .pricing-original {
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
.signup-pricing-amount .pricing-discounted {
|
||||
font-size: 24px;
|
||||
font-weight: 800;
|
||||
}
|
||||
.signup-pricing-badge .pricing-discount-badge {
|
||||
margin: 2px 0 6px;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
/* ══════════════════════════════════════════════════════════
|
||||
@@ -1747,56 +1850,118 @@
|
||||
Cancel anytime with monthly termination.
|
||||
</p>
|
||||
|
||||
<div class="pricing-card">
|
||||
<div class="pricing-amount">
|
||||
<span class="pricing-original">$9.50</span>
|
||||
<span class="pricing-discounted">$7.50</span> <span>USD / month</span>
|
||||
<!-- ── Billing toggle ── -->
|
||||
<div class="pricing-billing-toggle">
|
||||
<span class="billing-label active" id="billing-monthly-label">Monthly</span>
|
||||
<label class="toggle-switch">
|
||||
<input type="checkbox" id="billing-toggle" onchange="toggleBilling()" />
|
||||
<span class="toggle-slider"></span>
|
||||
</label>
|
||||
<span class="billing-label" id="billing-yearly-label">Yearly</span>
|
||||
<span class="billing-save-badge" id="billing-save-badge">Save 1 month</span>
|
||||
</div>
|
||||
|
||||
<!-- ── Plans grid ── -->
|
||||
<div class="pricing-grid">
|
||||
|
||||
<!-- Trainee -->
|
||||
<div class="pricing-card">
|
||||
<div class="pricing-plan-name">Trainee</div>
|
||||
<div class="pricing-amount" id="amount-trainee">
|
||||
<span class="pricing-currency">$</span>4<span class="pricing-decimal">.99</span>
|
||||
</div>
|
||||
<div class="pricing-period" id="period-trainee">/ month</div>
|
||||
<div class="pricing-yearly-bonus" id="bonus-trainee">✨ +$4.99 OpenRouter credits</div>
|
||||
<p class="pricing-plan-desc">For getting started with your first agent.</p>
|
||||
<div class="pricing-plan-quota">1GB RAM · 10GB HDD</div>
|
||||
<ul class="pricing-perks">
|
||||
<li>
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>
|
||||
Your Agent's Office (root access)
|
||||
</li>
|
||||
<li>
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>
|
||||
Management dashboard
|
||||
</li>
|
||||
<li>
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>
|
||||
Daily automatic backups
|
||||
</li>
|
||||
<li>
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>
|
||||
OpenRouter key included
|
||||
</li>
|
||||
<li>
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>
|
||||
Prompt Builder & Skills
|
||||
</li>
|
||||
<li>
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>
|
||||
Support chat with human escalation
|
||||
</li>
|
||||
</ul>
|
||||
<a href="https://app.derez.ai" class="btn btn-primary btn-block">Choose Trainee</a>
|
||||
</div>
|
||||
<div class="pricing-discount-badge">
|
||||
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>
|
||||
Startup Discount −$2.00
|
||||
|
||||
<!-- Junior -->
|
||||
<div class="pricing-card featured">
|
||||
<span class="pricing-badge">Popular</span>
|
||||
<div class="pricing-plan-name">Junior</div>
|
||||
<div class="pricing-amount" id="amount-junior">
|
||||
<span class="pricing-currency">$</span>9<span class="pricing-decimal">.50</span>
|
||||
</div>
|
||||
<div class="pricing-period" id="period-junior">/ month</div>
|
||||
<div class="pricing-yearly-bonus" id="bonus-junior">✨ +$9.50 OpenRouter credits</div>
|
||||
<p class="pricing-plan-desc">The sweet spot for most users.</p>
|
||||
<div class="pricing-plan-quota">2GB RAM · 20GB HDD</div>
|
||||
<ul class="pricing-perks">
|
||||
<li>
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>
|
||||
Everything in Trainee
|
||||
</li>
|
||||
<li>
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>
|
||||
SSH access to your container
|
||||
</li>
|
||||
<li>
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>
|
||||
On-demand backups
|
||||
</li>
|
||||
<li>
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>
|
||||
Higher API key credit allocation
|
||||
</li>
|
||||
</ul>
|
||||
<a href="https://app.derez.ai" class="btn btn-primary btn-block">Choose Junior</a>
|
||||
</div>
|
||||
<p class="pricing-term">Per agent instance · Monthly termination · Limited time</p>
|
||||
|
||||
<ul class="pricing-perks">
|
||||
<li>
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>
|
||||
Your Agent's Office — container with root access
|
||||
</li>
|
||||
<li>
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>
|
||||
Hermes or OpenClaw agent, bootstrapped & ready
|
||||
</li>
|
||||
<li>
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>
|
||||
Daily auto backups + on-demand copies
|
||||
</li>
|
||||
<li>
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>
|
||||
Management dashboard for all your agents
|
||||
</li>
|
||||
<li>
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>
|
||||
OpenRouter key included (or bring your own)
|
||||
</li>
|
||||
<li>
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>
|
||||
Support chat with human escalation
|
||||
</li>
|
||||
<li>
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>
|
||||
Refer-a-friend: $5 credit per signup
|
||||
</li>
|
||||
</ul>
|
||||
<!-- Senior -->
|
||||
<div class="pricing-card">
|
||||
<div class="pricing-plan-name">Senior</div>
|
||||
<div class="pricing-amount" id="amount-senior">
|
||||
<span class="pricing-currency">$</span>17<span class="pricing-decimal">.50</span>
|
||||
</div>
|
||||
<div class="pricing-period" id="period-senior">/ month</div>
|
||||
<div class="pricing-yearly-bonus" id="bonus-senior">✨ +$17.50 OpenRouter credits</div>
|
||||
<p class="pricing-plan-desc">For power users and teams.</p>
|
||||
<div class="pricing-plan-quota">4GB RAM · 40GB HDD</div>
|
||||
<ul class="pricing-perks">
|
||||
<li>
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>
|
||||
Everything in Junior
|
||||
</li>
|
||||
<li>
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>
|
||||
Email access for your agent
|
||||
</li>
|
||||
<li>
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>
|
||||
Highest API key credit allocation
|
||||
</li>
|
||||
</ul>
|
||||
<a href="https://app.derez.ai" class="btn btn-primary btn-block">Choose Senior</a>
|
||||
</div>
|
||||
|
||||
<a href="https://app.derez.ai" class="btn btn-primary btn-block btn-lg">
|
||||
Create Your Agent Now
|
||||
</a>
|
||||
|
||||
<p class="pricing-extra">
|
||||
Coupon codes available for $5 OpenRouter credits.<br/>
|
||||
Hosted in 🇫🇷 France.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -1835,7 +2000,7 @@
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>
|
||||
</button>
|
||||
<div class="faq-answer">
|
||||
Each agent instance is <strong>$9.50 USD per month</strong> with a <strong>$2.00 startup discount</strong> (you pay <strong>$7.50/mo</strong>). Monthly termination. Cancel anytime. Coupon codes are available for $5 OpenRouter credits to help you get started.
|
||||
Three plans to fit your needs. <strong>Trainee</strong> at <strong>$4.99/mo</strong> (1GB RAM, 10GB HDD) for getting started. <strong>Junior</strong> at <strong>$9.50/mo</strong> (2GB RAM, 20GB HDD) with SSH access and on-demand backups — the sweet spot. <strong>Senior</strong> at <strong>$17.50/mo</strong> (4GB RAM, 40GB HDD) with email access. Go yearly and get one month's worth of OpenRouter credits on top. Cancel anytime with monthly termination.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1919,21 +2084,27 @@
|
||||
<div class="container">
|
||||
<h2 class="section-title">Create Your AI Agent Now</h2>
|
||||
<p class="section-sub">
|
||||
Sign up, pick your agent, and get your own container with full access — bootstrapped and ready. Billed monthly.
|
||||
Sign up, pick your plan, and get your agent bootstrapped and ready in minutes.
|
||||
</p>
|
||||
|
||||
<div class="signup-card">
|
||||
<!-- Pricing badge -->
|
||||
<!-- Pricing -->
|
||||
<div class="signup-pricing-badge">
|
||||
<div class="signup-pricing-amount">
|
||||
<span class="pricing-original">$9.50</span>
|
||||
<span class="pricing-discounted">$7.50</span> <span>USD / month</span>
|
||||
<div class="signup-pricing-plans">
|
||||
<div class="signup-plan">
|
||||
<span class="signup-plan-name">Trainee</span>
|
||||
<span class="signup-plan-price">$4.99</span>
|
||||
</div>
|
||||
<div class="signup-plan featured">
|
||||
<span class="signup-plan-name">Junior</span>
|
||||
<span class="signup-plan-price">$9.50</span>
|
||||
</div>
|
||||
<div class="signup-plan">
|
||||
<span class="signup-plan-name">Senior</span>
|
||||
<span class="signup-plan-price">$17.50</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pricing-discount-badge">
|
||||
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>
|
||||
Startup Discount −$2.00
|
||||
</div>
|
||||
<div class="signup-pricing-term">Per agent instance · Monthly termination · Limited time</div>
|
||||
<div class="signup-pricing-term">Per agent instance · Monthly termination · Yearly credits available</div>
|
||||
</div>
|
||||
|
||||
<!-- Coupon -->
|
||||
@@ -2206,6 +2377,22 @@
|
||||
});
|
||||
});
|
||||
|
||||
/* ── Billing Toggle ────────────────────────────────── */
|
||||
function toggleBilling() {
|
||||
const yearly = document.getElementById('billing-toggle').checked;
|
||||
document.getElementById('billing-monthly-label').classList.toggle('active', !yearly);
|
||||
document.getElementById('billing-yearly-label').classList.toggle('active', yearly);
|
||||
document.getElementById('billing-save-badge').classList.toggle('show', yearly);
|
||||
|
||||
document.getElementById('bonus-trainee').classList.toggle('show', yearly);
|
||||
document.getElementById('bonus-junior').classList.toggle('show', yearly);
|
||||
document.getElementById('bonus-senior').classList.toggle('show', yearly);
|
||||
|
||||
document.getElementById('period-trainee').textContent = yearly ? '/ month ✦ yearly' : '/ month';
|
||||
document.getElementById('period-junior').textContent = yearly ? '/ month ✦ yearly' : '/ month';
|
||||
document.getElementById('period-senior').textContent = yearly ? '/ month ✦ yearly' : '/ month';
|
||||
}
|
||||
|
||||
/* ── Chat Widget ──────────────────────────────────────────── */
|
||||
const CHAT_URL = "https://n8n.derez.ai/webhook/a58d00c4-f0c9-40cd-bb50-4f45f0442ef0";
|
||||
let chatId = null;
|
||||
|
||||
Reference in New Issue
Block a user