-
- {t('common.developers')}
+
+
+
+
+ {FEATURE_PANELS.map((panel) => {
+ const Icon = panel.icon;
+ const perks = panel.perks.map((perkKey, index) => t(perkKey, panel.fallbackPerks[index]));
+
+ return (
+
+
+
+
+
+ {t(panel.titleKey, panel.titleDefault)}
+
+
+ {t(panel.descKey, panel.descDefault)}
+
+
+ {perks.map((perk) => (
+ -
+
+ {perk}
+
+ ))}
+
+
+ );
+ })}
+
+
+
+
+ {t('common.developers')}
+
+
+ {t('pages.developers.ctaTitle')}
+
+
+ {t('pages.developers.ctaSubtitle')}
+
+
+
+
+ {t('pages.developers.openDocs')}
+
+
+
+ {t('pages.developers.getApiKey')}
+
+
+
+
+
+
+
+
+
+ {t('home.ctaBannerLabel', 'Get started today')}
-
- {t('pages.developers.ctaTitle')}
+
+ {t('home.ctaBannerTitle', 'Ready to convert your files?')}
-
- {t('pages.developers.ctaSubtitle')}
+
+ {t('home.ctaBannerSubtitle', 'Join thousands of users who convert, compress, and edit their files every day — completely free.')}
-
-
-
- {t('pages.developers.openDocs')}
-
-
-
- {t('pages.developers.getApiKey')}
-
+
+
+ {t('home.ctaBrowseTools', 'Browse All Tools')}
+
+
+
+ {t('home.ctaCreateAccount', 'Create Free Account')}
+
+
-
- {t('home.ctaBannerLabel', 'Get started today')}
-
-
- {t('home.ctaBannerTitle', 'Ready to convert your files?')}
-
-
- {t('home.ctaBannerSubtitle', 'Join thousands of users who convert, compress, and edit their files every day — completely free.')}
-
-
-
- {t('home.ctaBrowseTools', 'Browse All Tools')}
-
-
-
- {t('home.ctaCreateAccount', 'Create Free Account')}
-
-
-
- {/* Header */}
+
+ {/* Header + billing toggle */}
-
+
{t('pages.pricing.title', 'Simple, Transparent Pricing')}
- {t('pages.pricing.subtitle', 'Start free with all tools. Upgrade when you need more power.')}
+ {t('pages.pricing.subtitle', 'Unlock the power of your PDFs with flexible plans.')}
+ {/* Billing toggle */}
+
+
+
+
+
+ {/* Transparency callout */}
@@ -120,88 +155,76 @@ export default function PricingPage() {
- {/* Plan Cards */}
-
+ {/* 3-tier Plan Cards */}
+
{/* Free Plan */}
-
-
-
-
-
-
-
- {t('pages.pricing.freePlan', 'Free')}
-
-
- {t('pages.pricing.freeDesc', 'For personal use')}
-
-
+
+
+
+ {t('pages.pricing.freePlan', 'Free')}
+
- $0
+ ${prices.free}
/ {t('pages.pricing.month', 'month')}
-
+
{FEATURES.filter((f) => f.free !== false).map((f) => (
- -
-
- {t(`pages.pricing.features.${f.key}`, f.key)}
- {typeof f.free === 'string' && (
- ({f.free})
- )}
+
-
+
+
+ {t(`pages.pricing.features.${f.key}`, f.key)}
+ {typeof f.free === 'string' && (
+ ({f.free})
+ )}
+
))}
- {t('pages.pricing.getStarted', 'Get Started Free')}
+ {t('pages.pricing.getStarted', 'Get Started')}
{/* Pro Plan */}
-
-
+
+
{t('pages.pricing.popular', 'MOST POPULAR')}
-
-
-
-
-
-
- {t('pages.pricing.proPlan', 'Pro')}
-
-
- {t('pages.pricing.proDesc', 'For professionals & teams')}
-
-
+
+
+ {t('pages.pricing.proPlan', 'Pro')}
+
- $9
+ ${prices.pro}
/ {t('pages.pricing.month', 'month')}
-
+
+ {/* Enterprise Plan */}
+
+
+
+ {t('pages.pricing.enterprisePlan', 'Enterprise')}
+
+
+
+
+ ${prices.enterprise}
+ / {t('pages.pricing.month', 'month')}
+
+
+
+ {FEATURES.filter((f) => f.enterprise !== false).map((f) => (
+ -
+
+
+ {t(`pages.pricing.features.${f.key}`, f.key)}
+ {typeof f.enterprise === 'string' && (
+ ({f.enterprise})
+ )}
+
+
+ ))}
+
+
+
+ {/* Trust section */}
@@ -244,39 +300,16 @@ export default function PricingPage() {
- {/* Comparison Table */}
-
-
-
-
- |
- {t('pages.pricing.feature', 'Feature')}
- |
-
- {t('pages.pricing.freePlan', 'Free')}
- |
-
- {t('pages.pricing.proPlan', 'Pro')}
- |
-
-
-
- {FEATURES.map((f, idx) => (
-
- |
- {t(`pages.pricing.features.${f.key}`, f.key)}
- |
- {renderValue(f.free)} |
- {renderValue(f.pro)} |
-
- ))}
-
-
+ {/* Bottom trust badges */}
+
+
+
+ {t('pages.pricing.securePayment', 'Secure Payment')}
+
+
+
+ {t('pages.pricing.moneyBack', '30-Day Money Back Guarantee')}
+
{/* FAQ */}
diff --git a/frontend/src/styles/global.css b/frontend/src/styles/global.css
index 86edbc0..313011d 100644
--- a/frontend/src/styles/global.css
+++ b/frontend/src/styles/global.css
@@ -169,6 +169,40 @@
linear-gradient(180deg, #0f172a 0%, #0f172a 100%);
}
+.marketing-shell {
+ background:
+ radial-gradient(circle at top left, rgba(59, 130, 246, 0.1), transparent 30%),
+ radial-gradient(circle at top right, rgba(14, 165, 233, 0.08), transparent 26%),
+ linear-gradient(180deg, rgba(248, 250, 252, 0.88) 0%, rgba(255, 255, 255, 0.92) 26%, #ffffff 100%);
+}
+
+.dark .marketing-shell {
+ background:
+ radial-gradient(circle at top left, rgba(37, 99, 235, 0.18), transparent 32%),
+ radial-gradient(circle at top right, rgba(14, 165, 233, 0.12), transparent 28%),
+ linear-gradient(180deg, rgba(2, 6, 23, 0.96) 0%, rgba(15, 23, 42, 0.98) 26%, #020617 100%);
+}
+
+.marketing-panel {
+ @apply rounded-[2rem] border border-slate-200/80 bg-white/90 shadow-sm backdrop-blur-sm dark:border-slate-700/70 dark:bg-slate-900/70;
+}
+
+.marketing-card {
+ @apply rounded-[1.75rem] border border-slate-200/80 bg-white/90 p-6 shadow-sm transition-all duration-300 dark:border-slate-700/70 dark:bg-slate-900/75;
+}
+
+.marketing-card:hover {
+ @apply -translate-y-1 shadow-lg shadow-slate-200/70 dark:shadow-slate-950/30;
+}
+
+.metric-card {
+ @apply rounded-3xl border border-slate-200/80 bg-white/85 p-5 shadow-sm backdrop-blur-sm dark:border-slate-700/70 dark:bg-slate-900/70;
+}
+
+.section-kicker {
+ @apply text-xs font-bold uppercase tracking-[0.24em] text-primary-600 dark:text-primary-400;
+}
+
/* ──────────────────────────────────────────────────────────────────────────
Shimmer loading effect
────────────────────────────────────────────────────────────────────────── */