Hoopla Toad Fixed Navbar<\/title>\r\n \r\n \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=Slackey&family=Slackside+One&display=swap\" rel=\"stylesheet\">\r\n\r\n <style>\r\n \/* ==========================================================================\r\n 1. VARS & RESET (Terisolasi tanpa mengubah body\/bg WordPress)\r\n ========================================================================== *\/\r\n .hoopla-nav-wrapper {\r\n --font-heading: 'Slackey', cursive;\r\n --font-body: 'Slackside One', cursive;\r\n \r\n --color-green: #72D049;\r\n --color-purple: #8B46FF;\r\n --color-yellow: #FFDE59;\r\n --color-pink: #FF3EA5;\r\n --color-orange: #FF7A00;\r\n --color-cyan: #00E5FF;\r\n --color-dark: #1E1A29;\r\n --color-white: #FFFFFF;\r\n --border-dark: 2.5px solid #1E1A29;\r\n --shadow-cartoon: 4px 4px 0px #1E1A29;\r\n\r\n width: 100%;\r\n background: transparent !important;\r\n font-family: var(--font-body);\r\n color: var(--color-dark);\r\n box-sizing: border-box;\r\n \/* Memberi ruang kosong di atas agar konten di bawah navbar tidak tertutup saat dimuat *\/\r\n padding-top: 85px; \r\n }\r\n\r\n .hoopla-nav-wrapper * {\r\n box-sizing: border-box;\r\n margin: 0;\r\n padding: 0;\r\n }\r\n\r\n \/* Headings - OUTLINE TIPIS + SHADOW *\/\r\n .hoopla-nav-wrapper h2, \r\n .hoopla-nav-wrapper h3, \r\n .hoopla-nav-wrapper h4,\r\n .side-modal h2,\r\n .side-modal h4 {\r\n font-family: 'Slackey', cursive;\r\n font-weight: 500;\r\n text-transform: uppercase;\r\n color: #FFDE59;\r\n -webkit-text-stroke: 0.5px #1E1A29;\r\n text-shadow: 2px 2px 0px #1E1A29;\r\n line-height: 1.1;\r\n }\r\n\r\n .hoopla-nav-wrapper p, \r\n .hoopla-nav-wrapper span, \r\n .hoopla-nav-wrapper button, \r\n .hoopla-nav-wrapper a, \r\n .hoopla-nav-wrapper div,\r\n .side-modal p,\r\n .side-modal a,\r\n .side-modal div {\r\n font-family: 'Slackside One', cursive;\r\n }\r\n\r\n \/* ==========================================================================\r\n 2. FIXED NAVBAR SECTION (Tetap Melayang Di Atas Tanpa Rusak BG WP)\r\n ========================================================================== *\/\r\n .hoopla-nav-wrapper .navbar {\r\n position: fixed; \/* Kunci Navbar Melayang *\/\r\n top: 15px; \/* Jarak dari batas atas browser *\/\r\n left: 50%;\r\n transform: translateX(-50%) rotate(-0.5deg); \/* Tetap Center & Rotasi Quirky *\/\r\n width: calc(100% - 30px); \/* Presisi lebar aman agar tidak menempel pinggir *\/\r\n max-width: 1200px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n background: #72D049;\r\n border: 2.5px solid #1E1A29;\r\n border-radius: 25px;\r\n padding: 10px 22px;\r\n box-shadow: 4px 4px 0px #1E1A29;\r\n z-index: 9999; \/* Selalu di atas konten halaman *\/\r\n transition: all 0.3s ease;\r\n }\r\n\r\n .hoopla-nav-wrapper .nav-brand {\r\n display: flex;\r\n align-items: center;\r\n gap: 12px;\r\n font-size: 1.5rem;\r\n }\r\n\r\n .hoopla-nav-wrapper .nav-brand img {\r\n width: 44px;\r\n height: 44px;\r\n border-radius: 50%;\r\n border: 2px solid #1E1A29;\r\n object-fit: cover;\r\n background: #FFDE59;\r\n box-shadow: 2px 2px 0px #1E1A29;\r\n }\r\n\r\n .hoopla-nav-wrapper .nav-menu {\r\n display: flex;\r\n list-style: none;\r\n gap: 20px;\r\n }\r\n\r\n .hoopla-nav-wrapper .nav-link {\r\n font-size: 1.6rem;\r\n color: #1E1A29;\r\n cursor: pointer;\r\n transition: all 0.2s ease;\r\n user-select: none;\r\n }\r\n\r\n .hoopla-nav-wrapper .nav-link:hover {\r\n color: #8B46FF;\r\n transform: scale(1.1) rotate(3deg);\r\n text-shadow: 1px 1px 0px rgba(0,0,0,0.2);\r\n }\r\n\r\n \/* Cartoon Action Button *\/\r\n .hoopla-nav-wrapper .btn-buy {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 6px 18px;\r\n font-size: 1.5rem;\r\n background-color: #FF3EA5;\r\n color: #FFFFFF;\r\n border: 2.5px solid #1E1A29;\r\n border-radius: 20px;\r\n box-shadow: 3.5px 3.5px 0px #1E1A29;\r\n text-decoration: none;\r\n cursor: pointer;\r\n transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);\r\n }\r\n\r\n .hoopla-nav-wrapper .btn-buy:hover {\r\n transform: translate(-3px, -3px) rotate(-2deg);\r\n background-color: #FFDE59;\r\n color: #1E1A29;\r\n }\r\n\r\n .hoopla-nav-wrapper .btn-buy:active {\r\n transform: translate(2px, 2px);\r\n box-shadow: 1px 1px 0px #1E1A29;\r\n }\r\n\r\n \/* ==========================================================================\r\n 3. BOUNCY POP-UP MODALS (Desain Keren, Ringkas, TANPA SCROLLBAR)\r\n ========================================================================== *\/\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.45);\r\n backdrop-filter: blur(3px);\r\n z-index: 99999;\r\n opacity: 0;\r\n pointer-events: none;\r\n transition: opacity 0.3s 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 .side-modal {\r\n position: fixed;\r\n top: 50%;\r\n left: -100%;\r\n transform: translateY(-50%);\r\n width: 90%;\r\n max-width: 440px;\r\n background: #FFF8EA;\r\n border: 3.5px solid #1E1A29;\r\n border-radius: 28px;\r\n padding: 22px 18px 18px 18px;\r\n box-shadow: 8px 8px 0px #1E1A29;\r\n z-index: 100000;\r\n overflow: hidden; \/* Mengunci scrollbar *\/\r\n display: flex;\r\n flex-direction: column;\r\n gap: 10px;\r\n transition: left 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55);\r\n }\r\n\r\n .side-modal.active {\r\n left: 20px;\r\n }\r\n\r\n .modal-header {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n padding-right: 35px;\r\n }\r\n\r\n .modal-header h2 {\r\n font-size: clamp(1.4rem, 4vw, 1.8rem);\r\n }\r\n\r\n .modal-close {\r\n position: absolute;\r\n top: 14px;\r\n right: 14px;\r\n width: 34px;\r\n height: 34px;\r\n background: #FF3EA5;\r\n border: 2px solid #1E1A29;\r\n border-radius: 50%;\r\n font-size: 1.2rem;\r\n font-weight: bold;\r\n color: #FFFFFF;\r\n cursor: pointer;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n box-shadow: 2px 2px 0px #1E1A29;\r\n transition: transform 0.2s ease;\r\n }\r\n\r\n .modal-close:hover {\r\n transform: scale(1.1) rotate(90deg);\r\n background: #FFDE59;\r\n color: #1E1A29;\r\n }\r\n\r\n \/* \ud83d\udfe2 BADGE TOKENOMICS *\/\r\n .tokenomics-grid {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 10px;\r\n margin-top: 5px;\r\n }\r\n\r\n .tok-badge {\r\n border: 2px solid #1E1A29;\r\n border-radius: 16px;\r\n padding: 10px 8px;\r\n text-align: center;\r\n box-shadow: 3px 3px 0px #1E1A29;\r\n transition: transform 0.2s ease;\r\n }\r\n\r\n .tok-badge:hover {\r\n transform: translateY(-2px) rotate(-1deg);\r\n }\r\n\r\n .tok-label {\r\n font-family: 'Slackey', cursive;\r\n font-size: 0.95rem;\r\n color: #FFDE59;\r\n -webkit-text-stroke: 0.4px #1E1A29;\r\n text-shadow: 1px 1px 0px #1E1A29;\r\n margin-bottom: 2px;\r\n text-transform: uppercase;\r\n }\r\n\r\n .tok-val {\r\n font-size: 1.3rem;\r\n font-weight: bold;\r\n color: #1E1A29;\r\n line-height: 1.1;\r\n }\r\n\r\n \/* \ud83d\udfe2 STEP CARDS (HOW TO BUY) *\/\r\n .step-list {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 8px;\r\n margin-top: 5px;\r\n }\r\n\r\n .step-item {\r\n display: flex;\r\n align-items: center;\r\n gap: 12px;\r\n border: 2px solid #1E1A29;\r\n border-radius: 18px;\r\n padding: 10px 12px;\r\n box-shadow: 3px 3px 0px #1E1A29;\r\n transition: transform 0.2s ease;\r\n }\r\n\r\n .step-item:hover {\r\n transform: translateX(4px);\r\n }\r\n\r\n .step-number {\r\n width: 32px;\r\n height: 32px;\r\n border: 2px solid #1E1A29;\r\n border-radius: 50%;\r\n background: #FFDE59;\r\n color: #1E1A29;\r\n font-family: 'Slackey', cursive;\r\n font-size: 1.1rem;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-shrink: 0;\r\n box-shadow: 1.5px 1.5px 0px #1E1A29;\r\n }\r\n\r\n .step-content h4 {\r\n font-size: 1.25rem;\r\n margin-bottom: 1px;\r\n color: #FFFFFF;\r\n }\r\n\r\n .step-content p {\r\n font-size: 1.15rem;\r\n line-height: 1.1;\r\n }\r\n\r\n \/* \ud83d\udfe2 COMMUNITY CARD (JOIN US) *\/\r\n .banner-card {\r\n border: 2px solid #1E1A29;\r\n border-radius: 18px;\r\n padding: 12px;\r\n background: #FFDE59;\r\n box-shadow: 3px 3px 0px #1E1A29;\r\n text-align: center;\r\n }\r\n\r\n .banner-card h4 {\r\n color: #8B46FF;\r\n font-size: 1.35rem;\r\n margin-bottom: 2px;\r\n }\r\n\r\n .banner-card p {\r\n font-size: 1.15rem;\r\n line-height: 1.1;\r\n color: #1E1A29;\r\n }\r\n\r\n .social-btn-group {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 8px;\r\n margin-top: 4px;\r\n }\r\n\r\n .social-btn {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 8px;\r\n font-size: 1.35rem;\r\n border: 2px solid #1E1A29;\r\n border-radius: 14px;\r\n box-shadow: 3px 3px 0px #1E1A29;\r\n text-decoration: none;\r\n color: #1E1A29;\r\n font-weight: bold;\r\n transition: transform 0.2s ease, background-color 0.2s ease;\r\n }\r\n\r\n .social-btn:hover {\r\n transform: translate(-2px, -2px) rotate(-1deg);\r\n }\r\n\r\n \/* ==========================================================================\r\n 4. MOBILE RESPONSIVE (HANYA LOGO + TEKS SAJA, TANPA SEMUA TOMBOL)\r\n ========================================================================== *\/\r\n @media (max-width: 768px) {\r\n .hoopla-nav-wrapper {\r\n padding-top: 55px; \/* Ruang atas HP super ringkas *\/\r\n }\r\n\r\n .hoopla-nav-wrapper .navbar {\r\n top: 8px;\r\n flex-direction: row;\r\n justify-content: center; \/* Posisikan Logo + Teks tepat di tengah *\/\r\n align-items: center;\r\n padding: 6px 12px;\r\n border-radius: 20px;\r\n transform: translateX(-50%) rotate(0deg);\r\n width: auto; \/* Lebar menyesuaikan isi logo + teks saja *\/\r\n max-width: calc(100% - 20px);\r\n }\r\n\r\n .hoopla-nav-wrapper .nav-brand {\r\n gap: 8px;\r\n }\r\n\r\n .hoopla-nav-wrapper .nav-brand img {\r\n width: 30px;\r\n height: 30px;\r\n }\r\n\r\n .hoopla-nav-wrapper .nav-brand h2 {\r\n font-size: 1rem;\r\n -webkit-text-stroke: 0.3px #1E1A29;\r\n }\r\n\r\n \/* \ud83d\udccc KHUSUS MOBILE: Sembunyikan Seluruh Tombol Menu Navigasi & Tombol BUY *\/\r\n .hoopla-nav-wrapper .nav-menu,\r\n .hoopla-nav-wrapper .btn-buy {\r\n display: none !important;\r\n }\r\n\r\n .side-modal.active {\r\n left: 5%;\r\n width: 90%;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n\r\n \r\n <div class=\"hoopla-nav-wrapper\">\r\n \r\n <nav class=\"navbar\">\r\n <div class=\"nav-brand\">\r\n <img decoding=\"async\" src=\"https:\/\/hooplatoad.xyz\/wp-content\/uploads\/2026\/08\/ICON-WEB-HOOPLA-TOAD-1-1.png\" alt=\"Hoopla Toad Icon\" \/>\r\n <h2>HOOPLA TOAD<\/h2>\r\n <\/div>\r\n\r\n \r\n <ul class=\"nav-menu\">\r\n <li class=\"nav-link\" onclick=\"openModal('modal-tokenomics')\">Tokenomics<\/li>\r\n <li class=\"nav-link\" onclick=\"openModal('modal-howtobuy')\">How to Buy<\/li>\r\n <li class=\"nav-link\" onclick=\"openModal('modal-joinus')\">Join Us<\/li>\r\n <\/ul>\r\n\r\n <a href=\"https:\/\/swap.pump.fun\/?input=So11111111111111111111111111111111111111112&output=54CrAcw3mhAxP2QgFUTubeXTidtXtEowpDTL7b7Epump\" target=\"_blank\" class=\"btn-buy\">[ BUY $TOAD ]<\/a>\r\n <\/nav>\r\n <\/div>\r\n\r\n \r\n <div class=\"modal-overlay\" id=\"modal-overlay\" onclick=\"closeAllModals()\"><\/div>\r\n\r\n \r\n <div class=\"side-modal\" id=\"modal-tokenomics\">\r\n <button class=\"modal-close\" onclick=\"closeAllModals()\">\u2715<\/button>\r\n <div class=\"modal-header\">\r\n <h2>Tokenomics<\/h2>\r\n <\/div>\r\n \r\n <div class=\"tokenomics-grid\">\r\n <div class=\"tok-badge\" style=\"background: #8B46FF;\">\r\n <div class=\"tok-label\">Ticker<\/div>\r\n <div class=\"tok-val\" style=\"color: #FFDE59;\">$TOAD<\/div>\r\n <\/div>\r\n\r\n <div class=\"tok-badge\" style=\"background: #FF7A00;\">\r\n <div class=\"tok-label\">Total Supply<\/div>\r\n <div class=\"tok-val\" style=\"color: #FFFFFF;\">1B Supply<\/div>\r\n <\/div>\r\n\r\n <div class=\"tok-badge\" style=\"background: #00E5FF;\">\r\n <div class=\"tok-label\" style=\"color: #8B46FF;\">Buy \/ Sell Tax<\/div>\r\n <div class=\"tok-val\">0% \/ 0%<\/div>\r\n <\/div>\r\n\r\n <div class=\"tok-badge\" style=\"background: #FF3EA5;\">\r\n <div class=\"tok-label\">Liquidity<\/div>\r\n <div class=\"tok-val\" style=\"color: #FFFFFF; font-size: 1.15rem;\">Burned<\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"side-modal\" id=\"modal-howtobuy\">\r\n <button class=\"modal-close\" onclick=\"closeAllModals()\">\u2715<\/button>\r\n <div class=\"modal-header\">\r\n <h2>3 Simple Steps<\/h2>\r\n <\/div>\r\n\r\n <div class=\"step-list\">\r\n <div class=\"step-item\" style=\"background: #8B46FF; color: white;\">\r\n <div class=\"step-number\">1<\/div>\r\n <div class=\"step-content\">\r\n <h4>Set Up Wallet<\/h4>\r\n <p>Download Phantom or any Web3 wallet.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"step-item\" style=\"background: #FF7A00; color: white;\">\r\n <div class=\"step-number\">2<\/div>\r\n <div class=\"step-content\">\r\n <h4>Fund Wallet<\/h4>\r\n <p>Get SOL to trade for $TOAD.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"step-item\" style=\"background: #00E5FF; color: #1E1A29;\">\r\n <div class=\"step-number\">3<\/div>\r\n <div class=\"step-content\">\r\n <h4 style=\"color: #8B46FF;\">Swap $TOAD<\/h4>\r\n <p>Paste official CA and swap SOL.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"side-modal\" id=\"modal-joinus\">\r\n <button class=\"modal-close\" onclick=\"closeAllModals()\">\u2715<\/button>\r\n <div class=\"modal-header\">\r\n <h2>Join The Hoopla!<\/h2>\r\n <\/div>\r\n\r\n <div class=\"banner-card\">\r\n <h4>100% Organic Culture<\/h4>\r\n <p>Driven by community engagement & pure natural momentum!<\/p>\r\n <\/div>\r\n\r\n <div class=\"social-btn-group\">\r\n <a href=\"https:\/\/x.com\/hooplatoad\" target=\"_blank\" class=\"social-btn\" style=\"background: #00E5FF;\">[ X \/ TWITTER ]<\/a>\r\n <a href=\"https:\/\/t.me\/hooplatoad\" target=\"_blank\" class=\"social-btn\" style=\"background: #72D049;\">[ TELEGRAM ]<\/a>\r\n <a href=\"https:\/\/swap.pump.fun\/?input=So11111111111111111111111111111111111111112&output=54CrAcw3mhAxP2QgFUTubeXTidtXtEowpDTL7b7Epump\" target=\"_blank\" class=\"social-btn\" style=\"background: #FF3EA5; color: white;\">[ BUY $TOAD NOW ]<\/a>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <script>\r\n function openModal(modalId) {\r\n closeAllModals();\r\n document.getElementById(\"modal-overlay\").classList.add(\"active\");\r\n document.getElementById(modalId).classList.add(\"active\");\r\n }\r\n\r\n function closeAllModals() {\r\n document.getElementById(\"modal-overlay\").classList.remove(\"active\");\r\n const modals = document.querySelectorAll(\".side-modal\");\r\n modals.forEach(modal => modal.classList.remove(\"active\"));\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<\/div>\n\t\t<div class=\"elementor-element elementor-element-beafe6e e-con-full e-flex e-con e-child\" data-id=\"beafe6e\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b5aa3e8 elementor-widget elementor-widget-html\" data-id=\"b5aa3e8\" 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=\"id\">\r\n<head>\r\n <meta charset=\"UTF-8\" \/>\r\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" \/>\r\n <title>Hoopla Toad Hero Only<\/title>\r\n \r\n \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=Slackey&family=Slackside+One&display=swap\" rel=\"stylesheet\">\r\n\r\n <style>\r\n \/* ==========================================================================\r\n 1. VARS & RESET (Terisolasi tanpa merubah BG WordPress)\r\n ========================================================================== *\/\r\n .hoopla-hero-wrapper {\r\n --font-heading: 'Slackey', cursive;\r\n --font-body: 'Slackside One', cursive;\r\n \r\n --color-green: #72D049;\r\n --color-purple: #8B46FF;\r\n --color-yellow: #FFDE59;\r\n --color-pink: #FF3EA5;\r\n --color-cyan: #00E5FF;\r\n --color-dark: #1E1A29;\r\n --color-white: #FFFFFF;\r\n\r\n width: 100%;\r\n background: transparent !important;\r\n font-family: var(--font-body);\r\n color: var(--color-dark);\r\n box-sizing: border-box;\r\n padding: 10px 0;\r\n }\r\n\r\n .hoopla-hero-wrapper * {\r\n box-sizing: border-box;\r\n margin: 0;\r\n padding: 0;\r\n }\r\n\r\n \/* Headings - Outline Tipis & Soft Shadow Tegas *\/\r\n .hoopla-hero-wrapper h1 {\r\n font-family: 'Slackey', cursive;\r\n font-weight: 500;\r\n text-transform: uppercase;\r\n color: var(--color-yellow);\r\n -webkit-text-stroke: 0.6px #1E1A29;\r\n text-shadow: 3px 3px 0px #1E1A29;\r\n font-size: clamp(1.8rem, 3.8vw, 2.5rem);\r\n line-height: 1.1;\r\n margin-bottom: 6px;\r\n }\r\n\r\n .hoopla-hero-wrapper p, \r\n .hoopla-hero-wrapper span, \r\n .hoopla-hero-wrapper button, \r\n .hoopla-hero-wrapper a {\r\n font-family: 'Slackside One', cursive;\r\n }\r\n\r\n \/* ==========================================================================\r\n 2. HERO CONTAINER (Pojok Kiri Atas & Pojok Kanan Bawah, Tengah Lega)\r\n ========================================================================== *\/\r\n .hoopla-hero-wrapper .hero-container {\r\n width: 100%;\r\n min-height: 480px;\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n position: relative;\r\n }\r\n\r\n \/* \ud83d\udfe2 BAGIAN POJOK KIRI ATAS *\/\r\n .hoopla-hero-wrapper .hero-top-left {\r\n align-self: flex-start;\r\n max-width: 420px;\r\n text-align: left;\r\n z-index: 2;\r\n }\r\n\r\n .hoopla-hero-wrapper .hero-desc {\r\n font-size: clamp(1.3rem, 2vw, 1.5rem);\r\n color: var(--color-white);\r\n line-height: 1.2;\r\n text-shadow: 2px 2px 0px #1E1A29;\r\n }\r\n\r\n \/* \ud83d\udfe2 BAGIAN POJOK KANAN BAWAH *\/\r\n .hoopla-hero-wrapper .hero-bottom-right {\r\n align-self: flex-end;\r\n max-width: 450px;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: flex-end;\r\n gap: 10px;\r\n margin-top: 200px; \/* Space vertikal lega untuk karakter di tengah *\/\r\n z-index: 2;\r\n }\r\n\r\n \/* \ud83d\udfe2 CA BOX DENGAN IKON LINGKARAN & LABEL TEXT $TOAD *\/\r\n .hoopla-hero-wrapper .ca-box {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n gap: 8px;\r\n background: #FFF8EA;\r\n border: 2.5px solid #1E1A29;\r\n border-radius: 16px;\r\n padding: 5px 10px;\r\n box-shadow: 3.5px 3.5px 0px #1E1A29;\r\n width: 100%;\r\n }\r\n\r\n \/* Wrapper Ikon & Label $TOAD *\/\r\n .hoopla-hero-wrapper .ca-left-group {\r\n display: flex;\r\n align-items: center;\r\n gap: 6px;\r\n flex-shrink: 0;\r\n }\r\n\r\n \/* Ikon Lingkaran Kecil *\/\r\n .hoopla-hero-wrapper .ca-icon {\r\n width: 28px;\r\n height: 28px;\r\n border-radius: 50%;\r\n border: 1.8px solid #1E1A29;\r\n object-fit: cover;\r\n background: var(--color-yellow);\r\n box-shadow: 1.5px 1.5px 0px #1E1A29;\r\n }\r\n\r\n \/* Badge Text $TOAD *\/\r\n .hoopla-hero-wrapper .ca-badge {\r\n font-family: 'Slackey', cursive;\r\n font-size: 0.95rem;\r\n background: var(--color-yellow);\r\n color: #1E1A29;\r\n border: 1.8px solid #1E1A29;\r\n border-radius: 8px;\r\n padding: 1px 6px;\r\n box-shadow: 1.5px 1.5px 0px #1E1A29;\r\n line-height: 1;\r\n }\r\n\r\n \/* Text Kode CA *\/\r\n .hoopla-hero-wrapper .ca-text {\r\n font-size: 1.05rem;\r\n font-weight: bold;\r\n color: #1E1A29;\r\n word-break: break-all;\r\n padding: 0 4px;\r\n }\r\n\r\n \/* Tombol Copy *\/\r\n .hoopla-hero-wrapper .btn-copy {\r\n padding: 3px 10px;\r\n font-size: 1rem;\r\n background-color: var(--color-green);\r\n color: #1E1A29;\r\n border: 2px solid #1E1A29;\r\n border-radius: 10px;\r\n cursor: pointer;\r\n box-shadow: 2px 2px 0px #1E1A29;\r\n transition: transform 0.2s ease, background-color 0.2s ease;\r\n flex-shrink: 0;\r\n }\r\n\r\n .hoopla-hero-wrapper .btn-copy:hover {\r\n transform: scale(1.05);\r\n background-color: var(--color-yellow);\r\n }\r\n\r\n \/* Group Action Buttons SLIM & HORISONTAL *\/\r\n .hoopla-hero-wrapper .hero-btns {\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n justify-content: flex-end;\r\n gap: 8px;\r\n width: 100%;\r\n flex-wrap: nowrap;\r\n }\r\n\r\n .hoopla-hero-wrapper .btn-action {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 5px 12px;\r\n font-size: 1.25rem;\r\n border: 2px solid #1E1A29;\r\n border-radius: 14px;\r\n box-shadow: 3px 3px 0px #1E1A29;\r\n text-decoration: none;\r\n color: #1E1A29;\r\n font-weight: bold;\r\n white-space: nowrap;\r\n transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);\r\n }\r\n\r\n .hoopla-hero-wrapper .btn-action:hover {\r\n transform: translate(-2px, -2px) rotate(-1deg);\r\n }\r\n\r\n \/* Toast Notification Copy CA *\/\r\n .hoopla-hero-wrapper .toast-copy {\r\n position: fixed;\r\n bottom: -60px;\r\n left: 50%;\r\n transform: translateX(-50%);\r\n background: var(--color-green);\r\n color: #1E1A29;\r\n border: 2px solid #1E1A29;\r\n padding: 8px 18px;\r\n border-radius: 30px;\r\n box-shadow: 3px 3px 0px #1E1A29;\r\n font-size: 1.2rem;\r\n font-weight: bold;\r\n z-index: 999999;\r\n transition: bottom 0.3s ease;\r\n }\r\n\r\n .hoopla-hero-wrapper .toast-copy.show {\r\n bottom: 20px;\r\n }\r\n\r\n \/* ==========================================================================\r\n 3. RESPONSIVE MOBILE\r\n ========================================================================== *\/\r\n @media (max-width: 768px) {\r\n .hoopla-hero-wrapper .hero-container {\r\n min-height: auto;\r\n }\r\n\r\n .hoopla-hero-wrapper .hero-top-left {\r\n max-width: 100%;\r\n text-align: center;\r\n align-self: center;\r\n }\r\n\r\n .hoopla-hero-wrapper .hero-bottom-right {\r\n max-width: 100%;\r\n align-self: center;\r\n align-items: center;\r\n margin-top: 180px;\r\n }\r\n\r\n .hoopla-hero-wrapper .ca-box {\r\n flex-direction: column;\r\n text-align: center;\r\n gap: 6px;\r\n }\r\n\r\n .hoopla-hero-wrapper .hero-btns {\r\n justify-content: center;\r\n flex-wrap: wrap;\r\n gap: 6px;\r\n }\r\n\r\n .hoopla-hero-wrapper .btn-action {\r\n font-size: 1.15rem;\r\n padding: 5px 10px;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n\r\n \r\n <div class=\"hoopla-hero-wrapper\">\r\n <div class=\"hero-container\">\r\n \r\n \r\n <div class=\"hero-top-left\">\r\n <h1>A Tiny Toad. Bright World. Endless Hoopla.<\/h1>\r\n <p class=\"hero-desc\">\r\n Small moments turn into fun adventures, and simple things become memorable stories!\r\n <\/p>\r\n <\/div>\r\n\r\n \r\n <div class=\"hero-bottom-right\">\r\n \r\n <div class=\"ca-box\">\r\n <div class=\"ca-left-group\">\r\n <img decoding=\"async\" src=\"https:\/\/hooplatoad.xyz\/wp-content\/uploads\/2026\/08\/ICON-WEB-HOOPLA-TOAD-1-1.png\" alt=\"Icon Toad\" class=\"ca-icon\" \/>\r\n <span class=\"ca-badge\">$TOAD<\/span>\r\n <\/div>\r\n\r\n <span class=\"ca-text\" id=\"ca-text-code\">54CrAcw3mhAxP2QgFUTubeXTidtXtEowpDTL7b7Epumpp<\/span>\r\n <button class=\"btn-copy\" onclick=\"copyCAHero()\">[ Copy ]<\/button>\r\n <\/div>\r\n\r\n \r\n <div class=\"hero-btns\">\r\n <a href=\"https:\/\/swap.pump.fun\/?input=So11111111111111111111111111111111111111112&output=54CrAcw3mhAxP2QgFUTubeXTidtXtEowpDTL7b7Epump\" target=\"_blank\" class=\"btn-action\" style=\"background: var(--color-yellow);\">[ BUY $TOAD ]<\/a>\r\n <a href=\"https:\/\/t.me\/hooplatoad\" target=\"_blank\" class=\"btn-action\" style=\"background: var(--color-cyan);\">[ TELEGRAM ]<\/a>\r\n <a href=\"https:\/\/x.com\/hooplatoad\" target=\"_blank\" class=\"btn-action\" style=\"background: var(--color-purple); color: white;\">[ X \/ TWITTER ]<\/a>\r\n <\/div>\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n \r\n <div class=\"toast-copy\" id=\"hero-toast\">CA Berhasil Di-copy! \ud83d\udc38<\/div>\r\n <\/div>\r\n\r\n <script>\r\n function copyCAHero() {\r\n const caText = document.getElementById(\"ca-text-code\").innerText;\r\n navigator.clipboard.writeText(caText).then(() => {\r\n const toast = document.getElementById(\"hero-toast\");\r\n toast.classList.add(\"show\");\r\n setTimeout(() => {\r\n toast.classList.remove(\"show\");\r\n }, 2000);\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<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-f11223b e-flex e-con-boxed e-con e-parent\" data-id=\"f11223b\" data-element_type=\"container\" data-settings=\"{"background_background":"classic"}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-7aeb1a2 e-con-full e-flex e-con e-child\" data-id=\"7aeb1a2\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-bbcbaf5 elementor-widget elementor-widget-html\" data-id=\"bbcbaf5\" 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=\"id\">\r\n<head>\r\n <meta charset=\"UTF-8\" \/>\r\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" \/>\r\n <title>Hoopla Toad - Story, Vibe & Slim Footer<\/title>\r\n \r\n \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=Slackey&family=Slackside+One&display=swap\" rel=\"stylesheet\">\r\n\r\n <style>\r\n \/* ==========================================================================\r\n 1. VARS & RESET (Terisolasi tanpa merubah BG WordPress)\r\n ========================================================================== *\/\r\n .hoopla-content-wrapper {\r\n --font-heading: 'Slackey', cursive;\r\n --font-body: 'Slackside One', cursive;\r\n \r\n --color-green: #72D049;\r\n --color-purple: #8B46FF;\r\n --color-yellow: #FFDE59;\r\n --color-pink: #FF3EA5;\r\n --color-orange: #FF7A00;\r\n --color-cyan: #00E5FF;\r\n --color-dark: #1E1A29;\r\n --color-white: #FFFFFF;\r\n\r\n width: 100%;\r\n background: transparent !important;\r\n font-family: var(--font-body);\r\n color: var(--color-dark);\r\n box-sizing: border-box;\r\n padding: 30px 0 10px 0;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 50px;\r\n }\r\n\r\n .hoopla-content-wrapper * {\r\n box-sizing: border-box;\r\n margin: 0;\r\n padding: 0;\r\n }\r\n\r\n \/* Headings *\/\r\n .hoopla-content-wrapper h2, \r\n .hoopla-content-wrapper h3, \r\n .hoopla-content-wrapper h4 {\r\n font-family: 'Slackey', cursive;\r\n font-weight: 500;\r\n text-transform: uppercase;\r\n color: var(--color-yellow);\r\n -webkit-text-stroke: 0.6px #1E1A29;\r\n text-shadow: 2.5px 2.5px 0px #1E1A29;\r\n line-height: 1.1;\r\n }\r\n\r\n .hoopla-content-wrapper p, \r\n .hoopla-content-wrapper span, \r\n .hoopla-content-wrapper a, \r\n .hoopla-content-wrapper div {\r\n font-family: 'Slackside One', cursive;\r\n }\r\n\r\n \/* ==========================================================================\r\n 2. STORY SECTION (ASET 2 Ukuran 400px di Dalam Card Kanan)\r\n ========================================================================== *\/\r\n .hoopla-content-wrapper .story-wrapper {\r\n max-width: 1050px;\r\n margin: 0 auto;\r\n width: 100%;\r\n }\r\n\r\n .hoopla-content-wrapper .story-section {\r\n background: var(--color-yellow);\r\n border: 3px solid #1E1A29;\r\n border-radius: 28px;\r\n padding: 30px;\r\n box-shadow: 6px 6px 0px #1E1A29;\r\n transform: rotate(-0.6deg);\r\n transition: transform 0.3s ease;\r\n width: 100%;\r\n display: grid;\r\n grid-template-columns: 1fr auto;\r\n align-items: center;\r\n gap: 25px;\r\n overflow: hidden;\r\n }\r\n\r\n .hoopla-content-wrapper .story-section:hover {\r\n transform: rotate(0deg);\r\n }\r\n\r\n .hoopla-content-wrapper .story-content-left {\r\n text-align: left;\r\n }\r\n\r\n .hoopla-content-wrapper .story-title {\r\n color: var(--color-purple);\r\n font-size: clamp(2rem, 3.8vw, 2.6rem);\r\n margin-bottom: 12px;\r\n }\r\n\r\n .hoopla-content-wrapper .story-text {\r\n font-size: clamp(1.3rem, 2.2vw, 1.6rem);\r\n color: #1E1A29;\r\n line-height: 1.25;\r\n }\r\n\r\n \/* GAMBAR ASET 2 (400px DI DALAM CARD STORY KANAN) *\/\r\n .hoopla-content-wrapper .asset-story-right {\r\n width: clamp(250px, 35vw, 400px);\r\n height: auto;\r\n filter: drop-shadow(5px 5px 0px #1E1A29);\r\n animation: floatSmoothRight 4s ease-in-out infinite;\r\n flex-shrink: 0;\r\n }\r\n\r\n @keyframes floatSmoothRight {\r\n 0%, 100% { \r\n transform: translateY(0px) rotate(1deg); \r\n }\r\n 50% { \r\n transform: translateY(-12px) rotate(-2deg); \r\n }\r\n }\r\n\r\n \/* ==========================================================================\r\n 3. THE VIBE SECTION (ASET 1 Jumbo 500px + Smooth Motion)\r\n ========================================================================== *\/\r\n .hoopla-content-wrapper .vibe-section {\r\n width: 100%;\r\n max-width: 1050px;\r\n margin: 0 auto;\r\n text-align: center;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n }\r\n\r\n .hoopla-content-wrapper .vibe-header {\r\n font-size: clamp(2.2rem, 4.5vw, 3rem);\r\n color: var(--color-cyan);\r\n margin-bottom: 25px;\r\n }\r\n\r\n .hoopla-content-wrapper .vibe-grid {\r\n display: grid;\r\n grid-template-columns: repeat(3, 1fr);\r\n gap: 18px;\r\n width: 100%;\r\n }\r\n\r\n .hoopla-content-wrapper .vibe-card {\r\n border: 3px solid #1E1A29;\r\n border-radius: 22px;\r\n padding: 20px 16px;\r\n box-shadow: 5px 5px 0px #1E1A29;\r\n text-align: left;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 6px;\r\n transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);\r\n }\r\n\r\n .hoopla-content-wrapper .vibe-card:hover {\r\n transform: translateY(-5px) rotate(1deg);\r\n box-shadow: 7px 7px 0px #1E1A29;\r\n }\r\n\r\n .hoopla-content-wrapper .vibe-card h4 {\r\n font-size: 1.5rem;\r\n }\r\n\r\n .hoopla-content-wrapper .vibe-card p {\r\n font-size: 1.3rem;\r\n line-height: 1.15;\r\n }\r\n\r\n .hoopla-content-wrapper .vibe-card-1 { background: var(--color-cyan); }\r\n .hoopla-content-wrapper .vibe-card-2 { background: var(--color-pink); color: var(--color-white); }\r\n .hoopla-content-wrapper .vibe-card-3 { background: var(--color-green); }\r\n\r\n \/* GAMBAR ASET 1 (JUMBO 500px DI BAWAH VIBE CARDS) *\/\r\n .hoopla-content-wrapper .asset-vibe-bottom {\r\n width: clamp(280px, 45vw, 500px);\r\n height: auto;\r\n margin-top: 30px;\r\n filter: drop-shadow(6px 6px 0px #1E1A29);\r\n animation: floatSmoothBottom 4.5s ease-in-out infinite;\r\n transition: transform 0.3s ease;\r\n }\r\n\r\n @keyframes floatSmoothBottom {\r\n 0%, 100% { \r\n transform: translateY(0px) scale(1) rotate(0deg); \r\n }\r\n 50% { \r\n transform: translateY(-18px) scale(1.03) rotate(-2deg); \r\n }\r\n }\r\n\r\n \/* ==========================================================================\r\n 4. SLIM FOOTER SECTION (Clean & Seamless Overlay)\r\n ========================================================================== *\/\r\n .hoopla-content-wrapper .footer-slim {\r\n width: 100%;\r\n max-width: 900px;\r\n margin: 0 auto;\r\n text-align: center;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n gap: 12px;\r\n padding: 10px 0;\r\n }\r\n\r\n .hoopla-content-wrapper .footer-brand {\r\n font-size: clamp(1.6rem, 3vw, 2.2rem);\r\n color: var(--color-yellow);\r\n }\r\n\r\n .hoopla-content-wrapper .footer-socials {\r\n display: flex;\r\n justify-content: center;\r\n gap: 10px;\r\n flex-wrap: wrap;\r\n }\r\n\r\n .hoopla-content-wrapper .btn-social {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 6px 18px;\r\n font-size: 1.25rem;\r\n border: 2px solid #1E1A29;\r\n border-radius: 14px;\r\n box-shadow: 3.5px 3.5px 0px #1E1A29;\r\n text-decoration: none;\r\n color: #1E1A29;\r\n font-weight: bold;\r\n transition: transform 0.2s ease, background-color 0.2s ease;\r\n }\r\n\r\n .hoopla-content-wrapper .btn-social:hover {\r\n transform: translate(-2px, -2px) rotate(-1deg);\r\n }\r\n\r\n .hoopla-content-wrapper .footer-disclaimer {\r\n font-size: 1.15rem;\r\n max-width: 650px;\r\n color: var(--color-white);\r\n line-height: 1.2;\r\n text-shadow: 1.5px 1.5px 0px #1E1A29;\r\n opacity: 0.95;\r\n }\r\n\r\n .hoopla-content-wrapper .footer-copy {\r\n font-size: 1.05rem;\r\n color: var(--color-yellow);\r\n font-weight: bold;\r\n text-shadow: 1.5px 1.5px 0px #1E1A29;\r\n }\r\n\r\n \/* ==========================================================================\r\n 5. RESPONSIVE MOBILE\r\n ========================================================================== *\/\r\n @media (max-width: 868px) {\r\n .hoopla-content-wrapper .story-section {\r\n grid-template-columns: 1fr;\r\n text-align: center;\r\n padding: 25px 20px;\r\n }\r\n\r\n .hoopla-content-wrapper .story-content-left {\r\n text-align: center;\r\n }\r\n\r\n .hoopla-content-wrapper .asset-story-right {\r\n margin: 0 auto;\r\n width: 280px;\r\n }\r\n\r\n .hoopla-content-wrapper .vibe-grid {\r\n grid-template-columns: 1fr;\r\n gap: 14px;\r\n }\r\n\r\n .hoopla-content-wrapper .vibe-card {\r\n text-align: center;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n\r\n \r\n <div class=\"hoopla-content-wrapper\">\r\n\r\n \r\n <div class=\"story-wrapper\">\r\n <section class=\"story-section\">\r\n \r\n <div class=\"story-content-left\">\r\n <h2 class=\"story-title\">Meet Hoopla Toad<\/h2>\r\n <p class=\"story-text\">\r\n Hoopla Toad is all about curiosity, positivity, and enjoying the little surprises along the way. Pure energy, sharp focus, and authentic community culture.\r\n <\/p>\r\n <\/div>\r\n\r\n \r\n <img decoding=\"async\" src=\"https:\/\/hooplatoad.xyz\/wp-content\/uploads\/2026\/08\/ASET2.png\" alt=\"Aset Hoopla Toad 2\" class=\"asset-story-right\" \/>\r\n <\/section>\r\n <\/div>\r\n\r\n \r\n <section class=\"vibe-section\">\r\n <h2 class=\"vibe-header\">Good Energy Only<\/h2>\r\n \r\n <div class=\"vibe-grid\">\r\n \r\n <div class=\"vibe-card vibe-card-1\">\r\n <h4 style=\"color: #8B46FF;\">100% Organic Culture<\/h4>\r\n <p>Driven by community engagement, natural momentum, and zero artificial noise.<\/p>\r\n <\/div>\r\n\r\n \r\n <div class=\"vibe-card vibe-card-2\">\r\n <h4 style=\"color: #FFDE59;\">Daily Adventures<\/h4>\r\n <p>Moving forward step by step, turning simple moments into solid milestones.<\/p>\r\n <\/div>\r\n\r\n \r\n <div class=\"vibe-card vibe-card-3\">\r\n <h4 style=\"color: #8B46FF;\">Pure Positivity<\/h4>\r\n <p>Clean narrative, straightforward approach, and transparent execution.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <img decoding=\"async\" src=\"https:\/\/hooplatoad.xyz\/wp-content\/uploads\/2026\/08\/ASET1.png\" alt=\"Aset Hoopla Toad 1\" class=\"asset-vibe-bottom\" \/>\r\n <\/section>\r\n\r\n \r\n <footer class=\"footer-slim\">\r\n <h2 class=\"footer-brand\">HOOPLA TOAD ($TOAD)<\/h2>\r\n \r\n \r\n <div class=\"footer-socials\">\r\n <a href=\"https:\/\/x.com\/hooplatoad\" target=\"_blank\" class=\"btn-social\" style=\"background: var(--color-cyan);\">[ X \/ Twitter ]<\/a>\r\n <a href=\"https:\/\/t.me\/hooplatoad\" target=\"_blank\" class=\"btn-social\" style=\"background: var(--color-green);\">[ Telegram ]<\/a>\r\n <\/div>\r\n\r\n \r\n <p class=\"footer-disclaimer\">\r\n $TOAD is a meme coin created for entertainment and community purposes. Crypto assets carry risk. Always DYOR.\r\n <\/p>\r\n\r\n \r\n <p class=\"footer-copy\">\u00a9 2026 Hoopla Toad. All rights reserved.<\/p>\r\n <\/footer>\r\n\r\n <\/div>\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>Hoopla Toad Fixed Navbar HOOPLA TOAD Tokenomics How to Buy Join Us [ BUY $TOAD ] \u2715 Tokenomics Ticker $TOAD Total Supply 1B Supply Buy \/ Sell Tax 0% \/ 0% Liquidity Burned \u2715 3 Simple Steps 1 Set Up Wallet Download Phantom or any Web3 wallet. 2 Fund Wallet Get SOL to trade for […]<\/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:\/\/hooplatoad.xyz\/index.php?rest_route=\/wp\/v2\/pages\/8","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/hooplatoad.xyz\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/hooplatoad.xyz\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/hooplatoad.xyz\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/hooplatoad.xyz\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=8"}],"version-history":[{"count":22,"href":"https:\/\/hooplatoad.xyz\/index.php?rest_route=\/wp\/v2\/pages\/8\/revisions"}],"predecessor-version":[{"id":43,"href":"https:\/\/hooplatoad.xyz\/index.php?rest_route=\/wp\/v2\/pages\/8\/revisions\/43"}],"wp:attachment":[{"href":"https:\/\/hooplatoad.xyz\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=8"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\r\n\r\n\r\n \r\n \r\n Hoopla Toad Fixed Navbar<\/title>\r\n \r\n \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=Slackey&family=Slackside+One&display=swap\" rel=\"stylesheet\">\r\n\r\n <style>\r\n \/* ==========================================================================\r\n 1. VARS & RESET (Terisolasi tanpa mengubah body\/bg WordPress)\r\n ========================================================================== *\/\r\n .hoopla-nav-wrapper {\r\n --font-heading: 'Slackey', cursive;\r\n --font-body: 'Slackside One', cursive;\r\n \r\n --color-green: #72D049;\r\n --color-purple: #8B46FF;\r\n --color-yellow: #FFDE59;\r\n --color-pink: #FF3EA5;\r\n --color-orange: #FF7A00;\r\n --color-cyan: #00E5FF;\r\n --color-dark: #1E1A29;\r\n --color-white: #FFFFFF;\r\n --border-dark: 2.5px solid #1E1A29;\r\n --shadow-cartoon: 4px 4px 0px #1E1A29;\r\n\r\n width: 100%;\r\n background: transparent !important;\r\n font-family: var(--font-body);\r\n color: var(--color-dark);\r\n box-sizing: border-box;\r\n \/* Memberi ruang kosong di atas agar konten di bawah navbar tidak tertutup saat dimuat *\/\r\n padding-top: 85px; \r\n }\r\n\r\n .hoopla-nav-wrapper * {\r\n box-sizing: border-box;\r\n margin: 0;\r\n padding: 0;\r\n }\r\n\r\n \/* Headings - OUTLINE TIPIS + SHADOW *\/\r\n .hoopla-nav-wrapper h2, \r\n .hoopla-nav-wrapper h3, \r\n .hoopla-nav-wrapper h4,\r\n .side-modal h2,\r\n .side-modal h4 {\r\n font-family: 'Slackey', cursive;\r\n font-weight: 500;\r\n text-transform: uppercase;\r\n color: #FFDE59;\r\n -webkit-text-stroke: 0.5px #1E1A29;\r\n text-shadow: 2px 2px 0px #1E1A29;\r\n line-height: 1.1;\r\n }\r\n\r\n .hoopla-nav-wrapper p, \r\n .hoopla-nav-wrapper span, \r\n .hoopla-nav-wrapper button, \r\n .hoopla-nav-wrapper a, \r\n .hoopla-nav-wrapper div,\r\n .side-modal p,\r\n .side-modal a,\r\n .side-modal div {\r\n font-family: 'Slackside One', cursive;\r\n }\r\n\r\n \/* ==========================================================================\r\n 2. FIXED NAVBAR SECTION (Tetap Melayang Di Atas Tanpa Rusak BG WP)\r\n ========================================================================== *\/\r\n .hoopla-nav-wrapper .navbar {\r\n position: fixed; \/* Kunci Navbar Melayang *\/\r\n top: 15px; \/* Jarak dari batas atas browser *\/\r\n left: 50%;\r\n transform: translateX(-50%) rotate(-0.5deg); \/* Tetap Center & Rotasi Quirky *\/\r\n width: calc(100% - 30px); \/* Presisi lebar aman agar tidak menempel pinggir *\/\r\n max-width: 1200px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n background: #72D049;\r\n border: 2.5px solid #1E1A29;\r\n border-radius: 25px;\r\n padding: 10px 22px;\r\n box-shadow: 4px 4px 0px #1E1A29;\r\n z-index: 9999; \/* Selalu di atas konten halaman *\/\r\n transition: all 0.3s ease;\r\n }\r\n\r\n .hoopla-nav-wrapper .nav-brand {\r\n display: flex;\r\n align-items: center;\r\n gap: 12px;\r\n font-size: 1.5rem;\r\n }\r\n\r\n .hoopla-nav-wrapper .nav-brand img {\r\n width: 44px;\r\n height: 44px;\r\n border-radius: 50%;\r\n border: 2px solid #1E1A29;\r\n object-fit: cover;\r\n background: #FFDE59;\r\n box-shadow: 2px 2px 0px #1E1A29;\r\n }\r\n\r\n .hoopla-nav-wrapper .nav-menu {\r\n display: flex;\r\n list-style: none;\r\n gap: 20px;\r\n }\r\n\r\n .hoopla-nav-wrapper .nav-link {\r\n font-size: 1.6rem;\r\n color: #1E1A29;\r\n cursor: pointer;\r\n transition: all 0.2s ease;\r\n user-select: none;\r\n }\r\n\r\n .hoopla-nav-wrapper .nav-link:hover {\r\n color: #8B46FF;\r\n transform: scale(1.1) rotate(3deg);\r\n text-shadow: 1px 1px 0px rgba(0,0,0,0.2);\r\n }\r\n\r\n \/* Cartoon Action Button *\/\r\n .hoopla-nav-wrapper .btn-buy {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 6px 18px;\r\n font-size: 1.5rem;\r\n background-color: #FF3EA5;\r\n color: #FFFFFF;\r\n border: 2.5px solid #1E1A29;\r\n border-radius: 20px;\r\n box-shadow: 3.5px 3.5px 0px #1E1A29;\r\n text-decoration: none;\r\n cursor: pointer;\r\n transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);\r\n }\r\n\r\n .hoopla-nav-wrapper .btn-buy:hover {\r\n transform: translate(-3px, -3px) rotate(-2deg);\r\n background-color: #FFDE59;\r\n color: #1E1A29;\r\n }\r\n\r\n .hoopla-nav-wrapper .btn-buy:active {\r\n transform: translate(2px, 2px);\r\n box-shadow: 1px 1px 0px #1E1A29;\r\n }\r\n\r\n \/* ==========================================================================\r\n 3. BOUNCY POP-UP MODALS (Desain Keren, Ringkas, TANPA SCROLLBAR)\r\n ========================================================================== *\/\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.45);\r\n backdrop-filter: blur(3px);\r\n z-index: 99999;\r\n opacity: 0;\r\n pointer-events: none;\r\n transition: opacity 0.3s 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 .side-modal {\r\n position: fixed;\r\n top: 50%;\r\n left: -100%;\r\n transform: translateY(-50%);\r\n width: 90%;\r\n max-width: 440px;\r\n background: #FFF8EA;\r\n border: 3.5px solid #1E1A29;\r\n border-radius: 28px;\r\n padding: 22px 18px 18px 18px;\r\n box-shadow: 8px 8px 0px #1E1A29;\r\n z-index: 100000;\r\n overflow: hidden; \/* Mengunci scrollbar *\/\r\n display: flex;\r\n flex-direction: column;\r\n gap: 10px;\r\n transition: left 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55);\r\n }\r\n\r\n .side-modal.active {\r\n left: 20px;\r\n }\r\n\r\n .modal-header {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n padding-right: 35px;\r\n }\r\n\r\n .modal-header h2 {\r\n font-size: clamp(1.4rem, 4vw, 1.8rem);\r\n }\r\n\r\n .modal-close {\r\n position: absolute;\r\n top: 14px;\r\n right: 14px;\r\n width: 34px;\r\n height: 34px;\r\n background: #FF3EA5;\r\n border: 2px solid #1E1A29;\r\n border-radius: 50%;\r\n font-size: 1.2rem;\r\n font-weight: bold;\r\n color: #FFFFFF;\r\n cursor: pointer;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n box-shadow: 2px 2px 0px #1E1A29;\r\n transition: transform 0.2s ease;\r\n }\r\n\r\n .modal-close:hover {\r\n transform: scale(1.1) rotate(90deg);\r\n background: #FFDE59;\r\n color: #1E1A29;\r\n }\r\n\r\n \/* \ud83d\udfe2 BADGE TOKENOMICS *\/\r\n .tokenomics-grid {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 10px;\r\n margin-top: 5px;\r\n }\r\n\r\n .tok-badge {\r\n border: 2px solid #1E1A29;\r\n border-radius: 16px;\r\n padding: 10px 8px;\r\n text-align: center;\r\n box-shadow: 3px 3px 0px #1E1A29;\r\n transition: transform 0.2s ease;\r\n }\r\n\r\n .tok-badge:hover {\r\n transform: translateY(-2px) rotate(-1deg);\r\n }\r\n\r\n .tok-label {\r\n font-family: 'Slackey', cursive;\r\n font-size: 0.95rem;\r\n color: #FFDE59;\r\n -webkit-text-stroke: 0.4px #1E1A29;\r\n text-shadow: 1px 1px 0px #1E1A29;\r\n margin-bottom: 2px;\r\n text-transform: uppercase;\r\n }\r\n\r\n .tok-val {\r\n font-size: 1.3rem;\r\n font-weight: bold;\r\n color: #1E1A29;\r\n line-height: 1.1;\r\n }\r\n\r\n \/* \ud83d\udfe2 STEP CARDS (HOW TO BUY) *\/\r\n .step-list {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 8px;\r\n margin-top: 5px;\r\n }\r\n\r\n .step-item {\r\n display: flex;\r\n align-items: center;\r\n gap: 12px;\r\n border: 2px solid #1E1A29;\r\n border-radius: 18px;\r\n padding: 10px 12px;\r\n box-shadow: 3px 3px 0px #1E1A29;\r\n transition: transform 0.2s ease;\r\n }\r\n\r\n .step-item:hover {\r\n transform: translateX(4px);\r\n }\r\n\r\n .step-number {\r\n width: 32px;\r\n height: 32px;\r\n border: 2px solid #1E1A29;\r\n border-radius: 50%;\r\n background: #FFDE59;\r\n color: #1E1A29;\r\n font-family: 'Slackey', cursive;\r\n font-size: 1.1rem;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-shrink: 0;\r\n box-shadow: 1.5px 1.5px 0px #1E1A29;\r\n }\r\n\r\n .step-content h4 {\r\n font-size: 1.25rem;\r\n margin-bottom: 1px;\r\n color: #FFFFFF;\r\n }\r\n\r\n .step-content p {\r\n font-size: 1.15rem;\r\n line-height: 1.1;\r\n }\r\n\r\n \/* \ud83d\udfe2 COMMUNITY CARD (JOIN US) *\/\r\n .banner-card {\r\n border: 2px solid #1E1A29;\r\n border-radius: 18px;\r\n padding: 12px;\r\n background: #FFDE59;\r\n box-shadow: 3px 3px 0px #1E1A29;\r\n text-align: center;\r\n }\r\n\r\n .banner-card h4 {\r\n color: #8B46FF;\r\n font-size: 1.35rem;\r\n margin-bottom: 2px;\r\n }\r\n\r\n .banner-card p {\r\n font-size: 1.15rem;\r\n line-height: 1.1;\r\n color: #1E1A29;\r\n }\r\n\r\n .social-btn-group {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 8px;\r\n margin-top: 4px;\r\n }\r\n\r\n .social-btn {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 8px;\r\n font-size: 1.35rem;\r\n border: 2px solid #1E1A29;\r\n border-radius: 14px;\r\n box-shadow: 3px 3px 0px #1E1A29;\r\n text-decoration: none;\r\n color: #1E1A29;\r\n font-weight: bold;\r\n transition: transform 0.2s ease, background-color 0.2s ease;\r\n }\r\n\r\n .social-btn:hover {\r\n transform: translate(-2px, -2px) rotate(-1deg);\r\n }\r\n\r\n \/* ==========================================================================\r\n 4. MOBILE RESPONSIVE (HANYA LOGO + TEKS SAJA, TANPA SEMUA TOMBOL)\r\n ========================================================================== *\/\r\n @media (max-width: 768px) {\r\n .hoopla-nav-wrapper {\r\n padding-top: 55px; \/* Ruang atas HP super ringkas *\/\r\n }\r\n\r\n .hoopla-nav-wrapper .navbar {\r\n top: 8px;\r\n flex-direction: row;\r\n justify-content: center; \/* Posisikan Logo + Teks tepat di tengah *\/\r\n align-items: center;\r\n padding: 6px 12px;\r\n border-radius: 20px;\r\n transform: translateX(-50%) rotate(0deg);\r\n width: auto; \/* Lebar menyesuaikan isi logo + teks saja *\/\r\n max-width: calc(100% - 20px);\r\n }\r\n\r\n .hoopla-nav-wrapper .nav-brand {\r\n gap: 8px;\r\n }\r\n\r\n .hoopla-nav-wrapper .nav-brand img {\r\n width: 30px;\r\n height: 30px;\r\n }\r\n\r\n .hoopla-nav-wrapper .nav-brand h2 {\r\n font-size: 1rem;\r\n -webkit-text-stroke: 0.3px #1E1A29;\r\n }\r\n\r\n \/* \ud83d\udccc KHUSUS MOBILE: Sembunyikan Seluruh Tombol Menu Navigasi & Tombol BUY *\/\r\n .hoopla-nav-wrapper .nav-menu,\r\n .hoopla-nav-wrapper .btn-buy {\r\n display: none !important;\r\n }\r\n\r\n .side-modal.active {\r\n left: 5%;\r\n width: 90%;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n\r\n \r\n <div class=\"hoopla-nav-wrapper\">\r\n \r\n <nav class=\"navbar\">\r\n <div class=\"nav-brand\">\r\n <img decoding=\"async\" src=\"https:\/\/hooplatoad.xyz\/wp-content\/uploads\/2026\/08\/ICON-WEB-HOOPLA-TOAD-1-1.png\" alt=\"Hoopla Toad Icon\" \/>\r\n <h2>HOOPLA TOAD<\/h2>\r\n <\/div>\r\n\r\n \r\n <ul class=\"nav-menu\">\r\n <li class=\"nav-link\" onclick=\"openModal('modal-tokenomics')\">Tokenomics<\/li>\r\n <li class=\"nav-link\" onclick=\"openModal('modal-howtobuy')\">How to Buy<\/li>\r\n <li class=\"nav-link\" onclick=\"openModal('modal-joinus')\">Join Us<\/li>\r\n <\/ul>\r\n\r\n <a href=\"https:\/\/swap.pump.fun\/?input=So11111111111111111111111111111111111111112&output=54CrAcw3mhAxP2QgFUTubeXTidtXtEowpDTL7b7Epump\" target=\"_blank\" class=\"btn-buy\">[ BUY $TOAD ]<\/a>\r\n <\/nav>\r\n <\/div>\r\n\r\n \r\n <div class=\"modal-overlay\" id=\"modal-overlay\" onclick=\"closeAllModals()\"><\/div>\r\n\r\n \r\n <div class=\"side-modal\" id=\"modal-tokenomics\">\r\n <button class=\"modal-close\" onclick=\"closeAllModals()\">\u2715<\/button>\r\n <div class=\"modal-header\">\r\n <h2>Tokenomics<\/h2>\r\n <\/div>\r\n \r\n <div class=\"tokenomics-grid\">\r\n <div class=\"tok-badge\" style=\"background: #8B46FF;\">\r\n <div class=\"tok-label\">Ticker<\/div>\r\n <div class=\"tok-val\" style=\"color: #FFDE59;\">$TOAD<\/div>\r\n <\/div>\r\n\r\n <div class=\"tok-badge\" style=\"background: #FF7A00;\">\r\n <div class=\"tok-label\">Total Supply<\/div>\r\n <div class=\"tok-val\" style=\"color: #FFFFFF;\">1B Supply<\/div>\r\n <\/div>\r\n\r\n <div class=\"tok-badge\" style=\"background: #00E5FF;\">\r\n <div class=\"tok-label\" style=\"color: #8B46FF;\">Buy \/ Sell Tax<\/div>\r\n <div class=\"tok-val\">0% \/ 0%<\/div>\r\n <\/div>\r\n\r\n <div class=\"tok-badge\" style=\"background: #FF3EA5;\">\r\n <div class=\"tok-label\">Liquidity<\/div>\r\n <div class=\"tok-val\" style=\"color: #FFFFFF; font-size: 1.15rem;\">Burned<\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"side-modal\" id=\"modal-howtobuy\">\r\n <button class=\"modal-close\" onclick=\"closeAllModals()\">\u2715<\/button>\r\n <div class=\"modal-header\">\r\n <h2>3 Simple Steps<\/h2>\r\n <\/div>\r\n\r\n <div class=\"step-list\">\r\n <div class=\"step-item\" style=\"background: #8B46FF; color: white;\">\r\n <div class=\"step-number\">1<\/div>\r\n <div class=\"step-content\">\r\n <h4>Set Up Wallet<\/h4>\r\n <p>Download Phantom or any Web3 wallet.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"step-item\" style=\"background: #FF7A00; color: white;\">\r\n <div class=\"step-number\">2<\/div>\r\n <div class=\"step-content\">\r\n <h4>Fund Wallet<\/h4>\r\n <p>Get SOL to trade for $TOAD.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"step-item\" style=\"background: #00E5FF; color: #1E1A29;\">\r\n <div class=\"step-number\">3<\/div>\r\n <div class=\"step-content\">\r\n <h4 style=\"color: #8B46FF;\">Swap $TOAD<\/h4>\r\n <p>Paste official CA and swap SOL.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"side-modal\" id=\"modal-joinus\">\r\n <button class=\"modal-close\" onclick=\"closeAllModals()\">\u2715<\/button>\r\n <div class=\"modal-header\">\r\n <h2>Join The Hoopla!<\/h2>\r\n <\/div>\r\n\r\n <div class=\"banner-card\">\r\n <h4>100% Organic Culture<\/h4>\r\n <p>Driven by community engagement & pure natural momentum!<\/p>\r\n <\/div>\r\n\r\n <div class=\"social-btn-group\">\r\n <a href=\"https:\/\/x.com\/hooplatoad\" target=\"_blank\" class=\"social-btn\" style=\"background: #00E5FF;\">[ X \/ TWITTER ]<\/a>\r\n <a href=\"https:\/\/t.me\/hooplatoad\" target=\"_blank\" class=\"social-btn\" style=\"background: #72D049;\">[ TELEGRAM ]<\/a>\r\n <a href=\"https:\/\/swap.pump.fun\/?input=So11111111111111111111111111111111111111112&output=54CrAcw3mhAxP2QgFUTubeXTidtXtEowpDTL7b7Epump\" target=\"_blank\" class=\"social-btn\" style=\"background: #FF3EA5; color: white;\">[ BUY $TOAD NOW ]<\/a>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <script>\r\n function openModal(modalId) {\r\n closeAllModals();\r\n document.getElementById(\"modal-overlay\").classList.add(\"active\");\r\n document.getElementById(modalId).classList.add(\"active\");\r\n }\r\n\r\n function closeAllModals() {\r\n document.getElementById(\"modal-overlay\").classList.remove(\"active\");\r\n const modals = document.querySelectorAll(\".side-modal\");\r\n modals.forEach(modal => modal.classList.remove(\"active\"));\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<\/div>\n\t\t<div class=\"elementor-element elementor-element-beafe6e e-con-full e-flex e-con e-child\" data-id=\"beafe6e\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b5aa3e8 elementor-widget elementor-widget-html\" data-id=\"b5aa3e8\" 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=\"id\">\r\n<head>\r\n <meta charset=\"UTF-8\" \/>\r\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" \/>\r\n <title>Hoopla Toad Hero Only<\/title>\r\n \r\n \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=Slackey&family=Slackside+One&display=swap\" rel=\"stylesheet\">\r\n\r\n <style>\r\n \/* ==========================================================================\r\n 1. VARS & RESET (Terisolasi tanpa merubah BG WordPress)\r\n ========================================================================== *\/\r\n .hoopla-hero-wrapper {\r\n --font-heading: 'Slackey', cursive;\r\n --font-body: 'Slackside One', cursive;\r\n \r\n --color-green: #72D049;\r\n --color-purple: #8B46FF;\r\n --color-yellow: #FFDE59;\r\n --color-pink: #FF3EA5;\r\n --color-cyan: #00E5FF;\r\n --color-dark: #1E1A29;\r\n --color-white: #FFFFFF;\r\n\r\n width: 100%;\r\n background: transparent !important;\r\n font-family: var(--font-body);\r\n color: var(--color-dark);\r\n box-sizing: border-box;\r\n padding: 10px 0;\r\n }\r\n\r\n .hoopla-hero-wrapper * {\r\n box-sizing: border-box;\r\n margin: 0;\r\n padding: 0;\r\n }\r\n\r\n \/* Headings - Outline Tipis & Soft Shadow Tegas *\/\r\n .hoopla-hero-wrapper h1 {\r\n font-family: 'Slackey', cursive;\r\n font-weight: 500;\r\n text-transform: uppercase;\r\n color: var(--color-yellow);\r\n -webkit-text-stroke: 0.6px #1E1A29;\r\n text-shadow: 3px 3px 0px #1E1A29;\r\n font-size: clamp(1.8rem, 3.8vw, 2.5rem);\r\n line-height: 1.1;\r\n margin-bottom: 6px;\r\n }\r\n\r\n .hoopla-hero-wrapper p, \r\n .hoopla-hero-wrapper span, \r\n .hoopla-hero-wrapper button, \r\n .hoopla-hero-wrapper a {\r\n font-family: 'Slackside One', cursive;\r\n }\r\n\r\n \/* ==========================================================================\r\n 2. HERO CONTAINER (Pojok Kiri Atas & Pojok Kanan Bawah, Tengah Lega)\r\n ========================================================================== *\/\r\n .hoopla-hero-wrapper .hero-container {\r\n width: 100%;\r\n min-height: 480px;\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n position: relative;\r\n }\r\n\r\n \/* \ud83d\udfe2 BAGIAN POJOK KIRI ATAS *\/\r\n .hoopla-hero-wrapper .hero-top-left {\r\n align-self: flex-start;\r\n max-width: 420px;\r\n text-align: left;\r\n z-index: 2;\r\n }\r\n\r\n .hoopla-hero-wrapper .hero-desc {\r\n font-size: clamp(1.3rem, 2vw, 1.5rem);\r\n color: var(--color-white);\r\n line-height: 1.2;\r\n text-shadow: 2px 2px 0px #1E1A29;\r\n }\r\n\r\n \/* \ud83d\udfe2 BAGIAN POJOK KANAN BAWAH *\/\r\n .hoopla-hero-wrapper .hero-bottom-right {\r\n align-self: flex-end;\r\n max-width: 450px;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: flex-end;\r\n gap: 10px;\r\n margin-top: 200px; \/* Space vertikal lega untuk karakter di tengah *\/\r\n z-index: 2;\r\n }\r\n\r\n \/* \ud83d\udfe2 CA BOX DENGAN IKON LINGKARAN & LABEL TEXT $TOAD *\/\r\n .hoopla-hero-wrapper .ca-box {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n gap: 8px;\r\n background: #FFF8EA;\r\n border: 2.5px solid #1E1A29;\r\n border-radius: 16px;\r\n padding: 5px 10px;\r\n box-shadow: 3.5px 3.5px 0px #1E1A29;\r\n width: 100%;\r\n }\r\n\r\n \/* Wrapper Ikon & Label $TOAD *\/\r\n .hoopla-hero-wrapper .ca-left-group {\r\n display: flex;\r\n align-items: center;\r\n gap: 6px;\r\n flex-shrink: 0;\r\n }\r\n\r\n \/* Ikon Lingkaran Kecil *\/\r\n .hoopla-hero-wrapper .ca-icon {\r\n width: 28px;\r\n height: 28px;\r\n border-radius: 50%;\r\n border: 1.8px solid #1E1A29;\r\n object-fit: cover;\r\n background: var(--color-yellow);\r\n box-shadow: 1.5px 1.5px 0px #1E1A29;\r\n }\r\n\r\n \/* Badge Text $TOAD *\/\r\n .hoopla-hero-wrapper .ca-badge {\r\n font-family: 'Slackey', cursive;\r\n font-size: 0.95rem;\r\n background: var(--color-yellow);\r\n color: #1E1A29;\r\n border: 1.8px solid #1E1A29;\r\n border-radius: 8px;\r\n padding: 1px 6px;\r\n box-shadow: 1.5px 1.5px 0px #1E1A29;\r\n line-height: 1;\r\n }\r\n\r\n \/* Text Kode CA *\/\r\n .hoopla-hero-wrapper .ca-text {\r\n font-size: 1.05rem;\r\n font-weight: bold;\r\n color: #1E1A29;\r\n word-break: break-all;\r\n padding: 0 4px;\r\n }\r\n\r\n \/* Tombol Copy *\/\r\n .hoopla-hero-wrapper .btn-copy {\r\n padding: 3px 10px;\r\n font-size: 1rem;\r\n background-color: var(--color-green);\r\n color: #1E1A29;\r\n border: 2px solid #1E1A29;\r\n border-radius: 10px;\r\n cursor: pointer;\r\n box-shadow: 2px 2px 0px #1E1A29;\r\n transition: transform 0.2s ease, background-color 0.2s ease;\r\n flex-shrink: 0;\r\n }\r\n\r\n .hoopla-hero-wrapper .btn-copy:hover {\r\n transform: scale(1.05);\r\n background-color: var(--color-yellow);\r\n }\r\n\r\n \/* Group Action Buttons SLIM & HORISONTAL *\/\r\n .hoopla-hero-wrapper .hero-btns {\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n justify-content: flex-end;\r\n gap: 8px;\r\n width: 100%;\r\n flex-wrap: nowrap;\r\n }\r\n\r\n .hoopla-hero-wrapper .btn-action {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 5px 12px;\r\n font-size: 1.25rem;\r\n border: 2px solid #1E1A29;\r\n border-radius: 14px;\r\n box-shadow: 3px 3px 0px #1E1A29;\r\n text-decoration: none;\r\n color: #1E1A29;\r\n font-weight: bold;\r\n white-space: nowrap;\r\n transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);\r\n }\r\n\r\n .hoopla-hero-wrapper .btn-action:hover {\r\n transform: translate(-2px, -2px) rotate(-1deg);\r\n }\r\n\r\n \/* Toast Notification Copy CA *\/\r\n .hoopla-hero-wrapper .toast-copy {\r\n position: fixed;\r\n bottom: -60px;\r\n left: 50%;\r\n transform: translateX(-50%);\r\n background: var(--color-green);\r\n color: #1E1A29;\r\n border: 2px solid #1E1A29;\r\n padding: 8px 18px;\r\n border-radius: 30px;\r\n box-shadow: 3px 3px 0px #1E1A29;\r\n font-size: 1.2rem;\r\n font-weight: bold;\r\n z-index: 999999;\r\n transition: bottom 0.3s ease;\r\n }\r\n\r\n .hoopla-hero-wrapper .toast-copy.show {\r\n bottom: 20px;\r\n }\r\n\r\n \/* ==========================================================================\r\n 3. RESPONSIVE MOBILE\r\n ========================================================================== *\/\r\n @media (max-width: 768px) {\r\n .hoopla-hero-wrapper .hero-container {\r\n min-height: auto;\r\n }\r\n\r\n .hoopla-hero-wrapper .hero-top-left {\r\n max-width: 100%;\r\n text-align: center;\r\n align-self: center;\r\n }\r\n\r\n .hoopla-hero-wrapper .hero-bottom-right {\r\n max-width: 100%;\r\n align-self: center;\r\n align-items: center;\r\n margin-top: 180px;\r\n }\r\n\r\n .hoopla-hero-wrapper .ca-box {\r\n flex-direction: column;\r\n text-align: center;\r\n gap: 6px;\r\n }\r\n\r\n .hoopla-hero-wrapper .hero-btns {\r\n justify-content: center;\r\n flex-wrap: wrap;\r\n gap: 6px;\r\n }\r\n\r\n .hoopla-hero-wrapper .btn-action {\r\n font-size: 1.15rem;\r\n padding: 5px 10px;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n\r\n \r\n <div class=\"hoopla-hero-wrapper\">\r\n <div class=\"hero-container\">\r\n \r\n \r\n <div class=\"hero-top-left\">\r\n <h1>A Tiny Toad. Bright World. Endless Hoopla.<\/h1>\r\n <p class=\"hero-desc\">\r\n Small moments turn into fun adventures, and simple things become memorable stories!\r\n <\/p>\r\n <\/div>\r\n\r\n \r\n <div class=\"hero-bottom-right\">\r\n \r\n <div class=\"ca-box\">\r\n <div class=\"ca-left-group\">\r\n <img decoding=\"async\" src=\"https:\/\/hooplatoad.xyz\/wp-content\/uploads\/2026\/08\/ICON-WEB-HOOPLA-TOAD-1-1.png\" alt=\"Icon Toad\" class=\"ca-icon\" \/>\r\n <span class=\"ca-badge\">$TOAD<\/span>\r\n <\/div>\r\n\r\n <span class=\"ca-text\" id=\"ca-text-code\">54CrAcw3mhAxP2QgFUTubeXTidtXtEowpDTL7b7Epumpp<\/span>\r\n <button class=\"btn-copy\" onclick=\"copyCAHero()\">[ Copy ]<\/button>\r\n <\/div>\r\n\r\n \r\n <div class=\"hero-btns\">\r\n <a href=\"https:\/\/swap.pump.fun\/?input=So11111111111111111111111111111111111111112&output=54CrAcw3mhAxP2QgFUTubeXTidtXtEowpDTL7b7Epump\" target=\"_blank\" class=\"btn-action\" style=\"background: var(--color-yellow);\">[ BUY $TOAD ]<\/a>\r\n <a href=\"https:\/\/t.me\/hooplatoad\" target=\"_blank\" class=\"btn-action\" style=\"background: var(--color-cyan);\">[ TELEGRAM ]<\/a>\r\n <a href=\"https:\/\/x.com\/hooplatoad\" target=\"_blank\" class=\"btn-action\" style=\"background: var(--color-purple); color: white;\">[ X \/ TWITTER ]<\/a>\r\n <\/div>\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n \r\n <div class=\"toast-copy\" id=\"hero-toast\">CA Berhasil Di-copy! \ud83d\udc38<\/div>\r\n <\/div>\r\n\r\n <script>\r\n function copyCAHero() {\r\n const caText = document.getElementById(\"ca-text-code\").innerText;\r\n navigator.clipboard.writeText(caText).then(() => {\r\n const toast = document.getElementById(\"hero-toast\");\r\n toast.classList.add(\"show\");\r\n setTimeout(() => {\r\n toast.classList.remove(\"show\");\r\n }, 2000);\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<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-f11223b e-flex e-con-boxed e-con e-parent\" data-id=\"f11223b\" data-element_type=\"container\" data-settings=\"{"background_background":"classic"}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-7aeb1a2 e-con-full e-flex e-con e-child\" data-id=\"7aeb1a2\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-bbcbaf5 elementor-widget elementor-widget-html\" data-id=\"bbcbaf5\" 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=\"id\">\r\n<head>\r\n <meta charset=\"UTF-8\" \/>\r\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" \/>\r\n <title>Hoopla Toad - Story, Vibe & Slim Footer<\/title>\r\n \r\n \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=Slackey&family=Slackside+One&display=swap\" rel=\"stylesheet\">\r\n\r\n <style>\r\n \/* ==========================================================================\r\n 1. VARS & RESET (Terisolasi tanpa merubah BG WordPress)\r\n ========================================================================== *\/\r\n .hoopla-content-wrapper {\r\n --font-heading: 'Slackey', cursive;\r\n --font-body: 'Slackside One', cursive;\r\n \r\n --color-green: #72D049;\r\n --color-purple: #8B46FF;\r\n --color-yellow: #FFDE59;\r\n --color-pink: #FF3EA5;\r\n --color-orange: #FF7A00;\r\n --color-cyan: #00E5FF;\r\n --color-dark: #1E1A29;\r\n --color-white: #FFFFFF;\r\n\r\n width: 100%;\r\n background: transparent !important;\r\n font-family: var(--font-body);\r\n color: var(--color-dark);\r\n box-sizing: border-box;\r\n padding: 30px 0 10px 0;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 50px;\r\n }\r\n\r\n .hoopla-content-wrapper * {\r\n box-sizing: border-box;\r\n margin: 0;\r\n padding: 0;\r\n }\r\n\r\n \/* Headings *\/\r\n .hoopla-content-wrapper h2, \r\n .hoopla-content-wrapper h3, \r\n .hoopla-content-wrapper h4 {\r\n font-family: 'Slackey', cursive;\r\n font-weight: 500;\r\n text-transform: uppercase;\r\n color: var(--color-yellow);\r\n -webkit-text-stroke: 0.6px #1E1A29;\r\n text-shadow: 2.5px 2.5px 0px #1E1A29;\r\n line-height: 1.1;\r\n }\r\n\r\n .hoopla-content-wrapper p, \r\n .hoopla-content-wrapper span, \r\n .hoopla-content-wrapper a, \r\n .hoopla-content-wrapper div {\r\n font-family: 'Slackside One', cursive;\r\n }\r\n\r\n \/* ==========================================================================\r\n 2. STORY SECTION (ASET 2 Ukuran 400px di Dalam Card Kanan)\r\n ========================================================================== *\/\r\n .hoopla-content-wrapper .story-wrapper {\r\n max-width: 1050px;\r\n margin: 0 auto;\r\n width: 100%;\r\n }\r\n\r\n .hoopla-content-wrapper .story-section {\r\n background: var(--color-yellow);\r\n border: 3px solid #1E1A29;\r\n border-radius: 28px;\r\n padding: 30px;\r\n box-shadow: 6px 6px 0px #1E1A29;\r\n transform: rotate(-0.6deg);\r\n transition: transform 0.3s ease;\r\n width: 100%;\r\n display: grid;\r\n grid-template-columns: 1fr auto;\r\n align-items: center;\r\n gap: 25px;\r\n overflow: hidden;\r\n }\r\n\r\n .hoopla-content-wrapper .story-section:hover {\r\n transform: rotate(0deg);\r\n }\r\n\r\n .hoopla-content-wrapper .story-content-left {\r\n text-align: left;\r\n }\r\n\r\n .hoopla-content-wrapper .story-title {\r\n color: var(--color-purple);\r\n font-size: clamp(2rem, 3.8vw, 2.6rem);\r\n margin-bottom: 12px;\r\n }\r\n\r\n .hoopla-content-wrapper .story-text {\r\n font-size: clamp(1.3rem, 2.2vw, 1.6rem);\r\n color: #1E1A29;\r\n line-height: 1.25;\r\n }\r\n\r\n \/* GAMBAR ASET 2 (400px DI DALAM CARD STORY KANAN) *\/\r\n .hoopla-content-wrapper .asset-story-right {\r\n width: clamp(250px, 35vw, 400px);\r\n height: auto;\r\n filter: drop-shadow(5px 5px 0px #1E1A29);\r\n animation: floatSmoothRight 4s ease-in-out infinite;\r\n flex-shrink: 0;\r\n }\r\n\r\n @keyframes floatSmoothRight {\r\n 0%, 100% { \r\n transform: translateY(0px) rotate(1deg); \r\n }\r\n 50% { \r\n transform: translateY(-12px) rotate(-2deg); \r\n }\r\n }\r\n\r\n \/* ==========================================================================\r\n 3. THE VIBE SECTION (ASET 1 Jumbo 500px + Smooth Motion)\r\n ========================================================================== *\/\r\n .hoopla-content-wrapper .vibe-section {\r\n width: 100%;\r\n max-width: 1050px;\r\n margin: 0 auto;\r\n text-align: center;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n }\r\n\r\n .hoopla-content-wrapper .vibe-header {\r\n font-size: clamp(2.2rem, 4.5vw, 3rem);\r\n color: var(--color-cyan);\r\n margin-bottom: 25px;\r\n }\r\n\r\n .hoopla-content-wrapper .vibe-grid {\r\n display: grid;\r\n grid-template-columns: repeat(3, 1fr);\r\n gap: 18px;\r\n width: 100%;\r\n }\r\n\r\n .hoopla-content-wrapper .vibe-card {\r\n border: 3px solid #1E1A29;\r\n border-radius: 22px;\r\n padding: 20px 16px;\r\n box-shadow: 5px 5px 0px #1E1A29;\r\n text-align: left;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 6px;\r\n transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);\r\n }\r\n\r\n .hoopla-content-wrapper .vibe-card:hover {\r\n transform: translateY(-5px) rotate(1deg);\r\n box-shadow: 7px 7px 0px #1E1A29;\r\n }\r\n\r\n .hoopla-content-wrapper .vibe-card h4 {\r\n font-size: 1.5rem;\r\n }\r\n\r\n .hoopla-content-wrapper .vibe-card p {\r\n font-size: 1.3rem;\r\n line-height: 1.15;\r\n }\r\n\r\n .hoopla-content-wrapper .vibe-card-1 { background: var(--color-cyan); }\r\n .hoopla-content-wrapper .vibe-card-2 { background: var(--color-pink); color: var(--color-white); }\r\n .hoopla-content-wrapper .vibe-card-3 { background: var(--color-green); }\r\n\r\n \/* GAMBAR ASET 1 (JUMBO 500px DI BAWAH VIBE CARDS) *\/\r\n .hoopla-content-wrapper .asset-vibe-bottom {\r\n width: clamp(280px, 45vw, 500px);\r\n height: auto;\r\n margin-top: 30px;\r\n filter: drop-shadow(6px 6px 0px #1E1A29);\r\n animation: floatSmoothBottom 4.5s ease-in-out infinite;\r\n transition: transform 0.3s ease;\r\n }\r\n\r\n @keyframes floatSmoothBottom {\r\n 0%, 100% { \r\n transform: translateY(0px) scale(1) rotate(0deg); \r\n }\r\n 50% { \r\n transform: translateY(-18px) scale(1.03) rotate(-2deg); \r\n }\r\n }\r\n\r\n \/* ==========================================================================\r\n 4. SLIM FOOTER SECTION (Clean & Seamless Overlay)\r\n ========================================================================== *\/\r\n .hoopla-content-wrapper .footer-slim {\r\n width: 100%;\r\n max-width: 900px;\r\n margin: 0 auto;\r\n text-align: center;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n gap: 12px;\r\n padding: 10px 0;\r\n }\r\n\r\n .hoopla-content-wrapper .footer-brand {\r\n font-size: clamp(1.6rem, 3vw, 2.2rem);\r\n color: var(--color-yellow);\r\n }\r\n\r\n .hoopla-content-wrapper .footer-socials {\r\n display: flex;\r\n justify-content: center;\r\n gap: 10px;\r\n flex-wrap: wrap;\r\n }\r\n\r\n .hoopla-content-wrapper .btn-social {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 6px 18px;\r\n font-size: 1.25rem;\r\n border: 2px solid #1E1A29;\r\n border-radius: 14px;\r\n box-shadow: 3.5px 3.5px 0px #1E1A29;\r\n text-decoration: none;\r\n color: #1E1A29;\r\n font-weight: bold;\r\n transition: transform 0.2s ease, background-color 0.2s ease;\r\n }\r\n\r\n .hoopla-content-wrapper .btn-social:hover {\r\n transform: translate(-2px, -2px) rotate(-1deg);\r\n }\r\n\r\n .hoopla-content-wrapper .footer-disclaimer {\r\n font-size: 1.15rem;\r\n max-width: 650px;\r\n color: var(--color-white);\r\n line-height: 1.2;\r\n text-shadow: 1.5px 1.5px 0px #1E1A29;\r\n opacity: 0.95;\r\n }\r\n\r\n .hoopla-content-wrapper .footer-copy {\r\n font-size: 1.05rem;\r\n color: var(--color-yellow);\r\n font-weight: bold;\r\n text-shadow: 1.5px 1.5px 0px #1E1A29;\r\n }\r\n\r\n \/* ==========================================================================\r\n 5. RESPONSIVE MOBILE\r\n ========================================================================== *\/\r\n @media (max-width: 868px) {\r\n .hoopla-content-wrapper .story-section {\r\n grid-template-columns: 1fr;\r\n text-align: center;\r\n padding: 25px 20px;\r\n }\r\n\r\n .hoopla-content-wrapper .story-content-left {\r\n text-align: center;\r\n }\r\n\r\n .hoopla-content-wrapper .asset-story-right {\r\n margin: 0 auto;\r\n width: 280px;\r\n }\r\n\r\n .hoopla-content-wrapper .vibe-grid {\r\n grid-template-columns: 1fr;\r\n gap: 14px;\r\n }\r\n\r\n .hoopla-content-wrapper .vibe-card {\r\n text-align: center;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n\r\n \r\n <div class=\"hoopla-content-wrapper\">\r\n\r\n \r\n <div class=\"story-wrapper\">\r\n <section class=\"story-section\">\r\n \r\n <div class=\"story-content-left\">\r\n <h2 class=\"story-title\">Meet Hoopla Toad<\/h2>\r\n <p class=\"story-text\">\r\n Hoopla Toad is all about curiosity, positivity, and enjoying the little surprises along the way. Pure energy, sharp focus, and authentic community culture.\r\n <\/p>\r\n <\/div>\r\n\r\n \r\n <img decoding=\"async\" src=\"https:\/\/hooplatoad.xyz\/wp-content\/uploads\/2026\/08\/ASET2.png\" alt=\"Aset Hoopla Toad 2\" class=\"asset-story-right\" \/>\r\n <\/section>\r\n <\/div>\r\n\r\n \r\n <section class=\"vibe-section\">\r\n <h2 class=\"vibe-header\">Good Energy Only<\/h2>\r\n \r\n <div class=\"vibe-grid\">\r\n \r\n <div class=\"vibe-card vibe-card-1\">\r\n <h4 style=\"color: #8B46FF;\">100% Organic Culture<\/h4>\r\n <p>Driven by community engagement, natural momentum, and zero artificial noise.<\/p>\r\n <\/div>\r\n\r\n \r\n <div class=\"vibe-card vibe-card-2\">\r\n <h4 style=\"color: #FFDE59;\">Daily Adventures<\/h4>\r\n <p>Moving forward step by step, turning simple moments into solid milestones.<\/p>\r\n <\/div>\r\n\r\n \r\n <div class=\"vibe-card vibe-card-3\">\r\n <h4 style=\"color: #8B46FF;\">Pure Positivity<\/h4>\r\n <p>Clean narrative, straightforward approach, and transparent execution.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <img decoding=\"async\" src=\"https:\/\/hooplatoad.xyz\/wp-content\/uploads\/2026\/08\/ASET1.png\" alt=\"Aset Hoopla Toad 1\" class=\"asset-vibe-bottom\" \/>\r\n <\/section>\r\n\r\n \r\n <footer class=\"footer-slim\">\r\n <h2 class=\"footer-brand\">HOOPLA TOAD ($TOAD)<\/h2>\r\n \r\n \r\n <div class=\"footer-socials\">\r\n <a href=\"https:\/\/x.com\/hooplatoad\" target=\"_blank\" class=\"btn-social\" style=\"background: var(--color-cyan);\">[ X \/ Twitter ]<\/a>\r\n <a href=\"https:\/\/t.me\/hooplatoad\" target=\"_blank\" class=\"btn-social\" style=\"background: var(--color-green);\">[ Telegram ]<\/a>\r\n <\/div>\r\n\r\n \r\n <p class=\"footer-disclaimer\">\r\n $TOAD is a meme coin created for entertainment and community purposes. Crypto assets carry risk. Always DYOR.\r\n <\/p>\r\n\r\n \r\n <p class=\"footer-copy\">\u00a9 2026 Hoopla Toad. All rights reserved.<\/p>\r\n <\/footer>\r\n\r\n <\/div>\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>Hoopla Toad Fixed Navbar HOOPLA TOAD Tokenomics How to Buy Join Us [ BUY $TOAD ] \u2715 Tokenomics Ticker $TOAD Total Supply 1B Supply Buy \/ Sell Tax 0% \/ 0% Liquidity Burned \u2715 3 Simple Steps 1 Set Up Wallet Download Phantom or any Web3 wallet. 2 Fund Wallet Get SOL to trade for […]<\/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:\/\/hooplatoad.xyz\/index.php?rest_route=\/wp\/v2\/pages\/8","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/hooplatoad.xyz\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/hooplatoad.xyz\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/hooplatoad.xyz\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/hooplatoad.xyz\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=8"}],"version-history":[{"count":22,"href":"https:\/\/hooplatoad.xyz\/index.php?rest_route=\/wp\/v2\/pages\/8\/revisions"}],"predecessor-version":[{"id":43,"href":"https:\/\/hooplatoad.xyz\/index.php?rest_route=\/wp\/v2\/pages\/8\/revisions\/43"}],"wp:attachment":[{"href":"https:\/\/hooplatoad.xyz\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=8"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}