{"id":1367,"date":"2025-12-07T12:26:11","date_gmt":"2025-12-07T12:26:11","guid":{"rendered":"https:\/\/demosites.royal-elementor-addons.com\/ai-image-v1\/?page_id=6"},"modified":"2026-04-27T19:27:00","modified_gmt":"2026-04-27T19:27:00","slug":"home-ai-image-v1","status":"publish","type":"page","link":"https:\/\/app.digitalfreelancer.org\/","title":{"rendered":"Home"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1367\" class=\"elementor elementor-1367\">\n\t\t\t\t<div class=\"elementor-element elementor-element-53668a6 e-flex e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no e-con e-parent\" data-id=\"53668a6\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-e6e2f09 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no e-con e-child\" data-id=\"e6e2f09\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-76c9d27 elementor-widget elementor-widget-shortcode\" data-id=\"76c9d27\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\">\n    <style>\n        body {\n            margin: 0;\n            background: #05050a;\n            overflow-x: hidden;\n        }\n\n        \/* FULL SCREEN CANVAS BACKGROUND *\/\n        #mysticCanvas {\n            position: fixed;\n            top: 0;\n            left: 0;\n            width: 100%;\n            height: 100%;\n            z-index: 0;\n        }\n\n        .dash-wrap {\n            position: relative;\n            z-index: 2;\n            padding: 60px 20px;\n            display: flex;\n            flex-direction: column;\n            align-items: center;\n            gap: 25px;\n            perspective: 1200px;\n        }\n\n        .dash-title {\n            color: #fff;\n            font-size: 30px;\n            font-weight: 900;\n            letter-spacing: 3px;\n            text-shadow: 0 0 25px rgba(255,255,255,0.25);\n        }\n\n        .dash-subtitle {\n            color: #aaa;\n            font-size: 12px;\n            letter-spacing: 3px;\n        }\n\n        \/* PORTAL *\/\n        .main-portal {\n            width: 340px;\n            height: 200px;\n            border-radius: 22px;\n            cursor: pointer;\n            position: relative;\n            overflow: hidden;\n            transform-style: preserve-3d;\n            transition: transform 0.8s ease, opacity 0.8s ease;\n        }\n\n        .main-portal::before {\n            content: \"\";\n            position: absolute;\n            inset: -80%;\n            background: conic-gradient(\n                from 180deg,\n                #7a00ff,\n                #ff00d4,\n                #00d4ff,\n                #7a00ff\n            );\n            filter: blur(20px);\n            animation: spin 7s linear infinite;\n            opacity: 0.6;\n        }\n\n        .main-portal::after {\n            content: \"\";\n            position: absolute;\n            inset: 0;\n            background: radial-gradient(circle at center,\n                rgba(0,0,0,0.2),\n                rgba(0,0,0,0.9)\n            );\n        }\n\n        .portal-content {\n            position: relative;\n            z-index: 2;\n            height: 100%;\n            display: flex;\n            flex-direction: column;\n            align-items: center;\n            justify-content: center;\n        }\n\n        .portal-title {\n            color: #fff;\n            font-size: 22px;\n            font-weight: 900;\n        }\n\n        .portal-sub {\n            color: #aaa;\n            font-size: 12px;\n            margin-top: 6px;\n        }\n\n        \/* ZOOM EFFECT *\/\n        .zoom-out {\n            transform: scale(2.5);\n            opacity: 0;\n        }\n\n        \/* GRID *\/\n        .dash-container {\n            display: grid;\n            grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));\n            gap: 22px;\n            width: 100%;\n            max-width: 1100px;\n\n            max-height: 0;\n            opacity: 0;\n            overflow: hidden;\n            transform: translateY(40px);\n            transition: all 1s ease;\n        }\n\n        .dash-container.open {\n            max-height: 1200px;\n            opacity: 1;\n            transform: translateY(0);\n        }\n\n        \/* CARDS *\/\n        .dash-card {\n            position: relative;\n            height: 170px;\n            border-radius: 18px;\n            text-decoration: none;\n            overflow: hidden;\n        }\n\n        .dash-card::before {\n            content: \"\";\n            position: absolute;\n            inset: -60%;\n            background: conic-gradient(\n                from 180deg,\n                #7a00ff,\n                #ff00d4,\n                #00d4ff,\n                #7a00ff\n            );\n            animation: spin 8s linear infinite;\n            filter: blur(14px);\n            opacity: 0.4;\n        }\n\n        .dash-card::after {\n            content: \"\";\n            position: absolute;\n            inset: 0;\n            background: rgba(0,0,0,0.65);\n        }\n\n        .dash-content {\n            position: relative;\n            z-index: 2;\n            height: 100%;\n            display: flex;\n            flex-direction: column;\n            align-items: center;\n            justify-content: center;\n        }\n\n        .dash-icon {\n            font-size: 34px;\n            margin-bottom: 10px;\n            animation: float 3s ease-in-out infinite;\n        }\n\n        .dash-label {\n            color: #fff;\n            font-size: 18px;\n            font-weight: 800;\n        }\n\n        \/* ANIMATIONS *\/\n        @keyframes spin {\n            0% { transform: rotate(0deg); }\n            100% { transform: rotate(360deg); }\n        }\n\n        @keyframes float {\n            0%,100% { transform: translateY(0); }\n            50% { transform: translateY(-6px); }\n        }\n\n    <\/style>\n\n    <canvas id=\"mysticCanvas\"><\/canvas>\n\n    <div class=\"dash-wrap\">\n\n        <div class=\"dash-title\">Mystic Apps<\/div>\n        <div class=\"dash-subtitle\">ENTER THE MYSTIC PORTAL<\/div>\n\n        <div class=\"main-portal\" id=\"portal\" onclick=\"enterPortal()\">\n            <div class=\"portal-content\">\n                <div class=\"portal-title\">Mystic Apps<\/div>\n                <div class=\"portal-sub\">CLICK TO ENTER DIMENSION<\/div>\n            <\/div>\n        <\/div>\n\n        <div class=\"dash-container\" id=\"grid\">\n\n            <a class=\"dash-card\" href=\"\/mystic-tarot\">\n                <div class=\"dash-content\">\n                    <div class=\"dash-icon\">\ud83d\udd2e<\/div>\n                    <div class=\"dash-label\">Mystic Tarot<\/div>\n                <\/div>\n            <\/a>\n\n            <a class=\"dash-card\" href=\"\/pendulum\">\n                <div class=\"dash-content\">\n                    <div class=\"dash-icon\">\ud83e\uddff<\/div>\n                    <div class=\"dash-label\">Pendulum<\/div>\n                <\/div>\n            <\/a>\n\n            <a class=\"dash-card\" href=\"\/runes\">\n                <div class=\"dash-content\">\n                    <div class=\"dash-icon\">\u16b1<\/div>\n                    <div class=\"dash-label\">Runes<\/div>\n                <\/div>\n            <\/a>\n\n            <a class=\"dash-card\" href=\"\/zodiac\">\n                <div class=\"dash-content\">\n                    <div class=\"dash-icon\">\u2648<\/div>\n                    <div class=\"dash-label\">Zodiac<\/div>\n                <\/div>\n            <\/a>\n\n            <a class=\"dash-card\" href=\"\/astro-map\">\n                <div class=\"dash-content\">\n                    <div class=\"dash-icon\">\ud83c\udf0c<\/div>\n                    <div class=\"dash-label\">Astro Map<\/div>\n                <\/div>\n            <\/a>\n\n            <a class=\"dash-card\" href=\"\/i-ching\">\n                <div class=\"dash-content\">\n                    <div class=\"dash-icon\">\u262f<\/div>\n                    <div class=\"dash-label\">I-Ching<\/div>\n                <\/div>\n            <\/a>\n\n        <\/div>\n\n    <\/div>\n\n    <script>\n        \/\/ PORTAL ZOOM + UNLOCK\n        function enterPortal() {\n            const portal = document.getElementById(\"portal\");\n            const grid = document.getElementById(\"grid\");\n\n            portal.classList.add(\"zoom-out\");\n\n            setTimeout(() => {\n                grid.classList.add(\"open\");\n            }, 700);\n        }\n\n        \/\/ PARTICLE CANVAS\n        const canvas = document.getElementById(\"mysticCanvas\");\n        const ctx = canvas.getContext(\"2d\");\n\n        canvas.width = window.innerWidth;\n        canvas.height = window.innerHeight;\n\n        let particles = [];\n\n        for (let i = 0; i < 120; i++) {\n            particles.push({\n                x: Math.random() * canvas.width,\n                y: Math.random() * canvas.height,\n                r: Math.random() * 2.2,\n                d: Math.random() * 1.5\n            });\n        }\n\n        function drawParticles() {\n            ctx.clearRect(0,0,canvas.width,canvas.height);\n            ctx.fillStyle = \"rgba(180,120,255,0.6)\";\n\n            particles.forEach(p => {\n                ctx.beginPath();\n                ctx.arc(p.x, p.y, p.r, 0, Math.PI * 2, true);\n                ctx.fill();\n            });\n\n            updateParticles();\n        }\n\n        function updateParticles() {\n            particles.forEach(p => {\n                p.y -= p.d;\n                if (p.y < 0) {\n                    p.y = canvas.height;\n                    p.x = Math.random() * canvas.width;\n                }\n            });\n        }\n\n        setInterval(drawParticles, 33);\n    <\/script>\n\n    <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-6558b17 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no e-con e-child\" data-id=\"6558b17\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3d0ae52 elementor-widget elementor-widget-shortcode\" data-id=\"3d0ae52\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\">\n    <style>\n        body {\n            margin: 0;\n            background: #05050a;\n            overflow-x: hidden;\n        }\n\n        \/* FULL SCREEN CANVAS BACKGROUND *\/\n        #mysticCanvas {\n            position: fixed;\n            top: 0;\n            left: 0;\n            width: 100%;\n            height: 100%;\n            z-index: 0;\n        }\n\n        .dash-wrap {\n            position: relative;\n            z-index: 2;\n            padding: 60px 20px;\n            display: flex;\n            flex-direction: column;\n            align-items: center;\n            gap: 25px;\n            perspective: 1200px;\n        }\n\n        .dash-title {\n            color: #fff;\n            font-size: 30px;\n            font-weight: 900;\n            letter-spacing: 3px;\n            text-shadow: 0 0 25px rgba(255,255,255,0.25);\n        }\n\n        .dash-subtitle {\n            color: #aaa;\n            font-size: 12px;\n            letter-spacing: 3px;\n        }\n\n        \/* PORTAL *\/\n        .main-portal {\n            width: 340px;\n            height: 200px;\n            border-radius: 22px;\n            cursor: pointer;\n            position: relative;\n            overflow: hidden;\n            transform-style: preserve-3d;\n            transition: transform 0.8s ease, opacity 0.8s ease;\n        }\n\n        .main-portal::before {\n            content: \"\";\n            position: absolute;\n            inset: -80%;\n            background: conic-gradient(\n                from 180deg,\n                #7a00ff,\n                #ff00d4,\n                #00d4ff,\n                #7a00ff\n            );\n            filter: blur(20px);\n            animation: spin 7s linear infinite;\n            opacity: 0.6;\n        }\n\n        .main-portal::after {\n            content: \"\";\n            position: absolute;\n            inset: 0;\n            background: radial-gradient(circle at center,\n                rgba(0,0,0,0.2),\n                rgba(0,0,0,0.9)\n            );\n        }\n\n        .portal-content {\n            position: relative;\n            z-index: 2;\n            height: 100%;\n            display: flex;\n            flex-direction: column;\n            align-items: center;\n            justify-content: center;\n        }\n\n        .portal-title {\n            color: #fff;\n            font-size: 22px;\n            font-weight: 900;\n        }\n\n        .portal-sub {\n            color: #aaa;\n            font-size: 12px;\n            margin-top: 6px;\n        }\n\n        \/* ZOOM EFFECT *\/\n        .zoom-out {\n            transform: scale(2.5);\n            opacity: 0;\n        }\n\n        \/* GRID *\/\n        .dash-container {\n            display: grid;\n            grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));\n            gap: 22px;\n            width: 100%;\n            max-width: 1100px;\n\n            max-height: 0;\n            opacity: 0;\n            overflow: hidden;\n            transform: translateY(40px);\n            transition: all 1s ease;\n        }\n\n        .dash-container.open {\n            max-height: 1200px;\n            opacity: 1;\n            transform: translateY(0);\n        }\n\n        \/* CARDS *\/\n        .dash-card {\n            position: relative;\n            height: 170px;\n            border-radius: 18px;\n            text-decoration: none;\n            overflow: hidden;\n        }\n\n        .dash-card::before {\n            content: \"\";\n            position: absolute;\n            inset: -60%;\n            background: conic-gradient(\n                from 180deg,\n                #7a00ff,\n                #ff00d4,\n                #00d4ff,\n                #7a00ff\n            );\n            animation: spin 8s linear infinite;\n            filter: blur(14px);\n            opacity: 0.4;\n        }\n\n        .dash-card::after {\n            content: \"\";\n            position: absolute;\n            inset: 0;\n            background: rgba(0,0,0,0.65);\n        }\n\n        .dash-content {\n            position: relative;\n            z-index: 2;\n            height: 100%;\n            display: flex;\n            flex-direction: column;\n            align-items: center;\n            justify-content: center;\n        }\n\n        .dash-icon {\n            font-size: 34px;\n            margin-bottom: 10px;\n            animation: float 3s ease-in-out infinite;\n        }\n\n        .dash-label {\n            color: #fff;\n            font-size: 18px;\n            font-weight: 800;\n        }\n\n        \/* ANIMATIONS *\/\n        @keyframes spin {\n            0% { transform: rotate(0deg); }\n            100% { transform: rotate(360deg); }\n        }\n\n        @keyframes float {\n            0%,100% { transform: translateY(0); }\n            50% { transform: translateY(-6px); }\n        }\n\n    <\/style>\n\n    <canvas id=\"mysticCanvas\"><\/canvas>\n\n    <div class=\"dash-wrap\">\n\n        <div class=\"dash-title\">Mystic Apps<\/div>\n        <div class=\"dash-subtitle\">ENTER THE MYSTIC PORTAL<\/div>\n\n        <div class=\"main-portal\" id=\"portal\" onclick=\"enterPortal()\">\n            <div class=\"portal-content\">\n                <div class=\"portal-title\">Mystic Apps<\/div>\n                <div class=\"portal-sub\">CLICK TO ENTER DIMENSION<\/div>\n            <\/div>\n        <\/div>\n\n        <div class=\"dash-container\" id=\"grid\">\n\n            <a class=\"dash-card\" href=\"\/mystic-tarot\">\n                <div class=\"dash-content\">\n                    <div class=\"dash-icon\">\ud83d\udd2e<\/div>\n                    <div class=\"dash-label\">Mystic Tarot<\/div>\n                <\/div>\n            <\/a>\n\n            <a class=\"dash-card\" href=\"\/pendulum\">\n                <div class=\"dash-content\">\n                    <div class=\"dash-icon\">\ud83e\uddff<\/div>\n                    <div class=\"dash-label\">Pendulum<\/div>\n                <\/div>\n            <\/a>\n\n            <a class=\"dash-card\" href=\"\/runes\">\n                <div class=\"dash-content\">\n                    <div class=\"dash-icon\">\u16b1<\/div>\n                    <div class=\"dash-label\">Runes<\/div>\n                <\/div>\n            <\/a>\n\n            <a class=\"dash-card\" href=\"\/zodiac\">\n                <div class=\"dash-content\">\n                    <div class=\"dash-icon\">\u2648<\/div>\n                    <div class=\"dash-label\">Zodiac<\/div>\n                <\/div>\n            <\/a>\n\n            <a class=\"dash-card\" href=\"\/astro-map\">\n                <div class=\"dash-content\">\n                    <div class=\"dash-icon\">\ud83c\udf0c<\/div>\n                    <div class=\"dash-label\">Astro Map<\/div>\n                <\/div>\n            <\/a>\n\n            <a class=\"dash-card\" href=\"\/i-ching\">\n                <div class=\"dash-content\">\n                    <div class=\"dash-icon\">\u262f<\/div>\n                    <div class=\"dash-label\">I-Ching<\/div>\n                <\/div>\n            <\/a>\n\n        <\/div>\n\n    <\/div>\n\n    <script>\n        \/\/ PORTAL ZOOM + UNLOCK\n        function enterPortal() {\n            const portal = document.getElementById(\"portal\");\n            const grid = document.getElementById(\"grid\");\n\n            portal.classList.add(\"zoom-out\");\n\n            setTimeout(() => {\n                grid.classList.add(\"open\");\n            }, 700);\n        }\n\n        \/\/ PARTICLE CANVAS\n        const canvas = document.getElementById(\"mysticCanvas\");\n        const ctx = canvas.getContext(\"2d\");\n\n        canvas.width = window.innerWidth;\n        canvas.height = window.innerHeight;\n\n        let particles = [];\n\n        for (let i = 0; i < 120; i++) {\n            particles.push({\n                x: Math.random() * canvas.width,\n                y: Math.random() * canvas.height,\n                r: Math.random() * 2.2,\n                d: Math.random() * 1.5\n            });\n        }\n\n        function drawParticles() {\n            ctx.clearRect(0,0,canvas.width,canvas.height);\n            ctx.fillStyle = \"rgba(180,120,255,0.6)\";\n\n            particles.forEach(p => {\n                ctx.beginPath();\n                ctx.arc(p.x, p.y, p.r, 0, Math.PI * 2, true);\n                ctx.fill();\n            });\n\n            updateParticles();\n        }\n\n        function updateParticles() {\n            particles.forEach(p => {\n                p.y -= p.d;\n                if (p.y < 0) {\n                    p.y = canvas.height;\n                    p.x = Math.random() * canvas.width;\n                }\n            });\n        }\n\n        setInterval(drawParticles, 33);\n    <\/script>\n\n    <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-72c9e87 e-con-full e-flex wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no e-con e-child\" data-id=\"72c9e87\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1b8c0ad elementor-widget elementor-widget-shortcode\" data-id=\"1b8c0ad\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\">\n    <style>\n        body {\n            margin: 0;\n            background: #05050a;\n            overflow-x: hidden;\n        }\n\n        \/* FULL SCREEN CANVAS BACKGROUND *\/\n        #mysticCanvas {\n            position: fixed;\n            top: 0;\n            left: 0;\n            width: 100%;\n            height: 100%;\n            z-index: 0;\n        }\n\n        .dash-wrap {\n            position: relative;\n            z-index: 2;\n            padding: 60px 20px;\n            display: flex;\n            flex-direction: column;\n            align-items: center;\n            gap: 25px;\n            perspective: 1200px;\n        }\n\n        .dash-title {\n            color: #fff;\n            font-size: 30px;\n            font-weight: 900;\n            letter-spacing: 3px;\n            text-shadow: 0 0 25px rgba(255,255,255,0.25);\n        }\n\n        .dash-subtitle {\n            color: #aaa;\n            font-size: 12px;\n            letter-spacing: 3px;\n        }\n\n        \/* PORTAL *\/\n        .main-portal {\n            width: 340px;\n            height: 200px;\n            border-radius: 22px;\n            cursor: pointer;\n            position: relative;\n            overflow: hidden;\n            transform-style: preserve-3d;\n            transition: transform 0.8s ease, opacity 0.8s ease;\n        }\n\n        .main-portal::before {\n            content: \"\";\n            position: absolute;\n            inset: -80%;\n            background: conic-gradient(\n                from 180deg,\n                #7a00ff,\n                #ff00d4,\n                #00d4ff,\n                #7a00ff\n            );\n            filter: blur(20px);\n            animation: spin 7s linear infinite;\n            opacity: 0.6;\n        }\n\n        .main-portal::after {\n            content: \"\";\n            position: absolute;\n            inset: 0;\n            background: radial-gradient(circle at center,\n                rgba(0,0,0,0.2),\n                rgba(0,0,0,0.9)\n            );\n        }\n\n        .portal-content {\n            position: relative;\n            z-index: 2;\n            height: 100%;\n            display: flex;\n            flex-direction: column;\n            align-items: center;\n            justify-content: center;\n        }\n\n        .portal-title {\n            color: #fff;\n            font-size: 22px;\n            font-weight: 900;\n        }\n\n        .portal-sub {\n            color: #aaa;\n            font-size: 12px;\n            margin-top: 6px;\n        }\n\n        \/* ZOOM EFFECT *\/\n        .zoom-out {\n            transform: scale(2.5);\n            opacity: 0;\n        }\n\n        \/* GRID *\/\n        .dash-container {\n            display: grid;\n            grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));\n            gap: 22px;\n            width: 100%;\n            max-width: 1100px;\n\n            max-height: 0;\n            opacity: 0;\n            overflow: hidden;\n            transform: translateY(40px);\n            transition: all 1s ease;\n        }\n\n        .dash-container.open {\n            max-height: 1200px;\n            opacity: 1;\n            transform: translateY(0);\n        }\n\n        \/* CARDS *\/\n        .dash-card {\n            position: relative;\n            height: 170px;\n            border-radius: 18px;\n            text-decoration: none;\n            overflow: hidden;\n        }\n\n        .dash-card::before {\n            content: \"\";\n            position: absolute;\n            inset: -60%;\n            background: conic-gradient(\n                from 180deg,\n                #7a00ff,\n                #ff00d4,\n                #00d4ff,\n                #7a00ff\n            );\n            animation: spin 8s linear infinite;\n            filter: blur(14px);\n            opacity: 0.4;\n        }\n\n        .dash-card::after {\n            content: \"\";\n            position: absolute;\n            inset: 0;\n            background: rgba(0,0,0,0.65);\n        }\n\n        .dash-content {\n            position: relative;\n            z-index: 2;\n            height: 100%;\n            display: flex;\n            flex-direction: column;\n            align-items: center;\n            justify-content: center;\n        }\n\n        .dash-icon {\n            font-size: 34px;\n            margin-bottom: 10px;\n            animation: float 3s ease-in-out infinite;\n        }\n\n        .dash-label {\n            color: #fff;\n            font-size: 18px;\n            font-weight: 800;\n        }\n\n        \/* ANIMATIONS *\/\n        @keyframes spin {\n            0% { transform: rotate(0deg); }\n            100% { transform: rotate(360deg); }\n        }\n\n        @keyframes float {\n            0%,100% { transform: translateY(0); }\n            50% { transform: translateY(-6px); }\n        }\n\n    <\/style>\n\n    <canvas id=\"mysticCanvas\"><\/canvas>\n\n    <div class=\"dash-wrap\">\n\n        <div class=\"dash-title\">Mystic Apps<\/div>\n        <div class=\"dash-subtitle\">ENTER THE MYSTIC PORTAL<\/div>\n\n        <div class=\"main-portal\" id=\"portal\" onclick=\"enterPortal()\">\n            <div class=\"portal-content\">\n                <div class=\"portal-title\">Mystic Apps<\/div>\n                <div class=\"portal-sub\">CLICK TO ENTER DIMENSION<\/div>\n            <\/div>\n        <\/div>\n\n        <div class=\"dash-container\" id=\"grid\">\n\n            <a class=\"dash-card\" href=\"\/mystic-tarot\">\n                <div class=\"dash-content\">\n                    <div class=\"dash-icon\">\ud83d\udd2e<\/div>\n                    <div class=\"dash-label\">Mystic Tarot<\/div>\n                <\/div>\n            <\/a>\n\n            <a class=\"dash-card\" href=\"\/pendulum\">\n                <div class=\"dash-content\">\n                    <div class=\"dash-icon\">\ud83e\uddff<\/div>\n                    <div class=\"dash-label\">Pendulum<\/div>\n                <\/div>\n            <\/a>\n\n            <a class=\"dash-card\" href=\"\/runes\">\n                <div class=\"dash-content\">\n                    <div class=\"dash-icon\">\u16b1<\/div>\n                    <div class=\"dash-label\">Runes<\/div>\n                <\/div>\n            <\/a>\n\n            <a class=\"dash-card\" href=\"\/zodiac\">\n                <div class=\"dash-content\">\n                    <div class=\"dash-icon\">\u2648<\/div>\n                    <div class=\"dash-label\">Zodiac<\/div>\n                <\/div>\n            <\/a>\n\n            <a class=\"dash-card\" href=\"\/astro-map\">\n                <div class=\"dash-content\">\n                    <div class=\"dash-icon\">\ud83c\udf0c<\/div>\n                    <div class=\"dash-label\">Astro Map<\/div>\n                <\/div>\n            <\/a>\n\n            <a class=\"dash-card\" href=\"\/i-ching\">\n                <div class=\"dash-content\">\n                    <div class=\"dash-icon\">\u262f<\/div>\n                    <div class=\"dash-label\">I-Ching<\/div>\n                <\/div>\n            <\/a>\n\n        <\/div>\n\n    <\/div>\n\n    <script>\n        \/\/ PORTAL ZOOM + UNLOCK\n        function enterPortal() {\n            const portal = document.getElementById(\"portal\");\n            const grid = document.getElementById(\"grid\");\n\n            portal.classList.add(\"zoom-out\");\n\n            setTimeout(() => {\n                grid.classList.add(\"open\");\n            }, 700);\n        }\n\n        \/\/ PARTICLE CANVAS\n        const canvas = document.getElementById(\"mysticCanvas\");\n        const ctx = canvas.getContext(\"2d\");\n\n        canvas.width = window.innerWidth;\n        canvas.height = window.innerHeight;\n\n        let particles = [];\n\n        for (let i = 0; i < 120; i++) {\n            particles.push({\n                x: Math.random() * canvas.width,\n                y: Math.random() * canvas.height,\n                r: Math.random() * 2.2,\n                d: Math.random() * 1.5\n            });\n        }\n\n        function drawParticles() {\n            ctx.clearRect(0,0,canvas.width,canvas.height);\n            ctx.fillStyle = \"rgba(180,120,255,0.6)\";\n\n            particles.forEach(p => {\n                ctx.beginPath();\n                ctx.arc(p.x, p.y, p.r, 0, Math.PI * 2, true);\n                ctx.fill();\n            });\n\n            updateParticles();\n        }\n\n        function updateParticles() {\n            particles.forEach(p => {\n                p.y -= p.d;\n                if (p.y < 0) {\n                    p.y = canvas.height;\n                    p.x = Math.random() * canvas.width;\n                }\n            });\n        }\n\n        setInterval(drawParticles, 33);\n    <\/script>\n\n    <\/div>\n\t\t\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-3c81a5b elementor-hidden-mobile e-flex e-con-boxed wpr-particle-no wpr-jarallax-no wpr-parallax-no wpr-sticky-section-no e-con e-parent\" data-id=\"3c81a5b\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b4fe4d1 elementor-widget elementor-widget-spacer\" data-id=\"b4fe4d1\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\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":"","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-1367","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/app.digitalfreelancer.org\/index.php\/wp-json\/wp\/v2\/pages\/1367","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/app.digitalfreelancer.org\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/app.digitalfreelancer.org\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/app.digitalfreelancer.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/app.digitalfreelancer.org\/index.php\/wp-json\/wp\/v2\/comments?post=1367"}],"version-history":[{"count":15,"href":"https:\/\/app.digitalfreelancer.org\/index.php\/wp-json\/wp\/v2\/pages\/1367\/revisions"}],"predecessor-version":[{"id":1672,"href":"https:\/\/app.digitalfreelancer.org\/index.php\/wp-json\/wp\/v2\/pages\/1367\/revisions\/1672"}],"wp:attachment":[{"href":"https:\/\/app.digitalfreelancer.org\/index.php\/wp-json\/wp\/v2\/media?parent=1367"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}