{"id":8,"date":"2026-03-30T14:39:40","date_gmt":"2026-03-30T14:39:40","guid":{"rendered":"https:\/\/queenshiva.fun\/?page_id=8"},"modified":"2026-04-02T04:21:04","modified_gmt":"2026-04-02T04:21:04","slug":"elementor-8","status":"publish","type":"page","link":"https:\/\/queenshiva.fun\/","title":{"rendered":"Elementor #8"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"8\" class=\"elementor elementor-8\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-20a7c93 e-flex e-con-boxed e-con e-parent\" data-id=\"20a7c93\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;video&quot;,&quot;background_video_link&quot;:&quot;http:\\\/\\\/queenshiva.fun\\\/wp-content\\\/uploads\\\/2026\\\/03\\\/QUEEN-SHIVA1.mp4&quot;,&quot;background_play_on_mobile&quot;:&quot;yes&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-background-video-container\">\n\t\t\t\t\t\t\t<video class=\"elementor-background-video-hosted elementor-html5-video\" autoplay muted playsinline loop><\/video>\n\t\t\t\t\t<\/div><div class=\"elementor-element elementor-element-5144c2f e-con-full e-flex e-con e-child\" data-id=\"5144c2f\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8e0644d elementor-widget elementor-widget-html\" data-id=\"8e0644d\" 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=Cinzel+Decorative:wght@700&family=Inter:wght@400;600&display=swap\" rel=\"stylesheet\">\r\n<script src=\"https:\/\/unpkg.com\/lucide@latest\"><\/script>\r\n\r\n<style>\r\n    :root {\r\n        --primary-ice: #A5F2F3;\r\n        --deep-cosmos: rgba(11, 16, 38, 0.85);\r\n        --glass-border: rgba(165, 242, 243, 0.3);\r\n    }\r\n\r\n    \/* Navbar Container *\/\r\n    .shiva-nav {\r\n        position: fixed;\r\n        top: 20px;\r\n        left: 50%;\r\n        transform: translateX(-50%);\r\n        width: 90%;\r\n        max-width: 1200px;\r\n        background: var(--deep-cosmos);\r\n        backdrop-filter: blur(15px);\r\n        -webkit-backdrop-filter: blur(15px);\r\n        border: 1px solid var(--glass-border);\r\n        border-radius: 50px;\r\n        display: flex;\r\n        justify-content: space-between;\r\n        align-items: center;\r\n        padding: 10px 25px;\r\n        z-index: 9999;\r\n        transition: all 0.4s ease;\r\n    }\r\n\r\n    \/* Logo - Cinzel Decorative *\/\r\n    .shiva-logo {\r\n        font-family: 'Cinzel Decorative', cursive;\r\n        font-size: 1.4rem;\r\n        font-weight: 700;\r\n        text-decoration: none;\r\n        background: linear-gradient(90deg, #A5F2F3, #FFFFFF);\r\n        -webkit-background-clip: text;\r\n        -webkit-text-fill-color: transparent;\r\n        letter-spacing: 1px;\r\n    }\r\n\r\n    \/* Menu Links - Inter *\/\r\n    .shiva-menu {\r\n        display: flex;\r\n        gap: 25px;\r\n        list-style: none;\r\n        margin: 0;\r\n        padding: 0;\r\n    }\r\n\r\n    .shiva-menu li a {\r\n        font-family: 'Inter', sans-serif;\r\n        text-decoration: none;\r\n        color: rgba(255, 255, 255, 0.8);\r\n        font-size: 0.9rem;\r\n        font-weight: 500;\r\n        transition: 0.3s ease;\r\n        text-transform: uppercase;\r\n        letter-spacing: 0.5px;\r\n    }\r\n\r\n    .shiva-menu li a:hover {\r\n        color: var(--primary-ice);\r\n        text-shadow: 0 0 10px rgba(165, 242, 243, 0.5);\r\n    }\r\n\r\n    \/* Buy Button in Nav *\/\r\n    .shiva-buy-btn {\r\n        background: var(--primary-ice);\r\n        color: #0B1026 !important;\r\n        padding: 8px 20px;\r\n        border-radius: 30px;\r\n        font-weight: 700 !important;\r\n        font-size: 0.85rem !important;\r\n        transition: 0.3s;\r\n    }\r\n\r\n    .shiva-buy-btn:hover {\r\n        box-shadow: 0 0 15px var(--primary-ice);\r\n        transform: scale(1.05);\r\n    }\r\n\r\n    \/* Mobile Menu Icon *\/\r\n    .mobile-toggle {\r\n        display: none;\r\n        color: var(--primary-ice);\r\n        cursor: pointer;\r\n    }\r\n\r\n    \/* Responsive Mobile *\/\r\n    @media (max-width: 992px) {\r\n        .shiva-menu {\r\n            display: none; \/* Sembunyikan menu di mobile (bisa dikembangkan dengan JS toggle) *\/\r\n        }\r\n        .mobile-toggle {\r\n            display: block;\r\n        }\r\n        .shiva-nav {\r\n            width: 95%;\r\n            padding: 12px 20px;\r\n            top: 10px;\r\n        }\r\n        .shiva-logo {\r\n            font-size: 1.2rem;\r\n        }\r\n    }\r\n<\/style>\r\n\r\n<nav class=\"shiva-nav\">\r\n    <a href=\"#\" class=\"shiva-logo\">$SHIVA<\/a>\r\n\r\n    <ul class=\"shiva-menu\">\r\n        <li><a href=\"#home\">Home<\/a><\/li>\r\n        <li><a href=\"#about\">The Legend<\/a><\/li>\r\n        <li><a href=\"#roadmap\">Glacier Path<\/a><\/li>\r\n        <li><a href=\"https:\/\/dexscreener.com\/solana\/A6qQm1YvJ9SAsQbagHEuT5piY8XPLwsAgNArmejcpump\">Live Chart<\/a><\/li>\r\n        <li><a href=\"#faq\">Wisdom<\/a><\/li>\r\n    <\/ul>\r\n\r\n    <div style=\"display: flex; align-items: center; gap: 15px;\">\r\n        <a href=\"https:\/\/swap.pump.fun\/?input=So11111111111111111111111111111111111111112&output=A6qQm1YvJ9SAsQbagHEuT5piY8XPLwsAgNArmejcpump\" class=\"shiva-menu li a shiva-buy-btn\">BUY NOW<\/a>\r\n        <div class=\"mobile-toggle\">\r\n            <i data-lucide=\"menu\"><\/i>\r\n        <\/div>\r\n    <\/div>\r\n<\/nav>\r\n\r\n<script>\r\n    \/\/ Inisialisasi icon Lucide (Menu Hamburger di mobile)\r\n    lucide.createIcons();\r\n<\/script>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-535fde2 elementor-widget elementor-widget-html\" data-id=\"535fde2\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<canvas id=\"particleCanvas\" style=\"\r\n    position: fixed;\r\n    top: 0;\r\n    left: 0;\r\n    width: 100%;\r\n    height: 100%;\r\n    z-index: 1; \/* Di atas background tapi di bawah tombol\/konten *\/\r\n    pointer-events: none; \/* KUNCI: Agar tidak menghalangi klik pada tombol *\/\r\n\"><\/canvas>\r\n\r\n<script>\r\n    const canvas = document.getElementById('particleCanvas');\r\n    const ctx = canvas.getContext('2d');\r\n\r\n    let particlesArray;\r\n\r\n    \/\/ Menyesuaikan ukuran canvas ke layar penuh\r\n    function resizeCanvas() {\r\n        canvas.width = window.innerWidth;\r\n        canvas.height = window.innerHeight;\r\n    }\r\n\r\n    window.addEventListener('resize', resizeCanvas);\r\n    resizeCanvas();\r\n\r\n    \/\/ Membuat Partikel Kristal\/Salju\r\n    class Particle {\r\n        constructor() {\r\n            this.x = Math.random() * canvas.width;\r\n            this.y = Math.random() * canvas.height;\r\n            this.size = Math.random() * 3 + 1; \/\/ Ukuran partikel\r\n            this.speedY = Math.random() * 1.5 + 0.5; \/\/ Kecepatan jatuh\r\n            this.speedX = Math.random() * 0.5 - 0.25; \/\/ Angin tipis ke samping\r\n            this.opacity = Math.random() * 0.5 + 0.2;\r\n        }\r\n\r\n        update() {\r\n            this.y += this.speedY;\r\n            this.x += this.speedX;\r\n\r\n            \/\/ Reset posisi jika keluar dari bawah layar\r\n            if (this.y > canvas.height) {\r\n                this.y = -10;\r\n                this.x = Math.random() * canvas.width;\r\n            }\r\n            \/\/ Reset jika keluar samping\r\n            if (this.x > canvas.width) this.x = 0;\r\n            if (this.x < 0) this.x = canvas.width;\r\n        }\r\n\r\n        draw() {\r\n            ctx.fillStyle = `rgba(165, 242, 243, ${this.opacity})`; \/\/ Warna Ice Blue\r\n            ctx.shadowBlur = 5;\r\n            ctx.shadowColor = '#A5F2F3';\r\n            ctx.beginPath();\r\n            ctx.arc(this.x, this.y, this.size, 0, Math.PI * 2);\r\n            ctx.fill();\r\n        }\r\n    }\r\n\r\n    function init() {\r\n        particlesArray = [];\r\n        const numberOfParticles = 80; \/\/ Jumlah partikel (jangan terlalu banyak agar ringan)\r\n        for (let i = 0; i < numberOfParticles; i++) {\r\n            particlesArray.push(new Particle());\r\n        }\r\n    }\r\n\r\n    function animate() {\r\n        ctx.clearRect(0, 0, canvas.width, canvas.height);\r\n        for (let i = 0; i < particlesArray.length; i++) {\r\n            particlesArray[i].update();\r\n            particlesArray[i].draw();\r\n        }\r\n        requestAnimationFrame(animate);\r\n    }\r\n\r\n    init();\r\n    animate();\r\n<\/script>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-2b2e06c e-con-full e-flex e-con e-child\" data-id=\"2b2e06c\" data-element_type=\"container\" id=\"home\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b6ec542 elementor-widget elementor-widget-html\" data-id=\"b6ec542\" 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=Cinzel+Decorative:wght@700;900&family=Inter:wght@300;400;700&display=swap\" rel=\"stylesheet\">\r\n<script src=\"https:\/\/unpkg.com\/lucide@latest\"><\/script>\r\n\r\n<style>\r\n    :root {\r\n        --primary-ice: #A5F2F3;\r\n        --white: #FFFFFF;\r\n        --glass-white: rgba(255, 255, 255, 0.1);\r\n    }\r\n\r\n    \/* DESKTOP - Tidak Dirubah *\/\r\n    .shiva-hero {\r\n        min-height: 100vh;\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: flex-start;\r\n        padding: 0 5%;\r\n        position: relative;\r\n        overflow: hidden;\r\n        background: transparent; \r\n    }\r\n\r\n    .hero-inner {\r\n        max-width: 750px;\r\n        z-index: 10;\r\n        opacity: 0;\r\n        filter: blur(15px);\r\n        transform: translateX(-50px);\r\n        animation: iceReveal 1.2s cubic-bezier(0.16, 1, 0.3, 1) forwards;\r\n        text-align: left;\r\n    }\r\n\r\n    @keyframes iceReveal {\r\n        to { opacity: 1; filter: blur(0); transform: translateX(0); }\r\n    }\r\n\r\n    .headline {\r\n        font-family: 'Cinzel Decorative', cursive;\r\n        font-size: clamp(2.2rem, 6vw, 4.2rem);\r\n        font-weight: 900;\r\n        line-height: 1.1;\r\n        margin-bottom: 25px;\r\n        background: linear-gradient(135deg, #A5F2F3 0%, #FFFFFF 50%, #71D8FF 100%);\r\n        background-size: 200% auto;\r\n        -webkit-background-clip: text;\r\n        -webkit-text-fill-color: transparent;\r\n        animation: shimmer 5s linear infinite;\r\n    }\r\n\r\n    @keyframes shimmer {\r\n        to { background-position: 200% center; }\r\n    }\r\n\r\n    .sub-headline {\r\n        font-family: 'Inter', sans-serif;\r\n        font-size: clamp(1rem, 1.8vw, 1.25rem);\r\n        color: rgba(255, 255, 255, 0.9);\r\n        line-height: 1.7;\r\n        margin-bottom: 40px;\r\n        font-weight: 400;\r\n        max-width: 650px;\r\n        border-left: 3px solid var(--primary-ice);\r\n        padding-left: 20px;\r\n    }\r\n\r\n    .ca-container {\r\n        display: inline-flex;\r\n        align-items: center;\r\n        gap: 15px;\r\n        background: var(--glass-white);\r\n        backdrop-filter: blur(10px);\r\n        -webkit-backdrop-filter: blur(10px);\r\n        border: 1px solid rgba(165, 242, 243, 0.3);\r\n        padding: 15px 25px;\r\n        border-radius: 50px;\r\n        font-family: 'Inter', sans-serif;\r\n    }\r\n\r\n    .ca-label {\r\n        color: var(--primary-ice);\r\n        font-weight: 700;\r\n        font-size: 0.75rem;\r\n        letter-spacing: 1px;\r\n        text-transform: uppercase;\r\n    }\r\n\r\n    .ca-address {\r\n        color: #fff;\r\n        font-weight: 600;\r\n        font-size: 1rem;\r\n    }\r\n\r\n    .copy-btn {\r\n        background: var(--primary-ice);\r\n        color: #0B1026;\r\n        width: 35px;\r\n        height: 35px;\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        border-radius: 50%;\r\n        cursor: pointer;\r\n        border: none;\r\n    }\r\n\r\n    \/* MOBILE OPTIMIZATION - Diperbaiki agar Rapi & Tidak Terpotong *\/\r\n    @media (max-width: 768px) {\r\n        .shiva-hero {\r\n            padding: 80px 20px; \/* Padding samping aman untuk HP *\/\r\n            justify-content: center;\r\n            align-items: flex-start; \/* Mulai agak ke atas agar tidak tertutup keyboard\/nav *\/\r\n            min-height: auto;\r\n            padding-top: 120px;\r\n        }\r\n\r\n        .hero-inner {\r\n            text-align: center;\r\n            transform: translateX(0);\r\n            max-width: 100%; \/* Gunakan lebar penuh layar HP *\/\r\n        }\r\n\r\n        .headline {\r\n            font-size: 1.8rem; \/* Ukuran lebih kecil agar tidak pecah\/lewat batas *\/\r\n            margin-bottom: 15px;\r\n        }\r\n\r\n        .sub-headline {\r\n            font-size: 0.95rem;\r\n            border-left: none; \/* Hapus border samping agar teks bisa di tengah *\/\r\n            padding-left: 0;\r\n            margin: 0 auto 30px;\r\n            line-height: 1.5;\r\n        }\r\n\r\n        .ca-container {\r\n            display: flex; \/* Ubah ke flex biasa agar bisa wrap *\/\r\n            flex-direction: column; \/* Susun vertikal di HP *\/\r\n            gap: 10px;\r\n            padding: 15px;\r\n            border-radius: 20px;\r\n            width: 100%; \/* Pastikan kotak tidak keluar layar *\/\r\n            max-width: 320px; \/* Batas aman lebar HP *\/\r\n            margin: 0 auto;\r\n        }\r\n\r\n        .ca-address {\r\n            font-size: 0.75rem; \/* Font alamat diperkecil agar tidak terpotong *\/\r\n            word-break: break-all; \/* Jika alamat sangat panjang, akan pindah baris otomatis *\/\r\n            text-align: center;\r\n        }\r\n\r\n        .ca-label {\r\n            font-size: 0.65rem;\r\n        }\r\n\r\n        .copy-btn {\r\n            width: 100%; \/* Tombol melebar di bawah alamat (opsional) atau tetap bulat *\/\r\n            height: 40px;\r\n            border-radius: 10px;\r\n        }\r\n    }\r\n<\/style>\r\n\r\n<section class=\"shiva-hero\">\r\n    <div class=\"hero-inner\">\r\n        <h1 class=\"headline\">\r\n            The Empress of the Frozen Cosmos Has Arrived.\r\n        <\/h1>\r\n\r\n        <p class=\"sub-headline\">\r\n            Rule the blockchain alongside <strong>Queen Shiva<\/strong>. A community-driven token merging celestial elegance with the unbreakable power of the crystal throne.\r\n        <\/p>\r\n\r\n        <div class=\"ca-container\">\r\n            <div style=\"display: flex; flex-direction: column; align-items: inherit;\">\r\n                <span class=\"ca-label\">Contract Address<\/span>\r\n                <span class=\"ca-address\" id=\"shivaCA\">A6qQm1YvJ9SAsQbagHEuT5piY8XPLwsAgNArmejcpump<\/span>\r\n            <\/div>\r\n            <button class=\"copy-btn\" onclick=\"copyCA(A6qQm1YvJ9SAsQbagHEuT5piY8XPLwsAgNArmejcpump)\" title=\"Copy Address\">\r\n                <i data-lucide=\"copy\" style=\"width: 18px; height: 18px;\"><\/i>\r\n            <\/button>\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\r\n\r\n<script>\r\n    lucide.createIcons();\r\n\r\n    function copyCA() {\r\n        const caText = document.getElementById(\"shivaCA\").innerText;\r\n        navigator.clipboard.writeText(caText).then(() => {\r\n            const btn = document.querySelector('.copy-btn');\r\n            const originalIcon = btn.innerHTML;\r\n            btn.innerHTML = '<i data-lucide=\"check\" style=\"width: 18px; height: 18px;\"><\/i>';\r\n            lucide.createIcons();\r\n            \r\n            setTimeout(() => {\r\n                btn.innerHTML = originalIcon;\r\n                lucide.createIcons();\r\n            }, 2000);\r\n            \r\n            alert(\"Address Copied: \" + caText);\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<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-4052a7a e-flex e-con-boxed e-con e-parent\" data-id=\"4052a7a\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;gradient&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-8501cbb e-con-full e-flex e-con e-child\" data-id=\"8501cbb\" data-element_type=\"container\" id=\"about\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d7408c6 elementor-widget elementor-widget-html\" data-id=\"d7408c6\" 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=Cinzel+Decorative:wght@700;900&family=Inter:wght@300;400;600&display=swap\" rel=\"stylesheet\">\r\n<script src=\"https:\/\/unpkg.com\/lucide@latest\"><\/script>\r\n\r\n<style>\r\n    :root {\r\n        --primary-ice: #A5F2F3;\r\n        --glass-card: rgba(255, 255, 255, 0.03);\r\n        --glass-border: rgba(165, 242, 243, 0.2);\r\n    }\r\n\r\n    \/* --- DESKTOP (TIDAK BERUBAH) --- *\/\r\n    .shiva-about-grid {\r\n        padding: 100px 8%;\r\n        display: grid;\r\n        grid-template-columns: 1fr 1.2fr;\r\n        gap: 30px;\r\n        align-items: stretch;\r\n        background: transparent;\r\n    }\r\n\r\n    .about-video-box {\r\n        position: relative;\r\n        width: 100%;\r\n        min-height: 100%;\r\n        border-radius: 30px;\r\n        overflow: hidden;\r\n        border: 1px solid var(--glass-border);\r\n        box-shadow: 0 0 30px rgba(165, 242, 243, 0.1);\r\n    }\r\n\r\n    .shiva-live-asset {\r\n        width: 100%;\r\n        height: 100%;\r\n        object-fit: cover;\r\n        display: block;\r\n    }\r\n\r\n    .about-card {\r\n        background: var(--glass-card);\r\n        backdrop-filter: blur(15px);\r\n        -webkit-backdrop-filter: blur(15px);\r\n        border: 1px solid var(--glass-border);\r\n        padding: 60px;\r\n        border-radius: 30px;\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        opacity: 0;\r\n        filter: blur(15px);\r\n        transform: translateX(30px);\r\n        transition: all 1s cubic-bezier(0.16, 1, 0.3, 1);\r\n    }\r\n\r\n    .about-card.visible {\r\n        opacity: 1;\r\n        filter: blur(0);\r\n        transform: translateX(0);\r\n    }\r\n\r\n    .about-tag {\r\n        font-family: 'Inter', sans-serif;\r\n        color: var(--primary-ice);\r\n        text-transform: uppercase;\r\n        letter-spacing: 3px;\r\n        font-size: 0.8rem;\r\n        font-weight: 700;\r\n        margin-bottom: 15px;\r\n    }\r\n\r\n    .about-title {\r\n        font-family: 'Cinzel Decorative', cursive;\r\n        font-size: clamp(2rem, 4vw, 3rem);\r\n        font-weight: 900;\r\n        margin-bottom: 25px;\r\n        color: #fff;\r\n        line-height: 1.1;\r\n    }\r\n\r\n    .about-text {\r\n        font-family: 'Inter', sans-serif;\r\n        color: rgba(255, 255, 255, 0.85);\r\n        font-size: 1.1rem;\r\n        line-height: 1.8;\r\n        margin-bottom: 35px;\r\n    }\r\n\r\n    .feature-list {\r\n        display: grid;\r\n        grid-template-columns: repeat(2, 1fr);\r\n        gap: 20px;\r\n    }\r\n\r\n    .feature-item {\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 12px;\r\n        font-family: 'Inter', sans-serif;\r\n        font-size: 0.95rem;\r\n        color: var(--primary-ice);\r\n        font-weight: 600;\r\n    }\r\n\r\n    \/* --- MOBILE OPTIMIZATION (LEBIH RAPI & AMAN) --- *\/\r\n    @media (max-width: 1024px) {\r\n        .shiva-about-grid {\r\n            grid-template-columns: 1fr; \r\n            padding: 60px 20px; \/* Padding samping dikecilkan agar teks luas *\/\r\n            gap: 20px; \/* Jarak antara video dan card dipersempit *\/\r\n        }\r\n\r\n        .about-video-box {\r\n            height: 350px; \/* Tinggi disesuaikan agar tidak terlalu dominan di HP *\/\r\n            border-radius: 20px;\r\n        }\r\n\r\n        .about-card {\r\n            padding: 30px 20px; \/* Padding dalam kartu dikurangi agar tidak sesak *\/\r\n            border-radius: 20px;\r\n            transform: translateY(20px);\r\n            opacity: 1; \/* Langsung muncul di mobile untuk performa *\/\r\n            filter: none;\r\n            text-align: center; \/* Teks rata tengah agar estetik di mobile *\/\r\n        }\r\n\r\n        .about-title {\r\n            font-size: 1.6rem; \/* Font diperkecil agar tidak terpotong *\/\r\n            margin-bottom: 15px;\r\n        }\r\n\r\n        .about-text {\r\n            font-size: 0.95rem; \/* Font teks lebih kecil agar tidak terlalu panjang *\/\r\n            line-height: 1.6;\r\n            margin-bottom: 25px;\r\n        }\r\n\r\n        .feature-list {\r\n            gap: 10px; \/* Gap list dipersempit *\/\r\n        }\r\n\r\n        .feature-item {\r\n            font-size: 0.85rem;\r\n            gap: 8px;\r\n            justify-content: center; \/* Ikon dan teks ke tengah *\/\r\n        }\r\n\r\n        .about-tag {\r\n            font-size: 0.7rem;\r\n            margin-bottom: 10px;\r\n        }\r\n    }\r\n<\/style>\r\n\r\n<section class=\"shiva-about-grid\" id=\"about\">\r\n    <div class=\"about-video-box\">\r\n        <video \r\n            class=\"shiva-live-asset\" \r\n            autoplay \r\n            muted \r\n            loop \r\n            playsinline>\r\n            <source src=\"http:\/\/queenshiva.fun\/wp-content\/uploads\/2026\/03\/QUEEN-SHIVA.mp4\" type=\"video\/mp4\">\r\n        <\/video>\r\n    <\/div>\r\n\r\n    <div class=\"about-card\" id=\"aboutCard\">\r\n        <span class=\"about-tag\">Celestial Guardian<\/span>\r\n        <h2 class=\"about-title\">The Legend of the Frozen Throne<\/h2>\r\n        \r\n        <p class=\"about-text\">\r\n            Deep within the furthest reaches of the cosmos, <strong>Queen Shiva<\/strong> reigns over the Crystal Kingdom. She is not merely a myth, but the eternal guardian of transparency and power.\r\n            <br><br>\r\n            As the frost spreads across the blockchain, she brings a new era of community-driven strength, where every holder is a citizen of her celestial empire.\r\n        <\/p>\r\n\r\n        <div class=\"feature-list\">\r\n            <div class=\"feature-item\"><i data-lucide=\"shield-check\"><\/i> Security<\/div>\r\n            <div class=\"feature-item\"><i data-lucide=\"zap\"><\/i> Growth<\/div>\r\n            <div class=\"feature-item\"><i data-lucide=\"users\"><\/i> Community<\/div>\r\n            <div class=\"feature-item\"><i data-lucide=\"eye\"><\/i> Transparent<\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\r\n\r\n<script>\r\n    lucide.createIcons();\r\n\r\n    const observer = new IntersectionObserver((entries) => {\r\n        entries.forEach(entry => {\r\n            if (entry.isIntersecting) {\r\n                entry.target.classList.add('visible');\r\n            }\r\n        });\r\n    }, { threshold: 0.1 });\r\n\r\n    \/\/ Cek jika layar bukan mobile untuk animasi slide\r\n    if (window.innerWidth > 1024) {\r\n        observer.observe(document.getElementById('aboutCard'));\r\n    } else {\r\n        document.getElementById('aboutCard').classList.add('visible');\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-ce6cfbf e-flex e-con-boxed e-con e-parent\" data-id=\"ce6cfbf\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;gradient&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-c947461 e-con-full e-flex e-con e-child\" data-id=\"c947461\" data-element_type=\"container\" id=\"roadmap\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2840f2c elementor-widget elementor-widget-html\" data-id=\"2840f2c\" 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=Cinzel+Decorative:wght@700;900&family=Inter:wght@300;400;700&display=swap\" rel=\"stylesheet\">\r\n<script src=\"https:\/\/unpkg.com\/lucide@latest\"><\/script>\r\n\r\n<style>\r\n    :root {\r\n        --primary-ice: #A5F2F3;\r\n        --glass-card: rgba(255, 255, 255, 0.03);\r\n        --glass-border: rgba(165, 242, 243, 0.15);\r\n    }\r\n\r\n    \/* --- DESKTOP (TIDAK BERUBAH) --- *\/\r\n    .roadmap-section {\r\n        padding: 100px 8%;\r\n        background: transparent;\r\n        position: relative;\r\n    }\r\n\r\n    .roadmap-header {\r\n        text-align: center;\r\n        margin-bottom: 80px;\r\n    }\r\n\r\n    .roadmap-header h2 {\r\n        font-family: 'Cinzel Decorative', cursive;\r\n        font-size: clamp(2.5rem, 5vw, 3.5rem);\r\n        font-weight: 900;\r\n        background: linear-gradient(90deg, #A5F2F3, #fff, #A5F2F3);\r\n        -webkit-background-clip: text;\r\n        -webkit-text-fill-color: transparent;\r\n        margin-bottom: 10px;\r\n    }\r\n\r\n    .timeline-container {\r\n        position: relative;\r\n        max-width: 950px;\r\n        margin: 0 auto;\r\n    }\r\n\r\n    .timeline-container::after {\r\n        content: '';\r\n        position: absolute;\r\n        width: 2px;\r\n        background: linear-gradient(to bottom, transparent, var(--primary-ice), #fff, var(--primary-ice), transparent);\r\n        top: 0;\r\n        bottom: 0;\r\n        left: 50%;\r\n        margin-left: -1px;\r\n        box-shadow: 0 0 20px rgba(165, 242, 243, 0.6);\r\n    }\r\n\r\n    .roadmap-item {\r\n        padding: 10px 50px;\r\n        position: relative;\r\n        background: inherit;\r\n        width: 50%;\r\n        opacity: 0;\r\n        filter: blur(20px);\r\n        transform: translateY(40px);\r\n        transition: all 1.2s cubic-bezier(0.16, 1, 0.3, 1);\r\n    }\r\n\r\n    .roadmap-item.visible {\r\n        opacity: 1;\r\n        filter: blur(0);\r\n        transform: translateY(0);\r\n    }\r\n\r\n    .left { left: 0; text-align: right; }\r\n    .right { left: 50%; text-align: left; }\r\n\r\n    .roadmap-item::after {\r\n        content: '\u2726';\r\n        position: absolute;\r\n        width: 30px;\r\n        height: 30px;\r\n        right: -15px;\r\n        background-color: #0B1026;\r\n        border: 2px solid var(--primary-ice);\r\n        top: 20px;\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        color: var(--primary-ice);\r\n        font-size: 12px;\r\n        transform: rotate(45deg);\r\n        z-index: 1;\r\n        box-shadow: 0 0 15px var(--primary-ice);\r\n    }\r\n\r\n    .right::after { left: -15px; }\r\n\r\n    .roadmap-content {\r\n        padding: 40px;\r\n        background: var(--glass-card);\r\n        backdrop-filter: blur(15px);\r\n        border: 1px solid var(--glass-border);\r\n        border-radius: 30px;\r\n        position: relative;\r\n        transition: 0.4s;\r\n    }\r\n\r\n    .epoch-tag {\r\n        font-family: 'Inter', sans-serif;\r\n        color: var(--primary-ice);\r\n        font-weight: 800;\r\n        letter-spacing: 4px;\r\n        font-size: 0.75rem;\r\n        margin-bottom: 15px;\r\n        display: block;\r\n        text-transform: uppercase;\r\n    }\r\n\r\n    .roadmap-content h3 {\r\n        font-family: 'Cinzel Decorative', cursive;\r\n        color: #fff;\r\n        margin-bottom: 20px;\r\n        font-size: 1.8rem;\r\n        font-weight: 700;\r\n    }\r\n\r\n    .roadmap-content ul {\r\n        list-style: none;\r\n        padding: 0;\r\n        margin: 0;\r\n        font-family: 'Inter', sans-serif;\r\n        color: rgba(255, 255, 255, 0.8);\r\n        font-size: 1rem;\r\n        line-height: 2;\r\n    }\r\n\r\n    .roadmap-content ul li {\r\n        margin-bottom: 10px;\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 10px;\r\n    }\r\n\r\n    .left ul li { justify-content: flex-end; }\r\n    .right ul li { justify-content: flex-start; }\r\n\r\n    .status-icon {\r\n        color: var(--primary-ice);\r\n        width: 16px;\r\n    }\r\n\r\n    \/* --- MOBILE OPTIMIZATION (RAPI & TIDAK TERPOTONG) --- *\/\r\n    @media (max-width: 850px) {\r\n        .roadmap-section {\r\n            padding: 60px 15px; \/* Spasi aman samping *\/\r\n        }\r\n\r\n        .timeline-container::after {\r\n            left: 20px; \/* Geser garis ke kiri *\/\r\n        }\r\n\r\n        .roadmap-item {\r\n            width: 100%; \/* Penuhi layar *\/\r\n            padding-left: 50px; \/* Beri jarak dari garis timeline *\/\r\n            padding-right: 10px;\r\n            text-align: left; \/* Semua rata kiri di HP *\/\r\n            left: 0 !important;\r\n            margin-bottom: 30px;\r\n        }\r\n\r\n        .roadmap-item::after {\r\n            left: 5px; \/* Titik bintang nempel di garis kiri *\/\r\n            right: auto;\r\n            width: 25px;\r\n            height: 25px;\r\n            top: 25px;\r\n        }\r\n\r\n        .roadmap-content {\r\n            padding: 25px 20px; \/* Kecilkan padding dalam agar tidak sesak *\/\r\n            border-radius: 20px;\r\n        }\r\n\r\n        .roadmap-content h3 {\r\n            font-size: 1.4rem; \/* Ukuran font judul lebih aman *\/\r\n            margin-bottom: 15px;\r\n        }\r\n\r\n        .roadmap-content ul li {\r\n            font-size: 0.9rem; \/* Ukuran teks list lebih kecil *\/\r\n            justify-content: flex-start !important; \/* Paksa semua rata kiri *\/\r\n            line-height: 1.5;\r\n            display: grid; \/* Gunakan grid agar ikon tidak terpotong teks panjang *\/\r\n            grid-template-columns: 1fr auto; \r\n            align-items: center;\r\n            text-align: left;\r\n        }\r\n\r\n        .status-icon {\r\n            grid-column: 2; \/* Ikon selalu di kanan teks *\/\r\n            width: 14px;\r\n        }\r\n\r\n        .epoch-tag {\r\n            font-size: 0.65rem;\r\n            letter-spacing: 2px;\r\n        }\r\n    }\r\n<\/style>\r\n\r\n<section class=\"roadmap-section\" id=\"roadmap\">\r\n    <div class=\"roadmap-header\">\r\n        <h2>GLACIER PATH<\/h2>\r\n        <p style=\"font-family:'Inter'; color:rgba(255,255,255,0.5); letter-spacing: 2px;\">THE CELESTIAL ASCENSION OF $SHIVA<\/p>\r\n    <\/div>\r\n\r\n    <div class=\"timeline-container\">\r\n        <div class=\"roadmap-item left scroll-reveal\">\r\n            <div class=\"roadmap-content\">\r\n                <span class=\"epoch-tag\">Epoch 01<\/span>\r\n                <h3>The First Frost<\/h3>\r\n                <ul>\r\n                    <li>Summoning the Royal Community <i data-lucide=\"sparkles\" class=\"status-icon\"><\/i><\/li>\r\n                    <li>Deployment of the Ice Throne Contract <i data-lucide=\"shield-check\" class=\"status-icon\"><\/i><\/li>\r\n                    <li>Crystal Clear Liquidity Burn (100%) <i data-lucide=\"flame\" class=\"status-icon\"><\/i><\/li>\r\n                    <li>Global Social Media Dominance <i data-lucide=\"globe\" class=\"status-icon\"><\/i><\/li>\r\n                <\/ul>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"roadmap-item right scroll-reveal\">\r\n            <div class=\"roadmap-content\">\r\n                <span class=\"epoch-tag\">Epoch 02<\/span>\r\n                <h3>Stellar Bloom<\/h3>\r\n                <ul>\r\n                    <li>Strategic KOL Alliances <i data-lucide=\"users\" class=\"status-icon\"><\/i><\/li>\r\n                    <li>CoinGecko & CMC Manifestation <i data-lucide=\"trending-up\" class=\"status-icon\"><\/i><\/li>\r\n                    <li>Viral Community \"Ice Storm\" Marketing <i data-lucide=\"zap\" class=\"status-icon\"><\/i><\/li>\r\n                    <li>Expanding the Kingdom: 5,000+ Holders <i data-lucide=\"crown\" class=\"status-icon\"><\/i><\/li>\r\n                <\/ul>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"roadmap-item left scroll-reveal\">\r\n            <div class=\"roadmap-content\">\r\n                <span class=\"epoch-tag\">Epoch 03<\/span>\r\n                <h3>Galactic Reign<\/h3>\r\n                <ul>\r\n                    <li>Tier-1 Centralized Exchange Gateway <i data-lucide=\"layout-grid\" class=\"status-icon\"><\/i><\/li>\r\n                    <li>The Shiva\u2019s Soul NFT Collection <i data-lucide=\"gem\" class=\"status-icon\"><\/i><\/li>\r\n                    <li>DeFi Ecosystem Integration <i data-lucide=\"link\" class=\"status-icon\"><\/i><\/li>\r\n                    <li>Establishing the \"Frozen Hope\" Charity <i data-lucide=\"heart\" class=\"status-icon\"><\/i><\/li>\r\n                <\/ul>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\r\n\r\n<script>\r\n    const roadmapObserver = new IntersectionObserver((entries) => {\r\n        entries.forEach(entry => {\r\n            if (entry.isIntersecting) {\r\n                entry.target.classList.add('visible');\r\n            }\r\n        });\r\n    }, { threshold: 0.1 });\r\n\r\n    document.querySelectorAll('.scroll-reveal').forEach((item) => {\r\n        roadmapObserver.observe(item);\r\n    });\r\n\r\n    lucide.createIcons();\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-82d1aef e-flex e-con-boxed e-con e-parent\" data-id=\"82d1aef\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;gradient&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-7eb9f25 e-con-full e-flex e-con e-child\" data-id=\"7eb9f25\" data-element_type=\"container\" id=\"chart\">\n\t\t\t\t<div class=\"elementor-element elementor-element-eed68e1 elementor-widget elementor-widget-html\" data-id=\"eed68e1\" 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=Cinzel+Decorative:wght@700;900&family=Inter:wght@300;400;700&display=swap\" rel=\"stylesheet\">\r\n<script src=\"https:\/\/unpkg.com\/lucide@latest\"><\/script>\r\n\r\n<style>\r\n    :root {\r\n        --primary-ice: #A5F2F3;\r\n        --secondary-ice: #71D8FF;\r\n        --glass-card: rgba(255, 255, 255, 0.02);\r\n        --glass-border: rgba(165, 242, 243, 0.15);\r\n    }\r\n\r\n    .chart-section {\r\n        padding: 80px 5%;\r\n        background: transparent;\r\n        position: relative;\r\n        overflow: hidden;\r\n    }\r\n\r\n    .chart-header {\r\n        text-align: center;\r\n        margin-bottom: 50px;\r\n    }\r\n\r\n    .chart-header h2 {\r\n        font-family: 'Cinzel Decorative', cursive;\r\n        font-size: clamp(2.5rem, 5vw, 4rem);\r\n        font-weight: 900;\r\n        background: linear-gradient(135deg, #fff 0%, var(--primary-ice) 50%, var(--secondary-ice) 100%);\r\n        -webkit-background-clip: text;\r\n        -webkit-text-fill-color: transparent;\r\n    }\r\n\r\n    \/* Container Utama - Fokus pada Chart *\/\r\n    .chart-container-full {\r\n        max-width: 1400px;\r\n        margin: 0 auto;\r\n        display: flex;\r\n        flex-direction: column;\r\n        gap: 30px;\r\n    }\r\n\r\n    \/* Iframe Styling - Dibuat Lebih Besar & Imersif *\/\r\n    .chart-main-wrapper {\r\n        background: #000;\r\n        border-radius: 40px;\r\n        border: 1px solid var(--glass-border);\r\n        overflow: hidden;\r\n        \/* Tinggi ditingkatkan menjadi 750px untuk tampilan desktop yang megah *\/\r\n        height: 750px; \r\n        width: 100%;\r\n        box-shadow: 0 30px 60px rgba(0,0,0,0.6), \r\n                    0 0 20px rgba(165, 242, 243, 0.1);\r\n        position: relative;\r\n    }\r\n\r\n    .chart-main-wrapper iframe {\r\n        width: 100%;\r\n        height: 100%;\r\n        border: none;\r\n        \/* Menghilangkan elemen yang tidak perlu dari Dexscreener agar chart lebih luas *\/\r\n    }\r\n\r\n    \/* Statistik dipindah ke bawah dalam satu baris (Horizontal Stats) *\/\r\n    .chart-stats-row {\r\n        display: grid;\r\n        grid-template-columns: repeat(4, 1fr);\r\n        gap: 20px;\r\n        width: 100%;\r\n    }\r\n\r\n    .stat-card-horizontal {\r\n        background: var(--glass-card);\r\n        backdrop-filter: blur(20px);\r\n        -webkit-backdrop-filter: blur(20px);\r\n        border: 1px solid var(--glass-border);\r\n        padding: 25px;\r\n        border-radius: 25px;\r\n        text-align: center;\r\n        transition: all 0.4s ease;\r\n        display: flex;\r\n        flex-direction: column;\r\n        align-items: center;\r\n        justify-content: center;\r\n    }\r\n\r\n    .stat-card-horizontal:hover {\r\n        transform: translateY(-5px);\r\n        border-color: var(--primary-ice);\r\n        background: rgba(165, 242, 243, 0.05);\r\n        box-shadow: 0 10px 25px rgba(165, 242, 243, 0.1);\r\n    }\r\n\r\n    .stat-label {\r\n        font-family: 'Inter', sans-serif;\r\n        color: var(--primary-ice);\r\n        font-size: 0.75rem;\r\n        font-weight: 800;\r\n        text-transform: uppercase;\r\n        letter-spacing: 2px;\r\n        margin-bottom: 10px;\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 8px;\r\n    }\r\n\r\n    .stat-value {\r\n        font-family: 'Inter', sans-serif;\r\n        color: #fff;\r\n        font-size: 1.5rem;\r\n        font-weight: 900;\r\n    }\r\n\r\n    \/* --- MOBILE REFINEMENT --- *\/\r\n    @media (max-width: 1024px) {\r\n        .chart-main-wrapper {\r\n            height: 550px; \/* Tinggi disesuaikan untuk tablet *\/\r\n            border-radius: 25px;\r\n        }\r\n        .chart-stats-row {\r\n            grid-template-columns: repeat(2, 1fr); \/* 2x2 di tablet *\/\r\n        }\r\n    }\r\n\r\n    @media (max-width: 768px) {\r\n        .chart-section { padding: 60px 15px; }\r\n        .chart-main-wrapper {\r\n            height: 500px; \/* Tinggi optimal untuk mobile *\/\r\n            border-radius: 20px;\r\n        }\r\n        .chart-stats-row {\r\n            grid-template-columns: 1fr; \/* Stack vertikal di HP *\/\r\n            gap: 15px;\r\n        }\r\n        .stat-value { font-size: 1.3rem; }\r\n    }\r\n<\/style>\r\n\r\n<section class=\"chart-section\" id=\"chart\">\r\n    <div class=\"chart-header\">\r\n        <h2>FROST ANALYTICS<\/h2>\r\n        <p style=\"font-family:'Inter'; color:rgba(255,255,255,0.4); letter-spacing: 3px; font-size: 0.9rem; font-weight: 300;\">LIVE MARKET INSIGHTS<\/p>\r\n    <\/div>\r\n\r\n    <div class=\"chart-container-full\">\r\n        <div class=\"chart-main-wrapper\">\r\n            <iframe \r\n                id=\"dexscreener-embed\" \r\n                title=\"Dexscreener Chart\" \r\n                src=\"https:\/\/dexscreener.com\/solana\/A6qQm1YvJ9SAsQbagHEuT5piY8XPLwsAgNArmejcpump\">\r\n            <\/iframe>\r\n        <\/div>\r\n\r\n        <div class=\"chart-stats-row\">\r\n            <div class=\"stat-card-horizontal\">\r\n                <span class=\"stat-label\"><i data-lucide=\"database\" size=\"14\"><\/i> SUPPLY<\/span>\r\n                <span class=\"stat-value\">1,000,000,000<\/span>\r\n            <\/div>\r\n            \r\n            <div class=\"stat-card-horizontal\">\r\n                <span class=\"stat-label\"><i data-lucide=\"droplet\" size=\"14\"><\/i> LIQUIDITY<\/span>\r\n                <span class=\"stat-value\">100% BURNT<\/span>\r\n            <\/div>\r\n            \r\n            <div class=\"stat-card-horizontal\">\r\n                <span class=\"stat-label\"><i data-lucide=\"shield-check\" size=\"14\"><\/i> TAX<\/span>\r\n                <span class=\"stat-value\">0% \/ 0%<\/span>\r\n            <\/div>\r\n            \r\n            <div class=\"stat-card-horizontal\">\r\n                <span class=\"stat-label\"><i data-lucide=\"cpu\" size=\"14\"><\/i> NETWORK<\/span>\r\n                <span class=\"stat-value\">SOLANA<\/span>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\r\n\r\n<script>\r\n    \/\/ Initialize Icons\r\n    lucide.createIcons();\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-d40a0d9 e-flex e-con-boxed e-con e-parent\" data-id=\"d40a0d9\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;gradient&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-757af1a e-con-full e-flex e-con e-child\" data-id=\"757af1a\" data-element_type=\"container\" id=\"faq\">\n\t\t\t\t<div class=\"elementor-element elementor-element-fbe1c49 elementor-widget elementor-widget-html\" data-id=\"fbe1c49\" 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=Cinzel+Decorative:wght@700;900&family=Inter:wght@300;400;600&display=swap\" rel=\"stylesheet\">\r\n<script src=\"https:\/\/unpkg.com\/lucide@latest\"><\/script>\r\n\r\n<style>\r\n    :root {\r\n        --primary-ice: #A5F2F3;\r\n        --glass-card: rgba(255, 255, 255, 0.03);\r\n        --glass-border: rgba(165, 242, 243, 0.15);\r\n    }\r\n\r\n    .faq-section {\r\n        padding: 100px 8%;\r\n        background: transparent;\r\n        position: relative;\r\n    }\r\n\r\n    .faq-header {\r\n        text-align: center;\r\n        margin-bottom: 60px;\r\n    }\r\n\r\n    .faq-header h2 {\r\n        font-family: 'Cinzel Decorative', cursive;\r\n        font-size: clamp(2.2rem, 5vw, 3.5rem);\r\n        font-weight: 900;\r\n        background: linear-gradient(90deg, #A5F2F3, #fff, #A5F2F3);\r\n        -webkit-background-clip: text;\r\n        -webkit-text-fill-color: transparent;\r\n        margin-bottom: 10px;\r\n    }\r\n\r\n    .faq-container {\r\n        max-width: 900px;\r\n        margin: 0 auto;\r\n        display: flex;\r\n        flex-direction: column;\r\n        gap: 15px;\r\n    }\r\n\r\n    \/* FAQ Item Styling *\/\r\n    .faq-item {\r\n        background: var(--glass-card);\r\n        backdrop-filter: blur(10px);\r\n        -webkit-backdrop-filter: blur(10px);\r\n        border: 1px solid var(--glass-border);\r\n        border-radius: 20px;\r\n        overflow: hidden;\r\n        transition: all 0.3s ease;\r\n    }\r\n\r\n    .faq-item:hover {\r\n        border-color: var(--primary-ice);\r\n        background: rgba(165, 242, 243, 0.05);\r\n    }\r\n\r\n    \/* Question Button *\/\r\n    .faq-question {\r\n        width: 100%;\r\n        padding: 25px 30px;\r\n        background: transparent;\r\n        border: none;\r\n        display: flex;\r\n        justify-content: space-between;\r\n        align-items: center;\r\n        cursor: pointer;\r\n        text-align: left;\r\n        outline: none;\r\n    }\r\n\r\n    .faq-question span {\r\n        font-family: 'Cinzel Decorative', cursive;\r\n        color: #fff;\r\n        font-size: 1.1rem;\r\n        font-weight: 700;\r\n        letter-spacing: 1px;\r\n    }\r\n\r\n    .faq-icon {\r\n        color: var(--primary-ice);\r\n        transition: transform 0.3s ease;\r\n    }\r\n\r\n    \/* Answer Content *\/\r\n    .faq-answer {\r\n        max-height: 0;\r\n        overflow: hidden;\r\n        transition: max-height 0.3s ease-out, padding 0.3s ease;\r\n        padding: 0 30px;\r\n    }\r\n\r\n    .faq-answer p {\r\n        font-family: 'Inter', sans-serif;\r\n        color: rgba(255, 255, 255, 0.7);\r\n        font-size: 1rem;\r\n        line-height: 1.7;\r\n        padding-bottom: 25px;\r\n    }\r\n\r\n    \/* Active State *\/\r\n    .faq-item.active {\r\n        border-color: var(--primary-ice);\r\n        background: rgba(165, 242, 243, 0.08);\r\n        box-shadow: 0 10px 30px rgba(0,0,0,0.3);\r\n    }\r\n\r\n    .faq-item.active .faq-icon {\r\n        transform: rotate(180deg);\r\n    }\r\n\r\n    .faq-item.active .faq-answer {\r\n        max-height: 500px; \/* Nilai besar agar konten terlihat semua *\/\r\n    }\r\n\r\n    \/* --- MOBILE REFINEMENT --- *\/\r\n    @media (max-width: 768px) {\r\n        .faq-section {\r\n            padding: 60px 15px;\r\n        }\r\n        .faq-question {\r\n            padding: 20px;\r\n        }\r\n        .faq-question span {\r\n            font-size: 0.95rem;\r\n        }\r\n        .faq-answer p {\r\n            font-size: 0.9rem;\r\n        }\r\n    }\r\n<\/style>\r\n\r\n<section class=\"faq-section\" id=\"faq\">\r\n    <div class=\"faq-header\">\r\n        <h2>WISDOM OF THE QUEEN<\/h2>\r\n        <p style=\"font-family:'Inter'; color:rgba(255,255,255,0.4); letter-spacing: 2px; font-size: 0.8rem; text-transform: uppercase;\">Unveiling the Secrets of the Realm<\/p>\r\n    <\/div>\r\n\r\n    <div class=\"faq-container\">\r\n        <div class=\"faq-item\">\r\n            <button class=\"faq-question\">\r\n                <span>What is $Shiva?<\/span>\r\n                <i data-lucide=\"chevron-down\" class=\"faq-icon\"><\/i>\r\n            <\/button>\r\n            <div class=\"faq-answer\">\r\n                <p>$Shiva is a community-centric token on the Solana network, inspired by the elegance and cosmic power of Queen Shiva. It is designed to create a solid, loyal kingdom of holders through transparency and engagement.<\/p>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"faq-item\">\r\n            <button class=\"faq-question\">\r\n                <span>How safe is my investment?<\/span>\r\n                <i data-lucide=\"chevron-down\" class=\"faq-icon\"><\/i>\r\n            <\/button>\r\n            <div class=\"faq-answer\">\r\n                <p>The Queen values trust above all. The liquidity pool (LP) is 100% burnt, the contract is renounced, and the tax is 0%. Your investment is protected by the unbreakable laws of the Frozen Throne.<\/p>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"faq-item\">\r\n            <button class=\"faq-question\">\r\n                <span>What is the vision of the Kingdom?<\/span>\r\n                <i data-lucide=\"chevron-down\" class=\"faq-icon\"><\/i>\r\n            <\/button>\r\n            <div class=\"faq-answer\">\r\n                <p>Our vision is to build a long-term ecosystem that includes exclusive NFT collections, strategic CEX listings, and partnerships that expand Queen Shiva's influence across the entire blockchain galaxy.<\/p>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"faq-item\">\r\n            <button class=\"faq-question\">\r\n                <span>How can I join the Shiva Army?<\/span>\r\n                <i data-lucide=\"chevron-down\" class=\"faq-icon\"><\/i>\r\n            <\/button>\r\n            <div class=\"faq-answer\">\r\n                <p>Simply acquire $Shiva through decentralized exchanges like Raydium or Jupiter and join our official Telegram and X communities to receive royal decrees and updates.<\/p>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\r\n\r\n<script>\r\n    \/\/ Initialize Icons\r\n    lucide.createIcons();\r\n\r\n    \/\/ Accordion Logic\r\n    document.querySelectorAll('.faq-question').forEach(button => {\r\n        button.addEventListener('click', () => {\r\n            const faqItem = button.parentElement;\r\n            \r\n            \/\/ Close other items (optional - hilangkan jika ingin bisa buka banyak sekaligus)\r\n            document.querySelectorAll('.faq-item').forEach(item => {\r\n                if (item !== faqItem) item.classList.remove('active');\r\n            });\r\n\r\n            faqItem.classList.toggle('active');\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-bc6be1e e-flex e-con-boxed e-con e-parent\" data-id=\"bc6be1e\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;gradient&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-c0ddf4a e-con-full e-flex e-con e-child\" data-id=\"c0ddf4a\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5a29d85 elementor-widget elementor-widget-html\" data-id=\"5a29d85\" 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=Cinzel+Decorative:wght@700;900&family=Inter:wght@300;400;700&display=swap\" rel=\"stylesheet\">\r\n<script src=\"https:\/\/unpkg.com\/lucide@latest\"><\/script>\r\n\r\n<style>\r\n    :root {\r\n        --primary-ice: #A5F2F3;\r\n        --secondary-ice: #71D8FF;\r\n        --accent-gold: #FFD700; \/* Warna tambahan untuk tombol Buy *\/\r\n    }\r\n\r\n    .join-section {\r\n        padding: 100px 5%;\r\n        background: transparent;\r\n        display: flex;\r\n        justify-content: center;\r\n        align-items: center;\r\n        position: relative;\r\n    }\r\n\r\n    .join-card {\r\n        position: relative;\r\n        width: 100%;\r\n        max-width: 1100px;\r\n        min-height: 550px;\r\n        border-radius: 40px;\r\n        overflow: hidden;\r\n        border: 1px solid rgba(165, 242, 243, 0.3);\r\n        display: flex;\r\n        flex-direction: column;\r\n        justify-content: center;\r\n        align-items: center;\r\n        text-align: center;\r\n        box-shadow: 0 25px 50px rgba(0,0,0,0.5);\r\n    }\r\n\r\n    .join-video-bg {\r\n        position: absolute;\r\n        top: 0;\r\n        left: 0;\r\n        width: 100%;\r\n        height: 100%;\r\n        object-fit: cover;\r\n        z-index: 1;\r\n        filter: brightness(0.35) contrast(1.1);\r\n    }\r\n\r\n    .join-overlay {\r\n        position: absolute;\r\n        top: 0; left: 0; right: 0; bottom: 0;\r\n        background: radial-gradient(circle, rgba(11, 16, 38, 0.2) 0%, rgba(11, 16, 38, 0.8) 100%);\r\n        z-index: 2;\r\n    }\r\n\r\n    .join-content {\r\n        position: relative;\r\n        z-index: 3;\r\n        padding: 40px 30px;\r\n        width: 100%;\r\n    }\r\n\r\n    .join-title {\r\n        font-family: 'Cinzel Decorative', cursive;\r\n        font-size: clamp(2rem, 5vw, 3.5rem);\r\n        font-weight: 900;\r\n        color: #fff;\r\n        margin-bottom: 20px;\r\n        text-shadow: 0 0 20px rgba(165, 242, 243, 0.6);\r\n    }\r\n\r\n    .join-text {\r\n        font-family: 'Inter', sans-serif;\r\n        color: rgba(255, 255, 255, 0.9);\r\n        font-size: clamp(1rem, 1.5vw, 1.1rem);\r\n        margin-bottom: 45px;\r\n        max-width: 650px;\r\n        margin-left: auto;\r\n        margin-right: auto;\r\n        line-height: 1.6;\r\n    }\r\n\r\n    \/* Social Buttons Group *\/\r\n    .action-group {\r\n        display: flex;\r\n        gap: 15px;\r\n        justify-content: center;\r\n        flex-wrap: wrap;\r\n    }\r\n\r\n    .btn-base {\r\n        font-family: 'Inter', sans-serif;\r\n        text-decoration: none;\r\n        padding: 16px 32px;\r\n        border-radius: 50px;\r\n        display: flex;\r\n        align-items: center;\r\n        gap: 10px;\r\n        font-weight: 800;\r\n        font-size: 0.85rem;\r\n        text-transform: uppercase;\r\n        letter-spacing: 1.5px;\r\n        transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);\r\n    }\r\n\r\n    \/* Tombol BUY NOW - Efek Spesial *\/\r\n    .btn-buy {\r\n        background: linear-gradient(135deg, #fff 0%, var(--primary-ice) 100%);\r\n        color: #0B1026;\r\n        box-shadow: 0 0 20px rgba(165, 242, 243, 0.4);\r\n        border: none;\r\n        position: relative;\r\n        overflow: hidden;\r\n    }\r\n\r\n    .btn-buy:hover {\r\n        transform: scale(1.1);\r\n        box-shadow: 0 0 40px var(--primary-ice);\r\n    }\r\n\r\n    \/* Animasi kilauan pada tombol Buy *\/\r\n    .btn-buy::after {\r\n        content: '';\r\n        position: absolute;\r\n        top: -50%; left: -50%;\r\n        width: 200%; height: 200%;\r\n        background: linear-gradient(45deg, transparent, rgba(255,255,255,0.6), transparent);\r\n        transform: rotate(45deg);\r\n        animation: shine 3s infinite;\r\n    }\r\n\r\n    @keyframes shine {\r\n        0% { left: -100%; }\r\n        20% { left: 100%; }\r\n        100% { left: 100%; }\r\n    }\r\n\r\n    .btn-tg {\r\n        background: rgba(255, 255, 255, 0.08);\r\n        color: #fff;\r\n        border: 1px solid rgba(255, 255, 255, 0.2);\r\n        backdrop-filter: blur(10px);\r\n    }\r\n\r\n    .btn-tg:hover {\r\n        background: #229ED9;\r\n        border-color: #229ED9;\r\n        transform: translateY(-5px);\r\n    }\r\n\r\n    .btn-x {\r\n        background: rgba(255, 255, 255, 0.08);\r\n        color: #fff;\r\n        border: 1px solid rgba(255, 255, 255, 0.2);\r\n        backdrop-filter: blur(10px);\r\n    }\r\n\r\n    .btn-x:hover {\r\n        background: #000;\r\n        border-color: #fff;\r\n        transform: translateY(-5px);\r\n    }\r\n\r\n    .footer-bottom {\r\n        margin-top: 50px;\r\n        padding-bottom: 50px;\r\n        font-family: 'Inter', sans-serif;\r\n        font-size: 0.75rem;\r\n        color: rgba(255, 255, 255, 0.3);\r\n        letter-spacing: 2px;\r\n        text-transform: uppercase;\r\n        text-align: center;\r\n    }\r\n\r\n    \/* --- MOBILE REFINEMENT --- *\/\r\n    @media (max-width: 768px) {\r\n        .join-card {\r\n            height: auto;\r\n            padding: 60px 20px;\r\n            border-radius: 30px;\r\n        }\r\n        .action-group {\r\n            flex-direction: column;\r\n            width: 100%;\r\n        }\r\n        .btn-base {\r\n            width: 100%;\r\n            justify-content: center;\r\n        }\r\n    }\r\n<\/style>\r\n\r\n<section class=\"join-section\" id=\"join\">\r\n    <div class=\"join-card\">\r\n        <video class=\"join-video-bg\" autoplay muted loop playsinline>\r\n            <source src=\"http:\/\/queenshiva.fun\/wp-content\/uploads\/2026\/03\/QUEEN-SHIVA-1.mp4\" type=\"video\/mp4\">\r\n        <\/video>\r\n        \r\n        <div class=\"join-overlay\"><\/div>\r\n\r\n        <div class=\"join-content\">\r\n            <h2 class=\"join-title\">SECURE YOUR THRONE<\/h2>\r\n            <p class=\"join-text\">\r\n                The era of the Crystal Kingdom has begun. Don't watch from the sidelines\u2014take your place among the royals and build the future of $SHIVA.\r\n            <\/p>\r\n\r\n            <div class=\"action-group\">\r\n                <a href=\"https:\/\/swap.pump.fun\/?input=So11111111111111111111111111111111111111112&output=A6qQm1YvJ9SAsQbagHEuT5piY8XPLwsAgNArmejcpump\" class=\"btn-base btn-buy\">\r\n                    <i data-lucide=\"shopping-cart\"><\/i> BUY $SHIVA NOW\r\n                <\/a>\r\n                \r\n                <a href=\"https:\/\/t.me\/queensshiva\" class=\"btn-base btn-tg\">\r\n                    <i data-lucide=\"send\"><\/i> Telegram\r\n                <\/a>\r\n                <a href=\"https:\/\/x.com\/queensshiva\" class=\"btn-base btn-x\">\r\n                    <i data-lucide=\"twitter\"><\/i> Twitter \/ X\r\n                <\/a>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\r\n\r\n<div class=\"footer-bottom\">\r\n    <p>\u00a9 2026 QUEEN SHIVA ($SHIVA) \u2022 CRAFTED FOR THE ROYALTY<\/p>\r\n<\/div>\r\n\r\n<script>\r\n    \/\/ Initialize Icons\r\n    lucide.createIcons();\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\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>$SHIVA Home The Legend Glacier Path Live Chart Wisdom BUY NOW The Empress of the Frozen Cosmos Has Arrived. Rule the blockchain alongside Queen Shiva. A community-driven token merging celestial elegance with the unbreakable power of the crystal throne. Contract Address A6qQm1YvJ9SAsQbagHEuT5piY8XPLwsAgNArmejcpump Celestial Guardian The Legend of the Frozen Throne Deep within the furthest reaches [&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:\/\/queenshiva.fun\/index.php\/wp-json\/wp\/v2\/pages\/8","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/queenshiva.fun\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/queenshiva.fun\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/queenshiva.fun\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/queenshiva.fun\/index.php\/wp-json\/wp\/v2\/comments?post=8"}],"version-history":[{"count":31,"href":"https:\/\/queenshiva.fun\/index.php\/wp-json\/wp\/v2\/pages\/8\/revisions"}],"predecessor-version":[{"id":50,"href":"https:\/\/queenshiva.fun\/index.php\/wp-json\/wp\/v2\/pages\/8\/revisions\/50"}],"wp:attachment":[{"href":"https:\/\/queenshiva.fun\/index.php\/wp-json\/wp\/v2\/media?parent=8"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}