{"id":8,"date":"2026-03-11T03:49:09","date_gmt":"2026-03-11T03:49:09","guid":{"rendered":"https:\/\/hyperballistic.online\/?page_id=8"},"modified":"2026-03-11T05:25:59","modified_gmt":"2026-03-11T05:25:59","slug":"elementor-8","status":"publish","type":"page","link":"https:\/\/hyperballistic.online\/","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-84c1c8d e-flex e-con-boxed e-con e-parent\" data-id=\"84c1c8d\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-31e2512 e-con-full e-flex e-con e-child\" data-id=\"31e2512\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a165269 elementor-widget elementor-widget-html\" data-id=\"a165269\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Black+Ops+One&family=Tektur:wght@400;600&display=swap\" rel=\"stylesheet\">\r\n\r\n<style>\r\n    :root {\r\n        --ballistic-orange: #FF6600;\r\n        --ballistic-white: #FFFFFF;\r\n    }\r\n\r\n    \/* Reset Dasar *\/\r\n    * {\r\n        box-sizing: border-box;\r\n        margin: 0;\r\n        padding: 0;\r\n    }\r\n\r\n    \/* Container Navigasi - Transparan Tanpa Warna Hitam *\/\r\n    .nav-ballistic-container {\r\n        background-color: transparent; \/* Latar belakang transparan penuh [cite: 2026-03-11] *\/\r\n        border-bottom: 2px solid var(--ballistic-orange);\r\n        padding: 0.8rem 5%;\r\n        display: flex;\r\n        justify-content: space-between;\r\n        align-items: center;\r\n        position: sticky;\r\n        top: 0;\r\n        z-index: 9999;\r\n        width: 100%;\r\n        overflow: hidden; \r\n        backdrop-filter: blur(5px); \/* Memberikan efek blur halus pada konten di bawahnya agar tetap rapi [cite: 2026-03-11] *\/\r\n    }\r\n\r\n    \/* Logo dengan Animasi Scramble *\/\r\n    .nav-ballistic-logo {\r\n        font-family: 'Black Ops One', cursive;\r\n        font-size: clamp(1.2rem, 4vw, 1.8rem);\r\n        color: var(--ballistic-orange);\r\n        text-decoration: none;\r\n        letter-spacing: 2px;\r\n        flex-shrink: 0;\r\n        white-space: nowrap;\r\n    }\r\n\r\n    \/* Menu Link Putih *\/\r\n    .nav-ballistic-links {\r\n        display: flex;\r\n        gap: clamp(10px, 2vw, 20px);\r\n        list-style: none;\r\n        align-items: center;\r\n    }\r\n\r\n    .nav-ballistic-links li a {\r\n        font-family: 'Tektur', sans-serif;\r\n        color: var(--ballistic-white);\r\n        text-decoration: none;\r\n        font-size: clamp(0.75rem, 1.5vw, 0.85rem);\r\n        font-weight: 500;\r\n        text-transform: uppercase;\r\n        letter-spacing: 1px;\r\n        transition: color 0.3s ease;\r\n        padding: 5px 4px;\r\n    }\r\n\r\n    .nav-ballistic-links li a:hover {\r\n        color: var(--ballistic-orange);\r\n    }\r\n\r\n    \/* Button Orange - Deploy Style *\/\r\n    .nav-btn-orange {\r\n        background-color: var(--ballistic-orange);\r\n        color: #FFFFFF !important;\r\n        font-family: 'Tektur', sans-serif;\r\n        padding: clamp(6px, 1.5vw, 10px) clamp(12px, 2vw, 22px);\r\n        border-radius: 4px;\r\n        font-weight: 700;\r\n        font-size: clamp(0.7rem, 1.5vw, 0.85rem);\r\n        text-transform: uppercase;\r\n        border: none;\r\n        cursor: pointer;\r\n        transition: transform 0.2s, background 0.3s;\r\n        text-decoration: none;\r\n        display: inline-block;\r\n        margin-left: clamp(5px, 1.5vw, 10px);\r\n    }\r\n\r\n    .nav-btn-orange:hover {\r\n        background-color: #e65c00;\r\n        transform: translateY(-2px);\r\n        box-shadow: 0 4px 12px rgba(255, 102, 0, 0.3);\r\n    }\r\n\r\n    \/* Responsif Mobile *\/\r\n    @media (max-width: 992px) {\r\n        .hide-mobile {\r\n            display: none;\r\n        }\r\n        \r\n        .nav-ballistic-container {\r\n            padding: 0.8rem 15px;\r\n        }\r\n    }\r\n<\/style>\r\n\r\n<nav class=\"nav-ballistic-container\">\r\n    <a href=\"#\" class=\"nav-ballistic-logo\" id=\"logoTitle\" data-value=\"BALLISTIC\">BALLISTIC<\/a>\r\n    \r\n    <ul class=\"nav-ballistic-links\">\r\n        <li class=\"hide-mobile\"><a href=\"#intel\">Intel<\/a><\/li>\r\n        <li class=\"hide-mobile\"><a href=\"#map\">Tactical Map<\/a><\/li>\r\n        <li class=\"hide-mobile\"><a href=\"#tokenomics\">Tokenomics<\/a><\/li>\r\n        <li><a href=\"#stats\">Stats<\/a><\/li>\r\n        <li><a href=\"#deploy\" class=\"nav-btn-orange\">Deploy Now<\/a><\/li>\r\n    <\/ul>\r\n<\/nav>\r\n\r\n<script>\r\n    const letters = \"ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789\";\r\n    let interval = null;\r\n\r\n    function runScramble() {\r\n        const element = document.getElementById(\"logoTitle\");\r\n        let iteration = 0;\r\n        \r\n        clearInterval(interval);\r\n        \r\n        interval = setInterval(() => {\r\n            element.innerText = element.innerText\r\n                .split(\"\")\r\n                .map((letter, index) => {\r\n                    if(index < iteration) {\r\n                        return element.dataset.value[index];\r\n                    }\r\n                    return letters[Math.floor(Math.random() * 36)];\r\n                })\r\n                .join(\"\");\r\n            \r\n            if(iteration >= element.dataset.value.length) {\r\n                clearInterval(interval);\r\n            }\r\n            \r\n            iteration += 1 \/ 3;\r\n        }, 30);\r\n    }\r\n\r\n    window.onload = runScramble;\r\n    document.getElementById(\"logoTitle\").onmouseover = runScramble;\r\n<\/script>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-cb352a4 e-con-full e-flex e-con e-child\" data-id=\"cb352a4\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8f82deb elementor-widget elementor-widget-html\" data-id=\"8f82deb\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<style>\r\n    \/* --- OVERLAY PARTIKEL LEDAKAN (DI ATAS KONTEN) --- *\/\r\n    #explosion-overlay {\r\n        position: fixed;\r\n        top: 0;\r\n        left: 0;\r\n        width: 100vw;\r\n        height: 100vh;\r\n        z-index: 9999; \/* Berada di atas SEMUA konten *\/\r\n        pointer-events: none; \/* PENTING: Klik akan menembus ke tombol di bawahnya *\/\r\n        overflow: hidden;\r\n    }\r\n\r\n    .ember {\r\n        position: absolute;\r\n        background: #FF6600; \/* Warna Oranye Ballistic *\/\r\n        border-radius: 50%;\r\n        filter: blur(1px);\r\n        box-shadow: 0 0 10px #FF6600, 0 0 20px #FF3300;\r\n        opacity: 0;\r\n        animation: fall-ember linear infinite;\r\n    }\r\n\r\n    @keyframes fall-ember {\r\n        0% {\r\n            transform: translateY(-10vh) translateX(0) rotate(0deg) scale(0);\r\n            opacity: 0;\r\n        }\r\n        20% {\r\n            opacity: 0.8;\r\n            transform: translateY(10vh) translateX(20px) rotate(90deg) scale(1);\r\n        }\r\n        80% {\r\n            opacity: 0.6;\r\n        }\r\n        100% {\r\n            transform: translateY(110vh) translateX(-50px) rotate(360deg) scale(0.2);\r\n            opacity: 0;\r\n        }\r\n    }\r\n<\/style>\r\n\r\n<div id=\"explosion-overlay\"><\/div>\r\n\r\n<script>\r\n    function createExplosionEmbers() {\r\n        const overlay = document.getElementById('explosion-overlay');\r\n        const count = 50; \/\/ Jumlah percikan ledakan\r\n\r\n        for (let i = 0; i < count; i++) {\r\n            const ember = document.createElement('div');\r\n            ember.className = 'ember';\r\n            \r\n            \/\/ Ukuran acak\r\n            const size = Math.random() * 5 + 2 + 'px';\r\n            \r\n            \/\/ Posisi horisontal acak\r\n            ember.style.left = Math.random() * 100 + 'vw';\r\n            \r\n            \/\/ Durasi jatuh acak (3s sampai 8s)\r\n            ember.style.animationDuration = Math.random() * 5 + 3 + 's';\r\n            \r\n            \/\/ Delay acak agar tidak jatuh bersamaan\r\n            ember.style.animationDelay = Math.random() * 10 + 's';\r\n            \r\n            ember.style.width = size;\r\n            ember.style.height = size;\r\n            \r\n            overlay.appendChild(ember);\r\n        }\r\n    }\r\n\r\n    \/\/ Jalankan fungsi\r\n    createExplosionEmbers();\r\n<\/script>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-3fa18bb e-con-full e-flex e-con e-child\" data-id=\"3fa18bb\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9ddd6fc elementor-widget elementor-widget-html\" data-id=\"9ddd6fc\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Black+Ops+One&family=Tektur:wght@400;600&display=swap\" rel=\"stylesheet\">\r\n\r\n<style>\r\n    :root {\r\n        --primary-orange: #FF6600;\r\n        --text-white: #FFFFFF;\r\n        --text-muted: rgba(255, 255, 255, 0.7);\r\n        \/* Sinkron dengan nuansa latar WordPress atau transparan *\/\r\n        --bg-custom: var(--wp--custom--surface, transparent); \r\n    }\r\n\r\n    .hero-section {\r\n        padding: clamp(60px, 10vh, 120px) 5%;\r\n        text-align: center;\r\n        background-color: var(--bg-custom);\r\n        display: flex;\r\n        flex-direction: column;\r\n        align-items: center;\r\n        gap: 20px;\r\n        position: relative;\r\n        overflow: hidden;\r\n        width: 100%;\r\n        box-sizing: border-box;\r\n    }\r\n\r\n    \/* Grid background tipis khas militer *\/\r\n    .hero-section::before {\r\n        content: \"\";\r\n        position: absolute;\r\n        inset: 0;\r\n        background-image: linear-gradient(var(--primary-orange) 1px, transparent 1px), \r\n                          linear-gradient(90deg, var(--primary-orange) 1px, transparent 1px);\r\n        background-size: 50px 50px;\r\n        opacity: 0.05;\r\n        pointer-events: none;\r\n    }\r\n\r\n    .status-alert {\r\n        display: inline-flex;\r\n        align-items: center;\r\n        gap: 8px;\r\n        font-family: 'Tektur', sans-serif;\r\n        font-size: 0.75rem;\r\n        color: var(--primary-orange);\r\n        border: 1px solid var(--primary-orange);\r\n        padding: 5px 15px;\r\n        border-radius: 2px;\r\n        text-transform: uppercase;\r\n        letter-spacing: 2px;\r\n        background: rgba(255, 102, 0, 0.05);\r\n    }\r\n\r\n    .pulse {\r\n        width: 6px;\r\n        height: 6px;\r\n        background: var(--primary-orange);\r\n        border-radius: 50%;\r\n        box-shadow: 0 0 8px var(--primary-orange);\r\n        animation: pulse-ring 1.5s infinite;\r\n    }\r\n\r\n    @keyframes pulse-ring {\r\n        0%, 100% { transform: scale(0.9); opacity: 1; }\r\n        50% { transform: scale(1.2); opacity: 0.5; }\r\n    }\r\n\r\n    \/* Judul Utama dengan Animasi Scramble *\/\r\n    h1 {\r\n        font-family: 'Black Ops One', cursive;\r\n        font-size: clamp(2.8rem, 12vw, 6rem);\r\n        color: var(--primary-orange);\r\n        text-shadow: 0 0 20px rgba(255, 102, 0, 0.3);\r\n        margin: 0;\r\n        line-height: 1;\r\n        cursor: default;\r\n    }\r\n\r\n    .hero-desc {\r\n        font-family: 'Tektur', sans-serif;\r\n        font-size: clamp(0.95rem, 2.2vw, 1.1rem);\r\n        color: var(--text-white); \/* Diubah ke putih agar lebih jelas *\/\r\n        max-width: 700px;\r\n        margin-bottom: 20px;\r\n        line-height: 1.6;\r\n        opacity: 0.9;\r\n    }\r\n\r\n    \/* CA Copy Section *\/\r\n    .ca-container {\r\n        display: flex;\r\n        flex-direction: column;\r\n        align-items: center;\r\n        gap: 10px;\r\n        width: 100%;\r\n        max-width: 550px;\r\n        position: relative;\r\n        z-index: 2;\r\n    }\r\n\r\n    .ca-label {\r\n        font-family: 'Tektur', sans-serif;\r\n        font-size: 0.7rem;\r\n        color: var(--primary-orange);\r\n        letter-spacing: 3px;\r\n        text-transform: uppercase;\r\n    }\r\n\r\n    .ca-box {\r\n        display: flex;\r\n        width: 100%;\r\n        background: rgba(255, 255, 255, 0.03);\r\n        border: 1.5px solid var(--primary-orange);\r\n        border-radius: 4px;\r\n        overflow: hidden;\r\n        backdrop-filter: blur(5px);\r\n        transition: transform 0.2s ease, box-shadow 0.2s ease;\r\n    }\r\n\r\n    .ca-box:hover {\r\n        transform: translateY(-2px);\r\n        box-shadow: 0 5px 15px rgba(255, 102, 0, 0.2);\r\n    }\r\n\r\n    .ca-address {\r\n        flex: 1;\r\n        padding: 12px 15px;\r\n        font-family: 'Tektur', sans-serif; \/* Mengikuti font deskripsi *\/\r\n        font-size: clamp(0.75rem, 2vw, 0.85rem);\r\n        color: var(--text-white);\r\n        white-space: nowrap;\r\n        overflow: hidden;\r\n        text-overflow: ellipsis;\r\n        text-align: left;\r\n        letter-spacing: 1px;\r\n    }\r\n\r\n    .ca-copy-btn {\r\n        background: var(--primary-orange);\r\n        border: none;\r\n        color: #000;\r\n        padding: 0 25px;\r\n        font-family: 'Tektur', sans-serif;\r\n        font-weight: 700;\r\n        font-size: 0.8rem;\r\n        cursor: pointer;\r\n        text-transform: uppercase;\r\n        transition: all 0.3s ease;\r\n    }\r\n\r\n    .ca-copy-btn:hover {\r\n        background: var(--text-white);\r\n        color: var(--primary-orange);\r\n    }\r\n\r\n    @media (max-width: 768px) {\r\n        .hero-section { padding: 60px 20px; }\r\n        .ca-box { flex-direction: column; }\r\n        .ca-copy-btn { padding: 14px; width: 100%; border-top: 1px solid rgba(255, 102, 0, 0.2); }\r\n        .ca-address { text-align: center; }\r\n    }\r\n<\/style>\r\n\r\n<section class=\"hero-section\">\r\n    <div class=\"status-alert\">\r\n        <div class=\"pulse\"><\/div>\r\n        Operational Status: Active\r\n    <\/div>\r\n    \r\n    <h1 id=\"scrambleTitle\" data-value=\"BALLISTIC\">BALLISTIC<\/h1>\r\n    \r\n    <p class=\"hero-desc\">\r\n        Real-time tactical monitoring and decentralized strategic intelligence network. \r\n        High-precision ballistic trajectory tracking powered by Solana.\r\n    <\/p>\r\n\r\n    <div class=\"ca-container\">\r\n        <div class=\"ca-label\">OFFICIAL CONTRACT ADDRESS<\/div>\r\n        <div class=\"ca-box\">\r\n            <div class=\"ca-address\" id=\"caValue\">NULL<\/div>\r\n            <button class=\"ca-copy-btn\" id=\"copyBtn\" onclick=\"copyCA()\">Copy CA<\/button>\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\r\n\r\n<script>\r\n    \/\/ FUNGSI ANIMASI SCRAMBLE (TEKS ACAK)\r\n    const glyphs = \"ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789\";\r\n    \r\n    function scramble(el) {\r\n        let iteration = 0;\r\n        let interval = null;\r\n        const originalText = el.dataset.value;\r\n        \r\n        clearInterval(interval);\r\n        \r\n        interval = setInterval(() => {\r\n            el.innerText = el.innerText\r\n                .split(\"\")\r\n                .map((letter, index) => {\r\n                    if(index < iteration) {\r\n                        return originalText[index];\r\n                    }\r\n                    return glyphs[Math.floor(Math.random() * 36)];\r\n                })\r\n                .join(\"\");\r\n            \r\n            if(iteration >= originalText.length) {\r\n                clearInterval(interval);\r\n            }\r\n            \r\n            iteration += 1 \/ 3;\r\n        }, 30);\r\n    }\r\n\r\n    \/\/ Jalankan saat load\r\n    window.addEventListener('DOMContentLoaded', () => {\r\n        const title = document.getElementById(\"scrambleTitle\");\r\n        scramble(title);\r\n    });\r\n\r\n    \/\/ Jalankan saat hover\r\n    document.getElementById(\"scrambleTitle\").onmouseover = e => scramble(e.target);\r\n\r\n    \/\/ FUNGSI COPY CA\r\n    function copyCA() {\r\n        const caText = document.getElementById('caValue').innerText;\r\n        navigator.clipboard.writeText(caText).then(() => {\r\n            const btn = document.getElementById('copyBtn');\r\n            const originalBtnText = btn.innerText;\r\n            \r\n            btn.innerText = 'COPIED!';\r\n            btn.style.background = '#FFFFFF';\r\n            btn.style.color = '#FF6600';\r\n            \r\n            setTimeout(() => {\r\n                btn.innerText = originalBtnText;\r\n                btn.style.background = '#FF6600';\r\n                btn.style.color = '#000000';\r\n            }, 2000);\r\n        });\r\n    }\r\n<\/script>\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-2a4f87c e-flex e-con-boxed e-con e-parent\" data-id=\"2a4f87c\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-d0d68dc e-con-full e-flex e-con e-child\" data-id=\"d0d68dc\" data-element_type=\"container\" id=\"intel\">\n\t\t\t\t<div class=\"elementor-element elementor-element-28aafc7 elementor-widget elementor-widget-html\" data-id=\"28aafc7\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Black+Ops+One&family=Tektur:wght@400;600&display=swap\" rel=\"stylesheet\">\r\n\r\n<style>\r\n    :root {\r\n        --ballistic-orange: #FF6600;\r\n        --ballistic-white: #FFFFFF;\r\n        --glow: 0 0 15px rgba(255, 102, 0, 0.5);\r\n    }\r\n\r\n    \/* --- SECTION INTEL --- *\/\r\n    .intel-section {\r\n        padding: 80px 5%;\r\n        width: 100%;\r\n        display: flex;\r\n        flex-direction: column;\r\n        align-items: center;\r\n        background: transparent;\r\n        overflow: hidden;\r\n    }\r\n\r\n    .intel-header {\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 20px;\r\n        margin-bottom: 50px;\r\n        width: 100%;\r\n        max-width: 1100px;\r\n    }\r\n\r\n    .intel-header h2 {\r\n        font-family: 'Black Ops One', cursive;\r\n        font-size: clamp(2rem, 5vw, 3rem);\r\n        color: var(--ballistic-orange);\r\n        text-transform: uppercase;\r\n        margin: 0;\r\n        cursor: pointer;\r\n    }\r\n\r\n    .intel-line {\r\n        flex: 1;\r\n        height: 2px;\r\n        background: linear-gradient(90deg, var(--ballistic-orange), transparent);\r\n    }\r\n\r\n    \/* --- GRID KONTEN --- *\/\r\n    .intel-grid {\r\n        display: grid;\r\n        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\r\n        gap: 30px;\r\n        width: 100%;\r\n        max-width: 1100px;\r\n    }\r\n\r\n    .intel-card {\r\n        background: rgba(255, 255, 255, 0.02);\r\n        border: 1px solid rgba(255, 102, 0, 0.1);\r\n        padding: 40px 30px;\r\n        border-radius: 8px;\r\n        text-align: center;\r\n        transition: 0.4s ease;\r\n        position: relative;\r\n    }\r\n\r\n    .intel-card:hover {\r\n        border-color: var(--ballistic-orange);\r\n        transform: translateY(-10px);\r\n        background: rgba(255, 102, 0, 0.05);\r\n    }\r\n\r\n    \/* --- ICON OUTLINE ANIMATION --- *\/\r\n    .icon-wrapper {\r\n        width: 80px;\r\n        height: 80px;\r\n        margin: 0 auto 25px;\r\n        display: flex;\r\n        justify-content: center;\r\n        align-items: center;\r\n        position: relative;\r\n    }\r\n\r\n    \/* Animasi Outline Berputar *\/\r\n    .icon-outline {\r\n        position: absolute;\r\n        inset: 0;\r\n        border: 2px solid transparent;\r\n        border-top-color: var(--ballistic-orange);\r\n        border-bottom-color: var(--ballistic-orange);\r\n        border-radius: 50%;\r\n        animation: rotateOutline 3s linear infinite;\r\n    }\r\n\r\n    .icon-outline::after {\r\n        content: \"\";\r\n        position: absolute;\r\n        inset: 5px;\r\n        border: 1px dashed var(--ballistic-orange);\r\n        border-radius: 50%;\r\n        opacity: 0.5;\r\n        animation: rotateOutline 6s linear reverse infinite;\r\n    }\r\n\r\n    @keyframes rotateOutline {\r\n        from { transform: rotate(0deg); }\r\n        to { transform: rotate(360deg); }\r\n    }\r\n\r\n    .intel-icon-svg {\r\n        font-size: 2rem;\r\n        filter: drop-shadow(0 0 10px var(--ballistic-orange));\r\n    }\r\n\r\n    \/* --- TYPOGRAPHY --- *\/\r\n    .intel-label {\r\n        font-family: 'Black Ops One', cursive;\r\n        font-size: 1.2rem;\r\n        color: var(--ballistic-orange);\r\n        margin-bottom: 15px;\r\n        display: block;\r\n        letter-spacing: 1px;\r\n    }\r\n\r\n    .intel-desc {\r\n        font-family: 'Tektur', sans-serif;\r\n        font-size: 0.95rem;\r\n        color: var(--ballistic-white);\r\n        line-height: 1.6;\r\n        opacity: 0.8;\r\n    }\r\n\r\n    \/* --- MOBILE RESPONSIVE --- *\/\r\n    @media (max-width: 768px) {\r\n        .intel-header { flex-direction: column; align-items: flex-start; }\r\n        .intel-line { width: 100%; }\r\n        .intel-card { padding: 30px 20px; }\r\n    }\r\n<\/style>\r\n\r\n<section class=\"intel-section\" id=\"intel\">\r\n    <div class=\"intel-header\">\r\n        <h2 class=\"scramble-intel\" data-value=\"STRATEGIC INTEL\">STRATEGIC INTEL<\/h2>\r\n        <div class=\"intel-line\"><\/div>\r\n    <\/div>\r\n\r\n    <div class=\"intel-grid\">\r\n        <div class=\"intel-card\">\r\n            <div class=\"icon-wrapper\">\r\n                <div class=\"icon-outline\"><\/div>\r\n                <div class=\"intel-icon-svg\">\ud83d\udce1<\/div>\r\n            <\/div>\r\n            <span class=\"intel-label\">Tactical Tracking<\/span>\r\n            <p class=\"intel-desc\">Global trajectory monitoring with sub-second latency and high-precision tactical data relay for decentralized defense networks.<\/p>\r\n        <\/div>\r\n\r\n        <div class=\"intel-card\">\r\n            <div class=\"icon-wrapper\">\r\n                <div class=\"icon-outline\"><\/div>\r\n                <div class=\"intel-icon-svg\">\ud83d\udee1\ufe0f<\/div>\r\n            <\/div>\r\n            <span class=\"intel-label\">Chain Security<\/span>\r\n            <p class=\"intel-desc\">All surveillance data is cryptographically verified and permanently secured on the Solana blockchain for absolute transparency.<\/p>\r\n        <\/div>\r\n\r\n        <div class=\"intel-card\">\r\n            <div class=\"icon-wrapper\">\r\n                <div class=\"icon-outline\"><\/div>\r\n                <div class=\"intel-icon-svg\">\ud83c\udfaf<\/div>\r\n            <\/div>\r\n            <span class=\"intel-label\">Impact Analysis<\/span>\r\n            <p class=\"intel-desc\">Advanced predictive algorithms calculating terminal phase trajectories and impact zones with military-grade situational awareness.<\/p>\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\r\n\r\n<script>\r\n    \/\/ LOGIKA ANIMASI SCRAMBLE JUDUL\r\n    const chars = \"ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789\";\r\n    \r\n    function scrambleIntel(el) {\r\n        let iteration = 0;\r\n        let interval = null;\r\n        const original = el.dataset.value;\r\n        \r\n        clearInterval(interval);\r\n        \r\n        interval = setInterval(() => {\r\n            el.innerText = el.innerText\r\n                .split(\"\")\r\n                .map((letter, index) => {\r\n                    if(index < iteration) return original[index];\r\n                    return chars[Math.floor(Math.random() * 36)];\r\n                })\r\n                .join(\"\");\r\n            \r\n            if(iteration >= original.length) clearInterval(interval);\r\n            iteration += 1 \/ 3;\r\n        }, 30);\r\n    }\r\n\r\n    \/\/ Jalankan saat scroll ke section intel\r\n    const intelObserver = new IntersectionObserver((entries) => {\r\n        entries.forEach(entry => {\r\n            if(entry.isIntersecting) scrambleIntel(entry.target);\r\n        });\r\n    }, { threshold: 0.5 });\r\n\r\n    const intelTitle = document.querySelector('.scramble-intel');\r\n    intelObserver.observe(intelTitle);\r\n    \r\n    \/\/ Jalankan saat hover\r\n    intelTitle.onmouseover = e => scrambleIntel(e.target);\r\n<\/script>\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-9d6c994 e-flex e-con-boxed e-con e-parent\" data-id=\"9d6c994\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-ee294ad e-con-full e-flex e-con e-child\" data-id=\"ee294ad\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6e3bf93 elementor-widget elementor-widget-html\" data-id=\"6e3bf93\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Black+Ops+One&family=Tektur:wght@400;600&display=swap\" rel=\"stylesheet\">\r\n\r\n<style>\r\n    :root {\r\n        --ballistic-orange: #FF6600;\r\n        --ballistic-white: #FFFFFF;\r\n        --ballistic-muted: rgba(255, 255, 255, 0.7);\r\n    }\r\n\r\n    \/* --- ABOUT SECTION --- *\/\r\n    .about-section {\r\n        padding: 80px 5%;\r\n        width: 100%;\r\n        display: flex;\r\n        justify-content: center;\r\n        background: transparent;\r\n        box-sizing: border-box;\r\n        overflow: hidden;\r\n    }\r\n\r\n    .about-container {\r\n        display: flex;\r\n        flex-direction: row;\r\n        align-items: center;\r\n        gap: clamp(30px, 5vw, 60px);\r\n        max-width: 1100px;\r\n        width: 100%;\r\n    }\r\n\r\n    \/* --- VISUAL SIDE WITH ANIMATED OUTLINE --- *\/\r\n    .about-visual {\r\n        flex: 1;\r\n        display: flex;\r\n        justify-content: center;\r\n        align-items: center;\r\n        position: relative;\r\n    }\r\n\r\n    .about-icon-wrapper {\r\n        width: clamp(180px, 25vw, 280px);\r\n        height: clamp(180px, 25vw, 280px);\r\n        display: flex;\r\n        justify-content: center;\r\n        align-items: center;\r\n        position: relative;\r\n    }\r\n\r\n    \/* Outer Rotating Glow *\/\r\n    .about-outline-outer {\r\n        position: absolute;\r\n        inset: 0;\r\n        border: 2px solid transparent;\r\n        border-left-color: var(--ballistic-orange);\r\n        border-right-color: var(--ballistic-orange);\r\n        border-radius: 50%;\r\n        animation: rotateAbout 8s linear infinite;\r\n    }\r\n\r\n    \/* Inner Dashed Radar *\/\r\n    .about-outline-inner {\r\n        position: absolute;\r\n        inset: 15px;\r\n        border: 1px dashed var(--ballistic-orange);\r\n        border-radius: 50%;\r\n        opacity: 0.4;\r\n        animation: rotateAbout 12s linear reverse infinite;\r\n    }\r\n\r\n    @keyframes rotateAbout {\r\n        from { transform: rotate(0deg); }\r\n        to { transform: rotate(360deg); }\r\n    }\r\n\r\n    \/* Custom Logo Styling *\/\r\n    .about-main-logo {\r\n        width: 60%; \/* Adjusted size within the radar rings [cite: 2026-03-11] *\/\r\n        height: auto;\r\n        max-height: 70%;\r\n        filter: drop-shadow(0 0 15px var(--ballistic-orange)); \/* Tactical glow [cite: 2026-03-11] *\/\r\n        z-index: 2;\r\n        object-fit: contain;\r\n    }\r\n\r\n    \/* --- CONTENT SIDE --- *\/\r\n    .about-content {\r\n        flex: 1.2;\r\n        text-align: left;\r\n    }\r\n\r\n    .about-tagline {\r\n        font-family: 'Tektur', sans-serif;\r\n        font-size: 0.75rem;\r\n        color: var(--ballistic-orange);\r\n        text-transform: uppercase;\r\n        letter-spacing: 4px;\r\n        margin-bottom: 15px;\r\n        display: block;\r\n    }\r\n\r\n    .about-content h2 {\r\n        font-family: 'Black Ops One', cursive;\r\n        font-size: clamp(2rem, 5vw, 3.2rem);\r\n        color: var(--ballistic-orange);\r\n        text-transform: uppercase;\r\n        margin-bottom: 25px;\r\n        line-height: 1.1;\r\n        cursor: pointer;\r\n    }\r\n\r\n    .about-content p {\r\n        font-family: 'Tektur', sans-serif;\r\n        font-size: 1.05rem;\r\n        color: var(--ballistic-white);\r\n        line-height: 1.8;\r\n        margin-bottom: 30px;\r\n        opacity: 0.9;\r\n    }\r\n\r\n    \/* Tactical Mission List *\/\r\n    .about-mission {\r\n        list-style: none;\r\n        padding: 0;\r\n        display: flex;\r\n        flex-direction: column;\r\n        gap: 15px;\r\n    }\r\n\r\n    .mission-row {\r\n        display: flex;\r\n        align-items: flex-start;\r\n        gap: 15px;\r\n        font-family: 'Tektur', sans-serif;\r\n        font-size: 0.95rem;\r\n        color: var(--ballistic-white);\r\n    }\r\n\r\n    .mission-row span {\r\n        color: var(--ballistic-orange);\r\n        font-weight: bold;\r\n    }\r\n\r\n    \/* --- RESPONSIVE MOBILE --- *\/\r\n    @media (max-width: 992px) {\r\n        .about-container {\r\n            flex-direction: column;\r\n            text-align: center;\r\n        }\r\n        .about-content {\r\n            text-align: center;\r\n        }\r\n        .about-visual {\r\n            order: -1; \/* Place visual above content on mobile [cite: 2026-03-11] *\/\r\n        }\r\n        .mission-row {\r\n            justify-content: center;\r\n            text-align: left;\r\n        }\r\n    }\r\n<\/style>\r\n\r\n<section class=\"about-section\" id=\"about\">\r\n    <div class=\"about-container\">\r\n        <div class=\"about-visual\">\r\n            <div class=\"about-icon-wrapper\">\r\n                <div class=\"about-outline-outer\"><\/div>\r\n                <div class=\"about-outline-inner\"><\/div>\r\n                <img decoding=\"async\" src=\"https:\/\/hyperballistic.online\/wp-content\/uploads\/2026\/03\/LOGO-1.png\" alt=\"Ballistic Logo\" class=\"about-main-logo\">\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"about-content\">\r\n            <span class=\"about-tagline\">Project Specification<\/span>\r\n            <h2 class=\"scramble-about\" data-value=\"ABOUT BALLISTIC\">ABOUT BALLISTIC<\/h2>\r\n            <p>\r\n                $BALLISTIC is a decentralized intelligence protocol designed to provide absolute transparency in global trajectory monitoring. We synthesize the high-speed capabilities of the Solana network with advanced tactical tracking algorithms to ensure public information security.\r\n            <\/p>\r\n            \r\n            <ul class=\"about-mission\">\r\n                <li class=\"mission-row\"><span>[01]<\/span> Ensuring unfiltered access to strategic intelligence for the global community.<\/li>\r\n                <li class=\"mission-row\"><span>[02]<\/span> Establishing a real-time monitoring infrastructure secured on-chain.<\/li>\r\n                <li class=\"mission-row\"><span>[03]<\/span> Utilizing AI-driven data analysis with military-grade precision.<\/li>\r\n            <\/ul>\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\r\n\r\n<script>\r\n    \/\/ SCRAMBLE ANIMATION LOGIC\r\n    const scrambleChars = \"ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789\";\r\n    \r\n    function startAboutScramble(el) {\r\n        let iteration = 0;\r\n        let interval = null;\r\n        const original = el.dataset.value;\r\n        \r\n        clearInterval(interval);\r\n        \r\n        interval = setInterval(() => {\r\n            el.innerText = el.innerText\r\n                .split(\"\")\r\n                .map((letter, index) => {\r\n                    if(index < iteration) return original[index];\r\n                    return scrambleChars[Math.floor(Math.random() * 36)];\r\n                })\r\n                .join(\"\");\r\n            \r\n            if(iteration >= original.length) clearInterval(interval);\r\n            iteration += 1 \/ 3;\r\n        }, 30);\r\n    }\r\n\r\n    \/\/ Trigger on Scroll\r\n    const aboutObserver = new IntersectionObserver((entries) => {\r\n        entries.forEach(entry => {\r\n            if(entry.isIntersecting) startAboutScramble(entry.target);\r\n        });\r\n    }, { threshold: 0.5 });\r\n\r\n    const aboutTitle = document.querySelector('.scramble-about');\r\n    if(aboutTitle) aboutObserver.observe(aboutTitle);\r\n    \r\n    \/\/ Trigger on Hover\r\n    if(aboutTitle) {\r\n        aboutTitle.onmouseover = e => startAboutScramble(e.target);\r\n    }\r\n<\/script>\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-f1ed097 e-flex e-con-boxed e-con e-parent\" data-id=\"f1ed097\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-e549f86 e-con-full e-flex e-con e-child\" data-id=\"e549f86\" data-element_type=\"container\" id=\"tokenomics\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a325795 elementor-widget elementor-widget-html\" data-id=\"a325795\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Black+Ops+One&family=Tektur:wght@400;600&display=swap\" rel=\"stylesheet\">\r\n\r\n<style>\r\n    :root {\r\n        --ballistic-orange: #FF6600;\r\n        --ballistic-white: #FFFFFF;\r\n    }\r\n\r\n    .tokenomics-section {\r\n        padding: 80px 5%;\r\n        width: 100%;\r\n        display: flex;\r\n        flex-direction: column;\r\n        align-items: center; \/* Centered secara vertikal\/horisontal *\/\r\n        text-align: center;\r\n        background: transparent;\r\n        box-sizing: border-box;\r\n        overflow: hidden;\r\n    }\r\n\r\n    .token-header {\r\n        display: flex;\r\n        flex-direction: column; \/* Judul di tengah *\/\r\n        align-items: center;\r\n        gap: 10px;\r\n        margin-bottom: 60px;\r\n        width: 100%;\r\n    }\r\n\r\n    .token-header h2 {\r\n        font-family: 'Black Ops One', cursive;\r\n        font-size: clamp(2.5rem, 6vw, 3.5rem);\r\n        color: var(--ballistic-orange);\r\n        text-transform: uppercase;\r\n        margin: 0;\r\n        cursor: pointer;\r\n    }\r\n\r\n    \/* Garis dekoratif di bawah judul agar seimbang di tengah *\/\r\n    .token-line-center {\r\n        width: 100px;\r\n        height: 3px;\r\n        background: var(--ballistic-orange);\r\n        box-shadow: 0 0 10px var(--ballistic-orange);\r\n    }\r\n\r\n    \/* --- TOKENOMICS HORIZONTAL GRID --- *\/\r\n    .token-main-container {\r\n        display: flex; \/* Horisontal Sejajar *\/\r\n        flex-direction: row;\r\n        justify-content: center;\r\n        flex-wrap: nowrap; \/* Memaksa sejajar di desktop *\/\r\n        gap: 20px;\r\n        width: 100%;\r\n        max-width: 1200px;\r\n    }\r\n\r\n    .token-data-card {\r\n        flex: 1; \/* Membagi ruang sama rata *\/\r\n        background: rgba(255, 255, 255, 0.02);\r\n        border: 1px solid rgba(255, 102, 0, 0.1);\r\n        padding: 35px 15px;\r\n        border-radius: 4px;\r\n        transition: all 0.3s ease;\r\n        position: relative;\r\n        min-width: 200px; \/* Ukuran minimal agar konten tidak terlalu sempit *\/\r\n    }\r\n\r\n    .token-data-card::before {\r\n        content: \"\";\r\n        position: absolute;\r\n        bottom: 0;\r\n        left: 0;\r\n        width: 100%;\r\n        height: 3px;\r\n        background: var(--ballistic-orange);\r\n        transform: scaleX(0);\r\n        transition: transform 0.3s ease;\r\n    }\r\n\r\n    .token-data-card:hover {\r\n        background: rgba(255, 102, 0, 0.05);\r\n        border-color: var(--ballistic-orange);\r\n        transform: translateY(-8px);\r\n    }\r\n\r\n    .token-data-card:hover::before {\r\n        transform: scaleX(1);\r\n    }\r\n\r\n    .token-data-card h4 {\r\n        font-family: 'Black Ops One', cursive;\r\n        color: var(--ballistic-orange);\r\n        font-size: 0.8rem;\r\n        margin-bottom: 15px;\r\n        letter-spacing: 2px;\r\n        text-transform: uppercase;\r\n    }\r\n\r\n    .token-data-card p {\r\n        font-family: 'Tektur', sans-serif;\r\n        color: var(--ballistic-white);\r\n        font-size: 1rem;\r\n        font-weight: 600;\r\n        letter-spacing: 1px;\r\n    }\r\n\r\n    \/* --- RESPONSIVE MOBILE: Menjadi Vertikal di layar kecil --- *\/\r\n    @media (max-width: 992px) {\r\n        .token-main-container {\r\n            flex-wrap: wrap; \/* Membolehkan baris baru di tablet *\/\r\n            justify-content: center;\r\n        }\r\n        .token-data-card {\r\n            flex: 0 1 calc(45% - 20px); \/* 2 kolom di tablet *\/\r\n        }\r\n    }\r\n\r\n    @media (max-width: 600px) {\r\n        .tokenomics-section { padding: 40px 15px; }\r\n        .token-data-card {\r\n            flex: 1 1 100%; \/* 1 kolom penuh di mobile *\/\r\n            min-width: unset;\r\n        }\r\n    }\r\n<\/style>\r\n\r\n<section class=\"tokenomics-section\" id=\"tokenomics\">\r\n    <div class=\"token-header\">\r\n        <h2 class=\"scramble-token\" data-value=\"TOKENOMICS\">TOKENOMICS<\/h2>\r\n        <div class=\"token-line-center\"><\/div>\r\n    <\/div>\r\n\r\n    <div class=\"token-main-container\">\r\n        <div class=\"token-data-card\">\r\n            <h4>TOTAL SUPPLY<\/h4>\r\n            <p>1,000,000,000<\/p>\r\n        <\/div>\r\n\r\n        <div class=\"token-data-card\">\r\n            <h4>BUY \/ SELL TAX<\/h4>\r\n            <p>ZERO TAX<\/p>\r\n        <\/div>\r\n\r\n        <div class=\"token-data-card\">\r\n            <h4>LIQUIDITY<\/h4>\r\n            <p>BURNED & SECURED<\/p>\r\n        <\/div>\r\n\r\n        <div class=\"token-data-card\">\r\n            <h4>NETWORK<\/h4>\r\n            <p>SOLANA MAINNET<\/p>\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\r\n\r\n<script>\r\n    const tokenChars = \"ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789\";\r\n    \r\n    function startTokenScramble(el) {\r\n        let iter = 0;\r\n        let intrval = null;\r\n        const targetText = el.dataset.value;\r\n        \r\n        clearInterval(intrval);\r\n        \r\n        intrval = setInterval(() => {\r\n            el.innerText = el.innerText.split(\"\")\r\n                .map((letter, index) => {\r\n                    if(index < iter) return targetText[index];\r\n                    return tokenChars[Math.floor(Math.random() * 36)];\r\n                }).join(\"\");\r\n            \r\n            if(iter >= targetText.length) clearInterval(intrval);\r\n            iter += 1 \/ 3;\r\n        }, 30);\r\n    }\r\n\r\n    const tokenObserver = new IntersectionObserver((entries) => {\r\n        entries.forEach(entry => {\r\n            if(entry.isIntersecting) {\r\n                if(entry.target.classList.contains('scramble-token')) {\r\n                    startTokenScramble(entry.target);\r\n                }\r\n            }\r\n        });\r\n    }, { threshold: 0.5 });\r\n\r\n    const tokenTitle = document.querySelector('.scramble-token');\r\n    if(tokenTitle) {\r\n        tokenObserver.observe(tokenTitle);\r\n        tokenTitle.onmouseover = e => startTokenScramble(e.target);\r\n    }\r\n<\/script>\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-31bbae0 e-flex e-con-boxed e-con e-parent\" data-id=\"31bbae0\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-4404943 e-con-full e-flex e-con e-child\" data-id=\"4404943\" data-element_type=\"container\" id=\"map\">\n\t\t\t\t<div class=\"elementor-element elementor-element-19efa5f elementor-widget elementor-widget-html\" data-id=\"19efa5f\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Black+Ops+One&family=Tektur:wght@400;600&display=swap\" rel=\"stylesheet\">\r\n\r\n<style>\r\n    :root {\r\n        --ballistic-orange: #FF6600;\r\n        --ballistic-white: #FFFFFF;\r\n        --map-bg: rgba(255, 102, 0, 0.03);\r\n    }\r\n\r\n    .tactical-map-section {\r\n        padding: 80px 5%;\r\n        width: 100%;\r\n        display: flex;\r\n        flex-direction: column;\r\n        align-items: center;\r\n        background: transparent;\r\n        box-sizing: border-box;\r\n        overflow: hidden;\r\n    }\r\n\r\n    .map-header {\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 20px;\r\n        margin-bottom: 50px;\r\n        width: 100%;\r\n        max-width: 1100px;\r\n    }\r\n\r\n    .map-header h2 {\r\n        font-family: 'Black Ops One', cursive;\r\n        font-size: clamp(2rem, 5vw, 3rem);\r\n        color: var(--ballistic-orange);\r\n        text-transform: uppercase;\r\n        margin: 0;\r\n        cursor: pointer;\r\n    }\r\n\r\n    .map-line {\r\n        flex: 1;\r\n        height: 2px;\r\n        background: linear-gradient(90deg, var(--ballistic-orange), transparent);\r\n    }\r\n\r\n    \/* --- CONTAINER: FEED KIRI, MAP KANAN --- *\/\r\n    .map-main-container {\r\n        display: grid;\r\n        grid-template-columns: 1fr 1.5fr; \/* Intel Feed (Kiri) & Map (Kanan) *\/\r\n        gap: 30px;\r\n        width: 100%;\r\n        max-width: 1100px;\r\n        align-items: start;\r\n    }\r\n\r\n    \/* --- LEFT SIDE: LIVE INTEL FEED (AUTO-SCROLL) --- *\/\r\n    .intel-feed-wrapper {\r\n        height: 400px;\r\n        overflow: hidden; \/* Sembunyikan scrollbar manual *\/\r\n        position: relative;\r\n        border-left: 2px solid var(--ballistic-orange);\r\n        background: rgba(255, 102, 0, 0.02);\r\n    }\r\n\r\n    .intel-feed-content {\r\n        display: flex;\r\n        flex-direction: column;\r\n        gap: 15px;\r\n        padding: 10px 15px;\r\n        animation: scrollFeed 20s linear infinite; \/* Animasi Jalan Terus *\/\r\n    }\r\n\r\n    .intel-feed-content:hover {\r\n        animation-play-state: paused; \/* Berhenti saat di-hover untuk dibaca *\/\r\n    }\r\n\r\n    @keyframes scrollFeed {\r\n        0% { transform: translateY(0); }\r\n        100% { transform: translateY(-50%); } \/* Scroll setengah tinggi (untuk loop smooth) *\/\r\n    }\r\n\r\n    .feed-card {\r\n        background: rgba(255, 255, 255, 0.03);\r\n        border: 1px solid rgba(255, 102, 0, 0.1);\r\n        padding: 15px;\r\n        font-family: 'Tektur', sans-serif;\r\n    }\r\n\r\n    .feed-card h4 {\r\n        color: var(--ballistic-orange);\r\n        font-size: 0.8rem;\r\n        margin-bottom: 5px;\r\n        text-transform: uppercase;\r\n        letter-spacing: 1px;\r\n    }\r\n\r\n    .feed-card p {\r\n        color: var(--ballistic-white);\r\n        font-size: 0.85rem;\r\n        line-height: 1.4;\r\n        opacity: 0.8;\r\n    }\r\n\r\n    .feed-time {\r\n        font-size: 0.7rem;\r\n        color: var(--ballistic-orange);\r\n        margin-top: 8px;\r\n        display: block;\r\n        font-weight: bold;\r\n    }\r\n\r\n    \/* --- RIGHT SIDE: TACTICAL MAP --- *\/\r\n    .map-viewport {\r\n        background: var(--map-bg);\r\n        border: 1px solid rgba(255, 102, 0, 0.3);\r\n        height: 400px;\r\n        position: relative;\r\n        border-radius: 4px;\r\n        overflow: hidden;\r\n        display: flex;\r\n        justify-content: center;\r\n        align-items: center;\r\n    }\r\n\r\n    .radar-sweep {\r\n        position: absolute;\r\n        width: 200%;\r\n        height: 200%;\r\n        background: conic-gradient(from 0deg, transparent 0%, rgba(255, 102, 0, 0.2) 25%, transparent 30%);\r\n        animation: sweep 4s linear infinite;\r\n        pointer-events: none;\r\n    }\r\n\r\n    @keyframes sweep {\r\n        from { transform: rotate(0deg); }\r\n        to { transform: rotate(360deg); }\r\n    }\r\n\r\n    .map-grid-overlay {\r\n        position: absolute;\r\n        inset: 0;\r\n        background-image: \r\n            linear-gradient(rgba(255, 102, 0, 0.1) 1px, transparent 1px),\r\n            linear-gradient(90deg, rgba(255, 102, 0, 0.1) 1px, transparent 1px);\r\n        background-size: 40px 40px;\r\n    }\r\n\r\n    .target-dot {\r\n        width: 8px;\r\n        height: 8px;\r\n        background: var(--ballistic-orange);\r\n        border-radius: 50%;\r\n        position: absolute;\r\n        box-shadow: 0 0 15px var(--ballistic-orange);\r\n        animation: target-pulse 1.5s infinite;\r\n    }\r\n\r\n    @keyframes target-pulse {\r\n        0% { transform: scale(1); opacity: 1; }\r\n        100% { transform: scale(3); opacity: 0; }\r\n    }\r\n\r\n    \/* --- MOBILE RESPONSIVE --- *\/\r\n    @media (max-width: 850px) {\r\n        .map-main-container {\r\n            grid-template-columns: 1fr;\r\n        }\r\n        .intel-feed-wrapper {\r\n            order: 2;\r\n            height: 300px;\r\n        }\r\n        .map-viewport {\r\n            order: 1;\r\n            height: 300px;\r\n        }\r\n    }\r\n<\/style>\r\n\r\n<section class=\"tactical-map-section\" id=\"map\">\r\n    <div class=\"map-header\">\r\n        <h2 class=\"scramble-map\" data-value=\"TACTICAL MAP\">TACTICAL MAP<\/h2>\r\n        <div class=\"map-line\"><\/div>\r\n    <\/div>\r\n\r\n    <div class=\"map-main-container\">\r\n        <div class=\"intel-feed-wrapper\">\r\n            <div class=\"intel-feed-content\">\r\n                <div class=\"feed-card\">\r\n                    <h4>Trajectory Detected<\/h4>\r\n                    <p>Sub-orbital ballistic signature identified. Sector Alpha-7. Tracking engaged.<\/p>\r\n                    <span class=\"feed-time\">SIGNAL: STRONG<\/span>\r\n                <\/div>\r\n                <div class=\"feed-card\">\r\n                    <h4>Chain Sync Complete<\/h4>\r\n                    <p>Tactical data block validated on Solana. 0x82...pump verified.<\/p>\r\n                    <span class=\"feed-time\">LIVE RELAY<\/span>\r\n                <\/div>\r\n                <div class=\"feed-card\">\r\n                    <h4>Orbital Alert<\/h4>\r\n                    <p>Atmospheric reentry prediction confirmed in Sector 4. Encryption active.<\/p>\r\n                    <span class=\"feed-time\">STATUS: HIGH ALERT<\/span>\r\n                <\/div>\r\n                <div class=\"feed-card\">\r\n                    <h4>Trajectory Detected<\/h4>\r\n                    <p>Sub-orbital ballistic signature identified. Sector Alpha-7. Tracking engaged.<\/p>\r\n                    <span class=\"feed-time\">SIGNAL: STRONG<\/span>\r\n                <\/div>\r\n                <div class=\"feed-card\">\r\n                    <h4>Chain Sync Complete<\/h4>\r\n                    <p>Tactical data block validated on Solana. 0x82...pump verified.<\/p>\r\n                    <span class=\"feed-time\">LIVE RELAY<\/span>\r\n                <\/div>\r\n                <div class=\"feed-card\">\r\n                    <h4>Orbital Alert<\/h4>\r\n                    <p>Atmospheric reentry prediction confirmed in Sector 4. Encryption active.<\/p>\r\n                    <span class=\"feed-time\">STATUS: HIGH ALERT<\/span>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"map-viewport\">\r\n            <div class=\"map-grid-overlay\"><\/div>\r\n            <div class=\"radar-sweep\"><\/div>\r\n            \r\n            <div class=\"target-dot\" style=\"top: 25%; left: 35%;\"><\/div>\r\n            <div class=\"target-dot\" style=\"top: 55%; left: 65%;\"><\/div>\r\n            <div class=\"target-dot\" style=\"top: 15%; left: 75%;\"><\/div>\r\n            \r\n            <div style=\"font-family: 'Tektur'; color: var(--ballistic-orange); z-index: 5; font-size: 0.65rem; position: absolute; bottom: 15px; left: 15px; letter-spacing: 1px;\">\r\n                COMMAND: SECTOR_SCAN \/\/ ZONE_A1\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\r\n\r\n<script>\r\n    const mapChars = \"ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789\";\r\n    \r\n    function startMapScramble(el) {\r\n        let iter = 0;\r\n        let intrval = null;\r\n        const targetText = el.dataset.value;\r\n        \r\n        clearInterval(intrval);\r\n        \r\n        intrval = setInterval(() => {\r\n            el.innerText = el.innerText.split(\"\")\r\n                .map((letter, index) => {\r\n                    if(index < iter) return targetText[index];\r\n                    return mapChars[Math.floor(Math.random() * 36)];\r\n                }).join(\"\");\r\n            \r\n            if(iter >= targetText.length) clearInterval(intrval);\r\n            iter += 1 \/ 3;\r\n        }, 30);\r\n    }\r\n\r\n    const mapObserver = new IntersectionObserver((entries) => {\r\n        entries.forEach(entry => {\r\n            if(entry.isIntersecting) startMapScramble(entry.target);\r\n        });\r\n    }, { threshold: 0.5 });\r\n\r\n    const mapTitle = document.querySelector('.scramble-map');\r\n    if(mapTitle) {\r\n        mapObserver.observe(mapTitle);\r\n        mapTitle.onmouseover = e => startMapScramble(e.target);\r\n    }\r\n<\/script>\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-62bc17b e-flex e-con-boxed e-con e-parent\" data-id=\"62bc17b\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4822cc7 elementor-widget elementor-widget-html\" data-id=\"4822cc7\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Black+Ops+One&family=Tektur:wght@400;700&display=swap\" rel=\"stylesheet\">\r\n\r\n<style>\r\n    \/* --- RUNNING TEXT STYLE --- *\/\r\n    .ballistic-marquee {\r\n        background-color: #FF6600; \/* Latar Belakang Oranye *\/\r\n        padding: 15px 0;\r\n        width: 100%;\r\n        overflow: hidden;\r\n        display: flex;\r\n        border-top: 3px solid #000;\r\n        border-bottom: 3px solid #000;\r\n        position: relative;\r\n    }\r\n\r\n    .marquee-content {\r\n        display: flex;\r\n        white-space: nowrap;\r\n        animation: marqueeScroll 25s linear infinite;\r\n    }\r\n\r\n    .marquee-content:hover {\r\n        animation-play-state: paused;\r\n    }\r\n\r\n    .marquee-item {\r\n        font-family: 'Black Ops One', cursive; \/* Font Judul Gahar *\/\r\n        font-size: 1.3rem;\r\n        color: #000000; \/* Tulisan Hitam *\/\r\n        text-transform: uppercase;\r\n        padding: 0 50px;\r\n        letter-spacing: 2px;\r\n        display: flex;\r\n        align-items: center;\r\n    }\r\n\r\n    \/* Pemisah Status dengan Font Tektur *\/\r\n    .marquee-item::after {\r\n        content: \"[ STATUS: ACTIVE ]\";\r\n        margin-left: 50px;\r\n        font-family: 'Tektur', sans-serif; \/* Font Teknis *\/\r\n        font-size: 0.8rem;\r\n        font-weight: 700;\r\n        background: rgba(0,0,0,0.1);\r\n        padding: 2px 8px;\r\n        border-radius: 2px;\r\n    }\r\n\r\n    @keyframes marqueeScroll {\r\n        0% { transform: translateX(0); }\r\n        100% { transform: translateX(-50%); }\r\n    }\r\n\r\n    @media (max-width: 600px) {\r\n        .marquee-item { font-size: 1rem; padding: 0 25px; }\r\n    }\r\n<\/style>\r\n\r\n<div class=\"ballistic-marquee\">\r\n    <div class=\"marquee-content\">\r\n        <div class=\"marquee-item\">$BALLISTIC DECENTRALIZED INTELLIGENCE<\/div>\r\n        <div class=\"marquee-item\">REAL-TIME TRAJECTORY MONITORING<\/div>\r\n        <div class=\"marquee-item\">SOLANA MAINNET OPERATIONAL<\/div>\r\n        <div class=\"marquee-item\">SECURE UPLINK ESTABLISHED<\/div>\r\n        <div class=\"marquee-item\">NO TAX PROTOCOL ACTIVE<\/div>\r\n        \r\n        <div class=\"marquee-item\">$BALLISTIC DECENTRALIZED INTELLIGENCE<\/div>\r\n        <div class=\"marquee-item\">REAL-TIME TRAJECTORY MONITORING<\/div>\r\n        <div class=\"marquee-item\">SOLANA MAINNET OPERATIONAL<\/div>\r\n        <div class=\"marquee-item\">SECURE UPLINK ESTABLISHED<\/div>\r\n        <div class=\"marquee-item\">NO TAX PROTOCOL ACTIVE<\/div>\r\n    <\/div>\r\n<\/div>\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-b271a01 e-flex e-con-boxed e-con e-parent\" data-id=\"b271a01\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-5ac3840 e-con-full e-flex e-con e-child\" data-id=\"5ac3840\" data-element_type=\"container\" id=\"stats\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3ac90d4 elementor-widget elementor-widget-html\" data-id=\"3ac90d4\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Black+Ops+One&family=Tektur:wght@400;600&display=swap\" rel=\"stylesheet\">\r\n\r\n<style>\r\n    :root {\r\n        --ballistic-orange: #FF6600;\r\n        --ballistic-white: #FFFFFF;\r\n    }\r\n\r\n    .stats-container-alt {\r\n        padding: 100px 5%;\r\n        width: 100%;\r\n        display: flex;\r\n        flex-direction: column;\r\n        align-items: center;\r\n        background: transparent;\r\n        box-sizing: border-box;\r\n        overflow: hidden;\r\n    }\r\n\r\n    \/* Judul Centered dengan Scramble *\/\r\n    .stats-alt-header {\r\n        margin-bottom: 70px;\r\n        text-align: center;\r\n    }\r\n\r\n    .stats-alt-header h2 {\r\n        font-family: 'Black Ops One', cursive;\r\n        font-size: clamp(2.5rem, 6vw, 3.5rem);\r\n        color: var(--ballistic-orange);\r\n        text-transform: uppercase;\r\n        margin: 0;\r\n    }\r\n\r\n    \/* --- LAYOUT HORISONTAL SEJAJAR --- *\/\r\n    .stats-radar-grid {\r\n        display: flex;\r\n        flex-direction: row;\r\n        justify-content: center;\r\n        gap: clamp(20px, 4vw, 50px);\r\n        width: 100%;\r\n        max-width: 1200px;\r\n        position: relative;\r\n    }\r\n\r\n    .stat-radar-item {\r\n        flex: 1;\r\n        position: relative;\r\n        padding: 20px;\r\n        display: flex;\r\n        flex-direction: column;\r\n        align-items: center;\r\n    }\r\n\r\n    \/* Efek Siku-siku (Tactical Brackets) *\/\r\n    .stat-radar-item::before, .stat-radar-item::after {\r\n        content: \"\";\r\n        position: absolute;\r\n        width: 20px;\r\n        height: 20px;\r\n        border-color: var(--ballistic-orange);\r\n        border-style: solid;\r\n        opacity: 0.5;\r\n    }\r\n\r\n    \/* Pojok Kiri Atas *\/\r\n    .stat-radar-item::before {\r\n        top: 0;\r\n        left: 0;\r\n        border-width: 2px 0 0 2px;\r\n    }\r\n\r\n    \/* Pojok Kanan Bawah *\/\r\n    .stat-radar-item::after {\r\n        bottom: 0;\r\n        right: 0;\r\n        border-width: 0 2px 2px 0;\r\n    }\r\n\r\n    .stat-radar-label {\r\n        font-family: 'Tektur', sans-serif;\r\n        color: var(--ballistic-white);\r\n        font-size: 0.8rem;\r\n        text-transform: uppercase;\r\n        letter-spacing: 3px;\r\n        margin-bottom: 15px;\r\n        opacity: 0.7;\r\n    }\r\n\r\n    .stat-radar-value {\r\n        font-family: 'Black Ops One', cursive;\r\n        color: var(--ballistic-orange);\r\n        font-size: clamp(2rem, 4vw, 3.5rem);\r\n        line-height: 1;\r\n        text-shadow: 0 0 15px rgba(255, 102, 0, 0.4);\r\n    }\r\n\r\n    \/* Animasi Garis Pemindai (Scanning Line) *\/\r\n    .scanning-bar {\r\n        position: absolute;\r\n        width: 100%;\r\n        height: 2px;\r\n        background: linear-gradient(90deg, transparent, var(--ballistic-orange), transparent);\r\n        top: 0;\r\n        left: 0;\r\n        animation: scanMove 4s ease-in-out infinite;\r\n        opacity: 0.6;\r\n    }\r\n\r\n    @keyframes scanMove {\r\n        0%, 100% { top: 0%; }\r\n        50% { top: 100%; }\r\n    }\r\n\r\n    \/* --- RESPONSIVE MOBILE --- *\/\r\n    @media (max-width: 900px) {\r\n        .stats-radar-grid {\r\n            flex-wrap: wrap;\r\n            gap: 40px;\r\n        }\r\n        .stat-radar-item {\r\n            flex: 0 1 calc(45% - 20px);\r\n            min-width: 180px;\r\n        }\r\n    }\r\n\r\n    @media (max-width: 500px) {\r\n        .stat-radar-item {\r\n            flex: 1 1 100%;\r\n        }\r\n    }\r\n<\/style>\r\n\r\n<section class=\"stats-container-alt\" id=\"stats-section\">\r\n    <div class=\"stats-alt-header\">\r\n        <h2 class=\"scramble-stats-alt\" data-value=\"LIVE STATISTICS\">LIVE STATISTICS<\/h2>\r\n    <\/div>\r\n\r\n    <div class=\"stats-radar-grid\">\r\n        <div class=\"stat-radar-item\">\r\n            <div class=\"scanning-bar\"><\/div>\r\n            <span class=\"stat-radar-label\">Nodes<\/span>\r\n            <div class=\"stat-radar-value counter-alt\" data-target=\"1420\">0<\/div>\r\n        <\/div>\r\n\r\n        <div class=\"stat-radar-item\">\r\n            <div class=\"scanning-bar\" style=\"animation-delay: 1s;\"><\/div>\r\n            <span class=\"stat-radar-label\">Relays<\/span>\r\n            <div class=\"stat-radar-value counter-alt\" data-target=\"850\">0<\/div>\r\n        <\/div>\r\n\r\n        <div class=\"stat-radar-item\">\r\n            <div class=\"scanning-bar\" style=\"animation-delay: 2s;\"><\/div>\r\n            <span class=\"stat-radar-label\">Sectors<\/span>\r\n            <div class=\"stat-radar-value counter-alt\" data-target=\"100\">0<\/div>\r\n        <\/div>\r\n\r\n        <div class=\"stat-radar-item\">\r\n            <div class=\"scanning-bar\" style=\"animation-delay: 1.5s;\"><\/div>\r\n            <span class=\"stat-radar-label\">Uptime<\/span>\r\n            <div class=\"stat-radar-value\">99.9<\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\r\n\r\n<script>\r\n    const charsAlt = \"ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789\";\r\n    \r\n    \/\/ SCRAMBLE ANIMATION\r\n    function runScrambleStats(el) {\r\n        let it = 0;\r\n        let intr = null;\r\n        const txt = el.dataset.value;\r\n        clearInterval(intr);\r\n        intr = setInterval(() => {\r\n            el.innerText = el.innerText.split(\"\")\r\n                .map((l, i) => i < it ? txt[i] : charsAlt[Math.floor(Math.random() * 36)])\r\n                .join(\"\");\r\n            if(it >= txt.length) clearInterval(intr);\r\n            it += 1 \/ 3;\r\n        }, 30);\r\n    }\r\n\r\n    \/\/ COUNTING ANIMATION\r\n    function runCounterAlt() {\r\n        const counters = document.querySelectorAll('.counter-alt');\r\n        counters.forEach(counter => {\r\n            const target = +counter.getAttribute('data-target');\r\n            const speed = 150; \r\n            const updateCount = () => {\r\n                const count = +counter.innerText;\r\n                const inc = target \/ speed;\r\n                if (count < target) {\r\n                    counter.innerText = Math.ceil(count + inc);\r\n                    setTimeout(updateCount, 15);\r\n                } else {\r\n                    counter.innerText = target;\r\n                }\r\n            };\r\n            updateCount();\r\n        });\r\n    }\r\n\r\n    \/\/ INTERSECTION OBSERVER\r\n    const obsStats = new IntersectionObserver((entries) => {\r\n        entries.forEach(entry => {\r\n            if(entry.isIntersecting) {\r\n                if(entry.target.classList.contains('scramble-stats-alt')) {\r\n                    runScrambleStats(entry.target);\r\n                }\r\n                if(entry.target.id === 'stats-section') {\r\n                    runCounterAlt();\r\n                    obsStats.unobserve(entry.target); \/\/ Hanya jalan sekali\r\n                }\r\n            }\r\n        });\r\n    }, { threshold: 0.4 });\r\n\r\n    const sTitleAlt = document.querySelector('.scramble-stats-alt');\r\n    const sSectionAlt = document.querySelector('#stats-section');\r\n    \r\n    if(sTitleAlt) obsStats.observe(sTitleAlt);\r\n    if(sSectionAlt) obsStats.observe(sSectionAlt);\r\n<\/script>\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-a5c1cda e-flex e-con-boxed e-con e-parent\" data-id=\"a5c1cda\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-2a24aaa e-con-full e-flex e-con e-child\" data-id=\"2a24aaa\" data-element_type=\"container\" id=\"deploy\">\n\t\t\t\t<div class=\"elementor-element elementor-element-88f469e elementor-widget elementor-widget-html\" data-id=\"88f469e\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Black+Ops+One&family=Tektur:wght@400;600&display=swap\" rel=\"stylesheet\">\r\n\r\n<style>\r\n    :root {\r\n        --ballistic-orange: #FF6600;\r\n        --ballistic-white: #FFFFFF;\r\n    }\r\n\r\n    .deploy-section {\r\n        padding: 100px 5%;\r\n        width: 100%;\r\n        display: flex;\r\n        flex-direction: column;\r\n        align-items: center;\r\n        text-align: center;\r\n        background: transparent;\r\n        box-sizing: border-box;\r\n        overflow: hidden;\r\n    }\r\n\r\n    .deploy-container {\r\n        max-width: 900px;\r\n        width: 100%;\r\n        padding: 60px 30px;\r\n        border: 1px solid rgba(255, 102, 0, 0.2);\r\n        background: rgba(255, 102, 0, 0.02);\r\n        position: relative;\r\n        border-radius: 4px;\r\n    }\r\n\r\n    \/* Tactical HUD Brackets *\/\r\n    .deploy-container::before {\r\n        content: \"\";\r\n        position: absolute;\r\n        top: -2px;\r\n        left: -2px;\r\n        width: 30px;\r\n        height: 30px;\r\n        border-top: 3px solid var(--ballistic-orange);\r\n        border-left: 3px solid var(--ballistic-orange);\r\n    }\r\n\r\n    .deploy-container::after {\r\n        content: \"\";\r\n        position: absolute;\r\n        bottom: -2px;\r\n        right: -2px;\r\n        width: 30px;\r\n        height: 30px;\r\n        border-bottom: 3px solid var(--ballistic-orange);\r\n        border-right: 3px solid var(--ballistic-orange);\r\n    }\r\n\r\n    .deploy-header h2 {\r\n        font-family: 'Black Ops One', cursive;\r\n        font-size: clamp(2.5rem, 7vw, 4rem);\r\n        color: var(--ballistic-orange);\r\n        text-transform: uppercase;\r\n        margin: 0 0 20px 0;\r\n        letter-spacing: 2px;\r\n    }\r\n\r\n    .deploy-subtitle {\r\n        font-family: 'Tektur', sans-serif;\r\n        color: var(--ballistic-white);\r\n        font-size: clamp(0.95rem, 2vw, 1.1rem);\r\n        max-width: 600px;\r\n        margin: 0 auto 45px auto;\r\n        opacity: 0.8;\r\n        line-height: 1.6;\r\n    }\r\n\r\n    \/* MAIN BUTTON *\/\r\n    .btn-deploy-main {\r\n        display: inline-block;\r\n        background: var(--ballistic-orange);\r\n        color: #000;\r\n        font-family: 'Black Ops One', cursive;\r\n        font-size: 1.3rem;\r\n        padding: 18px 50px;\r\n        text-decoration: none;\r\n        text-transform: uppercase;\r\n        border-radius: 2px;\r\n        letter-spacing: 3px;\r\n        transition: all 0.3s ease;\r\n        box-shadow: 0 0 20px rgba(255, 102, 0, 0.4);\r\n        margin-bottom: 50px;\r\n    }\r\n\r\n    .btn-deploy-main:hover {\r\n        background: var(--ballistic-white);\r\n        color: var(--ballistic-orange);\r\n        box-shadow: 0 0 30px rgba(255, 255, 255, 0.4);\r\n        transform: translateY(-3px);\r\n    }\r\n\r\n    \/* SOCIAL TEXT BUTTONS GRID *\/\r\n    .social-text-grid {\r\n        display: flex;\r\n        justify-content: center;\r\n        flex-wrap: wrap;\r\n        gap: 30px;\r\n        width: 100%;\r\n    }\r\n\r\n    .social-text-wrapper {\r\n        display: flex;\r\n        flex-direction: column;\r\n        align-items: center;\r\n        min-width: 120px;\r\n    }\r\n\r\n    .btn-text-link {\r\n        font-family: 'Black Ops One', cursive;\r\n        color: var(--ballistic-orange);\r\n        text-decoration: none;\r\n        font-size: 1.1rem;\r\n        letter-spacing: 2px;\r\n        text-transform: uppercase;\r\n        padding: 8px 15px;\r\n        border: 1px solid rgba(255, 102, 0, 0.3);\r\n        transition: all 0.3s ease;\r\n        margin-bottom: 10px;\r\n        width: 100%;\r\n    }\r\n\r\n    .btn-text-link:hover {\r\n        background: var(--ballistic-orange);\r\n        color: #000;\r\n        box-shadow: 0 0 15px var(--ballistic-orange);\r\n    }\r\n\r\n    .social-desc {\r\n        font-family: 'Tektur', sans-serif;\r\n        font-size: 0.65rem;\r\n        color: var(--ballistic-white);\r\n        text-transform: uppercase;\r\n        letter-spacing: 1px;\r\n        opacity: 0.6;\r\n    }\r\n\r\n    @media (max-width: 768px) {\r\n        .social-text-grid { gap: 20px; }\r\n        .social-text-wrapper { min-width: 45%; }\r\n        .btn-deploy-main { width: 100%; padding: 15px 0; }\r\n    }\r\n<\/style>\r\n\r\n<section class=\"deploy-section\" id=\"deploy\">\r\n    <div class=\"deploy-container\">\r\n        <div class=\"deploy-header\">\r\n            <h2 class=\"scramble-deploy\" data-value=\"DEPLOY NOW\">DEPLOY NOW<\/h2>\r\n        <\/div>\r\n        \r\n        <p class=\"deploy-subtitle\">\r\n            Establishing secure uplink to the Solana mainnet. Initiate the protocol to join the decentralized intelligence network.\r\n        <\/p>\r\n\r\n        <a href=\"https:\/\/raydium.io\" target=\"_blank\" class=\"btn-deploy-main\">Execute Launch<\/a>\r\n\r\n        <div class=\"social-text-grid\">\r\n            \r\n            <div class=\"social-text-wrapper\">\r\n                <a href=\"#\" class=\"btn-text-link\">X<\/a>\r\n                <span class=\"social-desc\">Tactical Feed<\/span>\r\n            <\/div>\r\n\r\n            <div class=\"social-text-wrapper\">\r\n                <a href=\"#\" class=\"btn-text-link\">TELEGRAM<\/a>\r\n                <span class=\"social-desc\">Comms Channel<\/span>\r\n            <\/div>\r\n\r\n            <div class=\"social-text-wrapper\">\r\n                <a href=\"#\" class=\"btn-text-link\">X - COMMUNITY<\/a>\r\n                <span class=\"social-desc\">X-Squadron<\/span>\r\n            <\/div>\r\n\r\n            <div class=\"social-text-wrapper\">\r\n                <a href=\"#\" class=\"btn-text-link\">CHART<\/a>\r\n                <span class=\"social-desc\">Live Analytics<\/span>\r\n            <\/div>\r\n\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\r\n\r\n<script>\r\n    const dChars = \"ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789\";\r\n    \r\n    function scrambleDeploy(el) {\r\n        let it = 0;\r\n        let intr = null;\r\n        const txt = el.dataset.value;\r\n        clearInterval(intr);\r\n        intr = setInterval(() => {\r\n            el.innerText = el.innerText.split(\"\")\r\n                .map((l, i) => i < it ? txt[i] : dChars[Math.floor(Math.random() * 36)])\r\n                .join(\"\");\r\n            if(it >= txt.length) clearInterval(intr);\r\n            it += 1 \/ 3;\r\n        }, 30);\r\n    }\r\n\r\n    const dObs = new IntersectionObserver((entries) => {\r\n        entries.forEach(entry => {\r\n            if(entry.isIntersecting) scrambleDeploy(entry.target);\r\n        });\r\n    }, { threshold: 0.5 });\r\n\r\n    const dTtl = document.querySelector('.scramble-deploy');\r\n    if(dTtl) {\r\n        dObs.observe(dTtl);\r\n        dTtl.onmouseover = e => scrambleDeploy(e.target);\r\n    }\r\n<\/script>\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-9f1a8db e-flex e-con-boxed e-con e-parent\" data-id=\"9f1a8db\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-de25f1d elementor-widget elementor-widget-html\" data-id=\"de25f1d\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Black+Ops+One&family=Tektur:wght@400;700&display=swap\" rel=\"stylesheet\">\r\n\r\n<style>\r\n    \/* --- RUNNING TEXT STYLE --- *\/\r\n    .ballistic-marquee {\r\n        background-color: #FF6600; \/* Latar Belakang Oranye *\/\r\n        padding: 15px 0;\r\n        width: 100%;\r\n        overflow: hidden;\r\n        display: flex;\r\n        border-top: 3px solid #000;\r\n        border-bottom: 3px solid #000;\r\n        position: relative;\r\n    }\r\n\r\n    .marquee-content {\r\n        display: flex;\r\n        white-space: nowrap;\r\n        animation: marqueeScroll 25s linear infinite;\r\n    }\r\n\r\n    .marquee-content:hover {\r\n        animation-play-state: paused;\r\n    }\r\n\r\n    .marquee-item {\r\n        font-family: 'Black Ops One', cursive; \/* Font Judul Gahar *\/\r\n        font-size: 1.3rem;\r\n        color: #000000; \/* Tulisan Hitam *\/\r\n        text-transform: uppercase;\r\n        padding: 0 50px;\r\n        letter-spacing: 2px;\r\n        display: flex;\r\n        align-items: center;\r\n    }\r\n\r\n    \/* Pemisah Status dengan Font Tektur *\/\r\n    .marquee-item::after {\r\n        content: \"[ STATUS: ACTIVE ]\";\r\n        margin-left: 50px;\r\n        font-family: 'Tektur', sans-serif; \/* Font Teknis *\/\r\n        font-size: 0.8rem;\r\n        font-weight: 700;\r\n        background: rgba(0,0,0,0.1);\r\n        padding: 2px 8px;\r\n        border-radius: 2px;\r\n    }\r\n\r\n    @keyframes marqueeScroll {\r\n        0% { transform: translateX(0); }\r\n        100% { transform: translateX(-50%); }\r\n    }\r\n\r\n    @media (max-width: 600px) {\r\n        .marquee-item { font-size: 1rem; padding: 0 25px; }\r\n    }\r\n<\/style>\r\n\r\n<div class=\"ballistic-marquee\">\r\n    <div class=\"marquee-content\">\r\n        <div class=\"marquee-item\">$BALLISTIC DECENTRALIZED INTELLIGENCE<\/div>\r\n        <div class=\"marquee-item\">REAL-TIME TRAJECTORY MONITORING<\/div>\r\n        <div class=\"marquee-item\">SOLANA MAINNET OPERATIONAL<\/div>\r\n        <div class=\"marquee-item\">SECURE UPLINK ESTABLISHED<\/div>\r\n        <div class=\"marquee-item\">NO TAX PROTOCOL ACTIVE<\/div>\r\n        \r\n        <div class=\"marquee-item\">$BALLISTIC DECENTRALIZED INTELLIGENCE<\/div>\r\n        <div class=\"marquee-item\">REAL-TIME TRAJECTORY MONITORING<\/div>\r\n        <div class=\"marquee-item\">SOLANA MAINNET OPERATIONAL<\/div>\r\n        <div class=\"marquee-item\">SECURE UPLINK ESTABLISHED<\/div>\r\n        <div class=\"marquee-item\">NO TAX PROTOCOL ACTIVE<\/div>\r\n    <\/div>\r\n<\/div>\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>BALLISTIC Intel Tactical Map Tokenomics Stats Deploy Now Operational Status: Active BALLISTIC Real-time tactical monitoring and decentralized strategic intelligence network. High-precision ballistic trajectory tracking powered by Solana. OFFICIAL CONTRACT ADDRESS NULL Copy CA STRATEGIC INTEL \ud83d\udce1 Tactical Tracking Global trajectory monitoring with sub-second latency and high-precision tactical data relay for decentralized defense networks. \ud83d\udee1\ufe0f Chain [&hellip;]<\/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:\/\/hyperballistic.online\/index.php\/wp-json\/wp\/v2\/pages\/8","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/hyperballistic.online\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/hyperballistic.online\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/hyperballistic.online\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/hyperballistic.online\/index.php\/wp-json\/wp\/v2\/comments?post=8"}],"version-history":[{"count":34,"href":"https:\/\/hyperballistic.online\/index.php\/wp-json\/wp\/v2\/pages\/8\/revisions"}],"predecessor-version":[{"id":56,"href":"https:\/\/hyperballistic.online\/index.php\/wp-json\/wp\/v2\/pages\/8\/revisions\/56"}],"wp:attachment":[{"href":"https:\/\/hyperballistic.online\/index.php\/wp-json\/wp\/v2\/media?parent=8"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}