{"id":8,"date":"2026-04-30T16:07:29","date_gmt":"2026-04-30T16:07:29","guid":{"rendered":"https:\/\/whograntswishes.fun\/?page_id=8"},"modified":"2026-04-30T18:10:38","modified_gmt":"2026-04-30T18:10:38","slug":"elementor-8","status":"publish","type":"page","link":"https:\/\/whograntswishes.fun\/","title":{"rendered":"Elementor #8"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"8\" class=\"elementor elementor-8\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1f394d6 e-flex e-con-boxed e-con e-parent\" data-id=\"1f394d6\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;video&quot;,&quot;background_video_link&quot;:&quot;https:\\\/\\\/whograntswishes.fun\\\/wp-content\\\/uploads\\\/2026\\\/04\\\/HERO-WHO-GRANTS-WISHES.mp4&quot;,&quot;background_play_on_mobile&quot;:&quot;yes&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-background-video-container\">\n\t\t\t\t\t\t\t<video class=\"elementor-background-video-hosted elementor-html5-video\" autoplay muted playsinline loop><\/video>\n\t\t\t\t\t<\/div><div class=\"elementor-element elementor-element-deb9199 e-con-full e-flex e-con e-child\" data-id=\"deb9199\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-178887c elementor-widget elementor-widget-html\" data-id=\"178887c\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n    <!-- Link Font Space Grotesk & Inter -->\r\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Space+Grotesk:wght@500;700&family=Inter:wght@400;500;600&display=swap\" rel=\"stylesheet\">\r\n    <style>\r\n        \/* CSS Variables - Solana Theme *\/\r\n        :root {\r\n            \/* Solana Palette *\/\r\n            --solana-green: #14F195;\r\n            --solana-purple: #9945FF;\r\n            --solana-teal: #00FFA3;\r\n            --deep-black: #000000;\r\n            --dark-bg: #0c0c0c;\r\n            \r\n            \/* UI Elements *\/\r\n            --glass-bg: rgba(255, 255, 255, 0.03);\r\n            --glass-border: rgba(255, 255, 255, 0.1);\r\n            --font-title: 'Space Grotesk', sans-serif;\r\n            --font-body: 'Inter', sans-serif;\r\n            --transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1);\r\n        }\r\n\r\n        * {\r\n            margin: 0;\r\n            padding: 0;\r\n            box-sizing: border-box;\r\n        }\r\n\r\n        body {\r\n            background-color: var(--dark-bg);\r\n            min-height: 200vh;\r\n        }\r\n\r\n        \/* --- Nav Style --- *\/\r\n        .header-nav {\r\n            position: fixed;\r\n            top: 0;\r\n            left: 0;\r\n            width: 100%;\r\n            z-index: 1000;\r\n            background: rgba(0, 0, 0, 0.8);\r\n            backdrop-filter: blur(20px);\r\n            border-bottom: 1px solid var(--glass-border);\r\n            padding: 12px 6%;\r\n            display: flex;\r\n            justify-content: space-between;\r\n            align-items: center;\r\n        }\r\n\r\n        .logo {\r\n            font-family: var(--font-title);\r\n            text-decoration: none;\r\n            font-size: 1.5rem;\r\n            font-weight: 700;\r\n            letter-spacing: -1px;\r\n            \/* Solana Gradient on Logo *\/\r\n            background: linear-gradient(90deg, var(--solana-green), var(--solana-purple));\r\n            -webkit-background-clip: text;\r\n            -webkit-text-fill-color: transparent;\r\n            display: flex;\r\n            flex-direction: column;\r\n            line-height: 1;\r\n        }\r\n\r\n        .logo span {\r\n            font-family: var(--font-body);\r\n            font-size: 0.7rem;\r\n            -webkit-text-fill-color: #fff; \/* Reset color for span *\/\r\n            text-transform: uppercase;\r\n            letter-spacing: 3px;\r\n            margin-top: 5px;\r\n            opacity: 0.6;\r\n        }\r\n\r\n        \/* Desktop Menu *\/\r\n        .nav-links {\r\n            display: flex;\r\n            gap: 35px;\r\n            align-items: center;\r\n        }\r\n\r\n        .nav-links a {\r\n            text-decoration: none;\r\n            color: #ffffff;\r\n            font-family: var(--font-body);\r\n            font-weight: 500;\r\n            font-size: 0.9rem;\r\n            position: relative;\r\n            transition: var(--transition);\r\n            opacity: 0.7;\r\n        }\r\n\r\n        \/* Hover Effect Desktop *\/\r\n        .nav-links a:hover {\r\n            color: var(--solana-green);\r\n            opacity: 1;\r\n        }\r\n\r\n        .nav-links a::after {\r\n            content: '';\r\n            position: absolute;\r\n            bottom: -6px;\r\n            left: 0;\r\n            width: 0;\r\n            height: 2px;\r\n            background: linear-gradient(90deg, var(--solana-green), var(--solana-teal));\r\n            transition: var(--transition);\r\n            box-shadow: 0 0 8px var(--solana-teal);\r\n        }\r\n\r\n        .nav-links a:hover::after {\r\n            width: 100%;\r\n        }\r\n\r\n        \/* Solana Style CTA Button *\/\r\n        .btn-buy {\r\n            background: linear-gradient(90deg, var(--solana-purple), var(--solana-green));\r\n            color: #fff !important;\r\n            padding: 12px 24px;\r\n            border-radius: 8px; \/* Squareish modern look *\/\r\n            font-family: var(--font-title) !important;\r\n            font-weight: 700 !important;\r\n            font-size: 0.85rem !important;\r\n            text-transform: uppercase;\r\n            letter-spacing: 1px;\r\n            box-shadow: 0 4px 15px rgba(153, 69, 255, 0.3);\r\n            opacity: 1 !important;\r\n            border: none;\r\n        }\r\n\r\n        .btn-buy:hover {\r\n            transform: translateY(-3px) scale(1.02);\r\n            box-shadow: 0 8px 25px rgba(20, 241, 149, 0.4);\r\n        }\r\n\r\n        \/* Mobile Toggle *\/\r\n        .menu-toggle {\r\n            display: none;\r\n            cursor: pointer;\r\n            color: var(--solana-green);\r\n        }\r\n\r\n        \/* Responsif Mobile *\/\r\n        @media (max-width: 991px) {\r\n            .header-nav {\r\n                padding: 15px 6%;\r\n            }\r\n\r\n            .menu-toggle {\r\n                display: block;\r\n            }\r\n\r\n            .nav-links {\r\n                position: fixed;\r\n                top: 0;\r\n                right: -100%;\r\n                width: 100%; \/* Full width for cleaner mobile feel *\/\r\n                height: 100vh;\r\n                background: #000;\r\n                flex-direction: column;\r\n                justify-content: center;\r\n                gap: 40px;\r\n                transition: 0.6s cubic-bezier(0.77, 0, 0.175, 1);\r\n            }\r\n\r\n            .nav-links.active {\r\n                right: 0;\r\n            }\r\n\r\n            .nav-links a {\r\n                font-family: var(--font-title);\r\n                font-size: 1.8rem;\r\n                font-weight: 700;\r\n                opacity: 1;\r\n            }\r\n            \r\n            .btn-buy {\r\n                width: 80%;\r\n                text-align: center;\r\n                font-size: 1.2rem !important;\r\n            }\r\n        }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n\r\n    <header class=\"header-nav\">\r\n        <!-- Logo Area -->\r\n        <a href=\"#\" class=\"logo\">\r\n            WHO GRANTS WISHES\r\n        <\/a>\r\n\r\n        <!-- Navigation Links -->\r\n        <nav class=\"nav-links\" id=\"navLinks\">\r\n            <a href=\"#mission\">Mission<\/a>\r\n            <a href=\"#impact\">Impact<\/a>\r\n            <a href=\"#how-to-buy\">How to Buy<\/a>\r\n            <a href=\"#faq\">FAQ<\/a>\r\n            <a href=\"#\" class=\"btn-buy\">Buy on Pump.fun<\/a>\r\n        <\/nav>\r\n\r\n        <!-- Mobile Toggle Icon -->\r\n        <div class=\"menu-toggle\" onclick=\"toggleMenu()\">\r\n            <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"32\" height=\"32\" fill=\"currentColor\" viewBox=\"0 0 16 16\">\r\n                <path fill-rule=\"evenodd\" d=\"M2.5 12a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5z\"\/>\r\n            <\/svg>\r\n        <\/div>\r\n    <\/header>\r\n\r\n    <script>\r\n        function toggleMenu() {\r\n            const nav = document.getElementById('navLinks');\r\n            nav.classList.toggle('active');\r\n            \r\n            \/\/ Lock scroll when menu is active\r\n            if(nav.classList.contains('active')) {\r\n                document.body.style.overflow = 'hidden';\r\n            } else {\r\n                document.body.style.overflow = 'auto';\r\n            }\r\n        }\r\n\r\n        \/\/ Close menu on link click\r\n        document.querySelectorAll('.nav-links a').forEach(link => {\r\n            link.addEventListener('click', () => {\r\n                document.getElementById('navLinks').classList.remove('active');\r\n                document.body.style.overflow = 'auto';\r\n            });\r\n        });\r\n    <\/script>\r\n\r\n<\/body>\r\n<\/html>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-a85235d e-con-full e-flex e-con e-child\" data-id=\"a85235d\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d4fde9a elementor-widget elementor-widget-html\" data-id=\"d4fde9a\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Space+Grotesk:wght@500;700&family=Inter:wght@400;500&display=swap\" rel=\"stylesheet\">\r\n    <style>\r\n        :root {\r\n            --solana-green: #14F195;\r\n            --solana-purple: #9945FF;\r\n            --solana-teal: #00FFA3;\r\n            --midnight: #0a0b1e;\r\n            --font-title: 'Space Grotesk', sans-serif;\r\n            --font-body: 'Inter', sans-serif;\r\n        }\r\n\r\n        \/* Animasi Mengalir untuk Gradien *\/\r\n        @keyframes flow {\r\n            0% { background-position: 0% 50%; }\r\n            50% { background-position: 100% 50%; }\r\n            100% { background-position: 0% 50%; }\r\n        }\r\n\r\n        * { margin: 0; padding: 0; box-sizing: border-box; }\r\n\r\n        body {\r\n            background-color: var(--midnight);\r\n            color: #fff;\r\n            font-family: var(--font-body);\r\n        }\r\n\r\n        .hero-section {\r\n            min-height: 100vh;\r\n            display: flex;\r\n            flex-direction: column;\r\n            justify-content: center;\r\n            align-items: center;\r\n            padding: 80px 5%;\r\n            text-align: center;\r\n            position: relative;\r\n        }\r\n\r\n        \/* --- Typography Style --- *\/\r\n        .hero-title {\r\n            font-family: var(--font-title);\r\n            font-size: clamp(2.5rem, 8vw, 5.5rem);\r\n            font-weight: 700;\r\n            line-height: 1;\r\n            margin-bottom: 25px;\r\n            letter-spacing: -2px;\r\n        }\r\n\r\n        \/* Gradien Solana untuk Judul Utama *\/\r\n        .title-main {\r\n            display: block;\r\n            background: linear-gradient(90deg, var(--solana-green), var(--solana-purple), var(--solana-teal));\r\n            background-size: 200% auto;\r\n            -webkit-background-clip: text;\r\n            -webkit-text-fill-color: transparent;\r\n            animation: flow 5s linear infinite;\r\n        }\r\n\r\n        \/* Gradien Putih ke Abu-abu untuk You Do *\/\r\n        .title-sub {\r\n            display: block;\r\n            background: linear-gradient(180deg, #FFFFFF 0%, #A0A0A0 100%);\r\n            -webkit-background-clip: text;\r\n            -webkit-text-fill-color: transparent;\r\n            margin-top: 5px;\r\n        }\r\n\r\n        .hero-subtitle {\r\n            color: rgba(255, 255, 255, 0.6);\r\n            font-size: clamp(1rem, 2vw, 1.15rem);\r\n            max-width: 650px;\r\n            margin-bottom: 40px;\r\n            line-height: 1.6;\r\n        }\r\n\r\n        \/* --- Contract Address Copy Box --- *\/\r\n        .ca-container {\r\n            background: rgba(255, 255, 255, 0.03);\r\n            border: 1px solid rgba(255, 255, 255, 0.1);\r\n            padding: 10px 20px;\r\n            border-radius: 12px;\r\n            display: flex;\r\n            align-items: center;\r\n            gap: 15px;\r\n            backdrop-filter: blur(10px);\r\n            margin-bottom: 35px;\r\n            transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);\r\n        }\r\n\r\n        .ca-container:hover {\r\n            border-color: var(--solana-green);\r\n            background: rgba(20, 241, 149, 0.05);\r\n            transform: translateY(-2px);\r\n        }\r\n\r\n        .ca-label {\r\n            font-family: var(--font-title);\r\n            color: var(--solana-green);\r\n            font-size: 0.75rem;\r\n            text-transform: uppercase;\r\n            font-weight: 700;\r\n            letter-spacing: 1px;\r\n        }\r\n\r\n        .ca-value {\r\n            font-family: var(--font-title); \/* Diubah menjadi Space Grotesk *\/\r\n            color: #fff;\r\n            font-size: 0.9rem;\r\n            font-weight: 500;\r\n            opacity: 0.9;\r\n            letter-spacing: 0.5px;\r\n            overflow: hidden;\r\n            text-overflow: ellipsis;\r\n            white-space: nowrap;\r\n            max-width: 250px;\r\n        }\r\n\r\n        .copy-btn {\r\n            background: transparent;\r\n            border: none;\r\n            color: #fff;\r\n            cursor: pointer;\r\n            padding: 5px;\r\n            display: flex;\r\n            align-items: center;\r\n            transition: 0.2s;\r\n        }\r\n\r\n        .copy-btn:hover { \r\n            color: var(--solana-green); \r\n            transform: scale(1.15); \r\n        }\r\n\r\n        \/* --- Action Buttons --- *\/\r\n        .btn-group { \r\n            display: flex; \r\n            gap: 15px; \r\n            flex-wrap: wrap; \r\n            justify-content: center; \r\n        }\r\n\r\n        .cta-main {\r\n            background: #fff;\r\n            color: var(--midnight);\r\n            padding: 16px 32px;\r\n            border-radius: 50px;\r\n            text-decoration: none;\r\n            font-family: var(--font-title);\r\n            font-weight: 700;\r\n            font-size: 0.9rem;\r\n            transition: 0.3s;\r\n            border: 1px solid #fff;\r\n        }\r\n\r\n        .cta-main:hover { \r\n            background: transparent;\r\n            color: #fff;\r\n            box-shadow: 0 0 20px rgba(255,255,255,0.2); \r\n        }\r\n\r\n        .cta-sec {\r\n            border: 1px solid rgba(255,255,255,0.2);\r\n            color: #fff;\r\n            padding: 16px 32px;\r\n            border-radius: 50px;\r\n            text-decoration: none;\r\n            font-family: var(--font-title);\r\n            font-size: 0.9rem;\r\n            transition: 0.3s;\r\n        }\r\n\r\n        .cta-sec:hover { \r\n            background: rgba(255,255,255,0.05); \r\n            border-color: #fff;\r\n        }\r\n\r\n        \/* Toast Notification *\/\r\n        #copyToast {\r\n            position: fixed;\r\n            bottom: 30px;\r\n            left: 50%;\r\n            transform: translate(-50%, 100px);\r\n            background: var(--solana-green);\r\n            color: var(--midnight);\r\n            padding: 12px 24px;\r\n            border-radius: 50px;\r\n            font-family: var(--font-title);\r\n            font-weight: 700;\r\n            font-size: 0.85rem;\r\n            transition: 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);\r\n            z-index: 2000;\r\n            box-shadow: 0 10px 30px rgba(20, 241, 149, 0.3);\r\n        }\r\n\r\n        @media (max-width: 768px) {\r\n            .ca-value { max-width: 160px; }\r\n            .hero-section { padding-top: 120px; }\r\n        }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n\r\n    <section class=\"hero-section\">\r\n        <h1 class=\"hero-title\">\r\n            <span class=\"title-main\">Who Grants Wishes?<\/span>\r\n            <span class=\"title-sub\">You Do.<\/span>\r\n        <\/h1>\r\n\r\n        <p class=\"hero-subtitle\">\r\n            The first community-led protocol on Solana where every trade creates a miracle. Turn market volume into life-changing impact.\r\n        <\/p>\r\n\r\n        <!-- CA Copy Box dengan Font Space Grotesk -->\r\n        <div class=\"ca-container\">\r\n            <span class=\"ca-label\">CA:<\/span>\r\n            <span class=\"ca-value\" id=\"caText\">NULL<\/span>\r\n            <button class=\"copy-btn\" onclick=\"copyCA()\" title=\"Copy Address\">\r\n                <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"18\" height=\"18\" fill=\"currentColor\" viewBox=\"0 0 16 16\">\r\n                    <path d=\"M4 1.5H3a2 2 0 0 0-2 2V14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V3.5a2 2 0 0 0-2-2h-1v1h1a1 1 0 0 1 1 1V14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3.5a1 1 0 0 1 1-1h1v-1z\"\/>\r\n                    <path d=\"M9.5 1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1-.5-.5v-1a.5.5 0 0 1 .5-.5h3zm-3-1A1.5 1.5 0 0 0 5 1.5v1A1.5 1.5 0 0 0 6.5 4h3A1.5 1.5 0 0 0 11 2.5v-1A1.5 1.5 0 0 0 9.5 0h-3z\"\/>\r\n                <\/svg>\r\n            <\/button>\r\n        <\/div>\r\n\r\n        <div class=\"btn-group\">\r\n            <a href=\"#\" class=\"cta-main\">Contribute Now<\/a>\r\n            <a href=\"#\" class=\"cta-sec\">Read Mission<\/a>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <div id=\"copyToast\">CA Copied to Clipboard!<\/div>\r\n\r\n    <script>\r\n        function copyCA() {\r\n            const caText = document.getElementById(\"caText\").innerText;\r\n            navigator.clipboard.writeText(caText).then(() => {\r\n                const toast = document.getElementById(\"copyToast\");\r\n                toast.style.transform = \"translate(-50%, 0)\";\r\n                setTimeout(() => {\r\n                    toast.style.transform = \"translate(-50%, 100px)\";\r\n                }, 2000);\r\n            });\r\n        }\r\n    <\/script>\r\n\r\n<\/body>\r\n<\/html>\t\t<\/div>\n\t\t\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>WHO GRANTS WISHES Mission Impact How to Buy FAQ Buy on Pump.fun Who Grants Wishes? You Do. The first community-led protocol on Solana where every trade creates a miracle. Turn market volume into life-changing impact. CA: NULL Contribute Now Read Mission CA Copied to Clipboard!<\/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:\/\/whograntswishes.fun\/index.php\/wp-json\/wp\/v2\/pages\/8","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/whograntswishes.fun\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/whograntswishes.fun\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/whograntswishes.fun\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/whograntswishes.fun\/index.php\/wp-json\/wp\/v2\/comments?post=8"}],"version-history":[{"count":8,"href":"https:\/\/whograntswishes.fun\/index.php\/wp-json\/wp\/v2\/pages\/8\/revisions"}],"predecessor-version":[{"id":22,"href":"https:\/\/whograntswishes.fun\/index.php\/wp-json\/wp\/v2\/pages\/8\/revisions\/22"}],"wp:attachment":[{"href":"https:\/\/whograntswishes.fun\/index.php\/wp-json\/wp\/v2\/media?parent=8"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}