<!DOCTYPE html>
<html lang="en">
<?php $pagetitle = "Digital Wallet | Nesvra";
include 'components/head.php' ?>

<body class="bg-white">

    <?php include 'components/navbar.php'; ?>

    <section class="relative max-h-[80dvh] h-fit w-full overflow-hidden">

        <div class="absolute inset-0 z-0">
            <div class="absolute inset-0 bg-black/30 z-10"></div> <img src="https://i.pinimg.com/1200x/b9/a2/fb/b9a2fb4a444156cfa5efd35c499313f3.jpg"
                class="w-full h-full object-cover bg-fixed bg-top"
                style="background-attachment: fixed; background-position: center;" alt="Nesvra Infrastructure" />
        </div>

        <div
            class="relative z-20 h-full w-full max-w-8xl mx-auto px-4 md:px-16 pt-32 md:pt-48 pb-12 flex flex-col items-start text-left">


            <h1 data-aos="fade-right" data-aos-delay="200"
                class="max-w-3xl text-4xl md:text-5xl font-[400] tracking-[-0.05em] leading-[1.05] text-white ">
                Build a Complete Digital Wallet & <span class="italic font-serif"> Payments Ecosystem </span> <br class="hidden md:block">

            </h1>

            <p data-aos="fade-right" data-aos-delay="400"
                class="mt-3 max-w-3xl text-sm  text-white/70 font-mono md:leading-relaxed leading-snug">
                Launch a fully branded fintech platform featuring customer wallets, agent banking, merchant payments, virtual cards, QR transactions, escrow services, and global payment integrations. <span class="max-sm:hidden"> Own the source code, control the infrastructure, and scale your financial ecosystem with confidence. </span>
            </p>

            <div data-aos="fade-up" data-aos-delay="600" class="mt-4 flex flex-wrap gap-5">

                <a href="get-demo?product=digital-wallet"
                    class="shimmer-effect group relative inline-flex items-center gap-3 px-8 py-4 bg-brandOrange text-white rounded-full transition-all duration-300 hover:scale-[1.05] active:translate-y-[2px] shadow-[0_15px_30px_-5px_rgba(255,138,0,0.4)]">

                    <div class="absolute inset-0 rounded-full border-t border-white/30 pointer-events-none"></div>

                    <div class="absolute inset-0 rounded-full bg-gradient-to-b from-white/10 to-transparent opacity-50">
                    </div>

                    <i data-lucide="play-circle" class="w-4 h-4 text-white"></i>
                    <span class="font-sans font-[600] tracking-tight text-sm">Schedule Live Demo</span>
                </a>

                <a href="checkout?product=digital-wallet"
                    class="shimmer-effect group relative inline-flex items-center gap-3 px-8 py-4 bg-[#111] text-white rounded-full transition-all duration-300 hover:scale-[1.05] active:scale-[0.95] shadow-[0_20px_50px_-10px_rgba(0,0,0,0.5)]">
                    <div class="absolute inset-0 rounded-full border border-white/10 pointer-events-none"></div>
                    <span class="font-sans font-[500] tracking-tight text-sm">Purchase License</span>
                    <i data-lucide="arrow-right" class="group-hover:translate-x-1 transition-transform w-4 h-4"></i>
                </a>

            </div>





        </div>


    </section>

    <section class="py-24 px-[5%] bg-white overflow-hidden" id="unified-advantage">
        <div class="max-w-[1200px] mx-auto text-center">

            <div class="mb-16" data-aos="fade-up" data-aos-duration="1000">
                <span class="font-mono text-[11px] uppercase tracking-[0.4em] text-brandOrange">{01} THE UNIFIED ADVANTAGE — ONE PLATFORM</span>
                <h2 class="text-4xl md:text-5xl font-[400] tracking-tighter mt-6 text-royal max-w-[900px] mx-auto leading-[1.1]">
                    Four Revenue Streams. <br>
                    <span class="italic font-serif text-electric">Infinite Possibilities.</span>
                </h2>
                <p class="text-soft text-lg mt-6 max-w-[850px] mx-auto font-sans leading-relaxed">
                    While PayPal focuses on consumers and Stripe on businesses, <span class="text-royal font-semibold">Nesvra delivers the complete stack.</span> You don't just launch a wallet you launch an entire financial ecosystem that captures value at every touchpoint.
                </p>
            </div>

            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-0 border border-gray-100 rounded-[32px] overflow-hidden shadow-[0_40px_100px_-20px_rgba(8,31,92,0.05)]" data-aos="fade-up" data-aos-delay="200">

                <div class="p-10 border-r border-b lg:border-b-0 border-gray-100 flex flex-col gap-4 group hover:bg-gray-50 transition-colors text-left">
                    <div class="w-10 h-10 rounded-full bg-gray-50 flex items-center justify-center text-royal group-hover:bg-royal group-hover:text-white transition-all">
                        <i class="ri-layout-masonry-line text-xl"></i>
                    </div>
                    <div class="mt-4">
                        <h3 class="text-4xl font-semibold tracking-tighter text-royal">4</h3>
                        <p class="font-mono text-[10px] uppercase tracking-wider text-electric mt-2 font-bold">Integrated Panels</p>
                        <p class="text-[13px] text-soft mt-4 leading-snug">User · Agent · Merchant · Admin. Specialized portals for every player in your market.</p>
                    </div>
                </div>

                <div class="p-10 border-r border-b lg:border-b-0 border-gray-100 flex flex-col gap-4 group hover:bg-gray-50 transition-colors text-left">
                    <div class="w-10 h-10 rounded-full bg-gray-50 flex items-center justify-center text-royal group-hover:bg-royal group-hover:text-white transition-all">
                        <i class="ri-global-line text-xl"></i>
                    </div>
                    <div class="mt-4">
                        <h3 class="text-4xl font-semibold tracking-tighter text-royal">30+</h3>
                        <p class="font-mono text-[10px] uppercase tracking-wider text-soft mt-2 font-bold">Global Gateways</p>
                        <p class="text-[13px] text-soft mt-4 leading-snug">Stripe · PayPal · Crypto · Mobile Money. Accept payments from anyone, anywhere.</p>
                    </div>
                </div>

                <div class="p-10 border-r border-b lg:border-b-0 border-gray-100 flex flex-col gap-4 group hover:bg-gray-50 transition-colors text-left">
                    <div class="w-10 h-10 rounded-full bg-gray-50 flex items-center justify-center text-royal group-hover:bg-royal group-hover:text-white transition-all">
                        <i class="ri-shield-keyhole-line text-xl"></i>
                    </div>
                    <div class="mt-4">
                        <h3 class="text-4xl font-semibold tracking-tighter text-royal">100%</h3>
                        <p class="font-mono text-[10px] uppercase tracking-wider text-brandOrange mt-2 font-bold">IP Ownership</p>
                        <p class="text-[13px] text-soft mt-4 leading-snug">Full Source Code Delivered. No vendor lock-in, no hidden royalties, no compromises.</p>
                    </div>
                </div>

                <div class="p-10 flex flex-col gap-4 bg-royal group relative overflow-hidden text-left cursor-pointer transition-transform hover:scale-[1.02]">
                    <div class="absolute -top-10 -right-10 w-32 h-32 bg-electric/20 blur-[60px] rounded-full"></div>

                    <div class="w-10 h-10 rounded-full bg-white/10 flex items-center justify-center text-white relative z-10">
                        <i class="ri-rocket-2-line text-xl"></i>
                    </div>
                    <div class="mt-4 relative z-10">
                        <h3 class="text-2xl font-semibold tracking-tight text-white leading-tight">Claim Your Ecosystem Now</h3>
                        <p class="font-mono text-[10px] uppercase tracking-wider text-brandOrange mt-2 font-bold">Ready for Launch</p>
                        <div class="flex items-center gap-2 text-white/70 text-[13px] mt-6 group-hover:text-white transition-colors">
                            <span>Get Started</span>
                            <i class="ri-arrow-right-line group-hover:translate-x-1 transition-transform"></i>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </section>

    <section class="py-24 px-[5%] bg-white overflow-hidden" id="transformational-engine">
        <div class="max-w-[1200px] mx-auto">

            <div class="text-center mb-16" data-aos="fade-up">
                <span class="font-mono text-[10px] uppercase tracking-[0.4em] text-electric block mb-4">{02} What Makes Nesvra Transformational?</span>
                <h2 class="text-3xl md:text-5xl font-[400] tracking-tighter text-royal">
                    Not Just Features A Complete <br> <span class="italic font-serif text-brandOrange">Business Engine.</span>
                </h2>
                <p class="text-soft text-lg mt-4 max-w-[750px] mx-auto leading-relaxed">
                    Designed to generate revenue from day one. Build your ecosystem with tools that actually move the needle.
                </p>
            </div>

            <div class="grid grid-cols-1 md:grid-cols-3 relative border-t border-zinc-100">

                <div class="relative p-10 flex flex-col items-center text-center border-b md:border-r border-zinc-100 group">
                    <div class="hidden md:block absolute -right-[10px] -bottom-[1px] w-[20px] h-[2px] bg-brandOrange z-10"></div>
                    <div class="hidden md:block absolute -right-[1px] -bottom-[10px] w-[2px] h-[20px] bg-brandOrange z-10"></div>

                    <i class="ri-layout-grid-fill text-3xl text-zinc-300 group-hover:text-royal transition-all duration-300 mb-6"></i>
                    <h3 class="text-lg font-bold text-royal tracking-tight mb-3">4-in-1 Multi-Panel System</h3>
                    <p class="text-[12px] text-soft leading-relaxed mb-4">Integrated dashboards for User (B2C), Agent (Network), Merchant (Payments), and Admin (Control).</p>
                    <div class="mt-auto px-4 py-2 bg-zinc-50 rounded-lg border border-zinc-100 group-hover:bg-brandOrange/5 transition-colors">
                        <p class="text-[10px] font-bold text-brandOrange uppercase tracking-wider">Revenue Impact</p>
                        <p class="text-[11px] text-royal font-[400]">Fees + Commissions + Subs</p>
                    </div>
                </div>

                <div class="relative p-10 flex flex-col items-center text-center border-b md:border-r border-zinc-100 group">
                    <div class="hidden md:block absolute -right-[10px] -bottom-[1px] w-[20px] h-[2px] bg-brandOrange z-10"></div>
                    <div class="hidden md:block absolute -right-[1px] -bottom-[10px] w-[2px] h-[20px] bg-brandOrange z-10"></div>

                    <i class="ri-global-line text-3xl text-zinc-300 group-hover:text-royal transition-all duration-300 mb-6"></i>
                    <h3 class="text-lg font-bold text-royal tracking-tight mb-3">30+ Global Gateways</h3>
                    <p class="text-[12px] text-soft leading-relaxed mb-4">Cards, crypto, and mobile money via Stripe, PayPal, Flutterwave, Coinbase, and 25+ more.</p>
                    <div class="mt-auto px-4 py-2 bg-zinc-50 rounded-lg border border-zinc-100 group-hover:bg-brandOrange/5 transition-colors">
                        <p class="text-[10px] font-bold text-brandOrange uppercase tracking-wider">Revenue Impact</p>
                        <p class="text-[11px] text-royal font-[400]">FX Spreads + Gateway Fees</p>
                    </div>
                </div>

                <div class="relative p-10 flex flex-col items-center text-center border-b border-zinc-100 group">
                    <i class="ri-node-tree text-3xl text-zinc-300 group-hover:text-royal transition-all duration-300 mb-6"></i>
                    <h3 class="text-lg font-bold text-royal tracking-tight mb-3">Agent Network & Cash</h3>
                    <p class="text-[12px] text-soft leading-relaxed mb-4">Dedicated app for cash-in/out networks. Fully white-label commission-based earning, like M-Pesa.</p>
                    <div class="mt-auto px-4 py-2 bg-zinc-50 rounded-lg border border-zinc-100 group-hover:bg-brandOrange/5 transition-colors">
                        <p class="text-[10px] font-bold text-brandOrange uppercase tracking-wider">Revenue Impact</p>
                        <p class="text-[11px] text-royal font-[400]">Zero-Overhead Commissions</p>
                    </div>
                </div>

                <div class="relative p-10 flex flex-col items-center text-center border-b md:border-r border-zinc-100 group">
                    <div class="hidden md:block absolute -right-[10px] -top-[1px] w-[20px] h-[2px] bg-brandOrange z-10"></div>
                    <div class="hidden md:block absolute -right-[1px] -top-[10px] w-[2px] h-[20px] bg-brandOrange z-10"></div>

                    <i class="ri-store-2-line text-3xl text-zinc-300 group-hover:text-royal transition-all duration-300 mb-6"></i>
                    <h3 class="text-lg font-bold text-royal tracking-tight mb-3">Merchant & API Access</h3>
                    <p class="text-[12px] text-soft leading-relaxed mb-4">Let businesses accept payments and access APIs. Turn your platform into a Stripe-like processor.</p>
                    <div class="mt-auto px-4 py-2 bg-zinc-50 rounded-lg border border-zinc-100 group-hover:bg-brandOrange/5 transition-colors">
                        <p class="text-[10px] font-bold text-brandOrange uppercase tracking-wider">Revenue Impact</p>
                        <p class="text-[11px] text-royal font-[400]">Subs + Premium API Access</p>
                    </div>
                </div>

                <div class="relative p-10 flex flex-col items-center text-center border-b md:border-r border-zinc-100 group">
                    <div class="hidden md:block absolute -right-[10px] -top-[1px] w-[20px] h-[2px] bg-brandOrange z-10"></div>
                    <div class="hidden md:block absolute -right-[1px] -top-[10px] w-[2px] h-[20px] bg-brandOrange z-10"></div>

                    <i class="ri-qr-code-line text-3xl text-zinc-300 group-hover:text-royal transition-all duration-300 mb-6"></i>
                    <h3 class="text-lg font-bold text-royal tracking-tight mb-3">Virtual Cards & QR</h3>
                    <p class="text-[12px] text-soft leading-relaxed mb-4">Instant Visa/Mastercard issuance + frictionless QR payments for P2P and in-store checkouts.</p>
                    <div class="mt-auto px-4 py-2 bg-zinc-50 rounded-lg border border-zinc-100 group-hover:bg-brandOrange/5 transition-colors">
                        <p class="text-[10px] font-bold text-brandOrange uppercase tracking-wider">Revenue Impact</p>
                        <p class="text-[11px] text-royal font-[400]">Issuance Fees + Interchange</p>
                    </div>
                </div>

                <div class="relative p-10 flex flex-col items-center text-center border-b border-zinc-100 group">
                    <i class="ri-code-box-line text-3xl text-zinc-300 group-hover:text-royal transition-all duration-300 mb-6"></i>
                    <h3 class="text-lg font-bold text-royal tracking-tight mb-3">100% Code Ownership</h3>
                    <p class="text-[12px] text-soft leading-relaxed mb-4">Laravel/Flutter source code delivered. No lock-in, no monthly rental, infinite scalability.</p>
                    <div class="mt-auto px-4 py-2 bg-zinc-50 rounded-lg border border-zinc-100 group-hover:bg-brandOrange/5 transition-colors">
                        <p class="text-[10px] font-bold text-brandOrange uppercase tracking-wider">Revenue Impact</p>
                        <p class="text-[11px] text-royal font-[400]">100% Profit Retention</p>
                    </div>
                </div>

            </div>
        </div>
    </section>

    <section class="py-24 px-[5%] bg-white" id="competitive-edge">
        <div class="max-w-[1200px] mx-auto">

            <div class="mb-16 text-left" data-aos="fade-up">
                <span class="font-mono text-[11px] uppercase tracking-[0.5em] text-brandOrange block mb-4">Market Positioning</span>
                <h2 class="text-4xl md:text-5xl font-[400] tracking-tighter text-royal leading-[1.1]">
                    How Nesvra Stacks <br>
                    <span class="italic font-serif text-zinc-400">Against the Giants.</span>
                </h2>
                <p class="text-soft text-lg mt-6 max-w-[700px] leading-relaxed">
                    Why build on someone else's platform when you can <span class="text-royal font-bold">own the entire stack?</span>
                </p>
            </div>

            <div class="md:hidden flex items-center gap-3 mb-6 text-zinc-400 animate-pulse">
                <div class="flex gap-1">
                    <i class="ri-arrow-left-s-line"></i>
                    <i class="ri-hand-coin-line"></i>
                    <i class="ri-arrow-right-s-line"></i>
                </div>
                <span class="font-mono text-[10px] uppercase tracking-[0.2em]">Swipe to compare the giants</span>
            </div>

            <div class="overflow-x-auto pb-6 custom-scrollbar">
                <div class="min-w-[900px]">
                    <table class="w-full text-left border-separate border-spacing-0 border border-zinc-100 rounded-[40px] overflow-hidden shadow-[0_40px_80px_-15px_rgba(0,0,0,0.05)]">
                        <thead>
                            <tr class="bg-zinc-50/80 backdrop-blur-sm">
                                <th class="p-8 text-[10px] uppercase tracking-widest text-zinc-400 font-mono border-b border-zinc-100">Capability</th>
                                <th class="p-8 text-sm font-bold text-royal border-b border-zinc-100">PayPal</th>
                                <th class="p-8 text-sm font-bold text-royal border-b border-zinc-100">CashApp</th>
                                <th class="p-8 text-sm font-bold text-royal border-b border-zinc-100">Stripe</th>
                                <th class="p-8 text-sm font-bold text-white bg-royal border-b border-royal text-center">Nesvra Advantage</th>
                            </tr>
                        </thead>
                        <tbody class="text-[13px] bg-white">

                            <tr>
                                <td class="p-8 font-[400] text-royal border-b border-zinc-50">Target Focus</td>
                                <td class="p-8 text-soft border-b border-zinc-50">Consumer Only</td>
                                <td class="p-8 text-soft border-b border-zinc-50">P2P Only</td>
                                <td class="p-8 text-soft border-b border-zinc-50">Merchant Only</td>
                                <td class="p-8 font-bold text-royal bg-royal/[0.02] border-b border-zinc-50">Unified Ecosystem</td>
                            </tr>

                            <tr>
                                <td class="p-8 font-[400] text-royal border-b border-zinc-50">Infrastructure</td>
                                <td class="p-8 text-soft border-b border-zinc-50 italic">Limited Tools</td>
                                <td class="p-8 text-soft border-b border-zinc-50 italic">No Merchant Layer</td>
                                <td class="p-8 text-soft border-b border-zinc-50 italic">API-Only</td>
                                <td class="p-8 font-bold text-royal bg-royal/[0.02] border-b border-zinc-50">User + Agent + Merchant</td>
                            </tr>

                            <tr>
                                <td class="p-8 font-[400] text-royal border-b border-zinc-50">Branding</td>
                                <td class="p-8 border-b border-zinc-50">
                                    <div class="flex items-center gap-2 text-red-400">
                                        <i class="ri-close-circle-fill"></i> No White-Label
                                    </div>
                                </td>
                                <td class="p-8 border-b border-zinc-50">
                                    <div class="flex items-center gap-2 text-red-400">
                                        <i class="ri-close-circle-fill"></i> No White-Label
                                    </div>
                                </td>
                                <td class="p-8 text-soft border-b border-zinc-50 italic">Dashboard Only</td>
                                <td class="p-8 border-b border-zinc-50 bg-royal/[0.02]">
                                    <div class="flex items-center gap-2 text-brandOrange font-bold">
                                        <i class="ri-checkbox-circle-fill"></i> 100% White-Label
                                    </div>
                                </td>
                            </tr>

                            <tr>
                                <td class="p-8 font-[400] text-royal">Ownership</td>
                                <td class="p-8 text-zinc-400 font-mono text-[11px] uppercase tracking-tighter">Zero Ownership</td>
                                <td class="p-8 text-zinc-400 font-mono text-[11px] uppercase tracking-tighter">Zero Ownership</td>
                                <td class="p-8 text-zinc-400 font-mono text-[11px] uppercase tracking-tighter">Zero Ownership</td>
                                <td class="p-8 bg-royal relative">
                                    <div class="flex flex-col text-center">
                                        <span class="text-white font-black text-lg tracking-tighter uppercase">Full Ownership</span>
                                        <span class="text-brandOrange font-mono text-[9px] uppercase tracking-[0.2em] mt-1">Source Code Included</span>
                                    </div>
                                    <div class="absolute inset-0 bg-white/5 animate-pulse pointer-events-none"></div>
                                </td>
                            </tr>

                        </tbody>
                    </table>
                </div>
            </div>

            <div class="mt-12 flex flex-col md:flex-row items-center justify-between gap-8 px-4">
                <div class="flex items-center gap-5">
                    <div class="w-14 h-14 rounded-2xl bg-zinc-50 flex items-center justify-center text-royal border border-zinc-100 shadow-sm">
                        <i class="ri-shield-user-line text-2xl"></i>
                    </div>
                    <p class="text-sm text-soft max-w-sm leading-relaxed">
                        While they rent you access, <span class="text-royal font-bold">Nesvra hands you the keys.</span> Build on your terms, with 100% revenue retention.
                    </p>
                </div>
                <a href="#purchase" class="w-full md:w-auto text-center px-10 py-5 bg-royal text-white rounded-full font-bold text-xs uppercase tracking-widest hover:bg-brandOrange transition-all shadow-[0_20px_40px_-10px_rgba(0,34,136,0.3)]">
                    Claim Your Ecosystem Now
                </a>
            </div>

        </div>
    </section>

    <style>
        .custom-scrollbar::-webkit-scrollbar {
            height: 6px;
        }

        .custom-scrollbar::-webkit-scrollbar-track {
            background: #f4f4f5;
            border-radius: 20px;
        }

        .custom-scrollbar::-webkit-scrollbar-thumb {
            background: #ff8a00;
            /* brandOrange */
            border-radius: 20px;
        }
    </style>



    <section class="py-24 px-[5%] bg-white hide-on-mobile" id="fintech-suite">
        <div class="max-w-[1400px] mx-auto">

            <div class="text-center mb-14" data-aos="fade-up">
                <span class="font-mono text-[11px] uppercase tracking-[0.4em] text-electric">{05} THE COMPLETE FINTECH SUITE</span>
                <h2 class="text-4xl md:text-5xl font-[400] tracking-tighter mt-6 text-royal leading-[1.1]">
                    Everything You Need to Dominate <br>
                    <span class="italic font-serif text-soft">the Digital Wallet Market</span>
                </h2>
                <p class="text-soft text-base mt-4 max-w-[800px] mx-auto leading-relaxed">
                    From P2P transfers to merchant payments, escrow, virtual cards, and enterprise-grade compliance a complete fintech powerhouse that rivals PayPal, Revolut, and M-Pesa.
                </p>
            </div>

            <?php
            $fintech_suite = [
                [
                    'title' => 'Multi-Currency Hub',
                    'desc' => 'Support USD, EUR, GBP, CAD, AUD, crypto (BTC, ETH, USDT), and local currencies. Real-time exchange rates with customizable spread — your profit margin built-in.',
                    'features' => ['Send Money', 'Request Money', 'Exchange', 'Cash Out'],
                    'monetization' => 'Revenue: FX Spread + Transfer Fees',
                    'image' => 'https://i.pinimg.com/736x/09/7f/d6/097fd699f15c8a411f0170f69799f510.jpg',
                    'accent' => 'brandOrange',
                    'delivery' => 'Real-time liquidity management'
                ],
                [
                    'title' => 'Agent & Merchant Ecosystem',
                    'desc' => 'Dedicated agent app for cash-in/out with commission tracking. Merchant app with payment acceptance, invoicing, API keys, and settlement reports — become the Stripe of your region.',
                    'features' => ['Agent Commission', 'Merchant API', 'Invoicing', 'Settlement Reports'],
                    'monetization' => 'Scale: B2B Subscription + Merchant Tx Fees',
                    'image' => 'https://i.pinimg.com/1200x/bb/50/94/bb5094ee9bf752558a5ec7b616fe90f5.jpg',
                    'accent' => 'electric',
                    'delivery' => 'White-label POS integration ready'
                ],
                [
                    'title' => '30+ Global Gateways',
                    'desc' => 'Pre-integrated with Stripe, PayPal, Flutterwave, Paystack, Coinbase, bKash, Mercado Pago, Razorpay, and 25+ more. Support cards, bank transfers, crypto, mobile money — anywhere in the world.',
                    'features' => ['Crypto Ready', 'Mobile Money', 'Bank Transfers', 'Auto-Settlement'],
                    'monetization' => 'Reach: Global Payment Interoperability',
                    'image' => 'https://i.pinimg.com/1200x/a8/70/84/a87084c7cf118c487a42f14a492ed494.jpg',
                    'accent' => 'brandOrange',
                    'delivery' => 'Instant gateway failover'
                ],
                [
                    'title' => 'QR & Virtual Cards',
                    'desc' => 'Instant QR code payments for in-store and P2P. Issue virtual Visa/Mastercard instantly — perfect for online spending. New revenue stream from card issuance and interchange fees.',
                    'features' => ['Tap to Pay', 'Virtual Card', 'QR Checkout', 'Physical Card Ready'],
                    'monetization' => 'Revenue: Issuance Fees + Interchange Revenue',
                    'image' => 'https://i.pinimg.com/1200x/ce/ca/4d/ceca4dcce84a27b49594049c8af9d5ff.jpg',
                    'accent' => 'electric',
                    'delivery' => 'Instant provisioning via API'
                ],
                [
                    'title' => 'Escrow, Voucher & Invoice',
                    'desc' => 'Secure escrow for high-value transactions, voucher codes for marketing campaigns, professional invoicing with payment links — transform simple transfers into full business finance.',
                    'features' => ['Escrow Protection', 'Voucher Codes', 'Invoicing', 'Payment Links'],
                    'monetization' => 'Trust: Escrow Holding Fees',
                    'image' => 'https://i.pinimg.com/1200x/d0/1a/d7/d01ad7b194c6bb4b1da9b2f750c6e7d6.jpg',
                    'accent' => 'brandOrange',
                    'delivery' => 'Automated Dispute Resolution'
                ],
                [
                    'title' => 'E-commerce Store System',
                    'desc' => 'Built-in storefront, product catalog, inventory management, shipping charges, order tracking — turn your wallet into a mini Amazon or TikTok Shop competitor.',
                    'features' => ['Product Listings', 'Stock Mgmt', 'Order Tracking', 'Flash Sales'],
                    'monetization' => 'Growth: 100% Native Marketplace Sales',
                    'image' => 'https://i.pinimg.com/1200x/7e/ca/1a/7eca1a0a1a4cc1bce55de7adc044303f.jpg',
                    'accent' => 'electric',
                    'delivery' => 'End-to-End Fulfillment'
                ],
                [
                    'title' => 'Bank-Grade Security & KYC',
                    'desc' => '2FA, security PIN, KYC verification with document upload, transaction monitoring, dispute center, fraud detection. Fully GDPR compliant. Build trust like Revolut or Wise.',
                    'features' => ['2FA', 'KYC/AML', 'Dispute Center', 'Fraud Detection'],
                    'monetization' => 'Trust: Institutional-Grade Safety',
                    'image' => 'https://i.pinimg.com/736x/04/e7/70/04e77088ea72387e25959222185a587c.jpg',
                    'accent' => 'brandOrange',
                    'delivery' => 'GDPR & PCI-DSS Compliant'
                ],
                [
                    'title' => 'Omnichannel Notifications',
                    'desc' => 'Push notifications, email alerts, SMS, in-app messages. Admin controls for bulk campaigns, reminders, and engagement automation. Increase user retention by 3x.',
                    'features' => ['Push Alerts', 'Email Campaigns', 'SMS', 'Bulk Reminders'],
                    'monetization' => 'Retention: Automated Marketing Engine',
                    'image' => 'https://i.pinimg.com/1200x/1e/75/ee/1e75ee50a119551bd06219827e751986.jpg', // Replace with relevant image
                    'accent' => 'electric',
                    'delivery' => 'Integrated Twilio/Firebase support'
                ]
            ];
            ?>

            <div class="mx-auto px-[3%]">
                <div class="space-y-32">
                    <?php foreach ($fintech_suite as $item): ?>
                        <div class="relative md:sticky top-24 bg-white mb-20 md:mb-0">
                            <div class="grid md:grid-cols-2 gap-16 items-center border-t border-gray-100 pt-16 group">

                                <div class="content-side" data-aos="fade-up">
                                    <span class="font-mono text-[10px] uppercase tracking-[0.3em] text-<?= $item['accent'] ?> mb-4 block font-bold">Fintech System</span>
                                    <h3 class="text-4xl text-royal font-[400] tracking-tighter mb-6 leading-tight"><?= $item['title'] ?></h3>
                                    <p class="text-base text-soft leading-relaxed mb-8"><?= $item['desc'] ?></p>

                                    <ul class="grid grid-cols-1 sm:grid-cols-2 gap-y-4 mb-10">
                                        <?php foreach ($item['features'] as $feature): ?>
                                            <li class="flex items-center gap-4 text-soft group/list">
                                                <div class="w-5 h-5 rounded-full bg-<?= $item['accent'] ?>/10 flex items-center justify-center transition-transform duration-300 group-hover/list:scale-110">
                                                    <i data-lucide="check" class="w-3 h-3 text-<?= $item['accent'] ?>"></i>
                                                </div>
                                                <span class="font-mono text-[12px] tracking-tight"><?= $feature ?></span>
                                            </li>
                                        <?php endforeach; ?>
                                    </ul>

                                    <div class="flex flex-col gap-2">
                                        <div class="inline-block px-4 py-2 bg-gray-50 rounded-lg border border-gray-100">
                                            <span class="font-mono text-[10px] uppercase tracking-widest text-<?= $item['accent'] ?> font-bold">
                                                <?= $item['monetization'] ?>
                                            </span>
                                        </div>
                                        <?php if (isset($item['delivery'])): ?>
                                            <div class="px-4 py-1">
                                                <span class="text-[11px] text-soft italic font-serif"><?= $item['delivery'] ?></span>
                                            </div>
                                        <?php endif; ?>
                                    </div>
                                </div>

                                <div class="image-side" data-aos="fade-up">
                                    <div class="aspect-[4/3] w-full rounded-[32px] overflow-hidden border border-gray-100 shadow-[0_32px_64px_-16px_rgba(8,31,92,0.1)] relative">
                                        <div class="absolute inset-0 bg-gradient-to-tr from-<?= $item['accent'] ?>/5 to-transparent pointer-events-none z-10"></div>

                                        <img src="<?= $item['image'] ?>"
                                            alt="<?= $item['title'] ?>"
                                            class="w-full h-full object-cover transform transition-transform duration-[2.5s] group-hover:scale-110" />

                                        <div class="absolute bottom-6 left-6 z-20 flex items-center gap-2 px-3 py-1.5 bg-white/90 backdrop-blur-md rounded-full border border-gray-200">
                                            <div class="w-1.5 h-1.5 rounded-full bg-<?= $item['accent'] ?> animate-pulse"></div>
                                            <span class="font-mono text-[9px] uppercase tracking-widest text-royal font-bold">System Online</span>
                                        </div>
                                    </div>
                                </div>

                            </div>
                        </div>
                    <?php endforeach; ?>
                </div>
            </div>

            <div class="mt-32 grid grid-cols-2 md:grid-cols-4 gap-8 border-t border-gray-100 pt-16">
                <div class="text-center group">
                    <i class="ri-shield-check-line text-2xl text-soft group-hover:text-brandOrange transition-colors mb-2"></i>
                    <p class="font-mono text-[10px] uppercase tracking-widest text-royal font-bold">GDPR Compliant</p>
                </div>
                <div class="text-center group">
                    <i class="ri-global-line text-2xl text-soft group-hover:text-electric transition-colors mb-2"></i>
                    <p class="font-mono text-[10px] uppercase tracking-widest text-royal font-bold">Cross-Border Ready</p>
                </div>
                <div class="text-center group">
                    <i class="ri-lock-2-line text-2xl text-soft group-hover:text-brandOrange transition-colors mb-2"></i>
                    <p class="font-mono text-[10px] uppercase tracking-widest text-royal font-bold">PCI-DSS Security</p>
                </div>
                <div class="text-center group">
                    <i class="ri-rocket-line text-2xl text-soft group-hover:text-electric transition-colors mb-2"></i>
                    <p class="font-mono text-[10px] uppercase tracking-widest text-royal font-bold">High Scalability</p>
                </div>
            </div>

        </div>
    </section>

    <section class="py-24 px-[5%] bg-white" id="ecosystem-matrix">
        <div class="max-w-[1400px] mx-auto">

            <div class="flex items-center gap-3 mb-4" data-aos="fade-up">
                <span class="w-8 h-[1px] bg-brandOrange"></span>
                <span class="font-mono text-[10px] uppercase tracking-[0.5em] text-brandOrange font-semibold">System Architecture </span>
            </div>

            <div class="grid lg:grid-cols-2 gap-16 items-end mb-12" data-aos="fade-up">
                <div>
                    <h2 class="text-4xl md:text-5xl font-[400] tracking-tighter text-royal leading-[0.9] mb-8">
                        One Core.
                        <span class="text-soft italic font-serif">Four Dimensions.</span>
                    </h2>

                </div>
                <div class="pb-2">
                    <p class="text-soft text-lg leading-relaxed max-w-xl pl-8">
                        Nesvra is an integrated governance engine. One database, four distinct interfaces, zero friction.
                    </p>
                </div>
            </div>

            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 border border-zinc-100 divide-y md:divide-y-0 md:divide-x divide-zinc-100">

                <div class="p-10 group hover:bg-zinc-50 transition-all duration-500">
                    <div class="flex justify-between items-start mb-12">
                        <span class="font-mono text-[10px] text-zinc-300">01 // B2C</span>
                        <i class="ri-user-6-line text-xl text-zinc-200 group-hover:text-royal transition-colors"></i>
                    </div>
                    <h3 class="text-xs font-mono uppercase tracking-[0.2em] text-brandOrange mb-3">User Dashboard</h3>
                    <p class="text-sm text-soft leading-relaxed mb-10 min-h-[80px]">
                        The consumer gateway. Send money, exchange currencies, and manage virtual cards in a frictionless P2P environment.
                    </p>
                    <div class="space-y-4">
                        <div class="text-[10px] font-bold text-royal/30 uppercase tracking-widest italic">Benchmarked: Venmo, CashApp</div>
                        <div class="h-[1px] w-full bg-zinc-100"></div>
                        <ul class="text-[11px] font-[400] text-royal space-y-2">
                            <li class="flex items-center gap-2"><span class="w-1 h-1 bg-brandOrange"></span> Multi-Currency Wallet</li>
                            <li class="flex items-center gap-2"><span class="w-1 h-1 bg-brandOrange"></span> Card Management</li>
                            <li class="flex items-center gap-2"><span class="w-1 h-1 bg-brandOrange"></span> QR Checkout</li>
                        </ul>
                    </div>
                </div>

                <div class="p-10 group hover:bg-zinc-50 transition-all duration-500">
                    <div class="flex justify-between items-start mb-12">
                        <span class="font-mono text-[10px] text-zinc-300">02 // FIELD</span>
                        <i class="ri-shield-user-line text-xl text-zinc-200 group-hover:text-royal transition-colors"></i>
                    </div>
                    <h3 class="text-xs font-mono uppercase tracking-[0.2em] text-brandOrange mb-3">Agent Network</h3>
                    <p class="text-sm text-soft leading-relaxed mb-10 min-h-[80px]">
                        The liquidity bridge. Manage cash-in/out and field operations with automated commission ledgers.
                    </p>
                    <div class="space-y-4">
                        <div class="text-[10px] font-bold text-royal/30 uppercase tracking-widest italic">Benchmarked: M-Pesa Agent</div>
                        <div class="h-[1px] w-full bg-zinc-100"></div>
                        <ul class="text-[11px] font-[400] text-royal space-y-2">
                            <li class="flex items-center gap-2"><span class="w-1 h-1 bg-brandOrange"></span> Commission Tracking</li>
                            <li class="flex items-center gap-2"><span class="w-1 h-1 bg-brandOrange"></span> Payout Requests</li>
                            <li class="flex items-center gap-2"><span class="w-1 h-1 bg-brandOrange"></span> Cash-In/Out Engine</li>
                        </ul>
                    </div>
                </div>

                <div class="p-10 group hover:bg-zinc-50 transition-all duration-500">
                    <div class="flex justify-between items-start mb-12">
                        <span class="font-mono text-[10px] text-zinc-300">03 // B2B</span>
                        <i class="ri-store-2-line text-xl text-zinc-200 group-hover:text-royal transition-colors"></i>
                    </div>
                    <h3 class="text-xs font-mono uppercase tracking-[0.2em] text-brandOrange mb-3">Merchant System</h3>
                    <p class="text-sm text-soft leading-relaxed mb-10 min-h-[80px]">
                        The enterprise layer. Professional payment acquiring, API access, and settlement tracking for businesses.
                    </p>
                    <div class="space-y-4">
                        <div class="text-[10px] font-bold text-royal/30 uppercase tracking-widest italic">Benchmarked: Stripe, Square</div>
                        <div class="h-[1px] w-full bg-zinc-100"></div>
                        <ul class="text-[11px] font-[400] text-royal space-y-2">
                            <li class="flex items-center gap-2"><span class="w-1 h-1 bg-brandOrange"></span> Developer API Docs</li>
                            <li class="flex items-center gap-2"><span class="w-1 h-1 bg-brandOrange"></span> Invoicing System</li>
                            <li class="flex items-center gap-2"><span class="w-1 h-1 bg-brandOrange"></span> Settlement Ledger</li>
                        </ul>
                    </div>
                </div>

                <div class="p-10 bg-royal group relative">
                    <div class="flex justify-between items-start mb-12">
                        <span class="font-mono text-[10px] text-white/30">04 // GOVERNANCE</span>
                        <i class="ri-dashboard-3-line text-xl text-white/20 group-hover:text-brandOrange transition-colors"></i>
                    </div>
                    <h3 class="text-xs font-mono uppercase tracking-[0.2em] text-brandOrange mb-3">Control Hub</h3>
                    <p class="text-sm text-white/70 leading-relaxed mb-10 min-h-[80px]">
                        Full platform oversight. Absolute governance over KYC, users, gateways, and real-time revenue analytics.
                    </p>
                    <div class="space-y-4">
                        <div class="text-[10px] font-bold text-white/30 uppercase tracking-widest italic">Real-Time Platform Insights</div>
                        <div class="h-[1px] w-full bg-white/10"></div>
                        <ul class="text-[11px] font-[400] text-white space-y-2">
                            <li class="flex items-center gap-2"><span class="w-1 h-1 bg-brandOrange"></span> KYC/AML Monitoring</li>
                            <li class="flex items-center gap-2"><span class="w-1 h-1 bg-brandOrange"></span> Addon Management</li>
                            <li class="flex items-center gap-2"><span class="w-1 h-1 bg-brandOrange"></span> Revenue Analytics</li>
                        </ul>
                    </div>
                </div>

            </div>

            <div class="mt-20 flex flex-wrap items-center justify-between gap-10 bg-zinc-50 p-12">
                <div class="grid grid-cols-3 gap-16">
                    <div>
                        <span class="block text-3xl font-bold text-royal tracking-tighter">4x</span>
                        <span class="text-[9px] font-mono uppercase text-zinc-400 tracking-widest">Revenue Streams</span>
                    </div>
                    <div>
                        <span class="block text-3xl font-bold text-royal tracking-tighter">1</span>
                        <span class="text-[9px] font-mono uppercase text-zinc-400 tracking-widest">Unified Database</span>
                    </div>
                    <div>
                        <span class="block text-3xl font-bold text-royal tracking-tighter">100%</span>
                        <span class="text-[9px] font-mono uppercase text-zinc-400 tracking-widest">White-Label</span>
                    </div>
                </div>

                <div class="flex flex-col md:flex-row items-center gap-8">
                    <p class="text-[11px] text-soft font-mono max-w-[240px] md:text-right leading-relaxed">
                        SYNC STATUS: STABLE // ALL SYSTEMS OPERATIONAL ACROSS UNIFIED DATABASE.
                    </p>
                    <a href="checkout.php?product=digital-wallet" class="px-10 py-5 bg-royal text-white font-bold text-[10px] uppercase tracking-[0.2em] hover:bg-brandOrange transition-all">
                        Deploy Complete Suite
                    </a>
                </div>
            </div>

        </div>
    </section>




    <div class="p-1">
        <section class="bg-dark rounded-[24px] py-20 px-[8%] overflow-hidden relative group">

            <div class="absolute -top-24 -right-24 w-96 h-96 bg-royal/10 rounded-full blur-[120px] pointer-events-none"></div>

            <div class="max-w-[1200px] mx-auto relative z-10">

                <div class="grid lg:grid-cols-2 gap-12 items-start mb-20">
                    <div data-aos="fade-right">
                        <span class="font-mono text-[10px] uppercase tracking-[0.4em] text-brandOrange block mb-4 font-bold">Mobile Ecosystem</span>
                        <h2 class="text-4xl md:text-5xl font-[400] tracking-tighter text-white leading-tight">
                            Native Mobile Apps <br>
                            <span class="text-brandOrange italic font-serif">iOS & Android.</span>
                        </h2>
                    </div>
                    <div class="lg:pt-14" data-aos="fade-left">
                        <p class="text-zinc-300 text-md leading-relaxed max-w-xl">
                            Fully white-label mobile apps ready to publish. Your brand, your design, your rules powered by high-performance biometric security and real-time synchronization.
                        </p>
                    </div>
                </div>

                <div class="grid grid-cols-2 md:grid-cols-4 gap-4 mb-20">

                    <div class="bg-white/5 border border-white/10 p-8 rounded-[20px] hover:bg-white/[0.08] transition-all">
                        <i class="ri-fingerprint-line text-2xl text-brandOrange mb-6 block"></i>
                        <h4 class="text-white text-sm font-bold mb-2">Biometric Login</h4>
                        <p class="text-[11px] text-zinc-500 uppercase tracking-widest font-mono">Face ID • Touch ID</p>
                    </div>

                    <div class="bg-white/5 border border-white/10 p-8 rounded-[20px] hover:bg-white/[0.08] transition-all">
                        <i class="ri-notification-3-line text-2xl text-brandOrange mb-6 block"></i>
                        <h4 class="text-white text-sm font-bold mb-2">Push Notifications</h4>
                        <p class="text-[11px] text-zinc-500 uppercase tracking-widest font-mono">Real-time alerts</p>
                    </div>

                    <div class="bg-white/5 border border-white/10 p-8 rounded-[20px] hover:bg-white/[0.08] transition-all">
                        <i class="ri-qr-scan-2-line text-2xl text-brandOrange mb-6 block"></i>
                        <h4 class="text-white text-sm font-bold mb-2">QR Scanner</h4>
                        <p class="text-[11px] text-zinc-500 uppercase tracking-widest font-mono">Instant payments</p>
                    </div>

                    <div class="bg-white/5 border border-white/10 p-8 rounded-[20px] hover:bg-white/[0.08] transition-all">
                        <i class="ri-pulse-line text-2xl text-brandOrange mb-6 block"></i>
                        <h4 class="text-white text-sm font-bold mb-2">Real-time Balance</h4>
                        <p class="text-[11px] text-zinc-500 uppercase tracking-widest font-mono">Live updates</p>
                    </div>

                </div>

                <div class="flex flex-col md:flex-row items-center justify-between border-t border-white/10 pt-12 gap-8">
                    <div class="flex items-center gap-6">
                        <div class="flex flex-col">
                            <span class="text-[10px] font-mono text-zinc-500 uppercase tracking-[0.2em]">Included In</span>
                            <span class="text-white font-bold text-sm">Professional & Enterprise Packages</span>
                        </div>
                        <div class="h-8 w-[1px] bg-white/10 hidden md:block"></div>
                        <div class="flex items-center gap-2">
                            <div class="w-2 h-2 rounded-full bg-green-500 animate-pulse"></div>
                            <span class="text-[10px] font-mono text-zinc-400 uppercase tracking-widest">Source Code Included</span>
                        </div>
                    </div>

                    <a href="#launch" class="group flex items-center gap-4 bg-white text-black px-10 py-5 rounded-full font-bold text-[11px] uppercase tracking-[0.2em] hover:bg-brandOrange hover:text-white transition-all shadow-2xl">
                        Launch Your Mobile App
                        <i class="ri-arrow-right-up-line group-hover:rotate-45 transition-transform"></i>
                    </a>
                </div>

            </div>
        </section>
    </div>


    <section class="py-24 px-[5%] bg-white" id="monetization-framework">
        <div class="max-w-[1200px] mx-auto text-center">

            <div class="mb-10" data-aos="fade-up">
                <span class="font-mono text-[11px] font-bold tracking-[0.3em] text-[#00D064] uppercase">
                    {06} Monetization Engine
                </span>
            </div>

            <div class="max-w-4xl mx-auto mb-20" data-aos="fade-up">
                <h2 class="text-4xl md:text-4xl font-[400] tracking-tight text-dark leading-tight">
                    Built-in, configurable revenue rules to scale <br>
                    <span class="italic font-serif text-electric">profitable</span> & result driven <span class="italic font-serif text-brandOrange">ecosystems</span>
                </h2>
            </div>

            <div class="w-full h-[1px] bg-zinc-100 mb-12"></div>

            <div class="grid grid-cols-1 md:grid-cols-4 items-start">

                <div class="px-8 py-6 text-left md:border-r border-zinc-100 last:border-0 group">
                    <div class="mb-6 opacity-40 group-hover:opacity-100 transition-opacity">
                        <i class="ri-exchange-dollar-line text-3xl"></i>
                    </div>
                    <h4 class="text-xl font-semibold text-dark mb-2 tracking-tight">Transaction Fees</h4>
                    <p class="text-zinc-500 text-sm leading-relaxed">Per transfer or payment markup.</p>
                </div>

                <div class="px-8 py-6 text-left md:border-r border-zinc-100 last:border-0 group">
                    <div class="mb-6 opacity-40 group-hover:opacity-100 transition-opacity">
                        <i class="ri-global-line text-3xl"></i>
                    </div>
                    <h4 class="text-xl font-semibold text-dark mb-2 tracking-tight">FX Markup</h4>
                    <p class="text-zinc-500 text-sm leading-relaxed">Currency exchange spread revenue.</p>
                </div>

                <div class="px-8 py-6 text-left md:border-r border-zinc-100 last:border-0 group">
                    <div class="mb-6 opacity-40 group-hover:opacity-100 transition-opacity">
                        <i class="ri-vip-crown-line text-3xl"></i>
                    </div>
                    <h4 class="text-xl font-semibold text-dark mb-2 tracking-tight">Merchant Subs</h4>
                    <p class="text-zinc-500 text-sm leading-relaxed">Monthly and annual business plans.</p>
                </div>

                <div class="px-8 py-6 text-left group">
                    <div class="mb-6 opacity-40 group-hover:opacity-100 transition-opacity">
                        <i class="ri-coupon-2-line text-3xl"></i>
                    </div>
                    <h4 class="text-xl font-bold text-dark mb-2 tracking-tight">Voucher Comm</h4>
                    <p class="text-zinc-500 text-sm leading-relaxed">Redeem and marketing commissions.</p>
                </div>

            </div>

            <div class="mt-24 pt-16 border-t border-zinc-100 grid md:grid-cols-2 gap-12 items-center text-left">
                <div>
                    <h5 class="text-[10px] font-mono uppercase tracking-[0.4em] text-zinc-400 mb-4">Potential Revenue Model</h5>
                    <p class="text-2xl text-dark font-[400] tracking-tight">
                        $0.50 - $5.00 <span class="text-zinc-300 italic font-serif text-lg lowercase">avg fee per user/month</span>
                    </p>
                </div>
                <div class="flex flex-col md:flex-row md:items-center justify-end gap-8">
                    <div class="text-right">
                        <span class="block text-xl font-bold text-dark">$60K - $600K</span>
                        <span class="text-[10px] font-mono text-zinc-400 uppercase">Annual ARR Projection</span>
                    </div>
                    <a href="checkout.php?product=digital-wallet" class="px-10 py-4 bg-dark text-white text-[10px] font-bold uppercase tracking-widest hover:bg-[#00D064] transition-all">
                        Start Earning
                    </a>
                </div>
            </div>

        </div>
    </section>







    <section class="py-24 px-[5%] overflow-hidden" id="pricing">
        <div class="max-w-[1200px] mx-auto">
            <!-- Section Header Module -->
            <div class="text-center mb-16" data-aos="fade-up">
                <span class="font-mono text-[11px] font-bold tracking-[0.4em] text-brandOrange uppercase block mb-3">{06} ONE-TIME INVESTMENT — PERPETUAL LICENSE</span>
                <h2 class="text-4xl md:text-5xl font-[400] tracking-tighter text-dark leading-[1.1]">
                    Own Your Fintech<span class="italic font-serif text-royal"> Empire</span>
                </h2>
                <p class="text-soft text-lg mt-4 max-w-2xl mx-auto">No monthly fees. No hidden costs. No recurring royalties. Full source code + lifetime updates + 30-day money-back guarantee.</p>
            </div>

            <!-- Adaptive Pricing Matrix Grid -->
            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8 items-stretch max-w-6xl mx-auto">
                <?php
                $plans = [
                    [
                        "title"     => "Essential",
                        "price"     => "$6,000",
                        "period"    => "",
                        "save"      => "One-time payment · Lifetime license",
                        "popular"   => false,
                        "accent"    => "royal",
                        "badge"     => "Web Platform + Admin Dashboard",
                        "highlight" => "Startups launching MVP & web-first strategy",
                        "btn"       => "Secure Essential",
                        "features"  => [
                            "Complete user dashboard + admin panel — full control",
                            "Send / Receive / Exchange / Request Money P2P",
                            "QR payments & virtual card module",
                            "5 integrated gateways (Stripe, PayPal, Flutterwave, etc.)",
                            "Transaction & dispute management system",
                            "Multi-currency wallet support — Crypto-ready",
                            "Perfect for: Businesses testing fintech market & entrepreneurs"
                        ]
                    ],
                    [
                        "title"     => "Professional",
                        "price"     => "$7,000",
                        "period"    => "",
                        "save"      => "One-time payment · Lifetime license",
                        "popular"   => true,
                        "accent"    => "brandOrange",
                        "badge"     => "Web + Android App + Agent Module",
                        "highlight" => "Fintech founders & offline-to-online agents",
                        "btn"       => "Claim Professional",
                        "features"  => [
                            "Save $3,000 vs buying separately",
                            "Full Android native app — Play Store ready",
                            "Agent panel (cash-in/out & commissions)",
                            "15+ payment gateways + Crypto (Coinbase, bKash)",
                            "Priority 24/7 support — Dedicated Slack channel",
                            "Advanced KYC/AML — Face matching & docs",
                            "Agent commission engine — Automated payouts",
                            "Perfect for: Targeting unbanked populations via agent networks"
                        ]
                    ],
                    [
                        "title"     => "Enterprise",
                        "price"     => "$8,000",
                        "period"    => "",
                        "save"      => "One-time payment · Lifetime license",
                        "popular"   => false,
                        "accent"    => "electric",
                        "badge"     => "Full Ecosystem: Web + iOS + Android + Merchant",
                        "highlight" => "Established banks & neobank enterprises",
                        "btn"       => "Get Enterprise",
                        "features"  => [
                            "Best Value — Complete Ecosystem",
                            "Full iOS native app — Swift/SwiftUI ready",
                            "Merchant panel (invoices, API, orders)",
                            "Complete store management & inventory",
                            "Full Source Code + CI/CD Setup",
                            "12 months of premium updates",
                            "White-glove onboarding & deployment",
                            "Perfect for: Enterprises requiring complete white-label solution"
                        ]
                    ]
                ];

                foreach ($plans as $plan):
                    $isPopular = $plan['popular'];
                ?>
                    <div class="flex flex-col <?= $isPopular ? 'bg-white border-2 border-royal shadow-2xl shadow-royal/10 lg:scale-[1.03] z-10' : 'bg-white border border-zinc-100 hover:border-royal/20' ?> rounded-[32px] p-8 transition-all duration-500 relative overflow-hidden" data-aos="fade-up">

                        <?php if ($isPopular): ?>
                            <div class="absolute top-0 right-0 bg-brandOrange text-white px-5 py-1.5 rounded-bl-2xl font-mono text-[9px] uppercase tracking-widest font-bold">Most Popular</div>
                        <?php endif; ?>

                        <!-- Identity & Pricing Typography -->
                        <div class="mb-6">
                            <h3 class="text-xl font-semibold text-royal tracking-tight mb-1"><?= $plan['title'] ?></h3>
                            <div class="flex items-baseline gap-1 mt-3">
                                <span class="text-4xl font-semibold text-dark tracking-tighter"><?= $plan['price'] ?></span>
                                <span class="text-sm text-soft"><?= $plan['period'] ?></span>
                            </div>
                            <p class="font-mono text-[10px] uppercase tracking-widest text-electric mt-2"><?= $plan['save'] ?></p>
                        </div>

                        <!-- Feature List -->
                        <ul class="flex flex-col gap-3 mb-8 flex-grow">
                            <?php foreach ($plan['features'] as $f): ?>
                                <li class="flex items-start gap-3 text-sm text-soft">
                                    <span class="text-electric mt-0.5 flex-shrink-0">✓</span>
                                    <?= $f ?>
                                </li>
                            <?php endforeach; ?>
                        </ul>

                        <!-- Call To Action & Sub-Context -->
                        <div class="border-t border-zinc-100 pt-6">
                            <a href="/get-demo"
                                class="w-full py-4 rounded-full text-center block text-xs font-bold uppercase tracking-widest transition-all <?= $isPopular ? 'bg-royal text-white hover:bg-electric' : 'border border-royal text-royal hover:bg-royal hover:text-white' ?>">
                                <?= $plan['btn'] ?> →
                            </a>
                            <p class="text-center text-[10px] font-mono text-soft uppercase tracking-widest mt-3"><?= $plan['highlight'] ?></p>
                        </div>
                    </div>
                <?php endforeach; ?>
            </div>
        </div>
    </section>


    <section class="py-24 px-[5%] bg-zinc-50/50" id="value-proposition">
        <div class="max-w-[1200px] mx-auto text-center">

            <div class="mb-10" data-aos="fade-up">
                <span class="font-mono text-[11px] font-bold tracking-[0.3em] text-[#00D064] uppercase">
                    {07} Strategic Advantage
                </span>
            </div>

            <div class="max-w-4xl mx-auto mb-20" data-aos="fade-up">
                <h2 class="text-4xl md:text-5xl font-[400] tracking-tight text-dark leading-tight">
                    Why invest in <span class="italic font-serif text-royal">Nesvra?</span> <br>
                    <span class="text-soft">The value of efficiency vs custom build.</span>
                </h2>
            </div>

            <div class="w-full h-[1px] bg-zinc-200 mb-16"></div>

            <div class="grid grid-cols-1 md:grid-cols-3 items-stretch">

                <div class="px-10 py-12 text-left md:border-r border-zinc-200 group">
                    <div class="mb-12">
                        <span class="text-5xl font-bold text-royal tracking-tighter">$150K+</span>
                        <p class="text-[10px] font-mono text-zinc-400 uppercase tracking-widest mt-2">Immediate Capital Savings</p>
                    </div>
                    <h4 class="text-xl font-bold text-dark mb-4">Saved vs Custom Dev</h4>
                    <p class="text-zinc-500 text-sm leading-relaxed">
                        Avoid the average development cost for a similar high-performance fintech platform.
                    </p>
                </div>

                <div class="px-10 py-12 text-left md:border-r border-zinc-200 group bg-white shadow-2xl shadow-zinc-200/50 z-10 rounded-xl md:rounded-none">
                    <div class="mb-12">
                        <span class="text-5xl font-bold text-brandOrange tracking-tighter">3-5 Weeks</span>
                        <p class="text-[10px] font-mono text-zinc-400 uppercase tracking-widest mt-2">Accelerated Deployment</p>
                    </div>
                    <h4 class="text-xl font-bold text-dark mb-4">Time to Market</h4>
                    <p class="text-zinc-500 text-sm leading-relaxed">
                        Launch in weeks, not years. Outpace competitors while they are still in the 12-18 month build phase.
                    </p>
                </div>

                <div class="px-10 py-12 text-left group">
                    <div class="mb-12">
                        <span class="text-5xl font-bold text-royal tracking-tighter">100%</span>
                        <p class="text-[10px] font-mono text-zinc-400 uppercase tracking-widest mt-2">Total Asset Autonomy</p>
                    </div>
                    <h4 class="text-xl font-bold text-dark mb-4">Ownership & Control</h4>
                    <p class="text-zinc-500 text-sm leading-relaxed">
                        No vendor lock-in. Full source code access ensures you own the IP and the future of your brand.
                    </p>
                </div>

            </div>

            <div class="mt-20 pt-16 border-t border-zinc-200 grid md:grid-cols-4 gap-8 text-left">
                <div class="flex items-center gap-4">
                    <div class="w-10 h-10 rounded-full bg-green-50 flex items-center justify-center text-[#00D064]">
                        <i class="ri-shield-check-line text-xl"></i>
                    </div>
                    <div>
                        <span class="block text-[11px] font-bold text-dark uppercase tracking-tight">Guarantee</span>
                        <span class="text-[10px] text-zinc-400">30-day money-back</span>
                    </div>
                </div>

                <div class="flex items-center gap-4">
                    <div class="w-10 h-10 rounded-full bg-royal/5 flex items-center justify-center text-royal">
                        <i class="ri-code-s-slash-line text-xl"></i>
                    </div>
                    <div>
                        <span class="block text-[11px] font-bold text-dark uppercase tracking-tight">Full IP</span>
                        <span class="text-[10px] text-zinc-400">Source code included</span>
                    </div>
                </div>

                <div class="flex items-center gap-4">
                    <div class="w-10 h-10 rounded-full bg-brandOrange/5 flex items-center justify-center text-brandOrange">
                        <i class="ri-user-star-line text-xl"></i>
                    </div>
                    <div>
                        <span class="block text-[11px] font-bold text-dark uppercase tracking-tight">Dedicated</span>
                        <span class="text-[10px] text-zinc-400">Success Manager</span>
                    </div>
                </div>

                <div class="flex items-center gap-4">
                    <div class="w-10 h-10 rounded-full bg-zinc-100 flex items-center justify-center text-zinc-400">
                        <i class="ri-refresh-line text-xl"></i>
                    </div>
                    <div>
                        <span class="block text-[11px] font-bold text-dark uppercase tracking-tight">Support</span>
                        <span class="text-[10px] text-zinc-400">Lifetime updates</span>
                    </div>
                </div>
            </div>

        </div>
    </section>


    <div class="bg-white p-1 md:p-2 overflow-hidden">
        <section id="launch-accelerator" class="relative bg-royal py-24 px-6 lg:px-14 overflow-hidden rounded-[24px]" data-aos="fade-up" data-aos-duration="1000" data-aos-once="true">

            <div class="absolute -bottom-24 -left-24 w-[500px] h-[500px] bg-white/5 rounded-full blur-[100px] pointer-events-none"></div>
            <div class="absolute -top-24 -right-24 w-[400px] h-[400px] bg-electric/10 rounded-full blur-[80px] pointer-events-none"></div>

            <div class="max-w-[1200px] mx-auto relative z-10">

                <div class="flex flex-col md:flex-row justify-between items-start md:items-end gap-10 mb-20">
                    <div class="max-w-2xl">
                        <span class="font-mono text-[11px] uppercase tracking-[0.4em] text-brandOrange font-bold block mb-4"> Launch Accelerator</span>
                        <h2 class="text-5xl md:text-6xl font-[400] tracking-tighter text-white leading-[0.8]">
                            Go Live Faster. <br>
                            <span class="text-white/30 italic font-serif">Scale Smarter.</span>
                        </h2>
                    </div>
                    <p class="text-white/60 text-lg leading-relaxed max-w-sm border-l border-white/10 pl-8 pb-2">
                        Turn your digital wallet into a revenue engine. Skip complexity with premium add-ons designed to fast-track compliance and acquisition.
                    </p>
                </div>

                <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 border border-white/10 rounded-[2px] overflow-hidden mb-20">

                    <div class="p-10 border-b lg:border-b-0 border-white/10 md:border-r border-white/10 group hover:bg-white/[0.03] transition-all">
                        <div class="mb-16">
                            <span class="text-[10px] font-mono text-white/40 uppercase tracking-widest block mb-1">Essential</span>
                            <h4 class="text-white font-bold text-lg leading-tight">App Store Domination</h4>
                        </div>
                        <ul class="text-[11px] text-white/50 space-y-3 mb-12">
                            <li class="flex items-start gap-2"><i class="ri-check-line text-brandOrange"></i> Compliance Check</li>
                            <li class="flex items-start gap-2"><i class="ri-check-line text-brandOrange"></i> ASO Optimization</li>
                            <li class="flex items-start gap-2"><i class="ri-check-line text-brandOrange"></i> 14-Day Turnaround</li>
                        </ul>
                        <div class="flex items-baseline gap-2 mb-6">
                            <span class="text-2xl font-bold text-white">$250</span>
                            <span class="text-[9px] font-mono text-white/30 uppercase">per store</span>
                        </div>
                        <a href="book-strategy-call.php?subject=Digital+Wallet+Deployment+Add-on" class="text-[10px] font-bold text-brandOrange uppercase tracking-widest hover:text-white transition-colors">Secure slot →</a>
                    </div>

                    <div class="p-10 border-b lg:border-b-0 border-white/10 lg:border-r border-white/10 group hover:bg-white/[0.03] transition-all">
                        <div class="mb-16">
                            <span class="text-[10px] font-mono text-white/40 uppercase tracking-widest block mb-1">Trust First</span>
                            <h4 class="text-white font-bold text-lg leading-tight">Identity & Trust Kit</h4>
                        </div>
                        <ul class="text-[11px] text-white/50 space-y-3 mb-12">
                            <li class="flex items-start gap-2"><i class="ri-check-line text-brandOrange"></i> Premium Logo Suite</li>
                            <li class="flex items-start gap-2"><i class="ri-check-line text-brandOrange"></i> Bank-grade Colors</li>
                            <li class="flex items-start gap-2"><i class="ri-check-line text-brandOrange"></i> Social Brand Kit</li>
                        </ul>
                        <div class="flex items-baseline gap-2 mb-6">
                            <span class="text-2xl font-bold text-white">$250</span>
                            <span class="text-[9px] font-mono text-white/30 uppercase">complete</span>
                        </div>
                        <a href="book-strategy-call.php?subject=Digital+Wallet+Identity+Kit+Add-on" class="text-[10px] font-bold text-brandOrange uppercase tracking-widest hover:text-white transition-colors">Build authority →</a>
                    </div>

                    <div class="p-10 border-b md:border-b-0 border-white/10 md:border-r border-white/10 group hover:bg-white/[0.03] transition-all">
                        <div class="mb-16">
                            <span class="text-[10px] font-mono text-white/40 uppercase tracking-widest block mb-1">Launch Ready</span>
                            <h4 class="text-white font-bold text-lg leading-tight">Social Launch Engine</h4>
                        </div>
                        <ul class="text-[11px] text-white/50 space-y-3 mb-12">
                            <li class="flex items-start gap-2"><i class="ri-check-line text-brandOrange"></i> 3 Platform Setup</li>
                            <li class="flex items-start gap-2"><i class="ri-check-line text-brandOrange"></i> 7 Days Content</li>
                            <li class="flex items-start gap-2"><i class="ri-check-line text-brandOrange"></i> Growth Hooks</li>
                        </ul>
                        <div class="flex items-baseline gap-2 mb-6">
                            <span class="text-2xl font-bold text-white">$150</span>
                            <span class="text-[9px] font-mono text-white/30 uppercase">full setup</span>
                        </div>
                        <a href="book-strategy-call.php?subject=Digital+Wallet+Social+Launch+Add-on" class="text-[10px] font-bold text-brandOrange uppercase tracking-widest hover:text-white transition-colors">Go viral →</a>
                    </div>

                    <div class="p-10 group hover:bg-white/[0.03] transition-all">
                        <div class="mb-16">
                            <span class="text-[10px] font-mono text-white/40 uppercase tracking-widest block mb-1">Growth</span>
                            <h4 class="text-white font-bold text-lg leading-tight">Marketing Stack</h4>
                        </div>
                        <ul class="text-[11px] text-white/50 space-y-3 mb-12">
                            <li class="flex items-start gap-2"><i class="ri-check-line text-brandOrange"></i> High-Conv Landing Page</li>
                            <li class="flex items-start gap-2"><i class="ri-check-line text-brandOrange"></i> Referral System</li>
                            <li class="flex items-start gap-2"><i class="ri-check-line text-brandOrange"></i> Local SEO Setup</li>
                        </ul>
                        <div class="flex items-baseline gap-2 mb-6">
                            <span class="text-2xl font-bold text-white">$400</span>
                            <span class="text-[9px] font-mono text-white/30 uppercase">bundle</span>
                        </div>
                        <a href="book-strategy-call.php?subject=Digital+Wallet+Marketing+Stack+Add-on" class="text-[10px] font-bold text-brandOrange uppercase tracking-widest hover:text-white transition-colors">Scale now →</a>
                    </div>
                </div>

                <div class="bg-white/5 border border-white/10 rounded-2xl p-10 flex flex-col lg:flex-row items-center justify-between gap-12 mb-20">
                    <div class="flex items-center gap-8">
                        <div class="w-16 h-16 rounded-2xl bg-white/5 flex items-center justify-center text-brandOrange">
                            <i class="ri-bank-line text-3xl"></i>
                        </div>
                        <div>
                            <span class="text-[10px] font-mono text-brandOrange uppercase tracking-widest font-bold">Regulatory Fast-Track</span>
                            <h4 class="text-2xl font-bold text-white tracking-tight">Licensing & Compliance Accelerator</h4>
                            <p class="text-white/40 text-xs mt-1">One-on-one expert session to navigate MSB / MTL requirements.</p>
                        </div>
                    </div>
                    <div class="flex flex-col md:flex-row items-center gap-10">
                        <div class="text-right">
                            <span class="text-3xl font-bold text-white tracking-tighter">$600</span>
                            <span class="block text-[9px] font-mono text-white/30 uppercase tracking-widest">per consultation</span>
                        </div>
                        <a href="book-strategy-call.php?subject=Digital+Wallet+Compliance+Accelerator" class="px-8 py-4 bg-white text-royal rounded-full font-bold text-[10px] uppercase tracking-widest hover:bg-brandOrange hover:text-white transition-all">
                            Book Compliance Session
                        </a>
                    </div>
                </div>

                <div class="flex flex-col md:flex-row items-center justify-between gap-10 pt-16 border-t border-white/10">
                    <div class="flex flex-wrap justify-center md:justify-start gap-12">
                        <div class="text-center md:text-left">
                            <span class="block text-2xl font-bold text-white">50+</span>
                            <span class="text-[9px] font-mono text-white/30 uppercase tracking-widest">Trusted Founders</span>
                        </div>
                        <div class="text-center md:text-left">
                            <span class="block text-2xl font-bold text-white">62%</span>
                            <span class="text-[9px] font-mono text-white/30 uppercase tracking-widest">Launch Time Reduction</span>
                        </div>
                        <div class="text-center md:text-left">
                            <span class="block text-2xl font-bold text-white">14 Days</span>
                            <span class="text-[9px] font-mono text-white/30 uppercase tracking-widest">To First Remittance</span>
                        </div>
                    </div>

                    <a href="book-strategy-call.php?subject=Digital+Wallet+Launch" class="group flex items-center gap-6 bg-brandOrange text-white px-12 py-6 rounded-full font-bold text-xs uppercase tracking-[0.2em] hover:bg-white hover:text-royal transition-all shadow-2xl">
                        Accelerate Your Launch
                        <i class="ri-rocket-2-line group-hover:translate-y-[-4px] transition-transform"></i>
                    </a>
                </div>

            </div>
        </section>
    </div>


    <section class="py-24 px-[5%] bg-white" id="infrastructure-pillars">
        <div class="max-w-[1400px] mx-auto">

            <div class="grid lg:grid-cols-2 gap-16 items-end mb-24" data-aos="fade-up">
                <div>
                    <span class="font-mono text-[11px] uppercase tracking-[0.4em] text-brandOrange font-bold block mb-6">{07} Battle-Tested Infrastructure</span>
                    <h2 class="text-5xl md:text-6xl font-[400] tracking-tighter text-royal leading-[0.85]">
                        Powering the next <br>
                        <span class="text-zinc-300 italic font-serif">Fintech Unicorns.</span>
                    </h2>
                </div>
                <div class="pb-4">
                    <p class="text-soft text-xl leading-relaxed max-w-md border-l-2 border-zinc-100 pl-10">
                        Whether it's PayPal for LATAM or Venmo for Africa, Nesvra provides the enterprise-grade engine. No compromises. No shortcuts.
                    </p>
                </div>
            </div>

            <div class="space-y-px bg-zinc-100 border-y border-zinc-100">

                <div class="grid lg:grid-cols-12 bg-white group hover:bg-zinc-50 transition-all duration-700 overflow-hidden">
                    <div class="lg:col-span-4 p-12 border-r border-zinc-100">
                        <span class="font-mono text-[10px] text-zinc-400 uppercase tracking-widest mb-10 block">System_Logic // 01</span>
                        <h3 class="text-3xl font-bold text-royal tracking-tight mb-4">PayPal-like Scale</h3>
                        <p class="text-sm text-soft leading-relaxed">Enterprise-grade orchestration for mass payouts and automated dispute handling.</p>
                    </div>
                    <div class="lg:col-span-5 p-12 border-r border-zinc-100 bg-zinc-50/30">
                        <h5 class="text-[10px] font-mono uppercase tracking-[0.3em] text-brandOrange font-bold mb-8">✨ Key Capabilities</h5>
                        <ul class="grid grid-cols-1 md:grid-cols-2 gap-y-4 gap-x-8 text-[11px] font-bold text-royal uppercase tracking-tight">
                            <li class="flex items-center gap-3"><span class="w-1 h-1 bg-brandOrange"></span> 30+ Payment Gateways</li>
                            <li class="flex items-center gap-3"><span class="w-1 h-1 bg-brandOrange"></span> Auto-Dispute Center</li>
                            <li class="flex items-center gap-3"><span class="w-1 h-1 bg-brandOrange"></span> 10K Daily Bulk Payouts</li>
                            <li class="flex items-center gap-3"><span class="w-1 h-1 bg-brandOrange"></span> Recurring Billing</li>
                        </ul>
                    </div>
                    <div class="lg:col-span-3 p-12 flex flex-col justify-center">
                        <span class="text-[9px] font-mono text-zinc-400 uppercase tracking-widest mb-4 block">Target Market:</span>
                        <p class="text-xs font-[400] text-royal leading-relaxed italic border-l border-brandOrange pl-4">
                            High-volume marketplaces, global remittance, and enterprise processing.
                        </p>
                    </div>
                </div>

                <div class="grid lg:grid-cols-12 bg-white group hover:bg-zinc-50 transition-all duration-700 overflow-hidden">
                    <div class="lg:col-span-4 p-12 border-r border-zinc-100">
                        <span class="font-mono text-[10px] text-zinc-400 uppercase tracking-widest mb-10 block">User_Experience // 02</span>
                        <h3 class="text-3xl font-bold text-royal tracking-tight mb-4">CashApp Simplicity</h3>
                        <p class="text-sm text-soft leading-relaxed">Lightning-fast transaction experience with username-based identity architecture.</p>
                    </div>
                    <div class="lg:col-span-5 p-12 border-r border-zinc-100 bg-zinc-50/30">
                        <h5 class="text-[10px] font-mono uppercase tracking-[0.3em] text-brandOrange font-bold mb-8">✨ Key Capabilities</h5>
                        <ul class="grid grid-cols-1 md:grid-cols-2 gap-y-4 gap-x-8 text-[11px] font-bold text-royal uppercase tracking-tight">
                            <li class="flex items-center gap-3"><span class="w-1 h-1 bg-brandOrange"></span> Instant P2P Transfers</li>
                            <li class="flex items-center gap-3"><span class="w-1 h-1 bg-brandOrange"></span> $Cashtag-like IDs</li>
                            <li class="flex items-center gap-3"><span class="w-1 h-1 bg-brandOrange"></span> QR Code Scan & Pay</li>
                            <li class="flex items-center gap-3"><span class="w-1 h-1 bg-brandOrange"></span> Live Push Alerts</li>
                        </ul>
                    </div>
                    <div class="lg:col-span-3 p-12 flex flex-col justify-center">
                        <span class="text-[9px] font-mono text-zinc-400 uppercase tracking-widest mb-4 block">Target Market:</span>
                        <p class="text-xs font-[400] text-royal leading-relaxed italic border-l border-brandOrange pl-4">
                            Gig economy payouts and everyday consumer micro-transactions.
                        </p>
                    </div>
                </div>

                <div class="grid lg:grid-cols-12 bg-white group hover:bg-zinc-50 transition-all duration-700 overflow-hidden">
                    <div class="lg:col-span-4 p-12 border-r border-zinc-100">
                        <span class="font-mono text-[10px] text-zinc-400 uppercase tracking-widest mb-10 block">Social_Layer // 03</span>
                        <h3 class="text-3xl font-bold text-royal tracking-tight mb-4">Venmo Social Edge</h3>
                        <p class="text-sm text-soft leading-relaxed">Viral engagement features including transaction notes and interactive social feeds.</p>
                    </div>
                    <div class="lg:col-span-5 p-12 border-r border-zinc-100 bg-zinc-50/30">
                        <h5 class="text-[10px] font-mono uppercase tracking-[0.3em] text-brandOrange font-bold mb-8">✨ Key Capabilities</h5>
                        <ul class="grid grid-cols-1 md:grid-cols-2 gap-y-4 gap-x-8 text-[11px] font-bold text-royal uppercase tracking-tight">
                            <li class="flex items-center gap-3"><span class="w-1 h-1 bg-brandOrange"></span> Emoji Reactions</li>
                            <li class="flex items-center gap-3"><span class="w-1 h-1 bg-brandOrange"></span> Social Activity Feed</li>
                            <li class="flex items-center gap-3"><span class="w-1 h-1 bg-brandOrange"></span> Personalized Requests</li>
                            <li class="flex items-center gap-3"><span class="w-1 h-1 bg-brandOrange"></span> Friend Connections</li>
                        </ul>
                    </div>
                    <div class="lg:col-span-3 p-12 flex flex-col justify-center">
                        <span class="text-[9px] font-mono text-zinc-400 uppercase tracking-widest mb-4 block">Target Market:</span>
                        <p class="text-xs font-[400] text-royal leading-relaxed italic border-l border-brandOrange pl-4">
                            Social payments and community-based financial neobanks.
                        </p>
                    </div>
                </div>

            </div>

            <div class="mt-20 flex flex-col md:flex-row items-center justify-between gap-10">
                <div class="flex items-center gap-12">
                    <div class="flex flex-col">
                        <span class="text-2xl font-bold text-royal tracking-tighter italic font-serif">Enterprise Grade</span>
                        <span class="text-[10px] font-mono text-zinc-400 uppercase tracking-widest">Reliability Protocol</span>
                    </div>
                    <div class="w-px h-10 bg-zinc-100"></div>
                    <div class="flex flex-col">
                        <span class="text-2xl font-bold text-royal tracking-tighter italic font-serif">100% Scalable</span>
                        <span class="text-[10px] font-mono text-zinc-400 uppercase tracking-widest">Cloud Ready Stack</span>
                    </div>
                </div>

                <a href="systems.php" class="px-12 py-6 bg-royal text-white rounded-full font-bold text-[10px] uppercase tracking-[0.3em] hover:bg-brandOrange transition-all shadow-xl">
                    Explore The Architecture
                </a>
            </div>

        </div>
    </section>


    <section class="py-24 px-[5%] bg-white" id="the-nesvra-advantage">
        <div class="max-w-[1200px] mx-auto text-center">

            <div class="mb-10" data-aos="fade-up">
                <span class="font-mono text-[11px] font-bold tracking-[0.3em] text-brandOrange uppercase">
                    {08} The Best of all worlds
                </span>
            </div>

            <div class="max-w-4xl mx-auto mb-16" data-aos="fade-up">
                <h2 class="text-4xl md:text-5xl font-[400] tracking-tight text-dark leading-tight">
                    Why choose Nesvra over <br>
                    building from <span class="italic font-serif text-royal">scratch?</span>
                </h2>
                <p class="text-zinc-500 text-lg mt-8 max-w-2xl mx-auto leading-relaxed">
                    Get PayPal's scale, CashApp's simplicity, and Venmo's social engagement — all in one platform. No need to piece together multiple solutions.
                </p>
            </div>

            <div class="w-full h-[1px] bg-zinc-100 mb-16"></div>

            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 items-start mb-24">

                <div class="px-8 py-6 text-left md:border-r border-zinc-100 last:border-0 group">
                    <div class="mb-6 opacity-40 group-hover:opacity-100 transition-opacity">
                        <i class="ri-money-dollar-circle-line text-3xl"></i>
                    </div>
                    <h4 class="text-2xl font-semibold text-dark mb-2 tracking-tighter">$150K+ Saved</h4>
                    <p class="text-zinc-500 text-sm leading-relaxed italic font-serif">vs custom dev — build in weeks, not years.</p>
                </div>

                <div class="px-8 py-6 text-left md:border-r border-zinc-100 last:border-0 group">
                    <div class="mb-6 opacity-40 group-hover:opacity-100 transition-opacity">
                        <i class="ri-layout-masonry-line text-3xl"></i>
                    </div>
                    <h4 class="text-2xl font-semibold text-dark mb-2 tracking-tighter">3-in-1 Platform</h4>
                    <p class="text-zinc-500 text-sm leading-relaxed italic font-serif">PayPal + CashApp + Venmo features combined.</p>
                </div>

                <div class="px-8 py-6 text-left group">
                    <div class="mb-6 opacity-40 group-hover:opacity-100 transition-opacity">
                        <i class="ri-key-2-line text-3xl"></i>
                    </div>
                    <h4 class="text-2xl font-semibold text-dark mb-2 tracking-tighter">100% Ownership</h4>
                    <p class="text-zinc-500 text-sm leading-relaxed italic font-serif">Full source code delivered upon launch.</p>
                </div>

                <div class="px-8 py-6 text-left md:border-r border-zinc-100 last:border-0 group">
                    <div class="mb-6 opacity-40 group-hover:opacity-100 transition-opacity">
                        <i class="ri-global-line text-3xl"></i>
                    </div>
                    <h4 class="text-2xl font-semibold text-dark mb-2 tracking-tighter">50+ Countries Deployed</h4>
                    <p class="text-zinc-500 text-sm leading-relaxed italic font-serif">Trusted across multiple markets and regulatory environments.</p>
                </div>

                <div class="px-8 py-6 text-left md:border-r border-zinc-100 last:border-0 group">
                    <div class="mb-6 opacity-40 group-hover:opacity-100 transition-opacity">
                        <i class="ri-group-line text-3xl"></i>
                    </div>
                    <h4 class="text-2xl font-semibold text-dark mb-2 tracking-tighter">100K+ Users Powered</h4>
                    <p class="text-zinc-500 text-sm leading-relaxed italic font-serif">Supporting growing fintech ecosystems worldwide.</p>
                </div>

                <div class="px-8 py-6 text-left group">
                    <div class="mb-6 opacity-40 group-hover:opacity-100 transition-opacity">
                        <i class="ri-line-chart-line text-3xl"></i>
                    </div>
                    <h4 class="text-2xl font-semibold text-dark mb-2 tracking-tighter">$50M+ Processed Annually</h4>
                    <p class="text-zinc-500 text-sm leading-relaxed italic font-serif">Built to handle high-volume transactions with confidence.</p>
                </div>

                <div class="px-8 py-6 text-left md:border-r border-zinc-100 last:border-0 group">
                    <div class="mb-6 opacity-40 group-hover:opacity-100 transition-opacity">
                        <i class="ri-shield-check-line text-3xl"></i>
                    </div>
                    <h4 class="text-2xl font-semibold text-dark mb-2 tracking-tighter">99.99% Enterprise Uptime</h4>
                    <p class="text-zinc-500 text-sm leading-relaxed italic font-serif">Reliable infrastructure engineered for uninterrupted operations.</p>
                </div>

                <div class="px-8 py-6 text-left md:border-r border-zinc-100 last:border-0 group">
                    <div class="mb-6 opacity-40 group-hover:opacity-100 transition-opacity">
                        <i class="ri-wallet-3-line text-3xl"></i>
                    </div>
                    <h4 class="text-2xl font-semibold text-dark mb-2 tracking-tighter">30+ Payment Gateways</h4>
                    <p class="text-zinc-500 text-sm leading-relaxed italic font-serif">Connect banks, cards, wallets, and payment processors globally.</p>
                </div>

                <div class="px-8 py-6 text-left group">
                    <div class="mb-6 opacity-40 group-hover:opacity-100 transition-opacity">
                        <i class="ri-flashlight-line text-3xl"></i>
                    </div>
                    <h4 class="text-2xl font-semibold text-dark mb-2 tracking-tighter">Launch in Weeks</h4>
                    <p class="text-zinc-500 text-sm leading-relaxed italic font-serif">Go live faster with production-ready fintech infrastructure.</p>
                </div>

            </div>





        </div>
    </section>




    <?php
    $faqs = [
        [
            "q" => "Do I get full ownership and can I rebrand?",
            "a" => "Yes — 100% ownership, full white-label rights. You receive complete source code (PHP/Laravel & Flutter) with no encryption or vendor lock-in. <br><small class='block mt-2 opacity-60'>• Custom Logo & UI • Domain & Hosting Control • No Royalty Fees</small>",
            "icon" => "ri-shield-keyhole-line"
        ],
        [
            "q" => "What about compliance and licensing?",
            "a" => "The platform includes built-in KYC/AML modules and GDPR tools. We also offer a Regulatory Fast-Track add-on for MSB/EMI licensing strategy. <br><small class='block mt-2 opacity-60'>• Identity Verification • Fraud Detection • Compliance Roadmap</small>",
            "icon" => "ri-scales-3-line"
        ],
        [
            "q" => "Can I add my own payment gateway later?",
            "a" => "Absolutely. The modular architecture is designed for flexibility. While 30+ are pre-integrated, you can add any custom bank or crypto API. <br><small class='block mt-2 opacity-60'>• Developer-friendly API • Mobile Money Support • Custom Integrations</small>",
            "icon" => "ri-plug-2-line"
        ],
        [
            "q" => "How do I handle customer support?",
            "a" => "Your platform comes with enterprise-grade tools: a ticket system, live chat plugins, and an automated dispute management module. <br><small class='block mt-2 opacity-60'>• Support Tickets • Live Chat • Knowledge Base Module</small>",
            "icon" => "ri-customer-service-2-line"
        ],
        [
            "q" => "Can the platform scale to millions of users?",
            "a" => "Yes — built for enterprise-scale from day one with indexed queries, caching layers, and queue management for high-volume transactions. <br><small class='block mt-2 opacity-60'>• AWS/Cloud Ready • Redis Caching • 10K+ Concurrent Users</small>",
            "icon" => "ri-database-2-line"
        ],
        [
            "q" => "What about updates and ongoing support?",
            "a" => "When you purchase Nesvra, you get free lifetime updates and 12 months of premium priority support via a dedicated Slack channel. <br><small class='block mt-2 opacity-60'>• Security Patches • API Guides • Video Tutorials</small>",
            "icon" => "ri-refresh-line"
        ]
    ];
    ?>

    <section class="py-24 px-[5%] bg-white overflow-hidden" id="faq-vault">
        <div class="max-w-[1100px] mx-auto">

            <div class="text-center mb-16" data-aos="fade-up">
                <span class="font-mono text-[10px] uppercase tracking-[0.4em] text-electric block mb-4">Expert Insights</span>
                <h2 class="text-4xl md:text-5xl font-[400] tracking-tighter text-royal leading-tight">
                    Common Questions. <br>
                    <span class="italic font-serif text-brandOrange">Expert Answers.</span>
                </h2>
            </div>

            <div class="grid md:grid-cols-2 gap-4">
                <?php foreach ($faqs as $faq): ?>
                    <div class="group relative p-8 rounded-[24px] bg-zinc-50/50 border border-zinc-100 transition-all duration-500 hover:bg-royal hover:shadow-xl hover:shadow-royal/10 overflow-hidden cursor-pointer">

                        <div class="relative z-10">
                            <div class="flex items-center gap-4 mb-2">
                                <i class="<?= $faq['icon'] ?> text-royal group-hover:text-brandOrange transition-colors"></i>
                                <h3 class="text-base font-bold text-royal group-hover:text-white transition-colors duration-300 pr-6">
                                    <?= $faq['q'] ?>
                                </h3>
                            </div>

                            <div class="max-h-0 opacity-0 group-hover:max-h-[300px] group-hover:opacity-100 transition-all duration-500 ease-in-out overflow-hidden">
                                <div class="pt-4 text-zinc-500 group-hover:text-white/70 text-[13px] leading-relaxed">
                                    <?= $faq['a'] ?>
                                </div>
                            </div>
                        </div>

                        <div class="absolute top-8 right-8">
                            <div class="w-6 h-6 rounded-full border border-zinc-200 group-hover:border-white/20 flex items-center justify-center transition-all">
                                <i class="ri-add-line text-xs text-royal group-hover:text-white group-hover:rotate-45 transition-all"></i>
                            </div>
                        </div>
                    </div>
                <?php endforeach; ?>
            </div>

            <div class="mt-12 text-center">
                <p class="text-xs text-soft font-[400]">
                    Don't see your question?
                    <a href="mailto:support@alphadev.com" class="text-royal border-b border-royal/20 hover:text-brandOrange hover:border-brandOrange transition-all ml-1">
                        Talk to our technical team
                    </a>
                </p>
            </div>

        </div>
    </section>








    <?php include 'components/Scroll-to-top.php'; ?>
    <?php include 'components/footer.php'; ?>


</body>

</html>