CashChat Flicks \u00b7 Multi-Page SPA<\/title>\n \n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.0.0-beta3\/css\/all.min.css\">\n \n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:opsz,wght@14..32,400;14..32,500;14..32,600;14..32,700;14..32,800;14..32,900&display=swap\" rel=\"stylesheet\">\n <style>\n \/* ============================================================\n 1. RESET & VARIABLES\n ============================================================ *\/\n *,\n *::before,\n *::after {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n :root {\n --bg-primary: #05050A;\n --bg-secondary: #0D0D1A;\n --bg-card: rgba(255, 255, 255, 0.03);\n --bg-card-hover: rgba(255, 255, 255, 0.07);\n --text-primary: #FFFFFF;\n --text-secondary: #A0A0B8;\n --text-muted: #6A6A82;\n --accent-green: #ccff00;\n --accent-purple: #a855f7;\n --accent-pink: #ec4899;\n --glow-green: rgba(204, 255, 0, 0.25);\n --glow-purple: rgba(168, 85, 247, 0.25);\n --radius-card: 24px;\n --radius-btn: 60px;\n --nav-height: 68px;\n --bottom-nav-height: 68px;\n --transition: 0.35s cubic-bezier(0.22, 1, 0.36, 1);\n }\n\n html {\n scroll-behavior: smooth;\n -webkit-tap-highlight-color: transparent;\n }\n\n body {\n font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;\n background: var(--bg-primary);\n color: var(--text-primary);\n line-height: 1.6;\n -webkit-font-smoothing: antialiased;\n overflow-x: hidden;\n min-height: 100vh;\n padding-bottom: calc(var(--bottom-nav-height) + 16px);\n }\n\n @media (min-width: 1024px) {\n body {\n padding-bottom: 0;\n }\n }\n\n .container {\n width: 100%;\n max-width: 1280px;\n margin: 0 auto;\n padding: 0 20px;\n }\n\n @media (min-width: 640px) {\n .container {\n padding: 0 40px;\n }\n }\n @media (min-width: 1024px) {\n .container {\n padding: 0 60px;\n }\n }\n\n a {\n text-decoration: none;\n color: inherit;\n }\n\n \/* Custom Scrollbar *\/\n ::-webkit-scrollbar {\n width: 5px;\n }\n ::-webkit-scrollbar-track {\n background: var(--bg-primary);\n }\n ::-webkit-scrollbar-thumb {\n background: var(--accent-green);\n border-radius: 12px;\n box-shadow: 0 0 20px var(--glow-green);\n }\n\n \/* ============================================================\n 2. UTILITY & TYPOGRAPHY\n ============================================================ *\/\n .section-tag {\n display: inline-block;\n font-size: 0.7rem;\n font-weight: 700;\n letter-spacing: 0.12em;\n text-transform: uppercase;\n color: var(--accent-green);\n background: rgba(204, 255, 0, 0.08);\n padding: 6px 18px;\n border-radius: 100px;\n margin-bottom: 14px;\n border: 1px solid rgba(204, 255, 0, 0.1);\n }\n\n .section-title {\n font-size: clamp(2.2rem, 5vw, 3.8rem);\n font-weight: 900;\n line-height: 1.1;\n letter-spacing: -0.04em;\n margin-bottom: 14px;\n }\n\n .section-title .gradient {\n background: linear-gradient(135deg, var(--accent-green), var(--accent-purple), var(--accent-pink));\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n background-size: 300% 300%;\n animation: gradientShift 6s ease-in-out infinite;\n }\n\n @keyframes gradientShift {\n 0% {\n background-position: 0% 50%;\n }\n 50% {\n background-position: 100% 50%;\n }\n 100% {\n background-position: 0% 50%;\n }\n }\n\n .section-desc {\n font-size: clamp(1rem, 1.1vw, 1.2rem);\n color: var(--text-secondary);\n max-width: 600px;\n margin-bottom: 40px;\n }\n\n .section-desc-full {\n font-size: clamp(1rem, 1.1vw, 1.2rem);\n color: var(--text-secondary);\n max-width: 100%;\n margin-bottom: 40px;\n }\n\n .grid-2col {\n display: grid;\n grid-template-columns: 1fr;\n gap: 24px;\n }\n @media (min-width: 640px) {\n .grid-2col {\n grid-template-columns: repeat(2, 1fr);\n gap: 30px;\n }\n }\n\n .grid-3col {\n display: grid;\n grid-template-columns: 1fr;\n gap: 24px;\n }\n @media (min-width: 640px) {\n .grid-3col {\n grid-template-columns: repeat(2, 1fr);\n gap: 28px;\n }\n }\n @media (min-width: 1024px) {\n .grid-3col {\n grid-template-columns: repeat(3, 1fr);\n gap: 30px;\n }\n }\n\n .flicks-link {\n color: inherit;\n border-bottom: 1px dotted rgba(255, 255, 255, 0.2);\n transition: var(--transition);\n display: inline-block;\n padding: 2px 0;\n font-weight: 600;\n }\n .flicks-link:hover {\n color: var(--accent-green);\n border-bottom-color: var(--accent-green);\n text-shadow: 0 0 30px var(--glow-green);\n }\n\n \/* ============================================================\n 3. BUTTONS\n ============================================================ *\/\n .btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 10px;\n padding: 16px 28px;\n border-radius: var(--radius-btn);\n font-weight: 700;\n font-size: 1rem;\n transition: var(--transition);\n border: none;\n cursor: pointer;\n min-height: 56px;\n min-width: 56px;\n width: 100%;\n position: relative;\n overflow: hidden;\n }\n\n @media (min-width: 480px) {\n .btn {\n width: auto;\n padding: 16px 38px;\n }\n }\n\n .btn-create-wallet {\n background: linear-gradient(135deg, var(--accent-purple), #7c3aed);\n color: #fff;\n box-shadow: 0 8px 32px var(--glow-purple);\n font-weight: 800;\n }\n .btn-create-wallet::before {\n content: '';\n position: absolute;\n top: -2px;\n left: -2px;\n right: -2px;\n bottom: -2px;\n background: linear-gradient(135deg, var(--accent-purple), var(--accent-pink));\n border-radius: var(--radius-btn);\n z-index: -1;\n opacity: 0;\n transition: var(--transition);\n }\n .btn-create-wallet:hover {\n transform: scale(1.04) translateY(-3px);\n box-shadow: 0 16px 48px var(--glow-purple);\n }\n .btn-create-wallet:hover::before {\n opacity: 1;\n }\n\n .btn-login {\n background: rgba(255, 255, 255, 0.04);\n color: var(--text-primary);\n border: 1px solid rgba(255, 255, 255, 0.08);\n }\n .btn-login:hover {\n background: rgba(255, 255, 255, 0.10);\n border-color: var(--accent-green);\n color: var(--accent-green);\n box-shadow: 0 0 30px var(--glow-green);\n }\n\n .btn-install {\n background: var(--accent-green);\n color: #05050A;\n box-shadow: 0 8px 32px var(--glow-green);\n font-weight: 800;\n }\n .btn-install::before {\n content: '';\n position: absolute;\n top: -2px;\n left: -2px;\n right: -2px;\n bottom: -2px;\n background: linear-gradient(135deg, var(--accent-green), var(--accent-purple));\n border-radius: var(--radius-btn);\n z-index: -1;\n opacity: 0;\n transition: var(--transition);\n }\n .btn-install:hover {\n transform: scale(1.04) translateY(-3px);\n box-shadow: 0 16px 48px var(--glow-green);\n }\n .btn-install:hover::before {\n opacity: 1;\n }\n\n .btn-support {\n background: rgba(37, 211, 102, 0.12);\n color: #25D366;\n border: 1px solid rgba(37, 211, 102, 0.15);\n font-weight: 600;\n }\n .btn-support:hover {\n background: rgba(37, 211, 102, 0.20);\n border-color: #25D366;\n box-shadow: 0 0 30px rgba(37, 211, 102, 0.15);\n transform: translateY(-2px);\n }\n\n \/* Payment badges *\/\n .payment-badge {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n padding: 6px 14px;\n border-radius: 100px;\n font-size: 0.75rem;\n font-weight: 600;\n background: rgba(255, 255, 255, 0.04);\n border: 1px solid rgba(255, 255, 255, 0.06);\n color: var(--text-secondary);\n }\n .payment-badge i {\n font-size: 1rem;\n }\n .payment-badge.stripe {\n border-color: rgba(99, 102, 241, 0.2);\n color: #818cf8;\n }\n .payment-badge.stripe i {\n color: #818cf8;\n }\n .payment-badge.mtn {\n border-color: rgba(255, 193, 7, 0.2);\n color: #fbbf24;\n }\n .payment-badge.mtn i {\n color: #fbbf24;\n }\n .payment-badge.airtel {\n border-color: rgba(239, 68, 68, 0.2);\n color: #f87171;\n }\n .payment-badge.airtel i {\n color: #f87171;\n }\n .payment-badge.mpesa {\n border-color: rgba(52, 211, 153, 0.2);\n color: #34d399;\n }\n .payment-badge.mpesa i {\n color: #34d399;\n }\n\n \/* ============================================================\n 4. TOP NAVBAR (Persistent)\n ============================================================ *\/\n .navbar {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n z-index: 1000;\n height: var(--nav-height);\n background: rgba(5, 5, 10, 0.75);\n backdrop-filter: blur(20px) saturate(180%);\n transition: var(--transition);\n display: flex;\n align-items: center;\n border-bottom: 1px solid rgba(255, 255, 255, 0.03);\n }\n\n .navbar .container {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding-top: 0;\n padding-bottom: 0;\n height: 100%;\n }\n\n .logo {\n font-size: 1.3rem;\n font-weight: 800;\n letter-spacing: -0.03em;\n display: flex;\n align-items: center;\n gap: 6px;\n flex-shrink: 0;\n }\n .logo i {\n color: var(--accent-green);\n font-size: 1.5rem;\n filter: drop-shadow(0 0 10px var(--glow-green));\n }\n .logo .cash {\n background: linear-gradient(135deg, #f8fafc, #94a3b8);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n }\n .logo .flicks-link {\n font-weight: 900;\n border-bottom: none;\n font-size: 1.3rem;\n }\n\n .nav-links {\n display: flex;\n align-items: center;\n gap: 6px;\n list-style: none;\n }\n .nav-links a:not(.btn) {\n font-size: 0.82rem;\n font-weight: 500;\n color: var(--text-secondary);\n transition: var(--transition);\n position: relative;\n padding: 6px 12px;\n cursor: pointer;\n border-radius: 8px;\n }\n .nav-links a:not(.btn):hover,\n .nav-links a:not(.btn).active {\n color: #fff;\n background: rgba(255, 255, 255, 0.05);\n }\n .nav-links a:not(.btn).active {\n color: var(--accent-green);\n }\n\n .nav-links .btn-install {\n padding: 8px 18px;\n font-size: 0.8rem;\n min-height: 38px;\n width: auto;\n box-shadow: 0 4px 20px var(--glow-green);\n margin-left: 4px;\n }\n\n .hamburger {\n display: none;\n font-size: 1.6rem;\n color: #fff;\n cursor: pointer;\n background: none;\n border: none;\n padding: 8px;\n z-index: 1001;\n align-items: center;\n justify-content: center;\n }\n\n @media (max-width: 899px) {\n .nav-links {\n position: fixed;\n top: 0;\n right: -100%;\n width: 280px;\n height: 100vh;\n background: rgba(13, 13, 26, 0.96);\n backdrop-filter: blur(30px);\n flex-direction: column;\n justify-content: center;\n align-items: center;\n gap: 20px;\n transition: var(--transition);\n padding: 40px 24px;\n border-left: 1px solid rgba(255, 255, 255, 0.04);\n }\n .nav-links.open {\n right: 0;\n }\n .nav-links .btn-install {\n width: 100%;\n justify-content: center;\n margin-top: 8px;\n }\n .nav-links a:not(.btn) {\n font-size: 1.1rem;\n padding: 10px 20px;\n width: 100%;\n text-align: center;\n }\n }\n\n @media (min-width: 900px) {\n .hamburger {\n display: none;\n }\n .nav-links {\n gap: 4px;\n }\n }\n\n \/* ============================================================\n 5. BOTTOM NAVIGATION (Mobile\/Tablet\/Desktop)\n ============================================================ *\/\n .bottom-nav {\n position: fixed;\n bottom: 0;\n left: 0;\n right: 0;\n z-index: 999;\n background: rgba(5, 5, 10, 0.85);\n backdrop-filter: blur(16px) saturate(180%);\n border-top: 1px solid rgba(255, 255, 255, 0.04);\n display: flex;\n justify-content: space-around;\n align-items: center;\n padding: 6px 0 env(safe-area-inset-bottom, 8px);\n height: var(--bottom-nav-height);\n transition: var(--transition);\n }\n\n .bottom-nav a {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 1px;\n font-size: 0.55rem;\n font-weight: 500;\n color: var(--text-muted);\n padding: 4px 8px;\n border-radius: 12px;\n transition: var(--transition);\n flex: 1;\n max-width: 80px;\n min-height: 52px;\n position: relative;\n text-align: center;\n }\n\n .bottom-nav a i {\n font-size: 1.3rem;\n transition: var(--transition);\n }\n\n .bottom-nav a span {\n line-height: 1.2;\n font-size: 0.55rem;\n letter-spacing: 0.02em;\n }\n\n .bottom-nav a:hover {\n color: var(--text-primary);\n }\n\n .bottom-nav a.active {\n color: var(--accent-green);\n }\n\n .bottom-nav a.active i {\n text-shadow: 0 0 20px var(--glow-green);\n }\n\n .bottom-nav a.active::before {\n content: '';\n position: absolute;\n top: -1px;\n left: 50%;\n transform: translateX(-50%);\n width: 24px;\n height: 3px;\n background: var(--accent-green);\n border-radius: 0 0 4px 4px;\n box-shadow: 0 0 20px var(--glow-green);\n }\n\n @media (min-width: 1024px) {\n .bottom-nav {\n display: none;\n }\n }\n\n \/* ============================================================\n 6. PAGE CONTAINER\n ============================================================ *\/\n #app {\n min-height: 400px;\n padding-top: var(--nav-height);\n }\n\n .page-content {\n display: none;\n animation: fadeInPage 0.5s cubic-bezier(0.22, 1, 0.36, 1) forwards;\n padding: 40px 0 60px;\n }\n\n .page-content.active {\n display: block;\n }\n\n @keyframes fadeInPage {\n 0% {\n opacity: 0;\n transform: translateY(16px);\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n }\n\n \/* ============================================================\n 7. HOME PAGE - HERO SECTION\n ============================================================ *\/\n .hero {\n padding: 20px 0 10px;\n background: radial-gradient(ellipse at 30% 20%, #1a0a2e 0%, #05050A 70%);\n position: relative;\n overflow: hidden;\n border-radius: var(--radius-card);\n margin-bottom: 20px;\n }\n\n .hero .orb {\n position: absolute;\n border-radius: 50%;\n pointer-events: none;\n filter: blur(80px);\n animation: floatOrb 12s ease-in-out infinite;\n }\n .hero .orb-1 {\n top: -20%;\n right: -20%;\n width: 400px;\n height: 400px;\n background: var(--accent-purple);\n opacity: 0.12;\n animation-delay: 0s;\n }\n .hero .orb-2 {\n bottom: -30%;\n left: -20%;\n width: 350px;\n height: 350px;\n background: var(--accent-green);\n opacity: 0.06;\n animation-delay: -4s;\n }\n .hero .orb-3 {\n top: 40%;\n left: 30%;\n width: 200px;\n height: 200px;\n background: var(--accent-pink);\n opacity: 0.06;\n animation-delay: -8s;\n }\n\n @keyframes floatOrb {\n 0%,\n 100% {\n transform: translate(0, 0) scale(1);\n }\n 50% {\n transform: translate(-30px, 20px) scale(1.08);\n }\n }\n\n .hero .container {\n position: relative;\n z-index: 2;\n display: grid;\n grid-template-columns: 1fr;\n gap: 32px;\n align-items: center;\n }\n\n @media (min-width: 900px) {\n .hero .container {\n grid-template-columns: 1fr 1fr;\n gap: 50px;\n }\n }\n\n .hero-content {\n max-width: 100%;\n text-align: left;\n }\n @media (max-width: 899px) {\n .hero-content {\n text-align: center;\n }\n .hero-content p {\n margin-left: auto;\n margin-right: auto;\n }\n .hero-actions {\n justify-content: center;\n }\n }\n\n .hero-badge {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n background: rgba(204, 255, 0, 0.06);\n padding: 6px 16px 6px 12px;\n border-radius: 100px;\n font-size: 0.75rem;\n font-weight: 600;\n color: var(--accent-green);\n border: 1px solid rgba(204, 255, 0, 0.08);\n margin-bottom: 20px;\n backdrop-filter: blur(4px);\n }\n\n .hero h1 {\n font-size: clamp(2.6rem, 6vw, 4.8rem);\n font-weight: 900;\n line-height: 1.02;\n letter-spacing: -0.05em;\n margin-bottom: 16px;\n }\n .hero h1 .gradient {\n background: linear-gradient(135deg, var(--accent-green), var(--accent-purple), var(--accent-pink));\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n background-size: 300% 300%;\n animation: gradientShift 8s ease-in-out infinite;\n }\n\n .hero p {\n font-size: clamp(1rem, 1.1vw, 1.2rem);\n color: var(--text-secondary);\n max-width: 520px;\n margin-bottom: 28px;\n }\n @media (max-width: 899px) {\n .hero p {\n max-width: 100%;\n }\n }\n\n .hero-actions {\n display: flex;\n flex-wrap: wrap;\n gap: 12px;\n margin-bottom: 28px;\n }\n @media (max-width: 480px) {\n .hero-actions .btn {\n width: 100%;\n }\n }\n\n .hero-visual {\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n }\n .mockup-card {\n background: rgba(255, 255, 255, 0.03);\n backdrop-filter: blur(16px);\n -webkit-backdrop-filter: blur(16px);\n border: 1px solid rgba(255, 255, 255, 0.05);\n border-radius: var(--radius-card);\n padding: 24px 20px;\n width: 100%;\n max-width: 420px;\n box-shadow: 0 32px 80px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.05);\n transition: var(--transition);\n }\n .mockup-card:hover {\n transform: translateY(-6px);\n border-color: rgba(204, 255, 0, 0.12);\n box-shadow: 0 40px 100px rgba(0, 0, 0, 0.7), 0 0 40px var(--glow-green);\n }\n .mockup-card .card-header {\n display: flex;\n align-items: center;\n gap: 12px;\n margin-bottom: 16px;\n }\n .mockup-card .card-header .avatar {\n width: 44px;\n height: 44px;\n border-radius: 50%;\n background: linear-gradient(135deg, var(--accent-green), var(--accent-purple));\n display: flex;\n align-items: center;\n justify-content: center;\n font-weight: 900;\n font-size: 1rem;\n color: #05050A;\n flex-shrink: 0;\n box-shadow: 0 0 30px var(--glow-green);\n }\n .mockup-card .card-header h3 {\n font-size: 1.1rem;\n font-weight: 700;\n }\n .mockup-card .card-header p {\n color: var(--text-secondary);\n font-size: 0.75rem;\n }\n .mockup-card .live-indicator {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n background: rgba(239, 68, 68, 0.12);\n padding: 3px 10px;\n border-radius: 100px;\n font-size: 0.65rem;\n font-weight: 600;\n color: #ef4444;\n margin-top: 2px;\n }\n .mockup-card .live-indicator .dot {\n width: 5px;\n height: 5px;\n background: #ef4444;\n border-radius: 50%;\n animation: pulse 1.5s ease-in-out infinite;\n }\n @keyframes pulse {\n 0%,\n 100% {\n opacity: 1;\n transform: scale(1);\n }\n 50% {\n opacity: 0.4;\n transform: scale(0.7);\n }\n }\n .mockup-card .chart {\n display: flex;\n align-items: flex-end;\n gap: 4px;\n height: 50px;\n margin: 16px 0 14px;\n padding: 0 2px;\n }\n .mockup-card .chart .bar {\n flex: 1;\n background: linear-gradient(180deg, var(--accent-green), var(--accent-purple));\n border-radius: 3px 3px 0 0;\n height: calc(20% + 10% * var(--i, 1));\n min-height: 6px;\n opacity: 0.7;\n transition: var(--transition);\n }\n .mockup-card:hover .chart .bar {\n opacity: 1;\n }\n .mockup-card .stat-grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 12px;\n margin-top: 14px;\n padding-top: 14px;\n border-top: 1px solid rgba(255, 255, 255, 0.04);\n }\n .mockup-card .stat-grid div {\n display: flex;\n flex-direction: column;\n }\n .mockup-card .stat-grid strong {\n font-size: 1.3rem;\n color: #fff;\n }\n .mockup-card .stat-grid small {\n color: var(--text-muted);\n font-size: 0.7rem;\n }\n .mockup-card .progress-bar {\n margin-top: 14px;\n height: 4px;\n background: rgba(255, 255, 255, 0.06);\n border-radius: 12px;\n overflow: hidden;\n }\n .mockup-card .progress-bar span {\n display: block;\n height: 100%;\n width: 72%;\n background: linear-gradient(90deg, var(--accent-green), var(--accent-purple));\n border-radius: 12px;\n box-shadow: 0 0 20px var(--glow-green);\n }\n\n .hero-stats {\n display: grid;\n grid-template-columns: repeat(2, 1fr);\n gap: 12px 20px;\n padding-top: 20px;\n border-top: 1px solid rgba(255, 255, 255, 0.04);\n }\n @media (min-width: 640px) {\n .hero-stats {\n grid-template-columns: repeat(4, 1fr);\n gap: 16px 24px;\n }\n }\n\n .stat-item {\n display: flex;\n flex-direction: column;\n }\n .stat-number {\n font-size: clamp(1.4rem, 2vw, 2.2rem);\n font-weight: 800;\n color: #fff;\n display: flex;\n align-items: center;\n gap: 6px;\n }\n .stat-number i {\n color: var(--accent-green);\n font-size: clamp(1rem, 1.5vw, 1.6rem);\n filter: drop-shadow(0 0 8px var(--glow-green));\n }\n .stat-label {\n font-size: 0.75rem;\n color: var(--text-muted);\n font-weight: 500;\n letter-spacing: 0.02em;\n }\n\n .quick-steps {\n background: rgba(255, 255, 255, 0.02);\n border-radius: var(--radius-card);\n padding: 20px 18px;\n border: 1px solid rgba(255, 255, 255, 0.04);\n margin-top: 28px;\n backdrop-filter: blur(4px);\n }\n .quick-steps .steps-header {\n display: flex;\n align-items: center;\n gap: 10px;\n margin-bottom: 14px;\n }\n .quick-steps .steps-header h4 {\n font-size: 0.95rem;\n font-weight: 700;\n color: #fff;\n }\n .quick-steps .steps-header i {\n color: var(--accent-green);\n font-size: 1.1rem;\n }\n\n .quick-steps-grid {\n display: grid;\n grid-template-columns: 1fr;\n gap: 14px;\n }\n @media (min-width: 640px) {\n .quick-steps-grid {\n grid-template-columns: 1fr 1fr;\n gap: 18px;\n }\n }\n\n .quick-step-col h5 {\n font-size: 0.8rem;\n font-weight: 700;\n color: var(--accent-purple);\n margin-bottom: 8px;\n display: flex;\n align-items: center;\n gap: 6px;\n }\n .quick-step-col .step-list {\n display: flex;\n flex-direction: column;\n gap: 3px;\n }\n .quick-step-col .step-list .step-item {\n display: flex;\n align-items: flex-start;\n gap: 6px;\n font-size: 0.72rem;\n color: var(--text-secondary);\n padding: 2px 0;\n }\n .quick-step-col .step-list .step-item .num {\n flex-shrink: 0;\n width: 18px;\n height: 18px;\n border-radius: 50%;\n background: rgba(204, 255, 0, 0.08);\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 0.55rem;\n font-weight: 700;\n color: var(--accent-green);\n margin-top: 1px;\n }\n .quick-step-col .step-list .step-item .highlight {\n color: #fff;\n font-weight: 500;\n }\n .quick-step-col .step-list .step-item .green {\n color: var(--accent-green);\n font-weight: 500;\n }\n .quick-step-col .step-list .step-item .blue {\n color: #3b82f6;\n font-weight: 500;\n }\n\n .quick-steps .note-mini {\n margin-top: 12px;\n padding: 8px 14px;\n background: rgba(204, 255, 0, 0.04);\n border-radius: 10px;\n font-size: 0.72rem;\n color: var(--text-secondary);\n border-left: 2px solid var(--accent-green);\n }\n\n \/* ============================================================\n 8. CARDS & SECTIONS (Shared Styles)\n ============================================================ *\/\n .card {\n background: var(--bg-card);\n backdrop-filter: blur(8px);\n -webkit-backdrop-filter: blur(8px);\n border-radius: var(--radius-card);\n padding: 28px 24px;\n transition: var(--transition);\n height: 100%;\n border: 1px solid rgba(255, 255, 255, 0.03);\n }\n .card:hover {\n background: var(--bg-card-hover);\n transform: translateY(-5px);\n border-color: rgba(204, 255, 0, 0.06);\n box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);\n }\n .card-icon {\n font-size: 2rem;\n color: var(--accent-green);\n margin-bottom: 14px;\n display: inline-block;\n filter: drop-shadow(0 0 10px var(--glow-green));\n }\n .card h3 {\n font-size: 1.2rem;\n font-weight: 700;\n margin-bottom: 8px;\n }\n .card p,\n .card li {\n color: var(--text-secondary);\n font-size: 0.92rem;\n }\n .card ul {\n list-style: none;\n padding: 0;\n margin-top: 10px;\n }\n .card ul li {\n padding: 5px 0;\n display: flex;\n gap: 10px;\n align-items: flex-start;\n }\n .card ul li i {\n color: var(--accent-green);\n font-size: 0.75rem;\n margin-top: 5px;\n flex-shrink: 0;\n }\n\n .highlight-box {\n background: rgba(204, 255, 0, 0.04);\n padding: 14px 18px;\n border-radius: 12px;\n margin-top: 14px;\n border-left: 3px solid var(--accent-green);\n }\n .highlight-box strong {\n color: #fff;\n }\n\n .executive-card {\n background: var(--bg-card);\n backdrop-filter: blur(8px);\n -webkit-backdrop-filter: blur(8px);\n border-radius: var(--radius-card);\n padding: 30px 28px;\n border: 1px solid rgba(255, 255, 255, 0.03);\n transition: var(--transition);\n }\n .executive-card:hover {\n background: var(--bg-card-hover);\n border-color: rgba(204, 255, 0, 0.06);\n box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);\n }\n .executive-card p {\n color: var(--text-secondary);\n font-size: 1rem;\n line-height: 1.7;\n }\n\n .feature-card {\n background: var(--bg-card);\n backdrop-filter: blur(8px);\n -webkit-backdrop-filter: blur(8px);\n border-radius: var(--radius-card);\n padding: 24px 22px;\n transition: var(--transition);\n border: 1px solid rgba(255, 255, 255, 0.03);\n height: 100%;\n }\n .feature-card:hover {\n background: var(--bg-card-hover);\n transform: translateY(-5px);\n border-color: rgba(204, 255, 0, 0.06);\n box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);\n }\n .feature-card .icon-wrap {\n width: 50px;\n height: 50px;\n border-radius: 12px;\n background: linear-gradient(135deg, rgba(204, 255, 0, 0.12), rgba(168, 85, 247, 0.12));\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 1.6rem;\n color: var(--accent-green);\n margin-bottom: 14px;\n }\n .feature-card h4 {\n font-size: 1.1rem;\n font-weight: 700;\n margin-bottom: 6px;\n }\n .feature-card p {\n color: var(--text-secondary);\n font-size: 0.88rem;\n }\n .feature-card ul {\n list-style: none;\n padding: 0;\n margin-top: 8px;\n }\n .feature-card ul li {\n padding: 3px 0;\n display: flex;\n gap: 10px;\n align-items: flex-start;\n color: var(--text-secondary);\n font-size: 0.85rem;\n }\n .feature-card ul li i {\n color: var(--accent-green);\n font-size: 0.65rem;\n margin-top: 4px;\n flex-shrink: 0;\n }\n\n \/* Tier Table *\/\n .tier-table-wrap {\n overflow-x: auto;\n margin-top: 16px;\n border-radius: var(--radius-card);\n background: rgba(255, 255, 255, 0.015);\n -webkit-overflow-scrolling: touch;\n border: 1px solid rgba(255, 255, 255, 0.03);\n }\n .tier-table {\n width: 100%;\n border-collapse: collapse;\n font-size: 0.85rem;\n min-width: 380px;\n }\n .tier-table thead {\n background: rgba(204, 255, 0, 0.04);\n }\n .tier-table th {\n text-align: left;\n padding: 12px 16px;\n font-weight: 700;\n color: #fff;\n border-bottom: 1px solid rgba(255, 255, 255, 0.04);\n }\n .tier-table td {\n padding: 10px 16px;\n border-bottom: 1px solid rgba(255, 255, 255, 0.02);\n color: var(--text-secondary);\n }\n .tier-table tr:last-child td {\n border-bottom: none;\n }\n .tier-table td strong {\n color: #fff;\n }\n .tier-table .free-badge {\n display: inline-block;\n background: rgba(204, 255, 0, 0.12);\n color: var(--accent-green);\n padding: 2px 10px;\n border-radius: 100px;\n font-size: 0.7rem;\n font-weight: 700;\n }\n .tier-table .pro-badge {\n display: inline-block;\n background: rgba(168, 85, 247, 0.12);\n color: var(--accent-purple);\n padding: 2px 10px;\n border-radius: 100px;\n font-size: 0.7rem;\n font-weight: 700;\n }\n\n .share-grid {\n display: grid;\n grid-template-columns: 1fr;\n gap: 12px;\n margin-top: 12px;\n }\n @media (min-width: 480px) {\n .share-grid {\n grid-template-columns: 1fr 1fr;\n }\n }\n .share-card {\n background: rgba(255, 255, 255, 0.02);\n border-radius: 12px;\n padding: 14px 18px;\n border: 1px solid rgba(255, 255, 255, 0.04);\n transition: var(--transition);\n }\n .share-card:hover {\n background: rgba(255, 255, 255, 0.05);\n border-color: rgba(204, 255, 0, 0.06);\n }\n .share-card h5 {\n font-size: 1rem;\n font-weight: 700;\n color: var(--accent-green);\n }\n .share-card p {\n color: var(--text-secondary);\n font-size: 0.85rem;\n margin-top: 2px;\n }\n\n \/* ============================================================\n 9. STEP CARDS (Register \/ Activate)\n ============================================================ *\/\n .step-grid {\n display: grid;\n grid-template-columns: 1fr;\n gap: 14px;\n }\n @media (min-width: 480px) {\n .step-grid {\n grid-template-columns: repeat(2, 1fr);\n gap: 16px;\n }\n }\n @media (min-width: 900px) {\n .step-grid {\n grid-template-columns: repeat(3, 1fr);\n gap: 18px;\n }\n }\n\n .step-card {\n background: var(--bg-card);\n backdrop-filter: blur(8px);\n -webkit-backdrop-filter: blur(8px);\n border-radius: var(--radius-card);\n padding: 18px 20px;\n display: flex;\n align-items: flex-start;\n gap: 14px;\n transition: var(--transition);\n border: 1px solid rgba(255, 255, 255, 0.03);\n }\n .step-card:hover {\n background: var(--bg-card-hover);\n transform: translateY(-3px);\n border-color: rgba(204, 255, 0, 0.05);\n box-shadow: 0 12px 24px rgba(0, 0, 0, 0.2);\n }\n .step-number {\n flex-shrink: 0;\n width: 38px;\n height: 38px;\n border-radius: 50%;\n background: linear-gradient(135deg, rgba(204, 255, 0, 0.15), rgba(168, 85, 247, 0.15));\n display: flex;\n align-items: center;\n justify-content: center;\n font-weight: 800;\n font-size: 0.9rem;\n color: var(--accent-green);\n margin-top: 2px;\n border: 1px solid rgba(204, 255, 0, 0.1);\n }\n .step-content {\n flex: 1;\n }\n .step-content strong {\n color: #fff;\n display: block;\n font-size: 0.9rem;\n margin-bottom: 2px;\n }\n .step-content p {\n color: var(--text-secondary);\n font-size: 0.82rem;\n margin: 0;\n }\n .step-content p i {\n color: var(--accent-green);\n margin-right: 4px;\n }\n .step-card.highlight-step {\n background: rgba(204, 255, 0, 0.04);\n border-color: rgba(204, 255, 0, 0.08);\n }\n\n .note-box {\n background: rgba(204, 255, 0, 0.04);\n padding: 16px 20px;\n border-radius: 14px;\n margin-top: 28px;\n display: flex;\n gap: 14px;\n align-items: flex-start;\n border: 1px solid rgba(204, 255, 0, 0.06);\n }\n .note-box i {\n color: var(--accent-green);\n font-size: 1.3rem;\n margin-top: 2px;\n }\n .note-box p {\n color: var(--text-secondary);\n font-size: 0.9rem;\n margin: 0;\n }\n .note-box strong {\n color: #fff;\n }\n\n \/* ============================================================\n 10. TABLE & TIMELINE\n ============================================================ *\/\n .table-wrap {\n overflow-x: auto;\n margin-top: 16px;\n border-radius: var(--radius-card);\n background: rgba(255, 255, 255, 0.015);\n -webkit-overflow-scrolling: touch;\n padding: 0 4px;\n border: 1px solid rgba(255, 255, 255, 0.03);\n }\n table {\n width: 100%;\n border-collapse: collapse;\n font-size: 0.85rem;\n min-width: 380px;\n }\n thead {\n background: rgba(204, 255, 0, 0.03);\n }\n th {\n text-align: left;\n padding: 12px 16px;\n font-weight: 600;\n color: #fff;\n border-bottom: 1px solid rgba(255, 255, 255, 0.04);\n }\n td {\n padding: 10px 16px;\n border-bottom: 1px solid rgba(255, 255, 255, 0.02);\n color: var(--text-secondary);\n }\n tr:last-child td {\n border-bottom: none;\n }\n td strong {\n color: #fff;\n }\n\n .timeline-item {\n display: flex;\n gap: 18px;\n align-items: flex-start;\n padding: 14px 0;\n border-bottom: 1px solid rgba(255, 255, 255, 0.02);\n }\n .timeline-item:last-child {\n border-bottom: none;\n }\n .timeline-year {\n font-weight: 900;\n font-size: 1.1rem;\n color: var(--accent-green);\n min-width: 65px;\n flex-shrink: 0;\n }\n .timeline-content p {\n color: var(--text-secondary);\n font-size: 0.88rem;\n }\n\n \/* ============================================================\n 11. FOOTER (Persistent)\n ============================================================ *\/\n footer {\n padding: 32px 0 24px;\n border-top: 1px solid rgba(255, 255, 255, 0.03);\n width: 100%;\n background: rgba(255, 255, 255, 0.005);\n margin-top: 20px;\n }\n\n .footer-grid {\n display: grid;\n grid-template-columns: 1fr;\n gap: 28px;\n margin-bottom: 24px;\n }\n @media (min-width: 640px) {\n .footer-grid {\n grid-template-columns: 1fr 1fr;\n gap: 32px;\n }\n }\n @media (min-width: 1024px) {\n .footer-grid {\n grid-template-columns: 1.5fr 1fr 1fr;\n gap: 40px;\n }\n }\n\n .footer-brand p {\n color: var(--text-secondary);\n font-size: 0.85rem;\n margin-top: 6px;\n max-width: 380px;\n }\n .footer-brand .logo-small {\n font-size: 1.1rem;\n font-weight: 800;\n display: flex;\n align-items: center;\n gap: 6px;\n }\n .footer-brand .logo-small i {\n color: var(--accent-green);\n font-size: 1.3rem;\n filter: drop-shadow(0 0 10px var(--glow-green));\n }\n\n .footer-company h4,\n .footer-links h4 {\n font-size: 0.9rem;\n font-weight: 700;\n color: #fff;\n margin-bottom: 10px;\n letter-spacing: 0.02em;\n }\n .footer-company p {\n color: var(--text-secondary);\n font-size: 0.85rem;\n line-height: 1.7;\n margin-bottom: 2px;\n }\n .footer-company .company-name {\n color: var(--accent-green);\n font-weight: 600;\n }\n .footer-company .company-number {\n color: #fff;\n font-weight: 500;\n }\n\n .footer-links .link-group {\n display: flex;\n flex-direction: column;\n gap: 8px;\n }\n .footer-links .link-group a {\n color: var(--text-secondary);\n font-size: 0.85rem;\n transition: var(--transition);\n display: inline-flex;\n align-items: center;\n gap: 8px;\n cursor: pointer;\n }\n .footer-links .link-group a:hover {\n color: var(--accent-green);\n text-shadow: 0 0 20px var(--glow-green);\n }\n .footer-links .link-group a i {\n font-size: 0.75rem;\n opacity: 0.6;\n }\n\n .footer-support {\n display: flex;\n flex-wrap: wrap;\n gap: 10px;\n margin-top: 4px;\n }\n .footer-support .btn-support {\n font-size: 0.8rem;\n padding: 8px 18px;\n min-height: 40px;\n }\n\n .footer-bottom {\n padding-top: 20px;\n border-top: 1px solid rgba(255, 255, 255, 0.03);\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 10px;\n text-align: center;\n }\n @media (min-width: 640px) {\n .footer-bottom {\n flex-direction: row;\n justify-content: space-between;\n text-align: left;\n }\n }\n .footer-bottom p {\n color: var(--text-muted);\n font-size: 0.75rem;\n }\n .footer-bottom p i {\n color: var(--accent-green);\n }\n .footer-legal-links {\n display: flex;\n flex-wrap: wrap;\n gap: 14px;\n }\n .footer-legal-links a {\n color: var(--text-muted);\n font-size: 0.75rem;\n transition: var(--transition);\n cursor: pointer;\n }\n .footer-legal-links a:hover {\n color: var(--accent-green);\n }\n\n \/* ============================================================\n 12. RESPONSIVE FINE-TUNING\n ============================================================ *\/\n @media (max-width: 480px) {\n .container {\n padding: 0 14px;\n }\n .card {\n padding: 20px 16px;\n }\n .step-card {\n padding: 14px 16px;\n gap: 10px;\n }\n .step-number {\n width: 32px;\n height: 32px;\n font-size: 0.8rem;\n }\n .hero h1 {\n font-size: 2.2rem;\n }\n .section-title {\n font-size: 1.8rem;\n }\n .mockup-card {\n padding: 18px 14px;\n }\n .mockup-card .chart {\n height: 40px;\n }\n .quick-steps {\n padding: 16px 14px;\n }\n .quick-step-col .step-list .step-item {\n font-size: 0.68rem;\n }\n .bottom-nav a {\n max-width: 60px;\n min-height: 44px;\n }\n .bottom-nav a i {\n font-size: 1.1rem;\n }\n .bottom-nav a span {\n font-size: 0.5rem;\n }\n }\n\n @media (max-width: 380px) {\n .hero-stats {\n grid-template-columns: 1fr 1fr;\n gap: 8px 12px;\n }\n .stat-number {\n font-size: 1.1rem;\n }\n .stat-label {\n font-size: 0.6rem;\n }\n .btn {\n font-size: 0.85rem;\n padding: 14px 20px;\n min-height: 48px;\n }\n }\n\n \/* ============================================================\n 13. ANIMATIONS\n ============================================================ *\/\n .fade-up {\n opacity: 0;\n transform: translateY(30px);\n animation: fadeUp 0.7s cubic-bezier(0.22, 1, 0.36, 1) forwards;\n }\n @keyframes fadeUp {\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n .delay-1 {\n animation-delay: 0.1s;\n }\n .delay-2 {\n animation-delay: 0.2s;\n }\n .delay-3 {\n animation-delay: 0.3s;\n }\n <\/style>\n<\/head>\n<body>\n\n \n <header class=\"navbar\" id=\"navbar\">\n <div class=\"container\">\n <div class=\"logo\">\n <i class=\"fas fa-film\"><\/i>\n <span class=\"cash\">CashChat<\/span>\n <a href=\"https:\/\/ai.cashchatapp.com\" target=\"_blank\" class=\"flicks-link\">Flicks<\/a>\n <\/div>\n <button class=\"hamburger\" id=\"menuToggle\" aria-label=\"Toggle navigation\">\n <i class=\"fas fa-bars\"><\/i>\n <\/button>\n <ul class=\"nav-links\" id=\"navLinks\">\n <li><a href=\"#home\" class=\"active\" data-page=\"home\">Home<\/a><\/li>\n <li><a href=\"#ad-model\" data-page=\"ad-model\">Ad Model<\/a><\/li>\n <li><a href=\"#gifts\" data-page=\"gifts\">Gifts<\/a><\/li>\n <li><a href=\"#register\" data-page=\"register\">Register<\/a><\/li>\n <li><a href=\"#activate\" data-page=\"activate\">Activate<\/a><\/li>\n <li><a href=\"#revenue\" data-page=\"revenue\">Revenue<\/a><\/li>\n <li><a href=\"#business\" data-page=\"business\">Business<\/a><\/li>\n <li>\n <a href=\"https:\/\/ai.cashchatapp.com\" target=\"_blank\" class=\"btn btn-install\">\n <i class=\"fas fa-download\"><\/i> Install\n <\/a>\n <\/li>\n <\/ul>\n <\/div>\n <\/header>\n\n \n <div id=\"app\"><\/div>\n\n \n <nav class=\"bottom-nav\" id=\"bottomNav\">\n <a href=\"#home\" class=\"active\" data-page=\"home\">\n <i class=\"fas fa-home\"><\/i>\n <span>Home<\/span>\n <\/a>\n <a href=\"#ad-model\" data-page=\"ad-model\">\n <i class=\"fas fa-bullhorn\"><\/i>\n <span>Ad Model<\/span>\n <\/a>\n <a href=\"#gifts\" data-page=\"gifts\">\n <i class=\"fas fa-gift\"><\/i>\n <span>Gifts<\/span>\n <\/a>\n <a href=\"#register\" data-page=\"register\">\n <i class=\"fas fa-user-plus\"><\/i>\n <span>Register<\/span>\n <\/a>\n <a href=\"#activate\" data-page=\"activate\">\n <i class=\"fas fa-rocket\"><\/i>\n <span>Activate<\/span>\n <\/a>\n <a href=\"#business\" data-page=\"business\">\n <i class=\"fas fa-building\"><\/i>\n <span>Business<\/span>\n <\/a>\n <a href=\"#revenue\" data-page=\"revenue\">\n <i class=\"fas fa-coins\"><\/i>\n <span>Revenue<\/span>\n <\/a>\n <\/nav>\n\n \n\n \n <template id=\"tmpl-home\">\n <section class=\"page-content active\">\n <div class=\"container\">\n <div class=\"hero\">\n <div class=\"orb orb-1\"><\/div>\n <div class=\"orb orb-2\"><\/div>\n <div class=\"orb orb-3\"><\/div>\n <div class=\"container\">\n <div class=\"hero-content\">\n <div class=\"hero-badge\">\n <i class=\"fas fa-shield-alt\"><\/i> Zero fraud complaints since 2016\n <\/div>\n <h1>\n The <span class=\"gradient\">future<\/span> of<br>\n creator monetization\n <\/h1>\n <p>\n CashChat <a href=\"https:\/\/ai.cashchatapp.com\" target=\"_blank\" class=\"flicks-link\">Flicks<\/a> combines\n digital advertising, virtual gifting, and a proprietary convertible\u2011note economy to build a self\u2011sustaining\n ecosystem.\n <\/p>\n <div class=\"hero-actions\">\n <a href=\"https:\/\/usd.bcbank.se\" target=\"_blank\" class=\"btn btn-create-wallet\">\n <i class=\"fas fa-wallet\"><\/i> Create Wallet\n <\/a>\n <a href=\"https:\/\/my.cashchatapp.com\/account\/login\" target=\"_blank\" class=\"btn btn-login\">\n <i class=\"fas fa-sign-in-alt\"><\/i> Login\n <\/a>\n <a href=\"https:\/\/ai.cashchatapp.com\" target=\"_blank\" class=\"btn btn-install\">\n <i class=\"fas fa-download\"><\/i> Install Flicks\n <\/a>\n <\/div>\n <div class=\"hero-stats\">\n <div class=\"stat-item\">\n <span class=\"stat-number\"><i class=\"fas fa-users\"><\/i> 200k<\/span>\n <span class=\"stat-label\">Ad Agents<\/span>\n <\/div>\n <div class=\"stat-item\">\n <span class=\"stat-number\"><i class=\"fas fa-gift\"><\/i> $1\u2013$300<\/span>\n <span class=\"stat-label\">Gift Range<\/span>\n <\/div>\n <div class=\"stat-item\">\n <span class=\"stat-number\"><i class=\"fas fa-percent\"><\/i> 60%<\/span>\n <span class=\"stat-label\">Creator Share<\/span>\n <\/div>\n <div class=\"stat-item\">\n <span class=\"stat-number\"><i class=\"fas fa-coins\"><\/i> 500<\/span>\n <span class=\"stat-label\">Points to Withdraw<\/span>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"hero-visual\">\n <div class=\"mockup-card\">\n <div class=\"card-header\">\n <div class=\"avatar\">CF<\/div>\n <div>\n <h3>CashChat Flicks<\/h3>\n <div class=\"live-indicator\">\n <span class=\"dot\"><\/span> Live \u00b7 1.2k watching\n <\/div>\n <\/div>\n <\/div>\n <p style=\"color:var(--text-secondary); font-size:0.85rem;\">Your dashboard is ready. Start earning from ads and gifts today.<\/p>\n <div class=\"chart\">\n <div class=\"bar\" style=\"--i:1; height:30%;\"><\/div>\n <div class=\"bar\" style=\"--i:2; height:55%;\"><\/div>\n <div class=\"bar\" style=\"--i:3; height:45%;\"><\/div>\n <div class=\"bar\" style=\"--i:4; height:75%;\"><\/div>\n <div class=\"bar\" style=\"--i:5; height:65%;\"><\/div>\n <div class=\"bar\" style=\"--i:6; height:90%;\"><\/div>\n <div class=\"bar\" style=\"--i:7; height:80%;\"><\/div>\n <div class=\"bar\" style=\"--i:8; height:100%;\"><\/div>\n <div class=\"bar\" style=\"--i:9; height:70%;\"><\/div>\n <div class=\"bar\" style=\"--i:10; height:85%;\"><\/div>\n <\/div>\n <div class=\"stat-grid\">\n <div><strong>$284.50<\/strong><small>Earned this week<\/small><\/div>\n <div><strong>1,842<\/strong><small>Total views<\/small><\/div>\n <\/div>\n <div class=\"progress-bar\"><span><\/span><\/div>\n <p style=\"font-size:0.65rem; color:var(--text-muted); margin-top:10px;\">72% towards next payout<\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"quick-steps\">\n <div class=\"steps-header\">\n <i class=\"fas fa-list-check\"><\/i>\n <h4>How to get started<\/h4>\n <\/div>\n <div class=\"quick-steps-grid\">\n <div class=\"quick-step-col\">\n <h5><i class=\"fas fa-user-plus\"><\/i> Register Wallet<\/h5>\n <div class=\"step-list\">\n <div class=\"step-item\"><span class=\"num\">1<\/span><span>First name \u2014 exactly as on your ID<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">2<\/span><span>Last name \u2014 exactly as on your ID<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">3<\/span><span>Valid email address \u2014 used for verification<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">4<\/span><span>Select your country from dropdown<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">5<\/span><span>Mobile number with country code \u2014 <span class=\"green\">NO + sign<\/span> (e.g., 256712345678)<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">6<\/span><span>Sponsor code <span class=\"highlight\">(Required)<\/span> \u2014 get from a verified user<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">7<\/span><span>Create a <span class=\"highlight\">6\u2011digit PIN<\/span> \u2014 only numbers, no letters<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">8<\/span><span>Re\u2011enter the same 6\u2011digit PIN to confirm<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">9<\/span><span>\u2714 Tick to Accept Terms & Conditions<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">10<\/span><span><span class=\"highlight\">Click Signup<\/span> \u2014 your wallet will be created<\/span><\/div>\n <\/div>\n <\/div>\n <div class=\"quick-step-col\">\n <h5><i class=\"fas fa-rocket\"><\/i> Activate & Pay Subscription<\/h5>\n <div class=\"step-list\">\n <div class=\"step-item\"><span class=\"num\">1<\/span><span>Login to wallet with email + 6\u2011digit PIN<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">2<\/span><span>Click \u201cPay Subscription\u201d (to pay using wallet credit \u2192 click the <span class=\"blue\">Blue wallet<\/span> icon)<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">3<\/span><span>Type <span class=\"highlight\">\u201cStart\u201d<\/span> and Send<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">4<\/span><span>Type <span class=\"highlight\">\u201c1\u201d<\/span> (My wallet) and Send<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">5<\/span><span>Type <span class=\"highlight\">\u201c2\u201d<\/span> (Pay Subscription) and Send<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">6<\/span><span>Choose currency: Type <span class=\"highlight\">1<\/span> for UGX \/ <span class=\"highlight\">2<\/span> for KES \/ <span class=\"highlight\">3<\/span> for USD \u2192 Send<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">7<\/span><span>Payment method: Type <span class=\"highlight\">1<\/span> (Use Mobile: MTN or Mpesa) OR <span class=\"highlight\">2<\/span> (Use Wallet credit) \u2192 Send<\/span><\/div>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"note-mini\">\n <i class=\"fas fa-lightbulb\" style=\"color:var(--accent-green); margin-right:6px;\"><\/i>\n <strong>Activation tip:<\/strong> After step 7 your subscription will be active. For wallet credit payments, ensure sufficient balance. The <span class=\"blue\">\u201cBlue wallet\u201d<\/span> refers to the blue\u2011coloured wallet credit button inside the dashboard.\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n <\/template>\n\n \n <template id=\"tmpl-ad-model\">\n <section class=\"page-content active\">\n <div class=\"container\">\n <span class=\"section-tag\"><i class=\"fas fa-bullhorn\"><\/i> Revenue engine<\/span>\n <h2 class=\"section-title\">Digital Advertising <span class=\"gradient\">& Agent Network<\/span><\/h2>\n <p class=\"section-desc\">\n Advertisements served on user videos fund the entire ecosystem. Creators earn up to 60%,\n while our 200,000 advertising agents drive global campaign management.\n <\/p>\n <div class=\"grid-2col\">\n <div class=\"card\">\n <div class=\"card-icon\"><i class=\"fas fa-video\"><\/i><\/div>\n <h3>Creator Ad Share<\/h3>\n <p>When ads play on your video, you earn between <strong>2% and 60%<\/strong> of the advertiser’s payment. The remaining 40% is shared with the company and advertising agents.<\/p>\n <div class=\"highlight-box\">\n <i class=\"fas fa-arrow-up\" style=\"color:var(--accent-green); margin-right:8px;\"><\/i>\n <strong>Max payout:<\/strong> 60% of ad revenue per video.\n <\/div>\n <\/div>\n <div class=\"card\">\n <div class=\"card-icon\"><i class=\"fas fa-user-tie\"><\/i><\/div>\n <h3>Agent Commission<\/h3>\n <p>CashChat <a href=\"https:\/\/ai.cashchatapp.com\" target=\"_blank\" class=\"flicks-link\">Flicks<\/a> is managed by a dedicated network of <strong>200,000 advertising agents<\/strong>.<\/p>\n <ul>\n <li><i class=\"fas fa-check-circle\"><\/i> Each agent earns <strong>20% commission<\/strong> on every advert they upload.<\/li>\n <li><i class=\"fas fa-check-circle\"><\/i> Advertisers benefit from a decentralized, high-touch distribution model.<\/li>\n <\/ul>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n <\/template>\n\n \n <template id=\"tmpl-gifts\">\n <section class=\"page-content active\">\n <div class=\"container\">\n <span class=\"section-tag\"><i class=\"fas fa-heart\"><\/i> Engagement<\/span>\n <h2 class=\"section-title\">Virtual Gifts <span class=\"gradient\">& Engagement Points<\/span><\/h2>\n <p class=\"section-desc\">\n Viewers support creators directly via virtual gifts. A portion of every gift fuels a\n platform\u2011wide engagement pool that rewards all active users.\n <\/p>\n <div class=\"grid-2col\">\n <div class=\"card\">\n <div class=\"card-icon\"><i class=\"fas fa-gem\"><\/i><\/div>\n <h3>Gift Mechanics<\/h3>\n <ul>\n <li><i class=\"fas fa-dollar-sign\"><\/i> Gifts range from <strong>$1<\/strong> (minimum) to <strong>$300<\/strong> (maximum).<\/li>\n <li><i class=\"fas fa-percent\"><\/i> Creator receives <strong>60%<\/strong> of gift value immediately.<\/li>\n <li><i class=\"fas fa-percent\"><\/i> The remaining <strong>40%<\/strong> is split between the company and users based on engagement.<\/li>\n <\/ul>\n <\/div>\n <div class=\"card\">\n <div class=\"card-icon\"><i class=\"fas fa-trophy\"><\/i><\/div>\n <h3>Engagement Points<\/h3>\n <p>Users earn <strong>Engagement Points<\/strong> by interacting with content, watching videos, and participating in the community.<\/p>\n <div class=\"highlight-box\">\n <i class=\"fas fa-wallet\" style=\"color:var(--accent-green); margin-right:8px;\"><\/i>\n <strong>Withdraw at 500 points:<\/strong> Once you hit 500 points, you can withdraw directly to your <strong>CashChat Wallet<\/strong> from the 40% gift pool.\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n <\/template>\n\n \n <template id=\"tmpl-register\">\n <section class=\"page-content active\">\n <div class=\"container\">\n <span class=\"section-tag\"><i class=\"fas fa-user-plus\"><\/i> Step-by-Step<\/span>\n <h2 class=\"section-title\">Register <span class=\"gradient\">Your Wallet<\/span><\/h2>\n <p class=\"section-desc\">\n Follow these 10 simple steps to create your CashChat wallet and join the <a href=\"https:\/\/ai.cashchatapp.com\" target=\"_blank\" class=\"flicks-link\">Flicks<\/a> ecosystem.\n <\/p>\n <div class=\"step-grid\">\n <div class=\"step-card\"><span class=\"step-number\">1<\/span><div class=\"step-content\"><strong>First name<\/strong><p>Exactly as on your ID.<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">2<\/span><div class=\"step-content\"><strong>Last name<\/strong><p>Exactly as on your ID.<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">3<\/span><div class=\"step-content\"><strong>Valid email address<\/strong><p>Used for verification.<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">4<\/span><div class=\"step-content\"><strong>Select your country<\/strong><p>Choose your country from the dropdown.<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">5<\/span><div class=\"step-content\"><strong>Mobile phone number<\/strong><p>Include country code \u2014 <strong style=\"color: var(--accent-green);\">NO + sign<\/strong> (e.g., 256712345678).<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">6<\/span><div class=\"step-content\"><strong>Sponsor code <span style=\"color: var(--accent-green); font-weight:400;\">(Required)<\/span><\/strong><p>If none provided, get one from a verified user.<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">7<\/span><div class=\"step-content\"><strong>Create a 6\u2011digit PIN<\/strong><p>Only numbers, no letters.<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">8<\/span><div class=\"step-content\"><strong>Confirm PIN<\/strong><p>Re\u2011enter the same 6\u2011digit PIN to confirm.<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">9<\/span><div class=\"step-content\"><strong>Accept Terms & Conditions<\/strong><p><i class=\"fas fa-check-circle\"><\/i> Tick to accept.<\/p><\/div><\/div>\n <div class=\"step-card highlight-step\"><span class=\"step-number\">10<\/span><div class=\"step-content\"><strong>Click Signup<\/strong><p>Your wallet will be created instantly.<\/p><\/div><\/div>\n <\/div>\n <div class=\"note-box\">\n <i class=\"fas fa-lightbulb\"><\/i>\n <div>\n <p><strong>Important:<\/strong> Use only <strong>6 numeric digits<\/strong> for PIN. Phone number example: <strong>2567XXXXXXXX<\/strong> (omit \u2018+\u2019). Sponsor code: ask a verified CashChat user if needed.<\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n <\/template>\n\n \n <template id=\"tmpl-activate\">\n <section class=\"page-content active\">\n <div class=\"container\">\n <span class=\"section-tag\"><i class=\"fas fa-rocket\"><\/i> Get Started<\/span>\n <h2 class=\"section-title\">Activate <span class=\"gradient\">& Pay Subscription<\/span><\/h2>\n <p class=\"section-desc\">\n After registering, follow these 7 steps to activate your account and start earning on CashChat <a href=\"https:\/\/ai.cashchatapp.com\" target=\"_blank\" class=\"flicks-link\">Flicks<\/a>.\n <\/p>\n <div class=\"step-grid\">\n <div class=\"step-card\"><span class=\"step-number\">1<\/span><div class=\"step-content\"><strong>Login to wallet<\/strong><p>Use your email + 6\u2011digit PIN.<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">2<\/span><div class=\"step-content\"><strong>Click \u201cPay Subscription\u201d<\/strong><p>To pay using wallet credit \u2192 click the <strong style=\"color: #3b82f6;\">Blue wallet<\/strong> icon.<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">3<\/span><div class=\"step-content\"><strong>Type \u201cStart\u201d<\/strong><p>Type it and press Send.<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">4<\/span><div class=\"step-content\"><strong>Type \u201c1\u201d<\/strong><p>Select \u201cMy wallet\u201d and Send.<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">5<\/span><div class=\"step-content\"><strong>Type \u201c2\u201d<\/strong><p>Select \u201cPay Subscription\u201d and Send.<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">6<\/span><div class=\"step-content\"><strong>Choose currency<\/strong><p>Type <strong>1<\/strong> for UGX \/ <strong>2<\/strong> for KES \/ <strong>3<\/strong> for USD \u2192 Send.<\/p><\/div><\/div>\n <div class=\"step-card highlight-step\"><span class=\"step-number\">7<\/span><div class=\"step-content\"><strong>Payment method<\/strong><p>Type <strong>1<\/strong> (Use Mobile: MTN or Mpesa) <strong>OR<\/strong> <strong>2<\/strong> (Use Wallet credit) \u2192 Send.<\/p><\/div><\/div>\n <\/div>\n <div class=\"note-box\">\n <i class=\"fas fa-check-circle\"><\/i>\n <div>\n <p><strong>Activation tip:<\/strong> After step 7 your subscription will be active. For wallet credit payments, ensure sufficient balance. The <strong style=\"color: #3b82f6;\">\u201cBlue wallet\u201d<\/strong> refers to the blue\u2011coloured wallet credit button inside the dashboard.<\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n <\/template>\n\n \n <template id=\"tmpl-revenue\">\n <section class=\"page-content active\">\n <div class=\"container\">\n <span class=\"section-tag\"><i class=\"fas fa-coins\"><\/i> Institutional<\/span>\n <h2 class=\"section-title\">Company <span class=\"gradient\">Revenue Streams<\/span><\/h2>\n <p class=\"section-desc\">\n CashChat generates sustainable, diversified income through platform fees, commissions,\n and premium services \u2014 ensuring long\u2011term operational health.\n <\/p>\n <div class=\"table-wrap\">\n <table>\n <thead>\n <tr><th>Revenue Stream<\/th><th>Description<\/th><th>Fee \/ Rate<\/th><\/tr>\n <\/thead>\n <tbody>\n <tr><td><strong>Wallet Transfers<\/strong><\/td><td>Charged per peer-to-peer wallet transfer<\/td><td><span style=\"color:var(--accent-green);\">UGX 500<\/span> (fixed)<\/td><\/tr>\n <tr><td><strong>Advertising Commissions<\/strong><\/td><td>Retained from digital ad campaigns<\/td><td><span style=\"color:var(--accent-green);\">20%<\/span><\/td><\/tr>\n <tr><td><strong>Video Gift Commissions<\/strong><\/td><td>Retained from total virtual gift volume<\/td><td><span style=\"color:var(--accent-green);\">20%<\/span><\/td><\/tr>\n <tr><td><strong>AI Pro Services<\/strong><\/td><td>Premium AI tool subscriptions and credit sales<\/td><td><span style=\"color:var(--accent-green);\">Variable<\/span><\/td><\/tr>\n <tr><td><strong>Share Trading Fee<\/strong><\/td><td>Fee applied when users sell convertible notes<\/td><td><span style=\"color:var(--accent-green);\">3.5%<\/span><\/td><\/tr>\n <\/tbody>\n <\/table>\n <\/div>\n <\/div>\n <\/section>\n <\/template>\n\n \n <template id=\"tmpl-business\">\n <section class=\"page-content active\" style=\"background: rgba(255, 255, 255, 0.008);\">\n <div class=\"container\">\n <span class=\"section-tag\"><i class=\"fas fa-building\"><\/i> Business Overview<\/span>\n <h2 class=\"section-title\">CashChat <span class=\"gradient\">& CashChat Flicks<\/span><\/h2>\n <p class=\"section-desc-full\">\n A pioneering social-financial super-app that converges digital messaging, financial services,\n content monetization, artificial intelligence, and community-based equity ownership into a single,\n integrated platform.\n <\/p>\n\n \n <div style=\"margin-bottom: 50px;\">\n <h3 style=\"font-size: 1.5rem; font-weight: 800; margin-bottom: 14px; color: #fff;\">Executive Summary<\/h3>\n <div class=\"executive-card\">\n <p>CashChat is a pioneering <strong style=\"color: var(--accent-green);\">social-financial super-app<\/strong> that converges digital messaging, financial services, content monetization, artificial intelligence, and community-based equity ownership into a single, integrated platform. Designed primarily for <strong style=\"color: #fff;\">emerging markets<\/strong>, CashChat empowers users to communicate, transact, earn, and invest\u2014all within a self-sustaining digital economy.<\/p>\n <p style=\"margin-top: 14px;\">A key division of the ecosystem, <strong style=\"color: var(--accent-green);\">CashChat Flicks<\/strong>, serves as the platform’s video-sharing and content monetization arm, enabling creators to earn revenue through fan-supported virtual gifting and advertising partnerships.<\/p>\n <\/div>\n <\/div>\n\n \n <h3 style=\"font-size: 1.5rem; font-weight: 800; margin-bottom: 28px; color: #fff;\">Core <span class=\"gradient\">Products & Services<\/span><\/h3>\n\n <div class=\"feature-card\" style=\"margin-bottom: 24px;\">\n <div class=\"icon-wrap\"><i class=\"fas fa-wallet\"><\/i><\/div>\n <h4>1. Digital Wallet & Financial Services<\/h4>\n <p>At the heart of the ecosystem is a self-custody digital wallet, which functions as each user’s personal financial command center. It enables:<\/p>\n <ul>\n <li><i class=\"fas fa-check-circle\"><\/i> Peer-to-peer money transfers<\/li>\n <li><i class=\"fas fa-check-circle\"><\/i> Bill payments and subscription management<\/li>\n <li><i class=\"fas fa-check-circle\"><\/i> Secure storage of digital assets<\/li>\n <li><i class=\"fas fa-check-circle\"><\/i> Seamless integration with all ecosystem services<\/li>\n <\/ul>\n <\/div>\n\n <div class=\"feature-card\" style=\"margin-bottom: 24px;\">\n <div class=\"icon-wrap\"><i class=\"fas fa-film\"><\/i><\/div>\n <h4>2. CashChat Flicks <span style=\"font-size:0.75rem; color:var(--accent-green); font-weight:600;\">(Video Content Platform)<\/span><\/h4>\n <p>CashChat Flicks is a video-sharing and monetization platform where creators can:<\/p>\n <ul>\n <li><i class=\"fas fa-check-circle\"><\/i> Upload and share video content with the community<\/li>\n <li><i class=\"fas fa-check-circle\"><\/i> Receive virtual gifts from fans, ranging in value from <strong style=\"color: #fff;\">$1 to $300<\/strong><\/li>\n <li><i class=\"fas fa-check-circle\"><\/i> Convert all received gifts into real currency deposited directly into their CashChat wallet<\/li>\n <li><i class=\"fas fa-check-circle\"><\/i> Earn additional revenue through the platform’s CPM-based advertising network<\/li>\n <\/ul>\n <\/div>\n\n <div class=\"feature-card\" style=\"margin-bottom: 24px;\">\n <div class=\"icon-wrap\"><i class=\"fas fa-robot\"><\/i><\/div>\n <h4>3. Artificial Intelligence Services<\/h4>\n <p>CashChat offers a two-tier AI system designed to enhance user experience:<\/p>\n <div class=\"tier-table-wrap\" style=\"margin-top: 14px;\">\n <table class=\"tier-table\">\n <thead><tr><th>Tier<\/th><th>Feature<\/th><th>Cost<\/th><\/tr><\/thead>\n <tbody>\n <tr><td><span class=\"free-badge\"><i class=\"fas fa-star\"><\/i> Free<\/span><\/td><td>Text-based AI assistant (similar to ChatGPT) for general Q&A and conversation<\/td><td><strong style=\"color: var(--accent-green);\">Free<\/strong> for all members<\/td><\/tr>\n <tr><td><span class=\"pro-badge\"><i class=\"fas fa-crown\"><\/i> Pro<\/span><\/td><td>Voice-call AI with multilingual support, including multiple African and international languages<\/td><td><strong style=\"color: #fff;\">Credit-based<\/strong> (pay-per-use):<br>450 credits for <strong style=\"color: var(--accent-green);\">$9.99<\/strong> or<br>1,250 credits for <strong style=\"color: var(--accent-green);\">$24.99<\/strong><\/td><\/tr>\n <\/tbody>\n <\/table>\n <\/div>\n <\/div>\n\n <div class=\"feature-card\" style=\"margin-bottom: 24px;\">\n <div class=\"icon-wrap\"><i class=\"fas fa-hand-holding-usd\"><\/i><\/div>\n <h4>4. Community Crowdfunding & Equity Ownership<\/h4>\n <p>CashChat distinguishes itself through a unique community ownership model. The company has allocated <strong style=\"color: var(--accent-green);\">35% of its total equity<\/strong> exclusively to active members.<\/p>\n <ul style=\"margin-top: 10px;\">\n <li><i class=\"fas fa-check-circle\"><\/i> <strong>Entry Requirement:<\/strong> A one-time <strong style=\"color: #fff;\">$20 lifetime membership fee<\/strong> grants eligibility to participate.<\/li>\n <li><i class=\"fas fa-check-circle\"><\/i> <strong>Share Purchase:<\/strong> Shares cannot be bought with cash. Members must earn referral rewards by bringing new users into the ecosystem.<\/li>\n <\/ul>\n <div class=\"share-grid\">\n <div class=\"share-card\"><h5>Class B Shares<\/h5><p><strong style=\"color: #fff;\">$50<\/strong> per share <span style=\"color:var(--text-muted);\">(10% equity pool)<\/span><\/p><\/div>\n <div class=\"share-card\"><h5>Class C Shares<\/h5><p><strong style=\"color: #fff;\">$30<\/strong> per share <span style=\"color:var(--text-muted);\">(25% equity pool)<\/span><\/p><\/div>\n <\/div>\n <p style=\"margin-top: 10px; color: var(--text-secondary);\"><strong style=\"color: #fff;\">Benefits:<\/strong> Shareholders receive dividends derived from platform revenue, including transaction fees, advertising income, and AI product sales.<\/p>\n <\/div>\n\n <div class=\"feature-card\" style=\"margin-bottom: 24px;\">\n <div class=\"icon-wrap\"><i class=\"fas fa-ad\"><\/i><\/div>\n <h4>5. Advertising Network<\/h4>\n <p>CashChat operates a robust <strong style=\"color: #fff;\">Cost-Per-Mille (CPM)<\/strong> advertising network, supported by a network of over <strong style=\"color: var(--accent-green);\">200,000 ad agents<\/strong>. This provides additional revenue streams for both the platform and its active users.<\/p>\n <\/div>\n\n \n <div style=\"margin: 50px 0 40px;\">\n <h3 style=\"font-size: 1.5rem; font-weight: 800; margin-bottom: 14px; color: #fff;\">\n Payment & Subscription <span class=\"gradient\">Infrastructure<\/span>\n <\/h3>\n <p style=\"color:var(--text-secondary); font-size:0.95rem; margin-bottom: 24px;\">\n CashChatApp supports a hybrid payment model designed to serve both international and regional users.\n <\/p>\n\n \n <div style=\"background:var(--bg-card); border-radius:var(--radius-card); padding: 28px 24px; border:1px solid rgba(255,255,255,0.03); margin-bottom: 24px; transition: var(--transition);\">\n <div style=\"display:flex; align-items:center; gap:12px; margin-bottom:12px; flex-wrap:wrap;\">\n <div style=\"display:flex; align-items:center; gap:10px;\">\n <i class=\"fab fa-stripe\" style=\"font-size:2rem; color:#818cf8;\"><\/i>\n <h4 style=\"font-size:1.2rem; font-weight:700;\">Stripe Integration<\/h4>\n <\/div>\n <span class=\"payment-badge stripe\"><i class=\"fas fa-globe\"><\/i> International<\/span>\n <\/div>\n\n <p style=\"color:var(--text-secondary); font-size:0.92rem; margin-bottom:12px;\">\n CashChatApp utilizes <strong style=\"color:#818cf8;\">Stripe<\/strong> as its primary payment gateway for international transactions. Stripe is used exclusively for:\n <\/p>\n\n <ul style=\"list-style:none; padding:0; margin:0 0 16px 0;\">\n <li style=\"padding:4px 0; display:flex; gap:10px; align-items:flex-start; color:var(--text-secondary); font-size:0.88rem;\">\n <i class=\"fas fa-check-circle\" style=\"color:#818cf8; font-size:0.7rem; margin-top:5px; flex-shrink:0;\"><\/i>\n <span><strong style=\"color:#fff;\">Non-recurring subscription payments<\/strong> \u2013 App users in countries supported by Stripe can pay their one-time subscription fees securely.<\/span>\n <\/li>\n <li style=\"padding:4px 0; display:flex; gap:10px; align-items:flex-start; color:var(--text-secondary); font-size:0.88rem;\">\n <i class=\"fas fa-check-circle\" style=\"color:#818cf8; font-size:0.7rem; margin-top:5px; flex-shrink:0;\"><\/i>\n <span><strong style=\"color:#fff;\">AI Credits purchases<\/strong> \u2013 Users can purchase credits for the AI Pro version directly through Stripe.<\/span>\n <\/li>\n <\/ul>\n\n <div style=\"background:rgba(99,102,241,0.06); border-radius:12px; padding:12px 16px; border-left:3px solid #818cf8;\">\n <p style=\"color:var(--text-secondary); font-size:0.82rem; margin:0;\">\n <i class=\"fas fa-info-circle\" style=\"color:#818cf8; margin-right:8px;\"><\/i>\n <strong style=\"color:#fff;\">Important:<\/strong> Stripe is only available for users located in countries that Stripe actively supports. Users in unsupported regions will not see Stripe as a payment option.\n <\/p>\n <\/div>\n <\/div>\n\n \n <div style=\"background:var(--bg-card); border-radius:var(--radius-card); padding: 28px 24px; border:1px solid rgba(255,255,255,0.03); margin-bottom: 24px; transition: var(--transition);\">\n <div style=\"display:flex; align-items:center; gap:12px; margin-bottom:12px; flex-wrap:wrap;\">\n <div style=\"display:flex; align-items:center; gap:10px;\">\n <i class=\"fas fa-mobile-alt\" style=\"font-size:2rem; color:#fbbf24;\"><\/i>\n <h4 style=\"font-size:1.2rem; font-weight:700;\">Regional Mobile Wallet Support<\/h4>\n <\/div>\n <span class=\"payment-badge mtn\"><i class=\"fas fa-map-marker-alt\"><\/i> Uganda \u00b7 Kenya \u00b7 Rwanda<\/span>\n <\/div>\n\n <p style=\"color:var(--text-secondary); font-size:0.92rem; margin-bottom:12px;\">\n For users in <strong style=\"color:#fff;\">Uganda, Kenya, and Rwanda<\/strong>, CashChatApp offers localized payment solutions through leading mobile money providers:\n <\/p>\n\n <div style=\"display:grid; grid-template-columns:1fr; gap:10px; margin-bottom:14px;\">\n <div style=\"display:flex; align-items:center; gap:12px; background:rgba(255,255,255,0.02); padding:10px 14px; border-radius:10px; border:1px solid rgba(255,255,255,0.03);\">\n <span class=\"payment-badge airtel\"><i class=\"fas fa-phone\"><\/i> Airtel Money<\/span>\n <span style=\"color:var(--text-muted); font-size:0.8rem;\">Uganda \u00b7 Kenya \u00b7 Rwanda<\/span>\n <\/div>\n <div style=\"display:flex; align-items:center; gap:12px; background:rgba(255,255,255,0.02); padding:10px 14px; border-radius:10px; border:1px solid rgba(255,255,255,0.03);\">\n <span class=\"payment-badge mtn\"><i class=\"fas fa-phone\"><\/i> MTN Mobile Money<\/span>\n <span style=\"color:var(--text-muted); font-size:0.8rem;\">Uganda \u00b7 Kenya \u00b7 Rwanda<\/span>\n <\/div>\n <div style=\"display:flex; align-items:center; gap:12px; background:rgba(255,255,255,0.02); padding:10px 14px; border-radius:10px; border:1px solid rgba(255,255,255,0.03);\">\n <span class=\"payment-badge mpesa\"><i class=\"fas fa-phone\"><\/i> M-Pesa<\/span>\n <span style=\"color:var(--text-muted); font-size:0.8rem;\">Kenya \u00b7 Rwanda<\/span>\n <\/div>\n <\/div>\n\n <div style=\"background:rgba(251,191,36,0.06); border-radius:12px; padding:12px 16px; border-left:3px solid #fbbf24;\">\n <p style=\"color:var(--text-secondary); font-size:0.82rem; margin:0;\">\n <i class=\"fas fa-info-circle\" style=\"color:#fbbf24; margin-right:8px;\"><\/i>\n <strong style=\"color:#fff;\">Note:<\/strong> Other features are limited to <strong style=\"color:#fff;\">in-app rewards<\/strong> and the mobile wallet options listed above.\n <\/p>\n <\/div>\n <\/div>\n\n \n <div style=\"background:var(--bg-card); border-radius:var(--radius-card); padding: 24px 24px; border:1px solid rgba(255,255,255,0.03); transition: var(--transition);\">\n <div style=\"display:flex; align-items:center; gap:12px; margin-bottom:10px;\">\n <i class=\"fas fa-gem\" style=\"font-size:1.8rem; color:var(--accent-green);\"><\/i>\n <h4 style=\"font-size:1.1rem; font-weight:700;\">In-App Rewards<\/h4>\n <span class=\"payment-badge\" style=\"border-color:rgba(204,255,0,0.15); color:var(--accent-green);\"><i class=\"fas fa-star\"><\/i> Earn & Redeem<\/span>\n <\/div>\n <p style=\"color:var(--text-secondary); font-size:0.9rem;\">\n CashChatApp provides a robust in-app reward system where users can earn credits through platform engagement, content creation, and community participation. These rewards can be used for:\n <\/p>\n <ul style=\"list-style:none; padding:0; margin-top:8px;\">\n <li style=\"padding:3px 0; display:flex; gap:10px; align-items:flex-start; color:var(--text-secondary); font-size:0.85rem;\">\n <i class=\"fas fa-check-circle\" style=\"color:var(--accent-green); font-size:0.65rem; margin-top:5px; flex-shrink:0;\"><\/i>\n <span>Subscription fee payments<\/span>\n <\/li>\n <li style=\"padding:3px 0; display:flex; gap:10px; align-items:flex-start; color:var(--text-secondary); font-size:0.85rem;\">\n <i class=\"fas fa-check-circle\" style=\"color:var(--accent-green); font-size:0.65rem; margin-top:5px; flex-shrink:0;\"><\/i>\n <span>AI Credits purchases<\/span>\n <\/li>\n <li style=\"padding:3px 0; display:flex; gap:10px; align-items:flex-start; color:var(--text-secondary); font-size:0.85rem;\">\n <i class=\"fas fa-check-circle\" style=\"color:var(--accent-green); font-size:0.65rem; margin-top:5px; flex-shrink:0;\"><\/i>\n <span>Other in-app services<\/span>\n <\/li>\n <\/ul>\n <\/div>\n\n \n <div style=\"margin-top: 28px;\">\n <div class=\"table-wrap\">\n <table>\n <thead>\n <tr>\n <th>Payment Method<\/th>\n <th>Region<\/th>\n <th>Use Case<\/th>\n <\/tr>\n <\/thead>\n <tbody>\n <tr>\n <td><strong style=\"color:#818cf8;\">Stripe<\/strong><\/td>\n <td>Stripe-supported countries<\/td>\n <td>Non-recurring subscriptions & AI Credits<\/td>\n <\/tr>\n <tr>\n <td><strong style=\"color:#fbbf24;\">Airtel Money<\/strong><\/td>\n <td>Uganda, Kenya, Rwanda<\/td>\n <td>Subscriptions & in-app purchases<\/td>\n <\/tr>\n <tr>\n <td><strong style=\"color:#fbbf24;\">MTN Mobile Money<\/strong><\/td>\n <td>Uganda, Kenya, Rwanda<\/td>\n <td>Subscriptions & in-app purchases<\/td>\n <\/tr>\n <tr>\n <td><strong style=\"color:#34d399;\">M-Pesa<\/strong><\/td>\n <td>Kenya, Rwanda<\/td>\n <td>Subscriptions & in-app purchases<\/td>\n <\/tr>\n <tr>\n <td><strong style=\"color:var(--accent-green);\">In-App Rewards<\/strong><\/td>\n <td>Global<\/td>\n <td>Earned credits for subscriptions & AI Credits<\/td>\n <\/tr>\n <\/tbody>\n <\/table>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div style=\"margin: 40px 0 32px;\">\n <h3 style=\"font-size: 1.5rem; font-weight: 800; margin-bottom: 14px; color: #fff;\">Target <span class=\"gradient\">Market<\/span><\/h3>\n <div class=\"grid-3col\">\n <div class=\"card\" style=\"padding: 22px 20px;\"><div style=\"font-size: 2rem; margin-bottom: 10px;\">\ud83c\udf0d<\/div><h4 style=\"font-size:1rem;\">Emerging Markets<\/h4><p style=\"color:var(--text-secondary); font-size:0.88rem;\">Users seeking accessible financial tools and earning opportunities<\/p><\/div>\n <div class=\"card\" style=\"padding: 22px 20px;\"><div style=\"font-size: 2rem; margin-bottom: 10px;\">\ud83c\udfac<\/div><h4 style=\"font-size:1rem;\">Content Creators<\/h4><p style=\"color:var(--text-secondary); font-size:0.88rem;\">Looking for direct fan monetization without intermediaries<\/p><\/div>\n <div class=\"card\" style=\"padding: 22px 20px;\"><div style=\"font-size: 2rem; margin-bottom: 10px;\">\ud83d\udcf1<\/div><h4 style=\"font-size:1rem;\">Everyday Consumers<\/h4><p style=\"color:var(--text-secondary); font-size:0.88rem;\">Who want an all-in-one communication and financial platform<\/p><\/div>\n <div class=\"card\" style=\"padding: 22px 20px;\"><div style=\"font-size: 2rem; margin-bottom: 10px;\">\ud83d\udcc8<\/div><h4 style=\"font-size:1rem;\">Investors<\/h4><p style=\"color:var(--text-secondary); font-size:0.88rem;\">Interested in community-owned digital assets<\/p><\/div>\n <\/div>\n <\/div>\n\n \n <div style=\"margin: 40px 0 32px;\">\n <h3 style=\"font-size: 1.5rem; font-weight: 800; margin-bottom: 14px; color: #fff;\">Revenue <span class=\"gradient\">Model<\/span><\/h3>\n <p style=\"color:var(--text-secondary); margin-bottom: 16px; font-size:0.95rem;\">CashChat generates sustainable revenue through multiple, diversified streams:<\/p>\n <div class=\"table-wrap\">\n <table>\n <thead><tr><th>Revenue Stream<\/th><th>Description<\/th><\/tr><\/thead>\n <tbody>\n <tr><td><strong>Membership Fees<\/strong><\/td><td>One-time <strong style=\"color:#fff;\">$20<\/strong> lifetime activation fee<\/td><\/tr>\n <tr><td><strong>Monthly Subscriptions<\/strong><\/td><td>Premium tier at <strong style=\"color:#fff;\">$9.99\/month<\/strong> for enhanced features<\/td><\/tr>\n <tr><td><strong>Credit Sales<\/strong><\/td><td>AI voice call credits and in-app wallet coins<\/td><\/tr>\n <tr><td><strong>Transaction Fees<\/strong><\/td><td>Small percentage from wallet transfers and gift transactions<\/td><\/tr>\n <tr><td><strong>Advertising Revenue<\/strong><\/td><td>CPM-based ad network sales<\/td><\/tr>\n <tr><td><strong>Commission on Gifts<\/strong><\/td><td>Platform fee on video gifts sent within CashChat Flicks<\/td><\/tr>\n <\/tbody>\n <\/table>\n <\/div>\n <\/div>\n\n \n <div style=\"margin: 40px 0 32px;\">\n <h3 style=\"font-size: 1.5rem; font-weight: 800; margin-bottom: 14px; color: #fff;\">Competitive <span class=\"gradient\">Advantage<\/span><\/h3>\n <div class=\"grid-2col\">\n <div class=\"card\"><div style=\"font-size: 2rem; margin-bottom: 10px;\">\ud83e\udde9<\/div><h4>All-in-One Platform<\/h4><p style=\"color:var(--text-secondary);\">Combines messaging, payments, content, AI, and investment\u2014reducing the need for multiple apps.<\/p><\/div>\n <div class=\"card\"><div style=\"font-size: 2rem; margin-bottom: 10px;\">\ud83e\udd1d<\/div><h4>Community Ownership<\/h4><p style=\"color:var(--text-secondary);\">Members are also potential shareholders, creating strong loyalty and active participation.<\/p><\/div>\n <div class=\"card\"><div style=\"font-size: 2rem; margin-bottom: 10px;\">\ud83c\udf0d<\/div><h4>Emerging Market Focus<\/h4><p style=\"color:var(--text-secondary);\">Multilingual AI and mobile-first design cater specifically to users in Africa and similar markets.<\/p><\/div>\n <div class=\"card\"><div style=\"font-size: 2rem; margin-bottom: 10px;\">\ud83c\udfaf<\/div><h4>Creator Empowerment<\/h4><p style=\"color:var(--text-secondary);\">CashChat Flicks offers direct monetization through gifting, bypassing traditional advertising dependency.<\/p><\/div>\n <div class=\"card\" style=\"grid-column: 1 \/ -1;\"><div style=\"font-size: 2rem; margin-bottom: 10px;\">\ud83d\udce3<\/div><h4>Referral-Driven Growth<\/h4><p style=\"color:var(--text-secondary);\">The reward system incentivizes organic, community-led expansion.<\/p><\/div>\n <\/div>\n <\/div>\n\n \n <div style=\"margin-top: 32px;\">\n <div class=\"executive-card\" style=\"border-left: 4px solid var(--accent-green);\">\n <h3 style=\"font-size: 1.5rem; font-weight: 800; margin-bottom: 10px; color: #fff;\"><i class=\"fas fa-flag-checkered\" style=\"color:var(--accent-green); margin-right:12px;\"><\/i>Conclusion<\/h3>\n <p>CashChat and CashChat Flicks represent a <strong style=\"color: var(--accent-green);\">bold vision<\/strong> for the future of digital communities: a member-owned, financially integrated ecosystem where communication, content creation, and wealth-building coexist seamlessly. By combining essential digital services with equity participation and AI-powered innovation, CashChat is building <strong style=\"color: #fff;\">not just an app, but a sustainable digital economy<\/strong> for its global community.<\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n <\/template>\n\n \n <template id=\"tmpl-integrity\">\n <section class=\"page-content active\">\n <div class=\"container\">\n <span class=\"section-tag\"><i class=\"fas fa-medal\"><\/i> Trust<\/span>\n <h2 class=\"section-title\">Operational Integrity <span class=\"gradient\">& Track Record<\/span><\/h2>\n <p class=\"section-desc\">\n Since launching as Pesamoni in 2016 and evolving into CashChat in 2018, the ecosystem has\n maintained an unblemished record \u2014 no fraud or scam complaints.\n <\/p>\n <div style=\"background:var(--bg-card); backdrop-filter:blur(8px); border-radius:var(--radius-card); padding: 20px 22px; border:1px solid rgba(255,255,255,0.03);\">\n <div class=\"timeline-item\"><div class=\"timeline-year\">2016<\/div><div class=\"timeline-content\"><strong>Pesamoni launched<\/strong><p>Foundation of the financial\u2011social hybrid model.<\/p><\/div><\/div>\n <div class=\"timeline-item\"><div class=\"timeline-year\">2018<\/div><div class=\"timeline-content\"><strong>CashChat social media born<\/strong><p>Transitioned to a full\u2011featured social ecosystem with integrated wallet.<\/p><\/div><\/div>\n <div class=\"timeline-item\"><div class=\"timeline-year\">2020 \u2013 Present<\/div><div class=\"timeline-content\"><strong>Zero fraud complaints<\/strong><p>No verified scam reports, fraud cases, or regulatory violations associated with CashChat.<\/p><div style=\"margin-top:10px; display:inline-flex; gap:8px; flex-wrap:wrap;\"><span style=\"background:rgba(204,255,0,0.06); color:var(--accent-green); padding:4px 14px; border-radius:100px; font-size:0.7rem; font-weight:600; border:1px solid rgba(204,255,0,0.08);\"><i class=\"fas fa-check-circle\"><\/i> Fully compliant<\/span><span style=\"background:rgba(250,204,21,0.06); color:#facc15; padding:4px 14px; border-radius:100px; font-size:0.7rem; font-weight:600; border:1px solid rgba(250,204,21,0.08);\"><i class=\"fas fa-building-columns\"><\/i> URSB registered<\/span><\/div><\/div><\/div>\n <\/div>\n <\/div>\n <\/section>\n <\/template>\n\n \n <footer>\n <div class=\"container\">\n <div class=\"footer-grid\">\n <div class=\"footer-brand\">\n <div class=\"logo-small\">\n <i class=\"fas fa-film\"><\/i>\n <span style=\"font-weight:800;\">CashChat<span style=\"color:var(--accent-green);\">Flicks<\/span><\/span>\n <\/div>\n <p>The social-financial super-app that converges messaging, payments, content monetization, AI, and community equity into one integrated platform.<\/p>\n <\/div>\n <div class=\"footer-company\">\n <h4><i class=\"fas fa-building\" style=\"color:var(--accent-green); margin-right:8px;\"><\/i>Company<\/h4>\n <p><span class=\"company-name\">CASHCHAT LTD<\/span><\/p>\n <p>Dundas Way, Gateshead, Newcastle<\/p>\n <p>United Kingdom<\/p>\n <p style=\"margin-top:6px;\">Company Number: <span class=\"company-number\">17364747<\/span><\/p>\n <p style=\"font-size:0.75rem; color:var(--text-muted); margin-top:4px;\">Incorporated in England & Wales<\/p>\n <\/div>\n <div class=\"footer-links\">\n <h4><i class=\"fas fa-link\" style=\"color:var(--accent-green); margin-right:8px;\"><\/i>Quick Links<\/h4>\n <div class=\"link-group\">\n <a href=\"https:\/\/ai.cashchatapp.com\/privacy\" target=\"_blank\"><i class=\"fas fa-shield-alt\"><\/i> Privacy Policy<\/a>\n <a href=\"https:\/\/ai.cashchatapp.com\/terms\" target=\"_blank\"><i class=\"fas fa-file-contract\"><\/i> Terms of Service<\/a>\n <a href=\"#integrity\" data-page=\"integrity\"><i class=\"fas fa-history\"><\/i> Integrity & Track Record<\/a>\n <\/div>\n <div style=\"margin-top:14px;\">\n <h4 style=\"font-size:0.85rem; font-weight:600; color:var(--text-secondary); margin-bottom:6px;\"><i class=\"fas fa-headset\" style=\"color:#25D366; margin-right:8px;\"><\/i>Support<\/h4>\n <div class=\"footer-support\">\n <a href=\"https:\/\/wa.me\/46769112941\" target=\"_blank\" class=\"btn btn-support\"><i class=\"fab fa-whatsapp\"><\/i> +46 769 112 941<\/a>\n <a href=\"https:\/\/wa.me\/46734832708\" target=\"_blank\" class=\"btn btn-support\"><i class=\"fab fa-whatsapp\"><\/i> +46 734 832 708<\/a>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"footer-bottom\">\n <p><i class=\"fas fa-film\" style=\"margin-right:6px;\"><\/i> © 2026 CashChat Ecosystem. All rights reserved.<\/p>\n <div class=\"footer-legal-links\">\n <a href=\"https:\/\/ai.cashchatapp.com\/privacy\" target=\"_blank\">Privacy<\/a>\n <a href=\"https:\/\/ai.cashchatapp.com\/terms\" target=\"_blank\">Terms<\/a>\n <a href=\"#integrity\" data-page=\"integrity\">Integrity<\/a>\n <a href=\"https:\/\/ai.cashchatapp.com\" target=\"_blank\" class=\"flicks-link\">CashChat Flicks<\/a>\n <\/div>\n <\/div>\n <\/div>\n <\/footer>\n\n \n <script>\n \/\/ ---- Hamburger ----\n const menuToggle = document.getElementById('menuToggle');\n const navLinks = document.getElementById('navLinks');\n\n menuToggle.addEventListener('click', () => {\n navLinks.classList.toggle('open');\n const icon = menuToggle.querySelector('i');\n icon.className = navLinks.classList.contains('open') ? 'fas fa-times' : 'fas fa-bars';\n });\n\n document.querySelectorAll('.nav-links a').forEach(link => {\n link.addEventListener('click', () => {\n navLinks.classList.remove('open');\n const icon = menuToggle.querySelector('i');\n if (icon) icon.className = 'fas fa-bars';\n });\n });\n\n \/\/ ---- Router ----\n const app = document.getElementById('app');\n\n function navigateTo(page) {\n if (window.location.hash !== '#' + page) {\n history.pushState(null, '', '#' + page);\n }\n\n document.querySelectorAll('.nav-links a[data-page]').forEach(link => {\n link.classList.toggle('active', link.dataset.page === page);\n });\n\n document.querySelectorAll('.bottom-nav a[data-page]').forEach(link => {\n link.classList.toggle('active', link.dataset.page === page);\n });\n\n let targetPage = app.querySelector(`.page-content[data-page=\"${page}\"]`);\n if (targetPage) {\n app.querySelectorAll('.page-content').forEach(p => p.classList.remove('active'));\n targetPage.classList.add('active');\n triggerAnimations(targetPage);\n return;\n }\n\n const template = document.getElementById(`tmpl-${page}`);\n if (!template) {\n console.warn(`Page \"${page}\" not found.`);\n return;\n }\n\n const clone = template.content.cloneNode(true);\n const section = clone.querySelector('section');\n if (!section) return;\n\n section.dataset.page = page;\n section.classList.add('page-content');\n app.appendChild(section);\n\n app.querySelectorAll('.page-content').forEach(p => p.classList.remove('active'));\n section.classList.add('active');\n\n triggerAnimations(section);\n }\n\n function triggerAnimations(container) {\n const targets = container.querySelectorAll('.card, .step-card, .feature-card, .executive-card, .share-card, .mockup-card');\n targets.forEach((el, index) => {\n el.style.opacity = '0';\n el.style.transform = 'translateY(24px)';\n setTimeout(() => {\n el.style.opacity = '1';\n el.style.transform = 'translateY(0)';\n }, 80 + index * 40);\n });\n }\n\n function handleRoute() {\n const hash = window.location.hash.slice(1) || 'home';\n navigateTo(hash);\n }\n\n window.addEventListener('hashchange', handleRoute);\n\n document.querySelectorAll('a[data-page]').forEach(link => {\n link.addEventListener('click', (e) => {\n e.preventDefault();\n const page = link.dataset.page;\n if (page) {\n window.location.hash = page;\n }\n });\n });\n\n window.addEventListener('scroll', () => {\n const navbar = document.getElementById('navbar');\n navbar.style.boxShadow = window.scrollY > 10 ? '0 4px 30px rgba(0,0,0,0.5)' : 'none';\n });\n\n document.addEventListener('DOMContentLoaded', () => {\n if (!window.location.hash) {\n window.location.hash = 'home';\n } else {\n handleRoute();\n }\n });\n\n window.addEventListener('popstate', handleRoute);\n\n document.addEventListener('click', (e) => {\n if (navLinks.classList.contains('open')) {\n const isClickInside = navLinks.contains(e.target) || menuToggle.contains(e.target);\n if (!isClickInside) {\n navLinks.classList.remove('open');\n const icon = menuToggle.querySelector('i');\n if (icon) icon.className = 'fas fa-bars';\n }\n }\n });\n <\/script>\n\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>CashChat Flicks \u00b7 Multi-Page SPA CashChat Flicks Home Ad Model Gifts Register Activate Revenue Business Install Home Ad Model Gifts Register Activate Business Revenue Zero fraud complaints since 2016 The future of creator monetization CashChat Flicks combines digital advertising, virtual gifting, and a proprietary convertible\u2011note economy to build a self\u2011sustaining ecosystem. Create Wallet Login Install […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"pagelayer_contact_templates":[],"_pagelayer_content":"","footnotes":""},"class_list":["post-299","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/cashchat.se\/dir\/wp-json\/wp\/v2\/pages\/299","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cashchat.se\/dir\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/cashchat.se\/dir\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/cashchat.se\/dir\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/cashchat.se\/dir\/wp-json\/wp\/v2\/comments?post=299"}],"version-history":[{"count":8,"href":"https:\/\/cashchat.se\/dir\/wp-json\/wp\/v2\/pages\/299\/revisions"}],"predecessor-version":[{"id":335,"href":"https:\/\/cashchat.se\/dir\/wp-json\/wp\/v2\/pages\/299\/revisions\/335"}],"wp:attachment":[{"href":"https:\/\/cashchat.se\/dir\/wp-json\/wp\/v2\/media?parent=299"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":299,"date":"2026-07-18T00:45:15","date_gmt":"2026-07-18T00:45:15","guid":{"rendered":"https:\/\/cashchat.se\/dir\/?page_id=299"},"modified":"2026-07-28T13:23:45","modified_gmt":"2026-07-28T13:23:45","slug":"flicks","status":"publish","type":"page","link":"https:\/\/cashchat.se\/dir\/","title":{"rendered":"Flicks"},"content":{"rendered":"\n\n\n\n \n \n CashChat Flicks \u00b7 Multi-Page SPA<\/title>\n \n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.0.0-beta3\/css\/all.min.css\">\n \n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:opsz,wght@14..32,400;14..32,500;14..32,600;14..32,700;14..32,800;14..32,900&display=swap\" rel=\"stylesheet\">\n <style>\n \/* ============================================================\n 1. RESET & VARIABLES\n ============================================================ *\/\n *,\n *::before,\n *::after {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n :root {\n --bg-primary: #05050A;\n --bg-secondary: #0D0D1A;\n --bg-card: rgba(255, 255, 255, 0.03);\n --bg-card-hover: rgba(255, 255, 255, 0.07);\n --text-primary: #FFFFFF;\n --text-secondary: #A0A0B8;\n --text-muted: #6A6A82;\n --accent-green: #ccff00;\n --accent-purple: #a855f7;\n --accent-pink: #ec4899;\n --glow-green: rgba(204, 255, 0, 0.25);\n --glow-purple: rgba(168, 85, 247, 0.25);\n --radius-card: 24px;\n --radius-btn: 60px;\n --nav-height: 68px;\n --bottom-nav-height: 68px;\n --transition: 0.35s cubic-bezier(0.22, 1, 0.36, 1);\n }\n\n html {\n scroll-behavior: smooth;\n -webkit-tap-highlight-color: transparent;\n }\n\n body {\n font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;\n background: var(--bg-primary);\n color: var(--text-primary);\n line-height: 1.6;\n -webkit-font-smoothing: antialiased;\n overflow-x: hidden;\n min-height: 100vh;\n padding-bottom: calc(var(--bottom-nav-height) + 16px);\n }\n\n @media (min-width: 1024px) {\n body {\n padding-bottom: 0;\n }\n }\n\n .container {\n width: 100%;\n max-width: 1280px;\n margin: 0 auto;\n padding: 0 20px;\n }\n\n @media (min-width: 640px) {\n .container {\n padding: 0 40px;\n }\n }\n @media (min-width: 1024px) {\n .container {\n padding: 0 60px;\n }\n }\n\n a {\n text-decoration: none;\n color: inherit;\n }\n\n \/* Custom Scrollbar *\/\n ::-webkit-scrollbar {\n width: 5px;\n }\n ::-webkit-scrollbar-track {\n background: var(--bg-primary);\n }\n ::-webkit-scrollbar-thumb {\n background: var(--accent-green);\n border-radius: 12px;\n box-shadow: 0 0 20px var(--glow-green);\n }\n\n \/* ============================================================\n 2. UTILITY & TYPOGRAPHY\n ============================================================ *\/\n .section-tag {\n display: inline-block;\n font-size: 0.7rem;\n font-weight: 700;\n letter-spacing: 0.12em;\n text-transform: uppercase;\n color: var(--accent-green);\n background: rgba(204, 255, 0, 0.08);\n padding: 6px 18px;\n border-radius: 100px;\n margin-bottom: 14px;\n border: 1px solid rgba(204, 255, 0, 0.1);\n }\n\n .section-title {\n font-size: clamp(2.2rem, 5vw, 3.8rem);\n font-weight: 900;\n line-height: 1.1;\n letter-spacing: -0.04em;\n margin-bottom: 14px;\n }\n\n .section-title .gradient {\n background: linear-gradient(135deg, var(--accent-green), var(--accent-purple), var(--accent-pink));\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n background-size: 300% 300%;\n animation: gradientShift 6s ease-in-out infinite;\n }\n\n @keyframes gradientShift {\n 0% {\n background-position: 0% 50%;\n }\n 50% {\n background-position: 100% 50%;\n }\n 100% {\n background-position: 0% 50%;\n }\n }\n\n .section-desc {\n font-size: clamp(1rem, 1.1vw, 1.2rem);\n color: var(--text-secondary);\n max-width: 600px;\n margin-bottom: 40px;\n }\n\n .section-desc-full {\n font-size: clamp(1rem, 1.1vw, 1.2rem);\n color: var(--text-secondary);\n max-width: 100%;\n margin-bottom: 40px;\n }\n\n .grid-2col {\n display: grid;\n grid-template-columns: 1fr;\n gap: 24px;\n }\n @media (min-width: 640px) {\n .grid-2col {\n grid-template-columns: repeat(2, 1fr);\n gap: 30px;\n }\n }\n\n .grid-3col {\n display: grid;\n grid-template-columns: 1fr;\n gap: 24px;\n }\n @media (min-width: 640px) {\n .grid-3col {\n grid-template-columns: repeat(2, 1fr);\n gap: 28px;\n }\n }\n @media (min-width: 1024px) {\n .grid-3col {\n grid-template-columns: repeat(3, 1fr);\n gap: 30px;\n }\n }\n\n .flicks-link {\n color: inherit;\n border-bottom: 1px dotted rgba(255, 255, 255, 0.2);\n transition: var(--transition);\n display: inline-block;\n padding: 2px 0;\n font-weight: 600;\n }\n .flicks-link:hover {\n color: var(--accent-green);\n border-bottom-color: var(--accent-green);\n text-shadow: 0 0 30px var(--glow-green);\n }\n\n \/* ============================================================\n 3. BUTTONS\n ============================================================ *\/\n .btn {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 10px;\n padding: 16px 28px;\n border-radius: var(--radius-btn);\n font-weight: 700;\n font-size: 1rem;\n transition: var(--transition);\n border: none;\n cursor: pointer;\n min-height: 56px;\n min-width: 56px;\n width: 100%;\n position: relative;\n overflow: hidden;\n }\n\n @media (min-width: 480px) {\n .btn {\n width: auto;\n padding: 16px 38px;\n }\n }\n\n .btn-create-wallet {\n background: linear-gradient(135deg, var(--accent-purple), #7c3aed);\n color: #fff;\n box-shadow: 0 8px 32px var(--glow-purple);\n font-weight: 800;\n }\n .btn-create-wallet::before {\n content: '';\n position: absolute;\n top: -2px;\n left: -2px;\n right: -2px;\n bottom: -2px;\n background: linear-gradient(135deg, var(--accent-purple), var(--accent-pink));\n border-radius: var(--radius-btn);\n z-index: -1;\n opacity: 0;\n transition: var(--transition);\n }\n .btn-create-wallet:hover {\n transform: scale(1.04) translateY(-3px);\n box-shadow: 0 16px 48px var(--glow-purple);\n }\n .btn-create-wallet:hover::before {\n opacity: 1;\n }\n\n .btn-login {\n background: rgba(255, 255, 255, 0.04);\n color: var(--text-primary);\n border: 1px solid rgba(255, 255, 255, 0.08);\n }\n .btn-login:hover {\n background: rgba(255, 255, 255, 0.10);\n border-color: var(--accent-green);\n color: var(--accent-green);\n box-shadow: 0 0 30px var(--glow-green);\n }\n\n .btn-install {\n background: var(--accent-green);\n color: #05050A;\n box-shadow: 0 8px 32px var(--glow-green);\n font-weight: 800;\n }\n .btn-install::before {\n content: '';\n position: absolute;\n top: -2px;\n left: -2px;\n right: -2px;\n bottom: -2px;\n background: linear-gradient(135deg, var(--accent-green), var(--accent-purple));\n border-radius: var(--radius-btn);\n z-index: -1;\n opacity: 0;\n transition: var(--transition);\n }\n .btn-install:hover {\n transform: scale(1.04) translateY(-3px);\n box-shadow: 0 16px 48px var(--glow-green);\n }\n .btn-install:hover::before {\n opacity: 1;\n }\n\n .btn-support {\n background: rgba(37, 211, 102, 0.12);\n color: #25D366;\n border: 1px solid rgba(37, 211, 102, 0.15);\n font-weight: 600;\n }\n .btn-support:hover {\n background: rgba(37, 211, 102, 0.20);\n border-color: #25D366;\n box-shadow: 0 0 30px rgba(37, 211, 102, 0.15);\n transform: translateY(-2px);\n }\n\n \/* Payment badges *\/\n .payment-badge {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n padding: 6px 14px;\n border-radius: 100px;\n font-size: 0.75rem;\n font-weight: 600;\n background: rgba(255, 255, 255, 0.04);\n border: 1px solid rgba(255, 255, 255, 0.06);\n color: var(--text-secondary);\n }\n .payment-badge i {\n font-size: 1rem;\n }\n .payment-badge.stripe {\n border-color: rgba(99, 102, 241, 0.2);\n color: #818cf8;\n }\n .payment-badge.stripe i {\n color: #818cf8;\n }\n .payment-badge.mtn {\n border-color: rgba(255, 193, 7, 0.2);\n color: #fbbf24;\n }\n .payment-badge.mtn i {\n color: #fbbf24;\n }\n .payment-badge.airtel {\n border-color: rgba(239, 68, 68, 0.2);\n color: #f87171;\n }\n .payment-badge.airtel i {\n color: #f87171;\n }\n .payment-badge.mpesa {\n border-color: rgba(52, 211, 153, 0.2);\n color: #34d399;\n }\n .payment-badge.mpesa i {\n color: #34d399;\n }\n\n \/* ============================================================\n 4. TOP NAVBAR (Persistent)\n ============================================================ *\/\n .navbar {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n z-index: 1000;\n height: var(--nav-height);\n background: rgba(5, 5, 10, 0.75);\n backdrop-filter: blur(20px) saturate(180%);\n transition: var(--transition);\n display: flex;\n align-items: center;\n border-bottom: 1px solid rgba(255, 255, 255, 0.03);\n }\n\n .navbar .container {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding-top: 0;\n padding-bottom: 0;\n height: 100%;\n }\n\n .logo {\n font-size: 1.3rem;\n font-weight: 800;\n letter-spacing: -0.03em;\n display: flex;\n align-items: center;\n gap: 6px;\n flex-shrink: 0;\n }\n .logo i {\n color: var(--accent-green);\n font-size: 1.5rem;\n filter: drop-shadow(0 0 10px var(--glow-green));\n }\n .logo .cash {\n background: linear-gradient(135deg, #f8fafc, #94a3b8);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n }\n .logo .flicks-link {\n font-weight: 900;\n border-bottom: none;\n font-size: 1.3rem;\n }\n\n .nav-links {\n display: flex;\n align-items: center;\n gap: 6px;\n list-style: none;\n }\n .nav-links a:not(.btn) {\n font-size: 0.82rem;\n font-weight: 500;\n color: var(--text-secondary);\n transition: var(--transition);\n position: relative;\n padding: 6px 12px;\n cursor: pointer;\n border-radius: 8px;\n }\n .nav-links a:not(.btn):hover,\n .nav-links a:not(.btn).active {\n color: #fff;\n background: rgba(255, 255, 255, 0.05);\n }\n .nav-links a:not(.btn).active {\n color: var(--accent-green);\n }\n\n .nav-links .btn-install {\n padding: 8px 18px;\n font-size: 0.8rem;\n min-height: 38px;\n width: auto;\n box-shadow: 0 4px 20px var(--glow-green);\n margin-left: 4px;\n }\n\n .hamburger {\n display: none;\n font-size: 1.6rem;\n color: #fff;\n cursor: pointer;\n background: none;\n border: none;\n padding: 8px;\n z-index: 1001;\n align-items: center;\n justify-content: center;\n }\n\n @media (max-width: 899px) {\n .nav-links {\n position: fixed;\n top: 0;\n right: -100%;\n width: 280px;\n height: 100vh;\n background: rgba(13, 13, 26, 0.96);\n backdrop-filter: blur(30px);\n flex-direction: column;\n justify-content: center;\n align-items: center;\n gap: 20px;\n transition: var(--transition);\n padding: 40px 24px;\n border-left: 1px solid rgba(255, 255, 255, 0.04);\n }\n .nav-links.open {\n right: 0;\n }\n .nav-links .btn-install {\n width: 100%;\n justify-content: center;\n margin-top: 8px;\n }\n .nav-links a:not(.btn) {\n font-size: 1.1rem;\n padding: 10px 20px;\n width: 100%;\n text-align: center;\n }\n }\n\n @media (min-width: 900px) {\n .hamburger {\n display: none;\n }\n .nav-links {\n gap: 4px;\n }\n }\n\n \/* ============================================================\n 5. BOTTOM NAVIGATION (Mobile\/Tablet\/Desktop)\n ============================================================ *\/\n .bottom-nav {\n position: fixed;\n bottom: 0;\n left: 0;\n right: 0;\n z-index: 999;\n background: rgba(5, 5, 10, 0.85);\n backdrop-filter: blur(16px) saturate(180%);\n border-top: 1px solid rgba(255, 255, 255, 0.04);\n display: flex;\n justify-content: space-around;\n align-items: center;\n padding: 6px 0 env(safe-area-inset-bottom, 8px);\n height: var(--bottom-nav-height);\n transition: var(--transition);\n }\n\n .bottom-nav a {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 1px;\n font-size: 0.55rem;\n font-weight: 500;\n color: var(--text-muted);\n padding: 4px 8px;\n border-radius: 12px;\n transition: var(--transition);\n flex: 1;\n max-width: 80px;\n min-height: 52px;\n position: relative;\n text-align: center;\n }\n\n .bottom-nav a i {\n font-size: 1.3rem;\n transition: var(--transition);\n }\n\n .bottom-nav a span {\n line-height: 1.2;\n font-size: 0.55rem;\n letter-spacing: 0.02em;\n }\n\n .bottom-nav a:hover {\n color: var(--text-primary);\n }\n\n .bottom-nav a.active {\n color: var(--accent-green);\n }\n\n .bottom-nav a.active i {\n text-shadow: 0 0 20px var(--glow-green);\n }\n\n .bottom-nav a.active::before {\n content: '';\n position: absolute;\n top: -1px;\n left: 50%;\n transform: translateX(-50%);\n width: 24px;\n height: 3px;\n background: var(--accent-green);\n border-radius: 0 0 4px 4px;\n box-shadow: 0 0 20px var(--glow-green);\n }\n\n @media (min-width: 1024px) {\n .bottom-nav {\n display: none;\n }\n }\n\n \/* ============================================================\n 6. PAGE CONTAINER\n ============================================================ *\/\n #app {\n min-height: 400px;\n padding-top: var(--nav-height);\n }\n\n .page-content {\n display: none;\n animation: fadeInPage 0.5s cubic-bezier(0.22, 1, 0.36, 1) forwards;\n padding: 40px 0 60px;\n }\n\n .page-content.active {\n display: block;\n }\n\n @keyframes fadeInPage {\n 0% {\n opacity: 0;\n transform: translateY(16px);\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n }\n\n \/* ============================================================\n 7. HOME PAGE - HERO SECTION\n ============================================================ *\/\n .hero {\n padding: 20px 0 10px;\n background: radial-gradient(ellipse at 30% 20%, #1a0a2e 0%, #05050A 70%);\n position: relative;\n overflow: hidden;\n border-radius: var(--radius-card);\n margin-bottom: 20px;\n }\n\n .hero .orb {\n position: absolute;\n border-radius: 50%;\n pointer-events: none;\n filter: blur(80px);\n animation: floatOrb 12s ease-in-out infinite;\n }\n .hero .orb-1 {\n top: -20%;\n right: -20%;\n width: 400px;\n height: 400px;\n background: var(--accent-purple);\n opacity: 0.12;\n animation-delay: 0s;\n }\n .hero .orb-2 {\n bottom: -30%;\n left: -20%;\n width: 350px;\n height: 350px;\n background: var(--accent-green);\n opacity: 0.06;\n animation-delay: -4s;\n }\n .hero .orb-3 {\n top: 40%;\n left: 30%;\n width: 200px;\n height: 200px;\n background: var(--accent-pink);\n opacity: 0.06;\n animation-delay: -8s;\n }\n\n @keyframes floatOrb {\n 0%,\n 100% {\n transform: translate(0, 0) scale(1);\n }\n 50% {\n transform: translate(-30px, 20px) scale(1.08);\n }\n }\n\n .hero .container {\n position: relative;\n z-index: 2;\n display: grid;\n grid-template-columns: 1fr;\n gap: 32px;\n align-items: center;\n }\n\n @media (min-width: 900px) {\n .hero .container {\n grid-template-columns: 1fr 1fr;\n gap: 50px;\n }\n }\n\n .hero-content {\n max-width: 100%;\n text-align: left;\n }\n @media (max-width: 899px) {\n .hero-content {\n text-align: center;\n }\n .hero-content p {\n margin-left: auto;\n margin-right: auto;\n }\n .hero-actions {\n justify-content: center;\n }\n }\n\n .hero-badge {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n background: rgba(204, 255, 0, 0.06);\n padding: 6px 16px 6px 12px;\n border-radius: 100px;\n font-size: 0.75rem;\n font-weight: 600;\n color: var(--accent-green);\n border: 1px solid rgba(204, 255, 0, 0.08);\n margin-bottom: 20px;\n backdrop-filter: blur(4px);\n }\n\n .hero h1 {\n font-size: clamp(2.6rem, 6vw, 4.8rem);\n font-weight: 900;\n line-height: 1.02;\n letter-spacing: -0.05em;\n margin-bottom: 16px;\n }\n .hero h1 .gradient {\n background: linear-gradient(135deg, var(--accent-green), var(--accent-purple), var(--accent-pink));\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n background-size: 300% 300%;\n animation: gradientShift 8s ease-in-out infinite;\n }\n\n .hero p {\n font-size: clamp(1rem, 1.1vw, 1.2rem);\n color: var(--text-secondary);\n max-width: 520px;\n margin-bottom: 28px;\n }\n @media (max-width: 899px) {\n .hero p {\n max-width: 100%;\n }\n }\n\n .hero-actions {\n display: flex;\n flex-wrap: wrap;\n gap: 12px;\n margin-bottom: 28px;\n }\n @media (max-width: 480px) {\n .hero-actions .btn {\n width: 100%;\n }\n }\n\n .hero-visual {\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n }\n .mockup-card {\n background: rgba(255, 255, 255, 0.03);\n backdrop-filter: blur(16px);\n -webkit-backdrop-filter: blur(16px);\n border: 1px solid rgba(255, 255, 255, 0.05);\n border-radius: var(--radius-card);\n padding: 24px 20px;\n width: 100%;\n max-width: 420px;\n box-shadow: 0 32px 80px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.05);\n transition: var(--transition);\n }\n .mockup-card:hover {\n transform: translateY(-6px);\n border-color: rgba(204, 255, 0, 0.12);\n box-shadow: 0 40px 100px rgba(0, 0, 0, 0.7), 0 0 40px var(--glow-green);\n }\n .mockup-card .card-header {\n display: flex;\n align-items: center;\n gap: 12px;\n margin-bottom: 16px;\n }\n .mockup-card .card-header .avatar {\n width: 44px;\n height: 44px;\n border-radius: 50%;\n background: linear-gradient(135deg, var(--accent-green), var(--accent-purple));\n display: flex;\n align-items: center;\n justify-content: center;\n font-weight: 900;\n font-size: 1rem;\n color: #05050A;\n flex-shrink: 0;\n box-shadow: 0 0 30px var(--glow-green);\n }\n .mockup-card .card-header h3 {\n font-size: 1.1rem;\n font-weight: 700;\n }\n .mockup-card .card-header p {\n color: var(--text-secondary);\n font-size: 0.75rem;\n }\n .mockup-card .live-indicator {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n background: rgba(239, 68, 68, 0.12);\n padding: 3px 10px;\n border-radius: 100px;\n font-size: 0.65rem;\n font-weight: 600;\n color: #ef4444;\n margin-top: 2px;\n }\n .mockup-card .live-indicator .dot {\n width: 5px;\n height: 5px;\n background: #ef4444;\n border-radius: 50%;\n animation: pulse 1.5s ease-in-out infinite;\n }\n @keyframes pulse {\n 0%,\n 100% {\n opacity: 1;\n transform: scale(1);\n }\n 50% {\n opacity: 0.4;\n transform: scale(0.7);\n }\n }\n .mockup-card .chart {\n display: flex;\n align-items: flex-end;\n gap: 4px;\n height: 50px;\n margin: 16px 0 14px;\n padding: 0 2px;\n }\n .mockup-card .chart .bar {\n flex: 1;\n background: linear-gradient(180deg, var(--accent-green), var(--accent-purple));\n border-radius: 3px 3px 0 0;\n height: calc(20% + 10% * var(--i, 1));\n min-height: 6px;\n opacity: 0.7;\n transition: var(--transition);\n }\n .mockup-card:hover .chart .bar {\n opacity: 1;\n }\n .mockup-card .stat-grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 12px;\n margin-top: 14px;\n padding-top: 14px;\n border-top: 1px solid rgba(255, 255, 255, 0.04);\n }\n .mockup-card .stat-grid div {\n display: flex;\n flex-direction: column;\n }\n .mockup-card .stat-grid strong {\n font-size: 1.3rem;\n color: #fff;\n }\n .mockup-card .stat-grid small {\n color: var(--text-muted);\n font-size: 0.7rem;\n }\n .mockup-card .progress-bar {\n margin-top: 14px;\n height: 4px;\n background: rgba(255, 255, 255, 0.06);\n border-radius: 12px;\n overflow: hidden;\n }\n .mockup-card .progress-bar span {\n display: block;\n height: 100%;\n width: 72%;\n background: linear-gradient(90deg, var(--accent-green), var(--accent-purple));\n border-radius: 12px;\n box-shadow: 0 0 20px var(--glow-green);\n }\n\n .hero-stats {\n display: grid;\n grid-template-columns: repeat(2, 1fr);\n gap: 12px 20px;\n padding-top: 20px;\n border-top: 1px solid rgba(255, 255, 255, 0.04);\n }\n @media (min-width: 640px) {\n .hero-stats {\n grid-template-columns: repeat(4, 1fr);\n gap: 16px 24px;\n }\n }\n\n .stat-item {\n display: flex;\n flex-direction: column;\n }\n .stat-number {\n font-size: clamp(1.4rem, 2vw, 2.2rem);\n font-weight: 800;\n color: #fff;\n display: flex;\n align-items: center;\n gap: 6px;\n }\n .stat-number i {\n color: var(--accent-green);\n font-size: clamp(1rem, 1.5vw, 1.6rem);\n filter: drop-shadow(0 0 8px var(--glow-green));\n }\n .stat-label {\n font-size: 0.75rem;\n color: var(--text-muted);\n font-weight: 500;\n letter-spacing: 0.02em;\n }\n\n .quick-steps {\n background: rgba(255, 255, 255, 0.02);\n border-radius: var(--radius-card);\n padding: 20px 18px;\n border: 1px solid rgba(255, 255, 255, 0.04);\n margin-top: 28px;\n backdrop-filter: blur(4px);\n }\n .quick-steps .steps-header {\n display: flex;\n align-items: center;\n gap: 10px;\n margin-bottom: 14px;\n }\n .quick-steps .steps-header h4 {\n font-size: 0.95rem;\n font-weight: 700;\n color: #fff;\n }\n .quick-steps .steps-header i {\n color: var(--accent-green);\n font-size: 1.1rem;\n }\n\n .quick-steps-grid {\n display: grid;\n grid-template-columns: 1fr;\n gap: 14px;\n }\n @media (min-width: 640px) {\n .quick-steps-grid {\n grid-template-columns: 1fr 1fr;\n gap: 18px;\n }\n }\n\n .quick-step-col h5 {\n font-size: 0.8rem;\n font-weight: 700;\n color: var(--accent-purple);\n margin-bottom: 8px;\n display: flex;\n align-items: center;\n gap: 6px;\n }\n .quick-step-col .step-list {\n display: flex;\n flex-direction: column;\n gap: 3px;\n }\n .quick-step-col .step-list .step-item {\n display: flex;\n align-items: flex-start;\n gap: 6px;\n font-size: 0.72rem;\n color: var(--text-secondary);\n padding: 2px 0;\n }\n .quick-step-col .step-list .step-item .num {\n flex-shrink: 0;\n width: 18px;\n height: 18px;\n border-radius: 50%;\n background: rgba(204, 255, 0, 0.08);\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 0.55rem;\n font-weight: 700;\n color: var(--accent-green);\n margin-top: 1px;\n }\n .quick-step-col .step-list .step-item .highlight {\n color: #fff;\n font-weight: 500;\n }\n .quick-step-col .step-list .step-item .green {\n color: var(--accent-green);\n font-weight: 500;\n }\n .quick-step-col .step-list .step-item .blue {\n color: #3b82f6;\n font-weight: 500;\n }\n\n .quick-steps .note-mini {\n margin-top: 12px;\n padding: 8px 14px;\n background: rgba(204, 255, 0, 0.04);\n border-radius: 10px;\n font-size: 0.72rem;\n color: var(--text-secondary);\n border-left: 2px solid var(--accent-green);\n }\n\n \/* ============================================================\n 8. CARDS & SECTIONS (Shared Styles)\n ============================================================ *\/\n .card {\n background: var(--bg-card);\n backdrop-filter: blur(8px);\n -webkit-backdrop-filter: blur(8px);\n border-radius: var(--radius-card);\n padding: 28px 24px;\n transition: var(--transition);\n height: 100%;\n border: 1px solid rgba(255, 255, 255, 0.03);\n }\n .card:hover {\n background: var(--bg-card-hover);\n transform: translateY(-5px);\n border-color: rgba(204, 255, 0, 0.06);\n box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);\n }\n .card-icon {\n font-size: 2rem;\n color: var(--accent-green);\n margin-bottom: 14px;\n display: inline-block;\n filter: drop-shadow(0 0 10px var(--glow-green));\n }\n .card h3 {\n font-size: 1.2rem;\n font-weight: 700;\n margin-bottom: 8px;\n }\n .card p,\n .card li {\n color: var(--text-secondary);\n font-size: 0.92rem;\n }\n .card ul {\n list-style: none;\n padding: 0;\n margin-top: 10px;\n }\n .card ul li {\n padding: 5px 0;\n display: flex;\n gap: 10px;\n align-items: flex-start;\n }\n .card ul li i {\n color: var(--accent-green);\n font-size: 0.75rem;\n margin-top: 5px;\n flex-shrink: 0;\n }\n\n .highlight-box {\n background: rgba(204, 255, 0, 0.04);\n padding: 14px 18px;\n border-radius: 12px;\n margin-top: 14px;\n border-left: 3px solid var(--accent-green);\n }\n .highlight-box strong {\n color: #fff;\n }\n\n .executive-card {\n background: var(--bg-card);\n backdrop-filter: blur(8px);\n -webkit-backdrop-filter: blur(8px);\n border-radius: var(--radius-card);\n padding: 30px 28px;\n border: 1px solid rgba(255, 255, 255, 0.03);\n transition: var(--transition);\n }\n .executive-card:hover {\n background: var(--bg-card-hover);\n border-color: rgba(204, 255, 0, 0.06);\n box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);\n }\n .executive-card p {\n color: var(--text-secondary);\n font-size: 1rem;\n line-height: 1.7;\n }\n\n .feature-card {\n background: var(--bg-card);\n backdrop-filter: blur(8px);\n -webkit-backdrop-filter: blur(8px);\n border-radius: var(--radius-card);\n padding: 24px 22px;\n transition: var(--transition);\n border: 1px solid rgba(255, 255, 255, 0.03);\n height: 100%;\n }\n .feature-card:hover {\n background: var(--bg-card-hover);\n transform: translateY(-5px);\n border-color: rgba(204, 255, 0, 0.06);\n box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);\n }\n .feature-card .icon-wrap {\n width: 50px;\n height: 50px;\n border-radius: 12px;\n background: linear-gradient(135deg, rgba(204, 255, 0, 0.12), rgba(168, 85, 247, 0.12));\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 1.6rem;\n color: var(--accent-green);\n margin-bottom: 14px;\n }\n .feature-card h4 {\n font-size: 1.1rem;\n font-weight: 700;\n margin-bottom: 6px;\n }\n .feature-card p {\n color: var(--text-secondary);\n font-size: 0.88rem;\n }\n .feature-card ul {\n list-style: none;\n padding: 0;\n margin-top: 8px;\n }\n .feature-card ul li {\n padding: 3px 0;\n display: flex;\n gap: 10px;\n align-items: flex-start;\n color: var(--text-secondary);\n font-size: 0.85rem;\n }\n .feature-card ul li i {\n color: var(--accent-green);\n font-size: 0.65rem;\n margin-top: 4px;\n flex-shrink: 0;\n }\n\n \/* Tier Table *\/\n .tier-table-wrap {\n overflow-x: auto;\n margin-top: 16px;\n border-radius: var(--radius-card);\n background: rgba(255, 255, 255, 0.015);\n -webkit-overflow-scrolling: touch;\n border: 1px solid rgba(255, 255, 255, 0.03);\n }\n .tier-table {\n width: 100%;\n border-collapse: collapse;\n font-size: 0.85rem;\n min-width: 380px;\n }\n .tier-table thead {\n background: rgba(204, 255, 0, 0.04);\n }\n .tier-table th {\n text-align: left;\n padding: 12px 16px;\n font-weight: 700;\n color: #fff;\n border-bottom: 1px solid rgba(255, 255, 255, 0.04);\n }\n .tier-table td {\n padding: 10px 16px;\n border-bottom: 1px solid rgba(255, 255, 255, 0.02);\n color: var(--text-secondary);\n }\n .tier-table tr:last-child td {\n border-bottom: none;\n }\n .tier-table td strong {\n color: #fff;\n }\n .tier-table .free-badge {\n display: inline-block;\n background: rgba(204, 255, 0, 0.12);\n color: var(--accent-green);\n padding: 2px 10px;\n border-radius: 100px;\n font-size: 0.7rem;\n font-weight: 700;\n }\n .tier-table .pro-badge {\n display: inline-block;\n background: rgba(168, 85, 247, 0.12);\n color: var(--accent-purple);\n padding: 2px 10px;\n border-radius: 100px;\n font-size: 0.7rem;\n font-weight: 700;\n }\n\n .share-grid {\n display: grid;\n grid-template-columns: 1fr;\n gap: 12px;\n margin-top: 12px;\n }\n @media (min-width: 480px) {\n .share-grid {\n grid-template-columns: 1fr 1fr;\n }\n }\n .share-card {\n background: rgba(255, 255, 255, 0.02);\n border-radius: 12px;\n padding: 14px 18px;\n border: 1px solid rgba(255, 255, 255, 0.04);\n transition: var(--transition);\n }\n .share-card:hover {\n background: rgba(255, 255, 255, 0.05);\n border-color: rgba(204, 255, 0, 0.06);\n }\n .share-card h5 {\n font-size: 1rem;\n font-weight: 700;\n color: var(--accent-green);\n }\n .share-card p {\n color: var(--text-secondary);\n font-size: 0.85rem;\n margin-top: 2px;\n }\n\n \/* ============================================================\n 9. STEP CARDS (Register \/ Activate)\n ============================================================ *\/\n .step-grid {\n display: grid;\n grid-template-columns: 1fr;\n gap: 14px;\n }\n @media (min-width: 480px) {\n .step-grid {\n grid-template-columns: repeat(2, 1fr);\n gap: 16px;\n }\n }\n @media (min-width: 900px) {\n .step-grid {\n grid-template-columns: repeat(3, 1fr);\n gap: 18px;\n }\n }\n\n .step-card {\n background: var(--bg-card);\n backdrop-filter: blur(8px);\n -webkit-backdrop-filter: blur(8px);\n border-radius: var(--radius-card);\n padding: 18px 20px;\n display: flex;\n align-items: flex-start;\n gap: 14px;\n transition: var(--transition);\n border: 1px solid rgba(255, 255, 255, 0.03);\n }\n .step-card:hover {\n background: var(--bg-card-hover);\n transform: translateY(-3px);\n border-color: rgba(204, 255, 0, 0.05);\n box-shadow: 0 12px 24px rgba(0, 0, 0, 0.2);\n }\n .step-number {\n flex-shrink: 0;\n width: 38px;\n height: 38px;\n border-radius: 50%;\n background: linear-gradient(135deg, rgba(204, 255, 0, 0.15), rgba(168, 85, 247, 0.15));\n display: flex;\n align-items: center;\n justify-content: center;\n font-weight: 800;\n font-size: 0.9rem;\n color: var(--accent-green);\n margin-top: 2px;\n border: 1px solid rgba(204, 255, 0, 0.1);\n }\n .step-content {\n flex: 1;\n }\n .step-content strong {\n color: #fff;\n display: block;\n font-size: 0.9rem;\n margin-bottom: 2px;\n }\n .step-content p {\n color: var(--text-secondary);\n font-size: 0.82rem;\n margin: 0;\n }\n .step-content p i {\n color: var(--accent-green);\n margin-right: 4px;\n }\n .step-card.highlight-step {\n background: rgba(204, 255, 0, 0.04);\n border-color: rgba(204, 255, 0, 0.08);\n }\n\n .note-box {\n background: rgba(204, 255, 0, 0.04);\n padding: 16px 20px;\n border-radius: 14px;\n margin-top: 28px;\n display: flex;\n gap: 14px;\n align-items: flex-start;\n border: 1px solid rgba(204, 255, 0, 0.06);\n }\n .note-box i {\n color: var(--accent-green);\n font-size: 1.3rem;\n margin-top: 2px;\n }\n .note-box p {\n color: var(--text-secondary);\n font-size: 0.9rem;\n margin: 0;\n }\n .note-box strong {\n color: #fff;\n }\n\n \/* ============================================================\n 10. TABLE & TIMELINE\n ============================================================ *\/\n .table-wrap {\n overflow-x: auto;\n margin-top: 16px;\n border-radius: var(--radius-card);\n background: rgba(255, 255, 255, 0.015);\n -webkit-overflow-scrolling: touch;\n padding: 0 4px;\n border: 1px solid rgba(255, 255, 255, 0.03);\n }\n table {\n width: 100%;\n border-collapse: collapse;\n font-size: 0.85rem;\n min-width: 380px;\n }\n thead {\n background: rgba(204, 255, 0, 0.03);\n }\n th {\n text-align: left;\n padding: 12px 16px;\n font-weight: 600;\n color: #fff;\n border-bottom: 1px solid rgba(255, 255, 255, 0.04);\n }\n td {\n padding: 10px 16px;\n border-bottom: 1px solid rgba(255, 255, 255, 0.02);\n color: var(--text-secondary);\n }\n tr:last-child td {\n border-bottom: none;\n }\n td strong {\n color: #fff;\n }\n\n .timeline-item {\n display: flex;\n gap: 18px;\n align-items: flex-start;\n padding: 14px 0;\n border-bottom: 1px solid rgba(255, 255, 255, 0.02);\n }\n .timeline-item:last-child {\n border-bottom: none;\n }\n .timeline-year {\n font-weight: 900;\n font-size: 1.1rem;\n color: var(--accent-green);\n min-width: 65px;\n flex-shrink: 0;\n }\n .timeline-content p {\n color: var(--text-secondary);\n font-size: 0.88rem;\n }\n\n \/* ============================================================\n 11. FOOTER (Persistent)\n ============================================================ *\/\n footer {\n padding: 32px 0 24px;\n border-top: 1px solid rgba(255, 255, 255, 0.03);\n width: 100%;\n background: rgba(255, 255, 255, 0.005);\n margin-top: 20px;\n }\n\n .footer-grid {\n display: grid;\n grid-template-columns: 1fr;\n gap: 28px;\n margin-bottom: 24px;\n }\n @media (min-width: 640px) {\n .footer-grid {\n grid-template-columns: 1fr 1fr;\n gap: 32px;\n }\n }\n @media (min-width: 1024px) {\n .footer-grid {\n grid-template-columns: 1.5fr 1fr 1fr;\n gap: 40px;\n }\n }\n\n .footer-brand p {\n color: var(--text-secondary);\n font-size: 0.85rem;\n margin-top: 6px;\n max-width: 380px;\n }\n .footer-brand .logo-small {\n font-size: 1.1rem;\n font-weight: 800;\n display: flex;\n align-items: center;\n gap: 6px;\n }\n .footer-brand .logo-small i {\n color: var(--accent-green);\n font-size: 1.3rem;\n filter: drop-shadow(0 0 10px var(--glow-green));\n }\n\n .footer-company h4,\n .footer-links h4 {\n font-size: 0.9rem;\n font-weight: 700;\n color: #fff;\n margin-bottom: 10px;\n letter-spacing: 0.02em;\n }\n .footer-company p {\n color: var(--text-secondary);\n font-size: 0.85rem;\n line-height: 1.7;\n margin-bottom: 2px;\n }\n .footer-company .company-name {\n color: var(--accent-green);\n font-weight: 600;\n }\n .footer-company .company-number {\n color: #fff;\n font-weight: 500;\n }\n\n .footer-links .link-group {\n display: flex;\n flex-direction: column;\n gap: 8px;\n }\n .footer-links .link-group a {\n color: var(--text-secondary);\n font-size: 0.85rem;\n transition: var(--transition);\n display: inline-flex;\n align-items: center;\n gap: 8px;\n cursor: pointer;\n }\n .footer-links .link-group a:hover {\n color: var(--accent-green);\n text-shadow: 0 0 20px var(--glow-green);\n }\n .footer-links .link-group a i {\n font-size: 0.75rem;\n opacity: 0.6;\n }\n\n .footer-support {\n display: flex;\n flex-wrap: wrap;\n gap: 10px;\n margin-top: 4px;\n }\n .footer-support .btn-support {\n font-size: 0.8rem;\n padding: 8px 18px;\n min-height: 40px;\n }\n\n .footer-bottom {\n padding-top: 20px;\n border-top: 1px solid rgba(255, 255, 255, 0.03);\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 10px;\n text-align: center;\n }\n @media (min-width: 640px) {\n .footer-bottom {\n flex-direction: row;\n justify-content: space-between;\n text-align: left;\n }\n }\n .footer-bottom p {\n color: var(--text-muted);\n font-size: 0.75rem;\n }\n .footer-bottom p i {\n color: var(--accent-green);\n }\n .footer-legal-links {\n display: flex;\n flex-wrap: wrap;\n gap: 14px;\n }\n .footer-legal-links a {\n color: var(--text-muted);\n font-size: 0.75rem;\n transition: var(--transition);\n cursor: pointer;\n }\n .footer-legal-links a:hover {\n color: var(--accent-green);\n }\n\n \/* ============================================================\n 12. RESPONSIVE FINE-TUNING\n ============================================================ *\/\n @media (max-width: 480px) {\n .container {\n padding: 0 14px;\n }\n .card {\n padding: 20px 16px;\n }\n .step-card {\n padding: 14px 16px;\n gap: 10px;\n }\n .step-number {\n width: 32px;\n height: 32px;\n font-size: 0.8rem;\n }\n .hero h1 {\n font-size: 2.2rem;\n }\n .section-title {\n font-size: 1.8rem;\n }\n .mockup-card {\n padding: 18px 14px;\n }\n .mockup-card .chart {\n height: 40px;\n }\n .quick-steps {\n padding: 16px 14px;\n }\n .quick-step-col .step-list .step-item {\n font-size: 0.68rem;\n }\n .bottom-nav a {\n max-width: 60px;\n min-height: 44px;\n }\n .bottom-nav a i {\n font-size: 1.1rem;\n }\n .bottom-nav a span {\n font-size: 0.5rem;\n }\n }\n\n @media (max-width: 380px) {\n .hero-stats {\n grid-template-columns: 1fr 1fr;\n gap: 8px 12px;\n }\n .stat-number {\n font-size: 1.1rem;\n }\n .stat-label {\n font-size: 0.6rem;\n }\n .btn {\n font-size: 0.85rem;\n padding: 14px 20px;\n min-height: 48px;\n }\n }\n\n \/* ============================================================\n 13. ANIMATIONS\n ============================================================ *\/\n .fade-up {\n opacity: 0;\n transform: translateY(30px);\n animation: fadeUp 0.7s cubic-bezier(0.22, 1, 0.36, 1) forwards;\n }\n @keyframes fadeUp {\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n .delay-1 {\n animation-delay: 0.1s;\n }\n .delay-2 {\n animation-delay: 0.2s;\n }\n .delay-3 {\n animation-delay: 0.3s;\n }\n <\/style>\n<\/head>\n<body>\n\n \n <header class=\"navbar\" id=\"navbar\">\n <div class=\"container\">\n <div class=\"logo\">\n <i class=\"fas fa-film\"><\/i>\n <span class=\"cash\">CashChat<\/span>\n <a href=\"https:\/\/ai.cashchatapp.com\" target=\"_blank\" class=\"flicks-link\">Flicks<\/a>\n <\/div>\n <button class=\"hamburger\" id=\"menuToggle\" aria-label=\"Toggle navigation\">\n <i class=\"fas fa-bars\"><\/i>\n <\/button>\n <ul class=\"nav-links\" id=\"navLinks\">\n <li><a href=\"#home\" class=\"active\" data-page=\"home\">Home<\/a><\/li>\n <li><a href=\"#ad-model\" data-page=\"ad-model\">Ad Model<\/a><\/li>\n <li><a href=\"#gifts\" data-page=\"gifts\">Gifts<\/a><\/li>\n <li><a href=\"#register\" data-page=\"register\">Register<\/a><\/li>\n <li><a href=\"#activate\" data-page=\"activate\">Activate<\/a><\/li>\n <li><a href=\"#revenue\" data-page=\"revenue\">Revenue<\/a><\/li>\n <li><a href=\"#business\" data-page=\"business\">Business<\/a><\/li>\n <li>\n <a href=\"https:\/\/ai.cashchatapp.com\" target=\"_blank\" class=\"btn btn-install\">\n <i class=\"fas fa-download\"><\/i> Install\n <\/a>\n <\/li>\n <\/ul>\n <\/div>\n <\/header>\n\n \n <div id=\"app\"><\/div>\n\n \n <nav class=\"bottom-nav\" id=\"bottomNav\">\n <a href=\"#home\" class=\"active\" data-page=\"home\">\n <i class=\"fas fa-home\"><\/i>\n <span>Home<\/span>\n <\/a>\n <a href=\"#ad-model\" data-page=\"ad-model\">\n <i class=\"fas fa-bullhorn\"><\/i>\n <span>Ad Model<\/span>\n <\/a>\n <a href=\"#gifts\" data-page=\"gifts\">\n <i class=\"fas fa-gift\"><\/i>\n <span>Gifts<\/span>\n <\/a>\n <a href=\"#register\" data-page=\"register\">\n <i class=\"fas fa-user-plus\"><\/i>\n <span>Register<\/span>\n <\/a>\n <a href=\"#activate\" data-page=\"activate\">\n <i class=\"fas fa-rocket\"><\/i>\n <span>Activate<\/span>\n <\/a>\n <a href=\"#business\" data-page=\"business\">\n <i class=\"fas fa-building\"><\/i>\n <span>Business<\/span>\n <\/a>\n <a href=\"#revenue\" data-page=\"revenue\">\n <i class=\"fas fa-coins\"><\/i>\n <span>Revenue<\/span>\n <\/a>\n <\/nav>\n\n \n\n \n <template id=\"tmpl-home\">\n <section class=\"page-content active\">\n <div class=\"container\">\n <div class=\"hero\">\n <div class=\"orb orb-1\"><\/div>\n <div class=\"orb orb-2\"><\/div>\n <div class=\"orb orb-3\"><\/div>\n <div class=\"container\">\n <div class=\"hero-content\">\n <div class=\"hero-badge\">\n <i class=\"fas fa-shield-alt\"><\/i> Zero fraud complaints since 2016\n <\/div>\n <h1>\n The <span class=\"gradient\">future<\/span> of<br>\n creator monetization\n <\/h1>\n <p>\n CashChat <a href=\"https:\/\/ai.cashchatapp.com\" target=\"_blank\" class=\"flicks-link\">Flicks<\/a> combines\n digital advertising, virtual gifting, and a proprietary convertible\u2011note economy to build a self\u2011sustaining\n ecosystem.\n <\/p>\n <div class=\"hero-actions\">\n <a href=\"https:\/\/usd.bcbank.se\" target=\"_blank\" class=\"btn btn-create-wallet\">\n <i class=\"fas fa-wallet\"><\/i> Create Wallet\n <\/a>\n <a href=\"https:\/\/my.cashchatapp.com\/account\/login\" target=\"_blank\" class=\"btn btn-login\">\n <i class=\"fas fa-sign-in-alt\"><\/i> Login\n <\/a>\n <a href=\"https:\/\/ai.cashchatapp.com\" target=\"_blank\" class=\"btn btn-install\">\n <i class=\"fas fa-download\"><\/i> Install Flicks\n <\/a>\n <\/div>\n <div class=\"hero-stats\">\n <div class=\"stat-item\">\n <span class=\"stat-number\"><i class=\"fas fa-users\"><\/i> 200k<\/span>\n <span class=\"stat-label\">Ad Agents<\/span>\n <\/div>\n <div class=\"stat-item\">\n <span class=\"stat-number\"><i class=\"fas fa-gift\"><\/i> $1\u2013$300<\/span>\n <span class=\"stat-label\">Gift Range<\/span>\n <\/div>\n <div class=\"stat-item\">\n <span class=\"stat-number\"><i class=\"fas fa-percent\"><\/i> 60%<\/span>\n <span class=\"stat-label\">Creator Share<\/span>\n <\/div>\n <div class=\"stat-item\">\n <span class=\"stat-number\"><i class=\"fas fa-coins\"><\/i> 500<\/span>\n <span class=\"stat-label\">Points to Withdraw<\/span>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"hero-visual\">\n <div class=\"mockup-card\">\n <div class=\"card-header\">\n <div class=\"avatar\">CF<\/div>\n <div>\n <h3>CashChat Flicks<\/h3>\n <div class=\"live-indicator\">\n <span class=\"dot\"><\/span> Live \u00b7 1.2k watching\n <\/div>\n <\/div>\n <\/div>\n <p style=\"color:var(--text-secondary); font-size:0.85rem;\">Your dashboard is ready. Start earning from ads and gifts today.<\/p>\n <div class=\"chart\">\n <div class=\"bar\" style=\"--i:1; height:30%;\"><\/div>\n <div class=\"bar\" style=\"--i:2; height:55%;\"><\/div>\n <div class=\"bar\" style=\"--i:3; height:45%;\"><\/div>\n <div class=\"bar\" style=\"--i:4; height:75%;\"><\/div>\n <div class=\"bar\" style=\"--i:5; height:65%;\"><\/div>\n <div class=\"bar\" style=\"--i:6; height:90%;\"><\/div>\n <div class=\"bar\" style=\"--i:7; height:80%;\"><\/div>\n <div class=\"bar\" style=\"--i:8; height:100%;\"><\/div>\n <div class=\"bar\" style=\"--i:9; height:70%;\"><\/div>\n <div class=\"bar\" style=\"--i:10; height:85%;\"><\/div>\n <\/div>\n <div class=\"stat-grid\">\n <div><strong>$284.50<\/strong><small>Earned this week<\/small><\/div>\n <div><strong>1,842<\/strong><small>Total views<\/small><\/div>\n <\/div>\n <div class=\"progress-bar\"><span><\/span><\/div>\n <p style=\"font-size:0.65rem; color:var(--text-muted); margin-top:10px;\">72% towards next payout<\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"quick-steps\">\n <div class=\"steps-header\">\n <i class=\"fas fa-list-check\"><\/i>\n <h4>How to get started<\/h4>\n <\/div>\n <div class=\"quick-steps-grid\">\n <div class=\"quick-step-col\">\n <h5><i class=\"fas fa-user-plus\"><\/i> Register Wallet<\/h5>\n <div class=\"step-list\">\n <div class=\"step-item\"><span class=\"num\">1<\/span><span>First name \u2014 exactly as on your ID<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">2<\/span><span>Last name \u2014 exactly as on your ID<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">3<\/span><span>Valid email address \u2014 used for verification<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">4<\/span><span>Select your country from dropdown<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">5<\/span><span>Mobile number with country code \u2014 <span class=\"green\">NO + sign<\/span> (e.g., 256712345678)<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">6<\/span><span>Sponsor code <span class=\"highlight\">(Required)<\/span> \u2014 get from a verified user<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">7<\/span><span>Create a <span class=\"highlight\">6\u2011digit PIN<\/span> \u2014 only numbers, no letters<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">8<\/span><span>Re\u2011enter the same 6\u2011digit PIN to confirm<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">9<\/span><span>\u2714 Tick to Accept Terms & Conditions<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">10<\/span><span><span class=\"highlight\">Click Signup<\/span> \u2014 your wallet will be created<\/span><\/div>\n <\/div>\n <\/div>\n <div class=\"quick-step-col\">\n <h5><i class=\"fas fa-rocket\"><\/i> Activate & Pay Subscription<\/h5>\n <div class=\"step-list\">\n <div class=\"step-item\"><span class=\"num\">1<\/span><span>Login to wallet with email + 6\u2011digit PIN<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">2<\/span><span>Click \u201cPay Subscription\u201d (to pay using wallet credit \u2192 click the <span class=\"blue\">Blue wallet<\/span> icon)<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">3<\/span><span>Type <span class=\"highlight\">\u201cStart\u201d<\/span> and Send<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">4<\/span><span>Type <span class=\"highlight\">\u201c1\u201d<\/span> (My wallet) and Send<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">5<\/span><span>Type <span class=\"highlight\">\u201c2\u201d<\/span> (Pay Subscription) and Send<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">6<\/span><span>Choose currency: Type <span class=\"highlight\">1<\/span> for UGX \/ <span class=\"highlight\">2<\/span> for KES \/ <span class=\"highlight\">3<\/span> for USD \u2192 Send<\/span><\/div>\n <div class=\"step-item\"><span class=\"num\">7<\/span><span>Payment method: Type <span class=\"highlight\">1<\/span> (Use Mobile: MTN or Mpesa) OR <span class=\"highlight\">2<\/span> (Use Wallet credit) \u2192 Send<\/span><\/div>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"note-mini\">\n <i class=\"fas fa-lightbulb\" style=\"color:var(--accent-green); margin-right:6px;\"><\/i>\n <strong>Activation tip:<\/strong> After step 7 your subscription will be active. For wallet credit payments, ensure sufficient balance. The <span class=\"blue\">\u201cBlue wallet\u201d<\/span> refers to the blue\u2011coloured wallet credit button inside the dashboard.\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n <\/template>\n\n \n <template id=\"tmpl-ad-model\">\n <section class=\"page-content active\">\n <div class=\"container\">\n <span class=\"section-tag\"><i class=\"fas fa-bullhorn\"><\/i> Revenue engine<\/span>\n <h2 class=\"section-title\">Digital Advertising <span class=\"gradient\">& Agent Network<\/span><\/h2>\n <p class=\"section-desc\">\n Advertisements served on user videos fund the entire ecosystem. Creators earn up to 60%,\n while our 200,000 advertising agents drive global campaign management.\n <\/p>\n <div class=\"grid-2col\">\n <div class=\"card\">\n <div class=\"card-icon\"><i class=\"fas fa-video\"><\/i><\/div>\n <h3>Creator Ad Share<\/h3>\n <p>When ads play on your video, you earn between <strong>2% and 60%<\/strong> of the advertiser’s payment. The remaining 40% is shared with the company and advertising agents.<\/p>\n <div class=\"highlight-box\">\n <i class=\"fas fa-arrow-up\" style=\"color:var(--accent-green); margin-right:8px;\"><\/i>\n <strong>Max payout:<\/strong> 60% of ad revenue per video.\n <\/div>\n <\/div>\n <div class=\"card\">\n <div class=\"card-icon\"><i class=\"fas fa-user-tie\"><\/i><\/div>\n <h3>Agent Commission<\/h3>\n <p>CashChat <a href=\"https:\/\/ai.cashchatapp.com\" target=\"_blank\" class=\"flicks-link\">Flicks<\/a> is managed by a dedicated network of <strong>200,000 advertising agents<\/strong>.<\/p>\n <ul>\n <li><i class=\"fas fa-check-circle\"><\/i> Each agent earns <strong>20% commission<\/strong> on every advert they upload.<\/li>\n <li><i class=\"fas fa-check-circle\"><\/i> Advertisers benefit from a decentralized, high-touch distribution model.<\/li>\n <\/ul>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n <\/template>\n\n \n <template id=\"tmpl-gifts\">\n <section class=\"page-content active\">\n <div class=\"container\">\n <span class=\"section-tag\"><i class=\"fas fa-heart\"><\/i> Engagement<\/span>\n <h2 class=\"section-title\">Virtual Gifts <span class=\"gradient\">& Engagement Points<\/span><\/h2>\n <p class=\"section-desc\">\n Viewers support creators directly via virtual gifts. A portion of every gift fuels a\n platform\u2011wide engagement pool that rewards all active users.\n <\/p>\n <div class=\"grid-2col\">\n <div class=\"card\">\n <div class=\"card-icon\"><i class=\"fas fa-gem\"><\/i><\/div>\n <h3>Gift Mechanics<\/h3>\n <ul>\n <li><i class=\"fas fa-dollar-sign\"><\/i> Gifts range from <strong>$1<\/strong> (minimum) to <strong>$300<\/strong> (maximum).<\/li>\n <li><i class=\"fas fa-percent\"><\/i> Creator receives <strong>60%<\/strong> of gift value immediately.<\/li>\n <li><i class=\"fas fa-percent\"><\/i> The remaining <strong>40%<\/strong> is split between the company and users based on engagement.<\/li>\n <\/ul>\n <\/div>\n <div class=\"card\">\n <div class=\"card-icon\"><i class=\"fas fa-trophy\"><\/i><\/div>\n <h3>Engagement Points<\/h3>\n <p>Users earn <strong>Engagement Points<\/strong> by interacting with content, watching videos, and participating in the community.<\/p>\n <div class=\"highlight-box\">\n <i class=\"fas fa-wallet\" style=\"color:var(--accent-green); margin-right:8px;\"><\/i>\n <strong>Withdraw at 500 points:<\/strong> Once you hit 500 points, you can withdraw directly to your <strong>CashChat Wallet<\/strong> from the 40% gift pool.\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n <\/template>\n\n \n <template id=\"tmpl-register\">\n <section class=\"page-content active\">\n <div class=\"container\">\n <span class=\"section-tag\"><i class=\"fas fa-user-plus\"><\/i> Step-by-Step<\/span>\n <h2 class=\"section-title\">Register <span class=\"gradient\">Your Wallet<\/span><\/h2>\n <p class=\"section-desc\">\n Follow these 10 simple steps to create your CashChat wallet and join the <a href=\"https:\/\/ai.cashchatapp.com\" target=\"_blank\" class=\"flicks-link\">Flicks<\/a> ecosystem.\n <\/p>\n <div class=\"step-grid\">\n <div class=\"step-card\"><span class=\"step-number\">1<\/span><div class=\"step-content\"><strong>First name<\/strong><p>Exactly as on your ID.<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">2<\/span><div class=\"step-content\"><strong>Last name<\/strong><p>Exactly as on your ID.<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">3<\/span><div class=\"step-content\"><strong>Valid email address<\/strong><p>Used for verification.<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">4<\/span><div class=\"step-content\"><strong>Select your country<\/strong><p>Choose your country from the dropdown.<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">5<\/span><div class=\"step-content\"><strong>Mobile phone number<\/strong><p>Include country code \u2014 <strong style=\"color: var(--accent-green);\">NO + sign<\/strong> (e.g., 256712345678).<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">6<\/span><div class=\"step-content\"><strong>Sponsor code <span style=\"color: var(--accent-green); font-weight:400;\">(Required)<\/span><\/strong><p>If none provided, get one from a verified user.<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">7<\/span><div class=\"step-content\"><strong>Create a 6\u2011digit PIN<\/strong><p>Only numbers, no letters.<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">8<\/span><div class=\"step-content\"><strong>Confirm PIN<\/strong><p>Re\u2011enter the same 6\u2011digit PIN to confirm.<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">9<\/span><div class=\"step-content\"><strong>Accept Terms & Conditions<\/strong><p><i class=\"fas fa-check-circle\"><\/i> Tick to accept.<\/p><\/div><\/div>\n <div class=\"step-card highlight-step\"><span class=\"step-number\">10<\/span><div class=\"step-content\"><strong>Click Signup<\/strong><p>Your wallet will be created instantly.<\/p><\/div><\/div>\n <\/div>\n <div class=\"note-box\">\n <i class=\"fas fa-lightbulb\"><\/i>\n <div>\n <p><strong>Important:<\/strong> Use only <strong>6 numeric digits<\/strong> for PIN. Phone number example: <strong>2567XXXXXXXX<\/strong> (omit \u2018+\u2019). Sponsor code: ask a verified CashChat user if needed.<\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n <\/template>\n\n \n <template id=\"tmpl-activate\">\n <section class=\"page-content active\">\n <div class=\"container\">\n <span class=\"section-tag\"><i class=\"fas fa-rocket\"><\/i> Get Started<\/span>\n <h2 class=\"section-title\">Activate <span class=\"gradient\">& Pay Subscription<\/span><\/h2>\n <p class=\"section-desc\">\n After registering, follow these 7 steps to activate your account and start earning on CashChat <a href=\"https:\/\/ai.cashchatapp.com\" target=\"_blank\" class=\"flicks-link\">Flicks<\/a>.\n <\/p>\n <div class=\"step-grid\">\n <div class=\"step-card\"><span class=\"step-number\">1<\/span><div class=\"step-content\"><strong>Login to wallet<\/strong><p>Use your email + 6\u2011digit PIN.<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">2<\/span><div class=\"step-content\"><strong>Click \u201cPay Subscription\u201d<\/strong><p>To pay using wallet credit \u2192 click the <strong style=\"color: #3b82f6;\">Blue wallet<\/strong> icon.<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">3<\/span><div class=\"step-content\"><strong>Type \u201cStart\u201d<\/strong><p>Type it and press Send.<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">4<\/span><div class=\"step-content\"><strong>Type \u201c1\u201d<\/strong><p>Select \u201cMy wallet\u201d and Send.<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">5<\/span><div class=\"step-content\"><strong>Type \u201c2\u201d<\/strong><p>Select \u201cPay Subscription\u201d and Send.<\/p><\/div><\/div>\n <div class=\"step-card\"><span class=\"step-number\">6<\/span><div class=\"step-content\"><strong>Choose currency<\/strong><p>Type <strong>1<\/strong> for UGX \/ <strong>2<\/strong> for KES \/ <strong>3<\/strong> for USD \u2192 Send.<\/p><\/div><\/div>\n <div class=\"step-card highlight-step\"><span class=\"step-number\">7<\/span><div class=\"step-content\"><strong>Payment method<\/strong><p>Type <strong>1<\/strong> (Use Mobile: MTN or Mpesa) <strong>OR<\/strong> <strong>2<\/strong> (Use Wallet credit) \u2192 Send.<\/p><\/div><\/div>\n <\/div>\n <div class=\"note-box\">\n <i class=\"fas fa-check-circle\"><\/i>\n <div>\n <p><strong>Activation tip:<\/strong> After step 7 your subscription will be active. For wallet credit payments, ensure sufficient balance. The <strong style=\"color: #3b82f6;\">\u201cBlue wallet\u201d<\/strong> refers to the blue\u2011coloured wallet credit button inside the dashboard.<\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n <\/template>\n\n \n <template id=\"tmpl-revenue\">\n <section class=\"page-content active\">\n <div class=\"container\">\n <span class=\"section-tag\"><i class=\"fas fa-coins\"><\/i> Institutional<\/span>\n <h2 class=\"section-title\">Company <span class=\"gradient\">Revenue Streams<\/span><\/h2>\n <p class=\"section-desc\">\n CashChat generates sustainable, diversified income through platform fees, commissions,\n and premium services \u2014 ensuring long\u2011term operational health.\n <\/p>\n <div class=\"table-wrap\">\n <table>\n <thead>\n <tr><th>Revenue Stream<\/th><th>Description<\/th><th>Fee \/ Rate<\/th><\/tr>\n <\/thead>\n <tbody>\n <tr><td><strong>Wallet Transfers<\/strong><\/td><td>Charged per peer-to-peer wallet transfer<\/td><td><span style=\"color:var(--accent-green);\">UGX 500<\/span> (fixed)<\/td><\/tr>\n <tr><td><strong>Advertising Commissions<\/strong><\/td><td>Retained from digital ad campaigns<\/td><td><span style=\"color:var(--accent-green);\">20%<\/span><\/td><\/tr>\n <tr><td><strong>Video Gift Commissions<\/strong><\/td><td>Retained from total virtual gift volume<\/td><td><span style=\"color:var(--accent-green);\">20%<\/span><\/td><\/tr>\n <tr><td><strong>AI Pro Services<\/strong><\/td><td>Premium AI tool subscriptions and credit sales<\/td><td><span style=\"color:var(--accent-green);\">Variable<\/span><\/td><\/tr>\n <tr><td><strong>Share Trading Fee<\/strong><\/td><td>Fee applied when users sell convertible notes<\/td><td><span style=\"color:var(--accent-green);\">3.5%<\/span><\/td><\/tr>\n <\/tbody>\n <\/table>\n <\/div>\n <\/div>\n <\/section>\n <\/template>\n\n \n <template id=\"tmpl-business\">\n <section class=\"page-content active\" style=\"background: rgba(255, 255, 255, 0.008);\">\n <div class=\"container\">\n <span class=\"section-tag\"><i class=\"fas fa-building\"><\/i> Business Overview<\/span>\n <h2 class=\"section-title\">CashChat <span class=\"gradient\">& CashChat Flicks<\/span><\/h2>\n <p class=\"section-desc-full\">\n A pioneering social-financial super-app that converges digital messaging, financial services,\n content monetization, artificial intelligence, and community-based equity ownership into a single,\n integrated platform.\n <\/p>\n\n \n <div style=\"margin-bottom: 50px;\">\n <h3 style=\"font-size: 1.5rem; font-weight: 800; margin-bottom: 14px; color: #fff;\">Executive Summary<\/h3>\n <div class=\"executive-card\">\n <p>CashChat is a pioneering <strong style=\"color: var(--accent-green);\">social-financial super-app<\/strong> that converges digital messaging, financial services, content monetization, artificial intelligence, and community-based equity ownership into a single, integrated platform. Designed primarily for <strong style=\"color: #fff;\">emerging markets<\/strong>, CashChat empowers users to communicate, transact, earn, and invest\u2014all within a self-sustaining digital economy.<\/p>\n <p style=\"margin-top: 14px;\">A key division of the ecosystem, <strong style=\"color: var(--accent-green);\">CashChat Flicks<\/strong>, serves as the platform’s video-sharing and content monetization arm, enabling creators to earn revenue through fan-supported virtual gifting and advertising partnerships.<\/p>\n <\/div>\n <\/div>\n\n \n <h3 style=\"font-size: 1.5rem; font-weight: 800; margin-bottom: 28px; color: #fff;\">Core <span class=\"gradient\">Products & Services<\/span><\/h3>\n\n <div class=\"feature-card\" style=\"margin-bottom: 24px;\">\n <div class=\"icon-wrap\"><i class=\"fas fa-wallet\"><\/i><\/div>\n <h4>1. Digital Wallet & Financial Services<\/h4>\n <p>At the heart of the ecosystem is a self-custody digital wallet, which functions as each user’s personal financial command center. It enables:<\/p>\n <ul>\n <li><i class=\"fas fa-check-circle\"><\/i> Peer-to-peer money transfers<\/li>\n <li><i class=\"fas fa-check-circle\"><\/i> Bill payments and subscription management<\/li>\n <li><i class=\"fas fa-check-circle\"><\/i> Secure storage of digital assets<\/li>\n <li><i class=\"fas fa-check-circle\"><\/i> Seamless integration with all ecosystem services<\/li>\n <\/ul>\n <\/div>\n\n <div class=\"feature-card\" style=\"margin-bottom: 24px;\">\n <div class=\"icon-wrap\"><i class=\"fas fa-film\"><\/i><\/div>\n <h4>2. CashChat Flicks <span style=\"font-size:0.75rem; color:var(--accent-green); font-weight:600;\">(Video Content Platform)<\/span><\/h4>\n <p>CashChat Flicks is a video-sharing and monetization platform where creators can:<\/p>\n <ul>\n <li><i class=\"fas fa-check-circle\"><\/i> Upload and share video content with the community<\/li>\n <li><i class=\"fas fa-check-circle\"><\/i> Receive virtual gifts from fans, ranging in value from <strong style=\"color: #fff;\">$1 to $300<\/strong><\/li>\n <li><i class=\"fas fa-check-circle\"><\/i> Convert all received gifts into real currency deposited directly into their CashChat wallet<\/li>\n <li><i class=\"fas fa-check-circle\"><\/i> Earn additional revenue through the platform’s CPM-based advertising network<\/li>\n <\/ul>\n <\/div>\n\n <div class=\"feature-card\" style=\"margin-bottom: 24px;\">\n <div class=\"icon-wrap\"><i class=\"fas fa-robot\"><\/i><\/div>\n <h4>3. Artificial Intelligence Services<\/h4>\n <p>CashChat offers a two-tier AI system designed to enhance user experience:<\/p>\n <div class=\"tier-table-wrap\" style=\"margin-top: 14px;\">\n <table class=\"tier-table\">\n <thead><tr><th>Tier<\/th><th>Feature<\/th><th>Cost<\/th><\/tr><\/thead>\n <tbody>\n <tr><td><span class=\"free-badge\"><i class=\"fas fa-star\"><\/i> Free<\/span><\/td><td>Text-based AI assistant (similar to ChatGPT) for general Q&A and conversation<\/td><td><strong style=\"color: var(--accent-green);\">Free<\/strong> for all members<\/td><\/tr>\n <tr><td><span class=\"pro-badge\"><i class=\"fas fa-crown\"><\/i> Pro<\/span><\/td><td>Voice-call AI with multilingual support, including multiple African and international languages<\/td><td><strong style=\"color: #fff;\">Credit-based<\/strong> (pay-per-use):<br>450 credits for <strong style=\"color: var(--accent-green);\">$9.99<\/strong> or<br>1,250 credits for <strong style=\"color: var(--accent-green);\">$24.99<\/strong><\/td><\/tr>\n <\/tbody>\n <\/table>\n <\/div>\n <\/div>\n\n <div class=\"feature-card\" style=\"margin-bottom: 24px;\">\n <div class=\"icon-wrap\"><i class=\"fas fa-hand-holding-usd\"><\/i><\/div>\n <h4>4. Community Crowdfunding & Equity Ownership<\/h4>\n <p>CashChat distinguishes itself through a unique community ownership model. The company has allocated <strong style=\"color: var(--accent-green);\">35% of its total equity<\/strong> exclusively to active members.<\/p>\n <ul style=\"margin-top: 10px;\">\n <li><i class=\"fas fa-check-circle\"><\/i> <strong>Entry Requirement:<\/strong> A one-time <strong style=\"color: #fff;\">$20 lifetime membership fee<\/strong> grants eligibility to participate.<\/li>\n <li><i class=\"fas fa-check-circle\"><\/i> <strong>Share Purchase:<\/strong> Shares cannot be bought with cash. Members must earn referral rewards by bringing new users into the ecosystem.<\/li>\n <\/ul>\n <div class=\"share-grid\">\n <div class=\"share-card\"><h5>Class B Shares<\/h5><p><strong style=\"color: #fff;\">$50<\/strong> per share <span style=\"color:var(--text-muted);\">(10% equity pool)<\/span><\/p><\/div>\n <div class=\"share-card\"><h5>Class C Shares<\/h5><p><strong style=\"color: #fff;\">$30<\/strong> per share <span style=\"color:var(--text-muted);\">(25% equity pool)<\/span><\/p><\/div>\n <\/div>\n <p style=\"margin-top: 10px; color: var(--text-secondary);\"><strong style=\"color: #fff;\">Benefits:<\/strong> Shareholders receive dividends derived from platform revenue, including transaction fees, advertising income, and AI product sales.<\/p>\n <\/div>\n\n <div class=\"feature-card\" style=\"margin-bottom: 24px;\">\n <div class=\"icon-wrap\"><i class=\"fas fa-ad\"><\/i><\/div>\n <h4>5. Advertising Network<\/h4>\n <p>CashChat operates a robust <strong style=\"color: #fff;\">Cost-Per-Mille (CPM)<\/strong> advertising network, supported by a network of over <strong style=\"color: var(--accent-green);\">200,000 ad agents<\/strong>. This provides additional revenue streams for both the platform and its active users.<\/p>\n <\/div>\n\n \n <div style=\"margin: 50px 0 40px;\">\n <h3 style=\"font-size: 1.5rem; font-weight: 800; margin-bottom: 14px; color: #fff;\">\n Payment & Subscription <span class=\"gradient\">Infrastructure<\/span>\n <\/h3>\n <p style=\"color:var(--text-secondary); font-size:0.95rem; margin-bottom: 24px;\">\n CashChatApp supports a hybrid payment model designed to serve both international and regional users.\n <\/p>\n\n \n <div style=\"background:var(--bg-card); border-radius:var(--radius-card); padding: 28px 24px; border:1px solid rgba(255,255,255,0.03); margin-bottom: 24px; transition: var(--transition);\">\n <div style=\"display:flex; align-items:center; gap:12px; margin-bottom:12px; flex-wrap:wrap;\">\n <div style=\"display:flex; align-items:center; gap:10px;\">\n <i class=\"fab fa-stripe\" style=\"font-size:2rem; color:#818cf8;\"><\/i>\n <h4 style=\"font-size:1.2rem; font-weight:700;\">Stripe Integration<\/h4>\n <\/div>\n <span class=\"payment-badge stripe\"><i class=\"fas fa-globe\"><\/i> International<\/span>\n <\/div>\n\n <p style=\"color:var(--text-secondary); font-size:0.92rem; margin-bottom:12px;\">\n CashChatApp utilizes <strong style=\"color:#818cf8;\">Stripe<\/strong> as its primary payment gateway for international transactions. Stripe is used exclusively for:\n <\/p>\n\n <ul style=\"list-style:none; padding:0; margin:0 0 16px 0;\">\n <li style=\"padding:4px 0; display:flex; gap:10px; align-items:flex-start; color:var(--text-secondary); font-size:0.88rem;\">\n <i class=\"fas fa-check-circle\" style=\"color:#818cf8; font-size:0.7rem; margin-top:5px; flex-shrink:0;\"><\/i>\n <span><strong style=\"color:#fff;\">Non-recurring subscription payments<\/strong> \u2013 App users in countries supported by Stripe can pay their one-time subscription fees securely.<\/span>\n <\/li>\n <li style=\"padding:4px 0; display:flex; gap:10px; align-items:flex-start; color:var(--text-secondary); font-size:0.88rem;\">\n <i class=\"fas fa-check-circle\" style=\"color:#818cf8; font-size:0.7rem; margin-top:5px; flex-shrink:0;\"><\/i>\n <span><strong style=\"color:#fff;\">AI Credits purchases<\/strong> \u2013 Users can purchase credits for the AI Pro version directly through Stripe.<\/span>\n <\/li>\n <\/ul>\n\n <div style=\"background:rgba(99,102,241,0.06); border-radius:12px; padding:12px 16px; border-left:3px solid #818cf8;\">\n <p style=\"color:var(--text-secondary); font-size:0.82rem; margin:0;\">\n <i class=\"fas fa-info-circle\" style=\"color:#818cf8; margin-right:8px;\"><\/i>\n <strong style=\"color:#fff;\">Important:<\/strong> Stripe is only available for users located in countries that Stripe actively supports. Users in unsupported regions will not see Stripe as a payment option.\n <\/p>\n <\/div>\n <\/div>\n\n \n <div style=\"background:var(--bg-card); border-radius:var(--radius-card); padding: 28px 24px; border:1px solid rgba(255,255,255,0.03); margin-bottom: 24px; transition: var(--transition);\">\n <div style=\"display:flex; align-items:center; gap:12px; margin-bottom:12px; flex-wrap:wrap;\">\n <div style=\"display:flex; align-items:center; gap:10px;\">\n <i class=\"fas fa-mobile-alt\" style=\"font-size:2rem; color:#fbbf24;\"><\/i>\n <h4 style=\"font-size:1.2rem; font-weight:700;\">Regional Mobile Wallet Support<\/h4>\n <\/div>\n <span class=\"payment-badge mtn\"><i class=\"fas fa-map-marker-alt\"><\/i> Uganda \u00b7 Kenya \u00b7 Rwanda<\/span>\n <\/div>\n\n <p style=\"color:var(--text-secondary); font-size:0.92rem; margin-bottom:12px;\">\n For users in <strong style=\"color:#fff;\">Uganda, Kenya, and Rwanda<\/strong>, CashChatApp offers localized payment solutions through leading mobile money providers:\n <\/p>\n\n <div style=\"display:grid; grid-template-columns:1fr; gap:10px; margin-bottom:14px;\">\n <div style=\"display:flex; align-items:center; gap:12px; background:rgba(255,255,255,0.02); padding:10px 14px; border-radius:10px; border:1px solid rgba(255,255,255,0.03);\">\n <span class=\"payment-badge airtel\"><i class=\"fas fa-phone\"><\/i> Airtel Money<\/span>\n <span style=\"color:var(--text-muted); font-size:0.8rem;\">Uganda \u00b7 Kenya \u00b7 Rwanda<\/span>\n <\/div>\n <div style=\"display:flex; align-items:center; gap:12px; background:rgba(255,255,255,0.02); padding:10px 14px; border-radius:10px; border:1px solid rgba(255,255,255,0.03);\">\n <span class=\"payment-badge mtn\"><i class=\"fas fa-phone\"><\/i> MTN Mobile Money<\/span>\n <span style=\"color:var(--text-muted); font-size:0.8rem;\">Uganda \u00b7 Kenya \u00b7 Rwanda<\/span>\n <\/div>\n <div style=\"display:flex; align-items:center; gap:12px; background:rgba(255,255,255,0.02); padding:10px 14px; border-radius:10px; border:1px solid rgba(255,255,255,0.03);\">\n <span class=\"payment-badge mpesa\"><i class=\"fas fa-phone\"><\/i> M-Pesa<\/span>\n <span style=\"color:var(--text-muted); font-size:0.8rem;\">Kenya \u00b7 Rwanda<\/span>\n <\/div>\n <\/div>\n\n <div style=\"background:rgba(251,191,36,0.06); border-radius:12px; padding:12px 16px; border-left:3px solid #fbbf24;\">\n <p style=\"color:var(--text-secondary); font-size:0.82rem; margin:0;\">\n <i class=\"fas fa-info-circle\" style=\"color:#fbbf24; margin-right:8px;\"><\/i>\n <strong style=\"color:#fff;\">Note:<\/strong> Other features are limited to <strong style=\"color:#fff;\">in-app rewards<\/strong> and the mobile wallet options listed above.\n <\/p>\n <\/div>\n <\/div>\n\n \n <div style=\"background:var(--bg-card); border-radius:var(--radius-card); padding: 24px 24px; border:1px solid rgba(255,255,255,0.03); transition: var(--transition);\">\n <div style=\"display:flex; align-items:center; gap:12px; margin-bottom:10px;\">\n <i class=\"fas fa-gem\" style=\"font-size:1.8rem; color:var(--accent-green);\"><\/i>\n <h4 style=\"font-size:1.1rem; font-weight:700;\">In-App Rewards<\/h4>\n <span class=\"payment-badge\" style=\"border-color:rgba(204,255,0,0.15); color:var(--accent-green);\"><i class=\"fas fa-star\"><\/i> Earn & Redeem<\/span>\n <\/div>\n <p style=\"color:var(--text-secondary); font-size:0.9rem;\">\n CashChatApp provides a robust in-app reward system where users can earn credits through platform engagement, content creation, and community participation. These rewards can be used for:\n <\/p>\n <ul style=\"list-style:none; padding:0; margin-top:8px;\">\n <li style=\"padding:3px 0; display:flex; gap:10px; align-items:flex-start; color:var(--text-secondary); font-size:0.85rem;\">\n <i class=\"fas fa-check-circle\" style=\"color:var(--accent-green); font-size:0.65rem; margin-top:5px; flex-shrink:0;\"><\/i>\n <span>Subscription fee payments<\/span>\n <\/li>\n <li style=\"padding:3px 0; display:flex; gap:10px; align-items:flex-start; color:var(--text-secondary); font-size:0.85rem;\">\n <i class=\"fas fa-check-circle\" style=\"color:var(--accent-green); font-size:0.65rem; margin-top:5px; flex-shrink:0;\"><\/i>\n <span>AI Credits purchases<\/span>\n <\/li>\n <li style=\"padding:3px 0; display:flex; gap:10px; align-items:flex-start; color:var(--text-secondary); font-size:0.85rem;\">\n <i class=\"fas fa-check-circle\" style=\"color:var(--accent-green); font-size:0.65rem; margin-top:5px; flex-shrink:0;\"><\/i>\n <span>Other in-app services<\/span>\n <\/li>\n <\/ul>\n <\/div>\n\n \n <div style=\"margin-top: 28px;\">\n <div class=\"table-wrap\">\n <table>\n <thead>\n <tr>\n <th>Payment Method<\/th>\n <th>Region<\/th>\n <th>Use Case<\/th>\n <\/tr>\n <\/thead>\n <tbody>\n <tr>\n <td><strong style=\"color:#818cf8;\">Stripe<\/strong><\/td>\n <td>Stripe-supported countries<\/td>\n <td>Non-recurring subscriptions & AI Credits<\/td>\n <\/tr>\n <tr>\n <td><strong style=\"color:#fbbf24;\">Airtel Money<\/strong><\/td>\n <td>Uganda, Kenya, Rwanda<\/td>\n <td>Subscriptions & in-app purchases<\/td>\n <\/tr>\n <tr>\n <td><strong style=\"color:#fbbf24;\">MTN Mobile Money<\/strong><\/td>\n <td>Uganda, Kenya, Rwanda<\/td>\n <td>Subscriptions & in-app purchases<\/td>\n <\/tr>\n <tr>\n <td><strong style=\"color:#34d399;\">M-Pesa<\/strong><\/td>\n <td>Kenya, Rwanda<\/td>\n <td>Subscriptions & in-app purchases<\/td>\n <\/tr>\n <tr>\n <td><strong style=\"color:var(--accent-green);\">In-App Rewards<\/strong><\/td>\n <td>Global<\/td>\n <td>Earned credits for subscriptions & AI Credits<\/td>\n <\/tr>\n <\/tbody>\n <\/table>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div style=\"margin: 40px 0 32px;\">\n <h3 style=\"font-size: 1.5rem; font-weight: 800; margin-bottom: 14px; color: #fff;\">Target <span class=\"gradient\">Market<\/span><\/h3>\n <div class=\"grid-3col\">\n <div class=\"card\" style=\"padding: 22px 20px;\"><div style=\"font-size: 2rem; margin-bottom: 10px;\">\ud83c\udf0d<\/div><h4 style=\"font-size:1rem;\">Emerging Markets<\/h4><p style=\"color:var(--text-secondary); font-size:0.88rem;\">Users seeking accessible financial tools and earning opportunities<\/p><\/div>\n <div class=\"card\" style=\"padding: 22px 20px;\"><div style=\"font-size: 2rem; margin-bottom: 10px;\">\ud83c\udfac<\/div><h4 style=\"font-size:1rem;\">Content Creators<\/h4><p style=\"color:var(--text-secondary); font-size:0.88rem;\">Looking for direct fan monetization without intermediaries<\/p><\/div>\n <div class=\"card\" style=\"padding: 22px 20px;\"><div style=\"font-size: 2rem; margin-bottom: 10px;\">\ud83d\udcf1<\/div><h4 style=\"font-size:1rem;\">Everyday Consumers<\/h4><p style=\"color:var(--text-secondary); font-size:0.88rem;\">Who want an all-in-one communication and financial platform<\/p><\/div>\n <div class=\"card\" style=\"padding: 22px 20px;\"><div style=\"font-size: 2rem; margin-bottom: 10px;\">\ud83d\udcc8<\/div><h4 style=\"font-size:1rem;\">Investors<\/h4><p style=\"color:var(--text-secondary); font-size:0.88rem;\">Interested in community-owned digital assets<\/p><\/div>\n <\/div>\n <\/div>\n\n \n <div style=\"margin: 40px 0 32px;\">\n <h3 style=\"font-size: 1.5rem; font-weight: 800; margin-bottom: 14px; color: #fff;\">Revenue <span class=\"gradient\">Model<\/span><\/h3>\n <p style=\"color:var(--text-secondary); margin-bottom: 16px; font-size:0.95rem;\">CashChat generates sustainable revenue through multiple, diversified streams:<\/p>\n <div class=\"table-wrap\">\n <table>\n <thead><tr><th>Revenue Stream<\/th><th>Description<\/th><\/tr><\/thead>\n <tbody>\n <tr><td><strong>Membership Fees<\/strong><\/td><td>One-time <strong style=\"color:#fff;\">$20<\/strong> lifetime activation fee<\/td><\/tr>\n <tr><td><strong>Monthly Subscriptions<\/strong><\/td><td>Premium tier at <strong style=\"color:#fff;\">$9.99\/month<\/strong> for enhanced features<\/td><\/tr>\n <tr><td><strong>Credit Sales<\/strong><\/td><td>AI voice call credits and in-app wallet coins<\/td><\/tr>\n <tr><td><strong>Transaction Fees<\/strong><\/td><td>Small percentage from wallet transfers and gift transactions<\/td><\/tr>\n <tr><td><strong>Advertising Revenue<\/strong><\/td><td>CPM-based ad network sales<\/td><\/tr>\n <tr><td><strong>Commission on Gifts<\/strong><\/td><td>Platform fee on video gifts sent within CashChat Flicks<\/td><\/tr>\n <\/tbody>\n <\/table>\n <\/div>\n <\/div>\n\n \n <div style=\"margin: 40px 0 32px;\">\n <h3 style=\"font-size: 1.5rem; font-weight: 800; margin-bottom: 14px; color: #fff;\">Competitive <span class=\"gradient\">Advantage<\/span><\/h3>\n <div class=\"grid-2col\">\n <div class=\"card\"><div style=\"font-size: 2rem; margin-bottom: 10px;\">\ud83e\udde9<\/div><h4>All-in-One Platform<\/h4><p style=\"color:var(--text-secondary);\">Combines messaging, payments, content, AI, and investment\u2014reducing the need for multiple apps.<\/p><\/div>\n <div class=\"card\"><div style=\"font-size: 2rem; margin-bottom: 10px;\">\ud83e\udd1d<\/div><h4>Community Ownership<\/h4><p style=\"color:var(--text-secondary);\">Members are also potential shareholders, creating strong loyalty and active participation.<\/p><\/div>\n <div class=\"card\"><div style=\"font-size: 2rem; margin-bottom: 10px;\">\ud83c\udf0d<\/div><h4>Emerging Market Focus<\/h4><p style=\"color:var(--text-secondary);\">Multilingual AI and mobile-first design cater specifically to users in Africa and similar markets.<\/p><\/div>\n <div class=\"card\"><div style=\"font-size: 2rem; margin-bottom: 10px;\">\ud83c\udfaf<\/div><h4>Creator Empowerment<\/h4><p style=\"color:var(--text-secondary);\">CashChat Flicks offers direct monetization through gifting, bypassing traditional advertising dependency.<\/p><\/div>\n <div class=\"card\" style=\"grid-column: 1 \/ -1;\"><div style=\"font-size: 2rem; margin-bottom: 10px;\">\ud83d\udce3<\/div><h4>Referral-Driven Growth<\/h4><p style=\"color:var(--text-secondary);\">The reward system incentivizes organic, community-led expansion.<\/p><\/div>\n <\/div>\n <\/div>\n\n \n <div style=\"margin-top: 32px;\">\n <div class=\"executive-card\" style=\"border-left: 4px solid var(--accent-green);\">\n <h3 style=\"font-size: 1.5rem; font-weight: 800; margin-bottom: 10px; color: #fff;\"><i class=\"fas fa-flag-checkered\" style=\"color:var(--accent-green); margin-right:12px;\"><\/i>Conclusion<\/h3>\n <p>CashChat and CashChat Flicks represent a <strong style=\"color: var(--accent-green);\">bold vision<\/strong> for the future of digital communities: a member-owned, financially integrated ecosystem where communication, content creation, and wealth-building coexist seamlessly. By combining essential digital services with equity participation and AI-powered innovation, CashChat is building <strong style=\"color: #fff;\">not just an app, but a sustainable digital economy<\/strong> for its global community.<\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n <\/template>\n\n \n <template id=\"tmpl-integrity\">\n <section class=\"page-content active\">\n <div class=\"container\">\n <span class=\"section-tag\"><i class=\"fas fa-medal\"><\/i> Trust<\/span>\n <h2 class=\"section-title\">Operational Integrity <span class=\"gradient\">& Track Record<\/span><\/h2>\n <p class=\"section-desc\">\n Since launching as Pesamoni in 2016 and evolving into CashChat in 2018, the ecosystem has\n maintained an unblemished record \u2014 no fraud or scam complaints.\n <\/p>\n <div style=\"background:var(--bg-card); backdrop-filter:blur(8px); border-radius:var(--radius-card); padding: 20px 22px; border:1px solid rgba(255,255,255,0.03);\">\n <div class=\"timeline-item\"><div class=\"timeline-year\">2016<\/div><div class=\"timeline-content\"><strong>Pesamoni launched<\/strong><p>Foundation of the financial\u2011social hybrid model.<\/p><\/div><\/div>\n <div class=\"timeline-item\"><div class=\"timeline-year\">2018<\/div><div class=\"timeline-content\"><strong>CashChat social media born<\/strong><p>Transitioned to a full\u2011featured social ecosystem with integrated wallet.<\/p><\/div><\/div>\n <div class=\"timeline-item\"><div class=\"timeline-year\">2020 \u2013 Present<\/div><div class=\"timeline-content\"><strong>Zero fraud complaints<\/strong><p>No verified scam reports, fraud cases, or regulatory violations associated with CashChat.<\/p><div style=\"margin-top:10px; display:inline-flex; gap:8px; flex-wrap:wrap;\"><span style=\"background:rgba(204,255,0,0.06); color:var(--accent-green); padding:4px 14px; border-radius:100px; font-size:0.7rem; font-weight:600; border:1px solid rgba(204,255,0,0.08);\"><i class=\"fas fa-check-circle\"><\/i> Fully compliant<\/span><span style=\"background:rgba(250,204,21,0.06); color:#facc15; padding:4px 14px; border-radius:100px; font-size:0.7rem; font-weight:600; border:1px solid rgba(250,204,21,0.08);\"><i class=\"fas fa-building-columns\"><\/i> URSB registered<\/span><\/div><\/div><\/div>\n <\/div>\n <\/div>\n <\/section>\n <\/template>\n\n \n <footer>\n <div class=\"container\">\n <div class=\"footer-grid\">\n <div class=\"footer-brand\">\n <div class=\"logo-small\">\n <i class=\"fas fa-film\"><\/i>\n <span style=\"font-weight:800;\">CashChat<span style=\"color:var(--accent-green);\">Flicks<\/span><\/span>\n <\/div>\n <p>The social-financial super-app that converges messaging, payments, content monetization, AI, and community equity into one integrated platform.<\/p>\n <\/div>\n <div class=\"footer-company\">\n <h4><i class=\"fas fa-building\" style=\"color:var(--accent-green); margin-right:8px;\"><\/i>Company<\/h4>\n <p><span class=\"company-name\">CASHCHAT LTD<\/span><\/p>\n <p>Dundas Way, Gateshead, Newcastle<\/p>\n <p>United Kingdom<\/p>\n <p style=\"margin-top:6px;\">Company Number: <span class=\"company-number\">17364747<\/span><\/p>\n <p style=\"font-size:0.75rem; color:var(--text-muted); margin-top:4px;\">Incorporated in England & Wales<\/p>\n <\/div>\n <div class=\"footer-links\">\n <h4><i class=\"fas fa-link\" style=\"color:var(--accent-green); margin-right:8px;\"><\/i>Quick Links<\/h4>\n <div class=\"link-group\">\n <a href=\"https:\/\/ai.cashchatapp.com\/privacy\" target=\"_blank\"><i class=\"fas fa-shield-alt\"><\/i> Privacy Policy<\/a>\n <a href=\"https:\/\/ai.cashchatapp.com\/terms\" target=\"_blank\"><i class=\"fas fa-file-contract\"><\/i> Terms of Service<\/a>\n <a href=\"#integrity\" data-page=\"integrity\"><i class=\"fas fa-history\"><\/i> Integrity & Track Record<\/a>\n <\/div>\n <div style=\"margin-top:14px;\">\n <h4 style=\"font-size:0.85rem; font-weight:600; color:var(--text-secondary); margin-bottom:6px;\"><i class=\"fas fa-headset\" style=\"color:#25D366; margin-right:8px;\"><\/i>Support<\/h4>\n <div class=\"footer-support\">\n <a href=\"https:\/\/wa.me\/46769112941\" target=\"_blank\" class=\"btn btn-support\"><i class=\"fab fa-whatsapp\"><\/i> +46 769 112 941<\/a>\n <a href=\"https:\/\/wa.me\/46734832708\" target=\"_blank\" class=\"btn btn-support\"><i class=\"fab fa-whatsapp\"><\/i> +46 734 832 708<\/a>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"footer-bottom\">\n <p><i class=\"fas fa-film\" style=\"margin-right:6px;\"><\/i> © 2026 CashChat Ecosystem. All rights reserved.<\/p>\n <div class=\"footer-legal-links\">\n <a href=\"https:\/\/ai.cashchatapp.com\/privacy\" target=\"_blank\">Privacy<\/a>\n <a href=\"https:\/\/ai.cashchatapp.com\/terms\" target=\"_blank\">Terms<\/a>\n <a href=\"#integrity\" data-page=\"integrity\">Integrity<\/a>\n <a href=\"https:\/\/ai.cashchatapp.com\" target=\"_blank\" class=\"flicks-link\">CashChat Flicks<\/a>\n <\/div>\n <\/div>\n <\/div>\n <\/footer>\n\n \n <script>\n \/\/ ---- Hamburger ----\n const menuToggle = document.getElementById('menuToggle');\n const navLinks = document.getElementById('navLinks');\n\n menuToggle.addEventListener('click', () => {\n navLinks.classList.toggle('open');\n const icon = menuToggle.querySelector('i');\n icon.className = navLinks.classList.contains('open') ? 'fas fa-times' : 'fas fa-bars';\n });\n\n document.querySelectorAll('.nav-links a').forEach(link => {\n link.addEventListener('click', () => {\n navLinks.classList.remove('open');\n const icon = menuToggle.querySelector('i');\n if (icon) icon.className = 'fas fa-bars';\n });\n });\n\n \/\/ ---- Router ----\n const app = document.getElementById('app');\n\n function navigateTo(page) {\n if (window.location.hash !== '#' + page) {\n history.pushState(null, '', '#' + page);\n }\n\n document.querySelectorAll('.nav-links a[data-page]').forEach(link => {\n link.classList.toggle('active', link.dataset.page === page);\n });\n\n document.querySelectorAll('.bottom-nav a[data-page]').forEach(link => {\n link.classList.toggle('active', link.dataset.page === page);\n });\n\n let targetPage = app.querySelector(`.page-content[data-page=\"${page}\"]`);\n if (targetPage) {\n app.querySelectorAll('.page-content').forEach(p => p.classList.remove('active'));\n targetPage.classList.add('active');\n triggerAnimations(targetPage);\n return;\n }\n\n const template = document.getElementById(`tmpl-${page}`);\n if (!template) {\n console.warn(`Page \"${page}\" not found.`);\n return;\n }\n\n const clone = template.content.cloneNode(true);\n const section = clone.querySelector('section');\n if (!section) return;\n\n section.dataset.page = page;\n section.classList.add('page-content');\n app.appendChild(section);\n\n app.querySelectorAll('.page-content').forEach(p => p.classList.remove('active'));\n section.classList.add('active');\n\n triggerAnimations(section);\n }\n\n function triggerAnimations(container) {\n const targets = container.querySelectorAll('.card, .step-card, .feature-card, .executive-card, .share-card, .mockup-card');\n targets.forEach((el, index) => {\n el.style.opacity = '0';\n el.style.transform = 'translateY(24px)';\n setTimeout(() => {\n el.style.opacity = '1';\n el.style.transform = 'translateY(0)';\n }, 80 + index * 40);\n });\n }\n\n function handleRoute() {\n const hash = window.location.hash.slice(1) || 'home';\n navigateTo(hash);\n }\n\n window.addEventListener('hashchange', handleRoute);\n\n document.querySelectorAll('a[data-page]').forEach(link => {\n link.addEventListener('click', (e) => {\n e.preventDefault();\n const page = link.dataset.page;\n if (page) {\n window.location.hash = page;\n }\n });\n });\n\n window.addEventListener('scroll', () => {\n const navbar = document.getElementById('navbar');\n navbar.style.boxShadow = window.scrollY > 10 ? '0 4px 30px rgba(0,0,0,0.5)' : 'none';\n });\n\n document.addEventListener('DOMContentLoaded', () => {\n if (!window.location.hash) {\n window.location.hash = 'home';\n } else {\n handleRoute();\n }\n });\n\n window.addEventListener('popstate', handleRoute);\n\n document.addEventListener('click', (e) => {\n if (navLinks.classList.contains('open')) {\n const isClickInside = navLinks.contains(e.target) || menuToggle.contains(e.target);\n if (!isClickInside) {\n navLinks.classList.remove('open');\n const icon = menuToggle.querySelector('i');\n if (icon) icon.className = 'fas fa-bars';\n }\n }\n });\n <\/script>\n\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>CashChat Flicks \u00b7 Multi-Page SPA CashChat Flicks Home Ad Model Gifts Register Activate Revenue Business Install Home Ad Model Gifts Register Activate Business Revenue Zero fraud complaints since 2016 The future of creator monetization CashChat Flicks combines digital advertising, virtual gifting, and a proprietary convertible\u2011note economy to build a self\u2011sustaining ecosystem. Create Wallet Login Install […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"pagelayer_contact_templates":[],"_pagelayer_content":"","footnotes":""},"class_list":["post-299","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/cashchat.se\/dir\/wp-json\/wp\/v2\/pages\/299","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cashchat.se\/dir\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/cashchat.se\/dir\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/cashchat.se\/dir\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/cashchat.se\/dir\/wp-json\/wp\/v2\/comments?post=299"}],"version-history":[{"count":8,"href":"https:\/\/cashchat.se\/dir\/wp-json\/wp\/v2\/pages\/299\/revisions"}],"predecessor-version":[{"id":335,"href":"https:\/\/cashchat.se\/dir\/wp-json\/wp\/v2\/pages\/299\/revisions\/335"}],"wp:attachment":[{"href":"https:\/\/cashchat.se\/dir\/wp-json\/wp\/v2\/media?parent=299"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}