{"id":8,"date":"2026-07-22T18:56:12","date_gmt":"2026-07-22T18:56:12","guid":{"rendered":"https:\/\/paylater.lol\/?page_id=8"},"modified":"2026-07-23T04:21:13","modified_gmt":"2026-07-23T04:21:13","slug":"elementor-8","status":"publish","type":"page","link":"https:\/\/paylater.lol\/","title":{"rendered":"Elementor #8"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\r\n\r\n\r\n \r\n \r\n PAYLATER ($PAYLATER) - The Currency of Tomorrow<\/title>\r\n <!-- Google Fonts Poppins -->\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Poppins:ital,wght@0,300;0,400;0,600;1,700;1,800&display=swap\" rel=\"stylesheet\">\r\n\r\n <style>\r\n \/* --- CSS VARIABLES FOR THEMES --- *\/\r\n :root {\r\n --bg-color: #050507;\r\n --text-main: #e2e8f0;\r\n --text-muted: #9ca3af;\r\n --grid-line: rgba(255, 255, 255, 0.03);\r\n --glass-bg: rgba(20, 20, 28, 0.65);\r\n --glass-border: rgba(249, 115, 22, 0.3);\r\n --modal-bg: rgba(15, 15, 22, 0.95);\r\n --card-bg: rgba(255, 255, 255, 0.02);\r\n --card-border: rgba(255, 255, 255, 0.06);\r\n --footer-border: rgba(255, 255, 255, 0.05);\r\n --heading-gradient: linear-gradient(180deg, #ffffff 0%, #a1a1aa 100%);\r\n --glow-opacity: 0.35;\r\n }\r\n\r\n [data-theme=\"light\"] {\r\n --bg-color: #f8fafc;\r\n --text-main: #0f172a;\r\n --text-muted: #475569;\r\n --grid-line: rgba(0, 0, 0, 0.04);\r\n --glass-bg: rgba(255, 255, 255, 0.75);\r\n --glass-border: rgba(249, 115, 22, 0.4);\r\n --modal-bg: rgba(255, 255, 255, 0.95);\r\n --card-bg: rgba(0, 0, 0, 0.02);\r\n --card-border: rgba(0, 0, 0, 0.08);\r\n --footer-border: rgba(0, 0, 0, 0.08);\r\n --heading-gradient: linear-gradient(180deg, #0f172a 0%, #334155 100%);\r\n --glow-opacity: 0.2;\r\n }\r\n\r\n \/* --- RESET & BASIC STYLES --- *\/\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n transition: background-color 0.4s ease, color 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease;\r\n }\r\n\r\n body {\r\n font-family: 'Poppins', sans-serif;\r\n font-weight: 300;\r\n background-color: var(--bg-color);\r\n color: var(--text-main);\r\n min-height: 100vh;\r\n width: 100vw;\r\n overflow-x: hidden;\r\n position: relative;\r\n }\r\n\r\n \/* --- TYPOGRAPHY RULES --- *\/\r\n h1, h2, h3, .heading-font {\r\n font-family: 'Poppins', sans-serif;\r\n font-weight: 800;\r\n font-style: italic;\r\n text-transform: uppercase;\r\n letter-spacing: -0.5px;\r\n }\r\n\r\n p, span, td, th {\r\n font-weight: 300;\r\n }\r\n\r\n \/* --- DYNAMIC BACKGROUND & GRID --- *\/\r\n .bg-container {\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n width: 100vw;\r\n height: 100vh;\r\n z-index: -3;\r\n background-color: var(--bg-color);\r\n background-image: \r\n linear-gradient(to right, var(--grid-line) 1px, transparent 1px),\r\n linear-gradient(to bottom, var(--grid-line) 1px, transparent 1px);\r\n background-size: 50px 50px;\r\n }\r\n\r\n \/* CANVAS UNTUK EFEK MOUSE PARTIKEL & OMBAK *\/\r\n #interactiveCanvas {\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n width: 100vw;\r\n height: 100vh;\r\n z-index: -1;\r\n pointer-events: none;\r\n }\r\n\r\n \/* MOUSE GLOW ORB FLUID *\/\r\n .cursor-glow {\r\n position: fixed;\r\n width: 350px;\r\n height: 350px;\r\n background: radial-gradient(circle, rgba(249, 115, 22, 0.25) 0%, rgba(234, 88, 12, 0.08) 50%, transparent 70%);\r\n border-radius: 50%;\r\n pointer-events: none;\r\n transform: translate(-50%, -50%);\r\n z-index: -2;\r\n transition: transform 0.1s ease-out;\r\n filter: blur(40px);\r\n }\r\n\r\n .glow-orb {\r\n position: fixed;\r\n border-radius: 50%;\r\n filter: blur(120px);\r\n opacity: var(--glow-opacity);\r\n z-index: -2;\r\n animation: floatGlow 12s infinite alternate ease-in-out;\r\n pointer-events: none;\r\n }\r\n\r\n .glow-1 {\r\n width: 450px;\r\n height: 450px;\r\n background: #d97706;\r\n top: -100px;\r\n left: -100px;\r\n }\r\n\r\n .glow-2 {\r\n width: 550px;\r\n height: 550px;\r\n background: #ea580c;\r\n bottom: -150px;\r\n right: -150px;\r\n animation-delay: -6s;\r\n }\r\n\r\n @keyframes floatGlow {\r\n 0% { transform: translate(0, 0) scale(1); }\r\n 100% { transform: translate(50px, 30px) scale(1.15); }\r\n }\r\n\r\n \/* --- PRELOADER --- *\/\r\n #preloader {\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n background: var(--bg-color);\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n align-items: center;\r\n z-index: 9999;\r\n transition: opacity 0.6s ease, visibility 0.6s ease;\r\n }\r\n\r\n .loader-logo {\r\n width: 140px;\r\n height: auto;\r\n object-fit: contain;\r\n animation: logoPulse 1.5s infinite ease-in-out;\r\n filter: drop-shadow(0 0 25px rgba(249, 115, 22, 0.6));\r\n }\r\n\r\n @keyframes logoPulse {\r\n 0%, 100% {\r\n transform: scale(0.95);\r\n filter: drop-shadow(0 0 15px rgba(249, 115, 22, 0.4));\r\n }\r\n 50% {\r\n transform: scale(1.05);\r\n filter: drop-shadow(0 0 35px rgba(249, 115, 22, 0.8));\r\n }\r\n }\r\n\r\n \/* --- MAIN WRAPPER --- *\/\r\n .page-wrapper {\r\n min-height: 100vh;\r\n max-width: 1200px;\r\n margin: 0 auto;\r\n padding: 20px 30px;\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n }\r\n\r\n \/* --- NAVIGATION --- *\/\r\n nav {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n height: 70px;\r\n }\r\n\r\n .brand-logo img {\r\n height: 45px;\r\n width: auto;\r\n object-fit: contain;\r\n filter: drop-shadow(0 2px 10px rgba(249, 115, 22, 0.2));\r\n transition: transform 0.3s ease;\r\n }\r\n\r\n .brand-logo img:hover {\r\n transform: scale(1.05);\r\n }\r\n\r\n .nav-links {\r\n display: flex;\r\n gap: 12px;\r\n align-items: center;\r\n }\r\n\r\n \/* --- BUTTONS & GLASS --- *\/\r\n .btn {\r\n padding: 10px 22px;\r\n border-radius: 30px;\r\n text-decoration: none;\r\n font-weight: 600;\r\n font-size: 0.85rem;\r\n cursor: pointer;\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 8px;\r\n border: none;\r\n outline: none;\r\n }\r\n\r\n .btn-primary {\r\n background: linear-gradient(135deg, #f97316 0%, #ea580c 100%);\r\n color: #fff;\r\n box-shadow: 0 4px 15px rgba(249, 115, 22, 0.3);\r\n }\r\n\r\n .btn-primary:hover {\r\n box-shadow: 0 6px 20px rgba(249, 115, 22, 0.5);\r\n transform: translateY(-2deg);\r\n }\r\n\r\n .btn-secondary {\r\n background: var(--card-bg);\r\n color: var(--text-main);\r\n border: 1px solid var(--card-border);\r\n backdrop-filter: blur(10px);\r\n }\r\n\r\n .btn-secondary:hover {\r\n border-color: rgba(249, 115, 22, 0.4);\r\n transform: translateY(-2deg);\r\n }\r\n\r\n .btn-icon {\r\n padding: 0;\r\n border-radius: 50%;\r\n width: 40px;\r\n height: 40px;\r\n }\r\n\r\n .btn-icon svg {\r\n width: 18px;\r\n height: 18px;\r\n fill: var(--text-main);\r\n }\r\n\r\n \/* THEME TOGGLE BUTTON *\/\r\n .theme-toggle-btn {\r\n background: var(--card-bg);\r\n border: 1px solid var(--card-border);\r\n color: var(--text-main);\r\n width: 40px;\r\n height: 40px;\r\n border-radius: 50%;\r\n cursor: pointer;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n font-size: 1.1rem;\r\n }\r\n\r\n .theme-toggle-btn:hover {\r\n border-color: #f97316;\r\n transform: scale(1.08);\r\n }\r\n\r\n \/* --- HERO SECTION --- *\/\r\n .hero-section {\r\n display: grid;\r\n grid-template-columns: 1.1fr 0.9fr;\r\n gap: 40px;\r\n align-items: center;\r\n flex-grow: 1;\r\n padding: 20px 0;\r\n }\r\n\r\n .hero-text h1 {\r\n font-size: 3.2rem;\r\n line-height: 1.1;\r\n margin-bottom: 20px;\r\n background: var(--heading-gradient);\r\n -webkit-background-clip: text;\r\n -webkit-text-fill-color: transparent;\r\n }\r\n\r\n .hero-text p {\r\n font-size: 1.05rem;\r\n color: var(--text-muted);\r\n margin-bottom: 25px;\r\n line-height: 1.6;\r\n max-width: 500px;\r\n }\r\n\r\n \/* LIVE CA HERO WIDGET *\/\r\n .hero-ca-bar {\r\n background: var(--glass-bg);\r\n backdrop-filter: blur(16px);\r\n -webkit-backdrop-filter: blur(16px);\r\n border: 1px solid var(--glass-border);\r\n border-radius: 16px;\r\n padding: 10px 16px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n max-width: 480px;\r\n margin-bottom: 25px;\r\n box-shadow: 0 10px 30px rgba(0,0,0,0.1);\r\n position: relative;\r\n }\r\n\r\n .ca-info-label {\r\n font-size: 0.7rem;\r\n text-transform: uppercase;\r\n color: #f97316;\r\n font-weight: 700;\r\n letter-spacing: 1px;\r\n display: block;\r\n }\r\n\r\n .hero-ca-text {\r\n font-family: monospace;\r\n font-size: 0.85rem;\r\n color: var(--text-main);\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n white-space: nowrap;\r\n max-width: 280px;\r\n }\r\n\r\n .copy-btn-mini {\r\n background: rgba(249, 115, 22, 0.15);\r\n color: #f97316;\r\n border: 1px solid rgba(249, 115, 22, 0.4);\r\n padding: 6px 14px;\r\n border-radius: 8px;\r\n font-size: 0.75rem;\r\n font-weight: 600;\r\n cursor: pointer;\r\n }\r\n\r\n .copy-btn-mini:hover {\r\n background: #f97316;\r\n color: #fff;\r\n }\r\n\r\n .hero-cta {\r\n display: flex;\r\n gap: 12px;\r\n flex-wrap: wrap;\r\n }\r\n\r\n .hero-image-box {\r\n text-align: center;\r\n position: relative;\r\n }\r\n\r\n .hero-image-box img {\r\n max-width: 85%;\r\n height: auto;\r\n border-radius: 24px;\r\n filter: drop-shadow(0 15px 30px rgba(0,0,0,0.3));\r\n animation: floatHero 4s ease-in-out infinite;\r\n }\r\n\r\n @keyframes floatHero {\r\n 0%, 100% { transform: translateY(0); }\r\n 50% { transform: translateY(-12px); }\r\n }\r\n\r\n \/* --- FOOTER --- *\/\r\n footer {\r\n height: 50px;\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n border-top: 1px solid var(--footer-border);\r\n font-size: 0.8rem;\r\n color: var(--text-muted);\r\n }\r\n\r\n \/* --- GLASS MODAL SYSTEM --- *\/\r\n .modal-overlay {\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n width: 100vw;\r\n height: 100vh;\r\n background: rgba(0, 0, 0, 0.7);\r\n backdrop-filter: blur(16px);\r\n -webkit-backdrop-filter: blur(16px);\r\n display: flex;\r\n justify-content: center;\r\n align-items: flex-end;\r\n z-index: 1000;\r\n opacity: 0;\r\n pointer-events: none;\r\n transition: opacity 0.4s ease;\r\n }\r\n\r\n .modal-overlay.active {\r\n opacity: 1;\r\n pointer-events: auto;\r\n }\r\n\r\n .glass-modal {\r\n background: var(--modal-bg);\r\n border: 1px solid var(--glass-border);\r\n border-bottom: none;\r\n border-radius: 28px 28px 0 0;\r\n width: 100%;\r\n max-width: 950px;\r\n max-height: 88vh;\r\n padding: 40px 35px;\r\n overflow-y: auto;\r\n position: relative;\r\n transform: translateY(100%);\r\n transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);\r\n box-shadow: 0 -20px 60px rgba(0, 0, 0, 0.3), 0 0 30px rgba(249, 115, 22, 0.1);\r\n }\r\n\r\n .modal-overlay.active .glass-modal {\r\n transform: translateY(0);\r\n }\r\n\r\n .close-btn {\r\n position: absolute;\r\n top: 25px;\r\n right: 30px;\r\n background: var(--card-bg);\r\n border: 1px solid var(--card-border);\r\n color: var(--text-muted);\r\n width: 40px;\r\n height: 40px;\r\n border-radius: 50%;\r\n font-size: 1.3rem;\r\n cursor: pointer;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n z-index: 10;\r\n }\r\n\r\n .close-btn:hover {\r\n color: #fff;\r\n background: #f97316;\r\n border-color: #f97316;\r\n transform: rotate(90deg);\r\n }\r\n\r\n \/* 2 COLUMNS MODAL LAYOUT *\/\r\n .modal-grid {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 30px;\r\n margin-top: 10px;\r\n }\r\n\r\n \/* HOVER EFFECTS FOR CARDS INSIDE POP-UP *\/\r\n .pop-card {\r\n background: var(--card-bg);\r\n border: 1px solid var(--card-border);\r\n border-radius: 18px;\r\n padding: 22px;\r\n margin-bottom: 20px;\r\n position: relative;\r\n overflow: hidden;\r\n }\r\n\r\n .pop-card::before {\r\n content: '';\r\n position: absolute;\r\n top: 0;\r\n left: -100%;\r\n width: 100%;\r\n height: 100%;\r\n background: linear-gradient(90deg, transparent, rgba(249, 115, 22, 0.1), transparent);\r\n transition: 0.6s;\r\n pointer-events: none;\r\n }\r\n\r\n .pop-card:hover::before {\r\n left: 100%;\r\n }\r\n\r\n .pop-card:hover {\r\n border-color: rgba(249, 115, 22, 0.5);\r\n transform: translateY(-4px) scale(1.01);\r\n box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15), 0 0 15px rgba(249, 115, 22, 0.15);\r\n }\r\n\r\n .modal-title {\r\n font-size: 1.4rem;\r\n color: var(--text-main);\r\n margin-bottom: 12px;\r\n display: flex;\r\n align-items: center;\r\n gap: 8px;\r\n }\r\n\r\n .modal-body {\r\n font-size: 0.9rem;\r\n color: var(--text-muted);\r\n line-height: 1.6;\r\n }\r\n\r\n .ca-box {\r\n display: flex;\r\n background: var(--bg-color);\r\n border: 1px solid var(--card-border);\r\n border-radius: 12px;\r\n padding: 10px 14px;\r\n align-items: center;\r\n justify-content: space-between;\r\n gap: 10px;\r\n margin-top: 15px;\r\n }\r\n\r\n .ca-text {\r\n font-family: monospace;\r\n font-size: 0.85rem;\r\n color: #f97316;\r\n word-break: break-all;\r\n }\r\n\r\n .copy-toast {\r\n position: fixed;\r\n bottom: 30px;\r\n left: 50%;\r\n transform: translateX(-50%);\r\n background: #10b981;\r\n color: #fff;\r\n padding: 10px 20px;\r\n border-radius: 30px;\r\n font-size: 0.85rem;\r\n font-weight: 600;\r\n box-shadow: 0 10px 25px rgba(16, 185, 129, 0.4);\r\n display: none;\r\n z-index: 10000;\r\n animation: fadeIn 0.3s ease;\r\n }\r\n\r\n @keyframes fadeIn {\r\n from { opacity: 0; transform: translate(-50%, 10px); }\r\n to { opacity: 1; transform: translate(-50%, 0); }\r\n }\r\n\r\n .tokenomics-table {\r\n width: 100%;\r\n border-collapse: collapse;\r\n }\r\n\r\n .tokenomics-table th, .tokenomics-table td {\r\n padding: 10px 12px;\r\n text-align: left;\r\n border-bottom: 1px solid var(--card-border);\r\n font-size: 0.85rem;\r\n color: var(--text-main);\r\n }\r\n\r\n .tokenomics-table th {\r\n color: #f97316;\r\n font-weight: 700;\r\n }\r\n\r\n .step-item {\r\n margin-bottom: 10px;\r\n background: var(--bg-color);\r\n padding: 12px;\r\n border-radius: 10px;\r\n border: 1px solid var(--card-border);\r\n }\r\n\r\n .step-item h4 {\r\n color: #f97316;\r\n font-size: 0.85rem;\r\n margin-bottom: 2px;\r\n }\r\n\r\n .step-item p {\r\n font-size: 0.8rem;\r\n color: var(--text-muted);\r\n }\r\n\r\n \/* --- RESPONSIVE MOBILE --- *\/\r\n @media (max-width: 868px) {\r\n body {\r\n overflow-y: auto;\r\n }\r\n\r\n .page-wrapper {\r\n min-height: 100vh;\r\n padding: 15px 20px;\r\n }\r\n\r\n nav {\r\n flex-direction: column;\r\n gap: 15px;\r\n height: auto;\r\n padding-bottom: 10px;\r\n }\r\n\r\n .hero-section {\r\n grid-template-columns: 1fr;\r\n text-align: center;\r\n gap: 20px;\r\n margin: 20px 0;\r\n }\r\n\r\n .hero-text h1 {\r\n font-size: 2.2rem;\r\n }\r\n\r\n .hero-text p {\r\n margin: 0 auto 20px auto;\r\n }\r\n\r\n .hero-ca-bar {\r\n margin: 0 auto 25px auto;\r\n }\r\n\r\n .hero-cta {\r\n justify-content: center;\r\n }\r\n\r\n .modal-grid {\r\n grid-template-columns: 1fr;\r\n gap: 0;\r\n }\r\n\r\n footer {\r\n flex-direction: column;\r\n gap: 5px;\r\n height: auto;\r\n padding: 15px 0;\r\n }\r\n\r\n .glass-modal {\r\n border-radius: 20px 20px 0 0;\r\n padding: 25px 20px;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n\r\n <!-- Background Elements & Interactive Mouse Effects -->\r\n <div class=\"bg-container\"><\/div>\r\n <div class=\"cursor-glow\" id=\"cursorGlow\"><\/div>\r\n <canvas id=\"interactiveCanvas\"><\/canvas>\r\n \r\n <div class=\"glow-orb glow-1\"><\/div>\r\n <div class=\"glow-orb glow-2\"><\/div>\r\n\r\n <!-- Preloader with LOGO3 -->\r\n <div id=\"preloader\">\r\n <img decoding=\"async\" src=\"https:\/\/paylater.lol\/wp-content\/uploads\/2026\/07\/LOGO3.png\" alt=\"PAYLATER Loading Logo\" class=\"loader-logo\">\r\n <\/div>\r\n\r\n <!-- Global Toast Notification -->\r\n <div class=\"copy-toast\" id=\"globalToast\">\u2713 Contract Address Copied!<\/div>\r\n\r\n <!-- MAIN 1-PAGE WRAPPER -->\r\n <div class=\"page-wrapper\">\r\n \r\n <!-- Header \/ Navigation -->\r\n <nav>\r\n <a href=\"#\" class=\"brand-logo\">\r\n <img decoding=\"async\" src=\"https:\/\/paylater.lol\/wp-content\/uploads\/2026\/07\/LOGO1-scaled.png\" alt=\"PAYLATER Logo\">\r\n <\/a>\r\n <div class=\"nav-links\">\r\n <!-- Theme Toggle Button -->\r\n <button class=\"theme-toggle-btn\" id=\"themeToggle\" title=\"Switch Theme\">\ud83c\udf19<\/button>\r\n\r\n <!-- Telegram Icon SVG -->\r\n <a href=\"https:\/\/t.me\/thepaylater\" target=\"_blank\" class=\"btn btn-secondary btn-icon\" title=\"Telegram\">\r\n <svg viewBox=\"0 0 24 24\">\r\n <path d=\"M12 0C5.37 0 0 5.37 0 12s5.37 12 12 12 12-5.37 12-12S18.63 0 12 0zm5.56 8.16l-2.02 9.51c-.15.68-.55.85-1.12.53l-3.08-2.27-1.48 1.43c-.16.16-.3.3-.62.3l.22-3.12 5.68-5.13c.25-.22-.05-.34-.38-.12l-7.02 4.42-3.03-.95c-.66-.21-.67-.66.14-.98l11.83-4.56c.55-.2 1.03.13.88.94z\"\/>\r\n <\/svg>\r\n <\/a>\r\n <!-- Twitter (X) Icon SVG -->\r\n <a href=\"https:\/\/x.com\/thepaylater\" target=\"_blank\" class=\"btn btn-secondary btn-icon\" title=\"Twitter \/ X\">\r\n <svg viewBox=\"0 0 24 24\">\r\n <path d=\"M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z\"\/>\r\n <\/svg>\r\n <\/a>\r\n <a href=\"https:\/\/dexscreener.com\/solana\/2Fvx8YB6msVppWcf9S3Ba3iVvuZT2DMeWBiUGFVYpump\" target=\"_blank\" class=\"btn btn-secondary\">Live Chart<\/a>\r\n <a href=\"https:\/\/swap.pump.fun\/?input=So11111111111111111111111111111111111111112&output=2Fvx8YB6msVppWcf9S3Ba3iVvuZT2DMeWBiUGFVYpump\" target=\"_blank\" class=\"btn btn-primary\">Swap Now<\/a>\r\n <\/div>\r\n <\/nav>\r\n\r\n <!-- Centralized Hero Section -->\r\n <main class=\"hero-section\">\r\n <div class=\"hero-text\">\r\n <h1>The Currency of Tomorrow. Quite Literally.<\/h1>\r\n <p>Designed for those who know the best decisions are made with a little patience. No rush, no pressure\u2014just $PAYLATER.<\/p>\r\n \r\n <!-- Direct Copyable CA Bar -->\r\n <div class=\"hero-ca-bar\">\r\n <div>\r\n <span class=\"ca-info-label\">Contract Address<\/span>\r\n <div class=\"hero-ca-text\" id=\"heroCaText\">2Fvx8YB6msVppWcf9S3Ba3iVvuZT2DMeWBiUGFVYpump<\/div>\r\n <\/div>\r\n <button class=\"copy-btn-mini\" onclick=\"copyCA('heroCaText')\">Copy<\/button>\r\n <\/div>\r\n\r\n <div class=\"hero-cta\">\r\n <a href=\"https:\/\/swap.pump.fun\/?input=So11111111111111111111111111111111111111112&output=2Fvx8YB6msVppWcf9S3Ba3iVvuZT2DMeWBiUGFVYpump\" target=\"_blank\" class=\"btn btn-primary\">Get $PAYLATER<\/a>\r\n <\/div>\r\n <\/div>\r\n <div class=\"hero-image-box\">\r\n <img decoding=\"async\" src=\"https:\/\/paylater.lol\/wp-content\/uploads\/2026\/07\/ASET-PAYLATER.gif\" alt=\"PAYLATER Asset\">\r\n <\/div>\r\n <\/main>\r\n\r\n <!-- Footer -->\r\n <footer>\r\n <p>© 2026 PAYLATER ($PAYLATER). All rights reserved.<\/p>\r\n <p><a href=\"javascript:void(0)\" onclick=\"openModal('infoModal')\" style=\"color:#f97316; text-decoration:none;\">Philosophy & Tokenomics<\/a><\/p>\r\n <\/footer>\r\n\r\n <\/div>\r\n\r\n <!-- POP-UP MODAL: 2 COLUMNS LAYOUT WITH HOVER EFFECTS -->\r\n <div class=\"modal-overlay\" id=\"infoModal\">\r\n <div class=\"glass-modal\">\r\n <button class=\"close-btn\" onclick=\"closeModal('infoModal')\">×<\/button>\r\n \r\n <div class=\"modal-grid\">\r\n <!-- LEFT COLUMN -->\r\n <div class=\"modal-col\">\r\n <!-- About Card -->\r\n <div class=\"pop-card\">\r\n <h3 class=\"modal-title heading-font\">Our Philosophy<\/h3>\r\n <div class=\"modal-body\">\r\n <p>Life moves fast, but your financial decisions don't always have to. PAYLATER is a digital token dedicated to the simple art of taking a pause. It is not a credit service, a loan, or a financial obligation\u2014it\u2019s about giving yourself breathing room. We created $PAYLATER for anyone who believes that whatever needs to be handled can comfortably wait until tomorrow.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- How It Works Card -->\r\n <div class=\"pop-card\">\r\n <h3 class=\"modal-title heading-font\">How It Works<\/h3>\r\n <div class=\"modal-body\">\r\n <div class=\"step-item\">\r\n <h4>1. Acquire (Simple & Seamless)<\/h4>\r\n <p>Purchase $PAYLATER easily through decentralized exchanges and secure it in your crypto wallet.<\/p>\r\n <\/div>\r\n <div class=\"step-item\">\r\n <h4>2. Hold (Zero Stress)<\/h4>\r\n <p>Enjoy complete peace of mind. No due dates, no automated reminders, and zero hidden fees.<\/p>\r\n <\/div>\r\n <div class=\"step-item\">\r\n <h4>3. Decide Later (On Your Own Terms)<\/h4>\r\n <p>Sit back, relax, and leave the heavy lifting for another day.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- RIGHT COLUMN -->\r\n <div class=\"modal-col\">\r\n <!-- Tokenomics Card -->\r\n <div class=\"pop-card\">\r\n <h3 class=\"modal-title heading-font\">Tokenomics<\/h3>\r\n <div class=\"modal-body\">\r\n <table class=\"tokenomics-table\">\r\n <tr>\r\n <th>Token Name<\/th>\r\n <td>PAYLATER<\/td>\r\n <\/tr>\r\n <tr>\r\n <th>Ticker<\/th>\r\n <td><strong>$PAYLATER<\/strong><\/td>\r\n <\/tr>\r\n <tr>\r\n <th>Total Supply<\/th>\r\n <td>1,000,000,000<\/td>\r\n <\/tr>\r\n <tr>\r\n <th>Buy \/ Sell Tax<\/th>\r\n <td>0% \/ 0%<\/td>\r\n <\/tr>\r\n <tr>\r\n <th>Liquidity<\/th>\r\n <td>Locked \/ Burned<\/td>\r\n <\/tr>\r\n <\/table>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- CA Box Card -->\r\n <div class=\"pop-card\">\r\n <h3 class=\"modal-title heading-font\">Contract Address<\/h3>\r\n <div class=\"modal-body\">\r\n <p style=\"font-size:0.8rem; color:var(--text-muted);\">Official contract address for purchasing $PAYLATER:<\/p>\r\n <div class=\"ca-box\">\r\n <span class=\"ca-text\" id=\"modalCaText\">0x0000000000000000000000000000000000000000<\/span>\r\n <button class=\"btn btn-primary\" style=\"padding: 6px 14px; font-size: 0.75rem;\" onclick=\"copyCA('modalCaText')\">Copy<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- JAVASCRIPT -->\r\n <script>\r\n \/\/ 1. Preloader\r\n window.addEventListener('load', () => {\r\n const preloader = document.getElementById('preloader');\r\n setTimeout(() => {\r\n preloader.style.opacity = '0';\r\n preloader.style.visibility = 'hidden';\r\n }, 600);\r\n });\r\n\r\n \/\/ 2. Light \/ Dark Theme Switch Logic\r\n const themeToggle = document.getElementById('themeToggle');\r\n themeToggle.addEventListener('click', () => {\r\n const currentTheme = document.documentElement.getAttribute('data-theme');\r\n if (currentTheme === 'light') {\r\n document.documentElement.setAttribute('data-theme', 'dark');\r\n themeToggle.textContent = '\ud83c\udf19';\r\n } else {\r\n document.documentElement.setAttribute('data-theme', 'light');\r\n themeToggle.textContent = '\u2600\ufe0f';\r\n }\r\n });\r\n\r\n \/\/ 3. Interactive Canvas: Particle & Wave Line Effect on Mouse Movement\r\n const canvas = document.getElementById('interactiveCanvas');\r\n const ctx = canvas.getContext('2d');\r\n const cursorGlow = document.getElementById('cursorGlow');\r\n\r\n let width, height;\r\n let particles = [];\r\n let mouse = { x: null, y: null, maxRadius: 150 };\r\n\r\n function initCanvas() {\r\n width = canvas.width = window.innerWidth;\r\n height = canvas.height = window.innerHeight;\r\n particles = [];\r\n \r\n const numberOfParticles = Math.floor((width * height) \/ 18000);\r\n for (let i = 0; i < numberOfParticles; i++) {\r\n particles.push(new Particle());\r\n }\r\n }\r\n\r\n class Particle {\r\n constructor() {\r\n this.x = Math.random() * width;\r\n this.y = Math.random() * height;\r\n this.size = Math.random() * 3 + 1;\r\n this.speedX = (Math.random() - 0.5) * 0.8;\r\n this.speedY = (Math.random() - 0.5) * 0.8;\r\n this.color = Math.random() > 0.5 ? 'rgba(249, 115, 22, ' : 'rgba(234, 88, 12, ';\r\n this.alpha = Math.random() * 0.5 + 0.2;\r\n }\r\n\r\n update() {\r\n this.x += this.speedX;\r\n this.y += this.speedY;\r\n\r\n if (this.x < 0 || this.x > width) this.speedX *= -1;\r\n if (this.y < 0 || this.y > height) this.speedY *= -1;\r\n }\r\n\r\n draw() {\r\n ctx.beginPath();\r\n ctx.arc(this.x, this.y, this.size, 0, Math.PI * 2);\r\n ctx.fillStyle = this.color + this.alpha + ')';\r\n ctx.shadowBlur = 10;\r\n ctx.shadowColor = '#f97316';\r\n ctx.fill();\r\n }\r\n }\r\n\r\n function connectParticles() {\r\n for (let a = 0; a < particles.length; a++) {\r\n for (let b = a; b < particles.length; b++) {\r\n let dx = particles[a].x - particles[b].x;\r\n let dy = particles[a].y - particles[b].y;\r\n let distance = Math.sqrt(dx * dx + dy * dy);\r\n\r\n if (distance < 100) {\r\n let opacity = 1 - (distance \/ 100);\r\n ctx.strokeStyle = `rgba(249, 115, 22, ${opacity * 0.15})`;\r\n ctx.lineWidth = 1;\r\n ctx.beginPath();\r\n ctx.moveTo(particles[a].x, particles[a].y);\r\n ctx.lineTo(particles[b].x, particles[b].y);\r\n ctx.stroke();\r\n }\r\n }\r\n\r\n if (mouse.x !== null && mouse.y !== null) {\r\n let mdx = particles[a].x - mouse.x;\r\n let mdy = particles[a].y - mouse.y;\r\n let mDistance = Math.sqrt(mdx * mdx + mdy * mdy);\r\n\r\n if (mDistance < mouse.maxRadius) {\r\n let mOpacity = 1 - (mDistance \/ mouse.maxRadius);\r\n ctx.strokeStyle = `rgba(249, 115, 22, ${mOpacity * 0.4})`;\r\n ctx.lineWidth = 1.2;\r\n ctx.beginPath();\r\n ctx.moveTo(particles[a].x, particles[a].y);\r\n ctx.lineTo(mouse.x, mouse.y);\r\n ctx.stroke();\r\n }\r\n }\r\n }\r\n }\r\n\r\n function animateCanvas() {\r\n ctx.clearRect(0, 0, width, height);\r\n for (let i = 0; i < particles.length; i++) {\r\n particles[i].update();\r\n particles[i].draw();\r\n }\r\n connectParticles();\r\n requestAnimationFrame(animateCanvas);\r\n }\r\n\r\n window.addEventListener('mousemove', (e) => {\r\n mouse.x = e.clientX;\r\n mouse.y = e.clientY;\r\n\r\n cursorGlow.style.left = `${e.clientX}px`;\r\n cursorGlow.style.top = `${e.clientY}px`;\r\n });\r\n\r\n window.addEventListener('mouseleave', () => {\r\n mouse.x = null;\r\n mouse.y = null;\r\n });\r\n\r\n window.addEventListener('resize', initCanvas);\r\n\r\n initCanvas();\r\n animateCanvas();\r\n\r\n \/\/ 4. Modal Logic\r\n function openModal(id) {\r\n document.getElementById(id).classList.add('active');\r\n }\r\n\r\n function closeModal(id) {\r\n document.getElementById(id).classList.remove('active');\r\n }\r\n\r\n document.querySelectorAll('.modal-overlay').forEach(overlay => {\r\n overlay.addEventListener('click', (e) => {\r\n if (e.target === overlay) {\r\n overlay.classList.remove('active');\r\n }\r\n });\r\n });\r\n\r\n \/\/ 5. Universal Copy CA Logic\r\n function copyCA(elementId) {\r\n const caText = document.getElementById(elementId).innerText;\r\n navigator.clipboard.writeText(caText).then(() => {\r\n const toast = document.getElementById('globalToast');\r\n toast.style.display = 'block';\r\n setTimeout(() => {\r\n toast.style.display = 'none';\r\n }, 2500);\r\n }).catch(err => {\r\n console.error('Failed to copy text: ', err);\r\n });\r\n }\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>PAYLATER ($PAYLATER) – The Currency of Tomorrow \u2713 Contract Address Copied! \ud83c\udf19 Live Chart Swap Now The Currency of Tomorrow. Quite Literally. Designed for those who know the best decisions are made with a little patience. No rush, no pressure\u2014just $PAYLATER. Contract Address 2Fvx8YB6msVppWcf9S3Ba3iVvuZT2DMeWBiUGFVYpump Copy Get $PAYLATER © 2026 PAYLATER ($PAYLATER). All rights reserved. Philosophy […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-8","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/paylater.lol\/index.php?rest_route=\/wp\/v2\/pages\/8","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/paylater.lol\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/paylater.lol\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/paylater.lol\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/paylater.lol\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=8"}],"version-history":[{"count":34,"href":"https:\/\/paylater.lol\/index.php?rest_route=\/wp\/v2\/pages\/8\/revisions"}],"predecessor-version":[{"id":53,"href":"https:\/\/paylater.lol\/index.php?rest_route=\/wp\/v2\/pages\/8\/revisions\/53"}],"wp:attachment":[{"href":"https:\/\/paylater.lol\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=8"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}