{"id":382,"date":"2025-06-04T20:06:36","date_gmt":"2025-06-04T20:06:36","guid":{"rendered":"https:\/\/p36.9c9.mytemp.website\/GGG\/?page_id=382"},"modified":"2026-03-30T21:17:19","modified_gmt":"2026-03-30T21:17:19","slug":"gods-galaxy-game","status":"publish","type":"page","link":"https:\/\/godsgalaxygame.com\/GGG\/","title":{"rendered":"Gods Galaxy Game"},"content":{"rendered":"\n<!-- ==========================================================\n  GODS GALAXY GAME \u2014 BLOCK 1\n  Typewriter (Plain Text) + Animated Starfield\n  ========================================================== -->\n<div id=\"gggTypewriterOverlay\" aria-live=\"polite\">\n  <!-- Star layers -->\n  <canvas id=\"gggStarsBack\"><\/canvas>\n  <canvas id=\"gggStarsFront\"><\/canvas>\n  <canvas id=\"gggComets\"><\/canvas>\n\n  <!-- Typewriter text (left-aligned, centered column) -->\n  <div class=\"ggg-tw-wrap\">\n    <div class=\"ggg-tw-inner\">\n      <div class=\"ggg-tw-text\" id=\"gggTypewriterText\"><\/div>\n      <span class=\"ggg-tw-cursor\" aria-hidden=\"true\">\u258c<\/span>\n    <\/div>\n  <\/div>\n\n  <!-- Small \u201cnext\u201d arrow -->\n  <button class=\"ggg-next-hint\" type=\"button\" aria-label=\"Next\">\n    <svg viewBox=\"0 0 24 24\" width=\"18\" height=\"18\" aria-hidden=\"true\">\n      <path d=\"M9 6l6 6-6 6\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\n    <\/svg>\n  <\/button>\n<\/div>\n\n<style>\n  \/* Overlay base *\/\n  #gggTypewriterOverlay{\n    position:fixed; inset:0; background:#000; color:#fff; overflow:hidden;\n    z-index:99999; opacity:1; visibility:visible; transition:opacity .6s ease, visibility .6s ease;\n  }\n  #gggTypewriterOverlay.ggg-hide{ opacity:0; visibility:hidden; pointer-events:none; }\n\n  \/* Background canvases *\/\n  #gggStarsBack, #gggStarsFront, #gggComets{\n    position:absolute; inset:0; width:100%; height:100%; display:block;\n  }\n  #gggStarsBack{ z-index:0; } #gggStarsFront{ z-index:1; } #gggComets{ z-index:2; }\n\n  \/* Centered column; readable on all screens *\/\n  .ggg-tw-wrap{\n    position:relative; z-index:3;\n    display:flex; align-items:center; justify-content:center;\n    width:100%; height:100%;\n    padding: max(16px, 5vw);\n    padding-left: calc(max(16px, 5vw) + env(safe-area-inset-left,0px));\n    padding-right: calc(max(16px, 5vw) + env(safe-area-inset-right,0px));\n    box-sizing: border-box;\n  }\n  .ggg-tw-inner{\n    width: min(100%, 900px);          \/* comfortable line length on desktop *\/\n    max-height: 80vh;                 \/* never overflow vertically on phones *\/\n    overflow: hidden;\n    text-align: left;                 \/* easier to read than centered blocks *\/\n    line-height: 1.45;                \/* a bit more breathing room *\/\n    filter: drop-shadow(0 0 14px rgba(0,0,0,.6)); \/* subtle contrast over stars *\/\n  }\n\n  \/* Plain text, responsive sizing (no spans inside) *\/\n  .ggg-tw-text{\n    font-size: clamp(16px, 2.2vw, 28px);\n    letter-spacing: .2px;\n    color: #eaf4ff;                   \/* solid color for clarity *\/\n  }\n  .ggg-tw-cursor{\n    display:inline-block; margin-left:.25ch; font-weight:700; opacity:.9;\n    animation: gggBlink .9s steps(1,end) infinite;\n  }\n  @keyframes gggBlink{ 50%{ opacity:0 } }\n\n  \/* Short screens (landscape phones, etc.) *\/\n  @media (max-height: 560px){\n    .ggg-tw-text{ font-size: clamp(15px, 3.6vw, 20px); }\n  }\n\n  \/* Next arrow *\/\n  .ggg-next-hint{\n    position:absolute; right:max(12px, 3vw); top:50%; transform: translateY(-50%);\n    z-index:3; width:42px; height:42px; border-radius:50%;\n    border:1px solid rgba(255,255,255,.25); background:rgba(0,0,0,.35); color:#eaf6ff;\n    display:grid; place-items:center; cursor:pointer;\n    box-shadow:0 0 14px rgba(0,0,0,.5);\n    transition: transform .15s ease, background .2s ease;\n  }\n  .ggg-next-hint:hover{ background: rgba(255,255,255,.12); }\n  .ggg-next-hint:active{ transform: translateY(-50%) scale(.97); }\n<\/style>\n\n<script>\n(()=>{\n  \/* ===== Typewriter config (slower for readability) ===== *\/\n  const TYPE_SPEED_MS = 38;       \/\/ per-character delay\n  const COMMA_PAUSE_MS = 170;     \/\/ slight pause on commas\n  const PERIOD_PAUSE_MS = 320;    \/\/ pause on ., \u2014, !, ?\n  const AFTER_FINISH_DELAY_MS = 5000; \/\/ 5s hold before auto-next\n\n  \/* Plain text only \u2014 no <span> inside *\/\n  const LINES = [\n   \n    \"Welcome to Gods Galaxy Game.\",\n  \"An interactive universe of travel, experiences, investments, and exclusive memberships.\",\n  \"Each level unlocks new services, opportunities, and personalized journeys.\",\n  \"Choose your path. Build your future. Expand your galaxy.\",\n  \"\u2728 Begin the experience.\"\n  ];\n  const FULL_TEXT = LINES.join(\"\\n\\n\"); \/\/ blank lines between paragraphs\n\n  const overlay = document.getElementById('gggTypewriterOverlay');\n  const textEl  = document.getElementById('gggTypewriterText');\n  const nextBtn = overlay.querySelector('.ggg-next-hint');\n\n  let i = 0;\n  function pauseFor(ch){\n    if (ch === ',') return COMMA_PAUSE_MS;\n    if ('.\u2014!?'.includes(ch)) return PERIOD_PAUSE_MS;\n    return 0;\n  }\n\n  function typeNext(){\n    if (i >= FULL_TEXT.length){\n      setTimeout(goNext, AFTER_FINISH_DELAY_MS);\n      return;\n    }\n    const ch = FULL_TEXT[i++];\n    if (ch === '\\n'){            \/\/ render line breaks\n      textEl.innerHTML += '<br>';\n    } else {\n      textEl.innerHTML += ch;\n    }\n    setTimeout(typeNext, TYPE_SPEED_MS + pauseFor(ch));\n  }\n\n  function goNext(){\n    overlay.classList.add('ggg-hide');\n    setTimeout(()=>overlay.remove(), 700);\n    \/\/ Show Block 3 (first slide) if present\n    const flow = document.querySelector('#gggIntroFlow');\n    if (flow){\n      const slides = Array.from(flow.querySelectorAll('.ggg-slide'));\n      slides.forEach((s,k)=> s.setAttribute('aria-hidden', String(k!==0)));\n      flow.scrollIntoView({behavior:'smooth', block:'start'});\n    }\n  }\n\n  \/\/ Click anywhere or the arrow = next\n  overlay.addEventListener('click', (e)=>{\n    if (e.target.closest('.ggg-next-hint')) return;\n    goNext();\n  });\n  nextBtn.addEventListener('click', (e)=>{ e.stopPropagation(); goNext(); });\n  document.addEventListener('keydown', (e)=>{\n    if ([' ', 'Enter', 'ArrowRight'].includes(e.key)) goNext();\n  });\n\n  if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', typeNext);\n  else typeNext();\n\n  \/* ===== Starfield: two parallax layers ===== *\/\n  const layers = [\n    { id:'gggStarsBack',  density: 1\/7500, speed: 0.03, sizeMin:0.6, sizeMax:1.2, twinkle:0.22 },\n    { id:'gggStarsFront', density: 1\/3500, speed: 0.08, sizeMin:0.9, sizeMax:1.8, twinkle:0.40 }\n  ];\n  function makeLayer(conf){\n    const cvs = document.getElementById(conf.id);\n    const ctx = cvs.getContext('2d', { alpha:true });\n    let w=0,h=0,dpr=1,stars=[],t=0;\n\n    function resize(){\n      dpr = Math.min(2, window.devicePixelRatio||1);\n      w = cvs.width  = Math.floor(window.innerWidth  * dpr);\n      h = cvs.height = Math.floor(window.innerHeight * dpr);\n      const count = Math.floor(window.innerWidth * window.innerHeight * conf.density);\n      stars = new Array(count).fill(0).map(()=>({\n        x: Math.random()*w,\n        y: Math.random()*h,\n        r: (Math.random()*(conf.sizeMax-conf.sizeMin)+conf.sizeMin) * dpr,\n        baseA: Math.random()*0.5 + 0.25,\n        tw: Math.random()*conf.twinkle + 0.1,\n        phase: Math.random()*Math.PI*2\n      }));\n    }\n    function draw(){\n      t += 1;\n      ctx.clearRect(0,0,w,h);\n      for (const s of stars){\n        s.y += conf.speed * dpr;\n        if (s.y > h){ s.y = -5; s.x = Math.random()*w; }\n        const pulse = (Math.sin(s.phase + t*0.02) + 1)\/2;\n        ctx.globalAlpha = Math.max(0, Math.min(1, s.baseA + s.tw*(pulse-0.5)));\n        ctx.beginPath(); ctx.arc(s.x, s.y, s.r, 0, Math.PI*2); ctx.fillStyle = '#fff'; ctx.fill();\n      }\n      requestAnimationFrame(draw);\n    }\n    window.addEventListener('resize', resize);\n    resize(); draw();\n  }\n  layers.forEach(makeLayer);\n\n  \/* ===== Comets (shooting stars) ===== *\/\n  const cometCanvas = document.getElementById('gggComets');\n  const cctx = cometCanvas.getContext('2d', { alpha:true });\n  let cw=0,ch=0,cdpr=1,comets=[];\n\n  function resizeComets(){\n    cdpr = Math.min(2, window.devicePixelRatio||1);\n    cw = cometCanvas.width  = Math.floor(window.innerWidth  * cdpr);\n    ch = cometCanvas.height = Math.floor(window.innerHeight * cdpr);\n  }\n  function spawnComet(){\n    const x = Math.random()*cw*0.5, y = -50;\n    const speed = (Math.random()*2 + 2) * cdpr;\n    const len   = Math.random()*120 + 80;\n    const ang   = Math.PI\/3.2; \/\/ ~56\u00b0\n    comets.push({ x, y, vx:Math.cos(ang)*speed, vy:Math.sin(ang)*speed, life:0, lifeMax:120+Math.random()*80, len });\n  }\n  function drawComets(){\n    cctx.clearRect(0,0,cw,ch);\n    if (Math.random() < 0.012) spawnComet();\n    for (let i=comets.length-1; i>=0; i--){\n      const c = comets[i]; c.life++; c.x += c.vx; c.y += c.vy;\n      const tx = c.x - c.vx*(c.len\/10), ty = c.y - c.vy*(c.len\/10);\n      const g = cctx.createLinearGradient(c.x,c.y,tx,ty);\n      g.addColorStop(0,'rgba(255,255,255,0.9)');\n      g.addColorStop(1,'rgba(255,255,255,0)');\n      cctx.strokeStyle = g; cctx.lineWidth = 2*cdpr;\n      cctx.beginPath(); cctx.moveTo(c.x,c.y); cctx.lineTo(tx,ty); cctx.stroke();\n      if (c.life > c.lifeMax || c.x > cw+100 || c.y > ch+100) comets.splice(i,1);\n    }\n    requestAnimationFrame(drawComets);\n  }\n  window.addEventListener('resize', resizeComets);\n  resizeComets(); drawComets();\n})();\n<\/script>\n\n\n\n<!-- ==========================================================\n  BLOCK 3 \u2014 Full-Screen Hero (centered) + NEXT\/PLAY + Slides\n  ========================================================== -->\n<section id=\"gggIntroFlow\" aria-live=\"polite\">\n\n  <!-- Full-bleed stage (self-contained) -->\n  <div class=\"gggStage\">\n    <!-- ===== Slide 1: Title only ===== -->\n    <div class=\"gggSlide gggWelcome\" data-slide=\"1\" aria-hidden=\"false\" aria-label=\"Welcome\">\n      <!-- starfield -->\n      <canvas class=\"gggStarsBack\"><\/canvas>\n      <canvas class=\"gggStarsFront\"><\/canvas>\n      <canvas class=\"gggComets\"><\/canvas>\n\n      <div class=\"gggCenter\">\n        <h1 class=\"gggTitle\" data-text=\"GODS GALAXY GAME\">GODS GALAXY GAME<\/h1>\n        <div class=\"gggActions\">\n          <button class=\"gggBtn gggNextBtn\" type=\"button\" title=\"Next\">NEXT<\/button>\n\n          <!-- PLAY (hard-wired to start video\/audio) -->\n          <a\n            id=\"gggPlayLink\"\n            class=\"gggBtn gggPlayBtn\"\n            href=\"#gggIntroVideo\"\n            role=\"button\"\n            title=\"Play intro\"\n            aria-label=\"Play intro\"\n            onclick=\"return kickGGG();\"\n          >PLAY<\/a>\n        <\/div>\n      <\/div>\n    <\/div>\n\n    <!-- ===== Slides 2\u201312: Images ===== -->\n    <div class=\"gggSlide\" data-slide=\"2\" aria-hidden=\"true\" aria-label=\"Choose a city\">\n      <img decoding=\"async\" src=\"https:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/10\/Screenshot_20251014_091702_PowerPoint.jpg\" alt=\"Choose your city\" draggable=\"false\">\n    <\/div>\n\n    <div class=\"gggSlide\" data-slide=\"3\" aria-hidden=\"true\" aria-label=\"Explore all levels\">\n      <img decoding=\"async\" src=\"https:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/10\/Screenshot_20251014_091711_PowerPoint.jpg\" alt=\"Explore all game levels\" draggable=\"false\">\n    <\/div>\n\n    <div class=\"gggSlide\" data-slide=\"4\" aria-hidden=\"true\" aria-label=\"Slide 4\">\n      <img decoding=\"async\" src=\"https:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/10\/Screenshot_20251014_091138_PowerPoint.jpg\" alt=\"Feature highlight 1\" draggable=\"false\">\n    <\/div>\n\n    <div class=\"gggSlide\" data-slide=\"5\" aria-hidden=\"true\" aria-label=\"Slide 5\">\n      <img decoding=\"async\" src=\"https:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/10\/Screenshot_20251014_091148_PowerPoint.jpg\" alt=\"Feature highlight 2\" draggable=\"false\">\n    <\/div>\n\n    <div class=\"gggSlide\" data-slide=\"6\" aria-hidden=\"true\" aria-label=\"Slide 6\">\n      <img decoding=\"async\" src=\"https:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/10\/Screenshot_20251014_091200_PowerPoint.jpg\" alt=\"Feature highlight 3\" draggable=\"false\">\n    <\/div>\n\n    <div class=\"gggSlide\" data-slide=\"7\" aria-hidden=\"true\" aria-label=\"Slide 7\">\n      <img decoding=\"async\" src=\"https:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/10\/Screenshot_20251014_091211_PowerPoint.jpg\" alt=\"Feature highlight 4\" draggable=\"false\">\n    <\/div>\n\n    <div class=\"gggSlide\" data-slide=\"8\" aria-hidden=\"true\" aria-label=\"Slide 8\">\n      <img decoding=\"async\" src=\"https:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/10\/Screenshot_20251014_091222_PowerPoint.jpg\" alt=\"Feature highlight 5\" draggable=\"false\">\n    <\/div>\n\n    <div class=\"gggSlide\" data-slide=\"9\" aria-hidden=\"true\" aria-label=\"Slide 9\">\n      <img decoding=\"async\" src=\"https:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/10\/Screenshot_20251014_091552_PowerPoint.jpg\" alt=\"Feature highlight 6\" draggable=\"false\">\n    <\/div>\n\n    <div class=\"gggSlide\" data-slide=\"10\" aria-hidden=\"true\" aria-label=\"Slide 10\">\n      <img decoding=\"async\" src=\"https:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/10\/Screenshot_20251014_091734_PowerPoint.jpg\" alt=\"Feature highlight 7\" draggable=\"false\">\n    <\/div>\n\n    <div class=\"gggSlide\" data-slide=\"11\" aria-hidden=\"true\" aria-label=\"Slide 11\">\n      <img decoding=\"async\" src=\"https:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/10\/Screenshot_20251014_091745_PowerPoint.jpg\" alt=\"Feature highlight 8\" draggable=\"false\">\n    <\/div>\n\n    <div class=\"gggSlide\" data-slide=\"12\" aria-hidden=\"true\" aria-label=\"Slide 12\">\n      <img decoding=\"async\" src=\"https:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/10\/Screenshot_20251014_091754_PowerPoint.jpg\" alt=\"Feature highlight 9\" draggable=\"false\">\n    <\/div>\n\n    <!-- Arrows (hidden on slide 1) -->\n    <button class=\"gggNav gggPrev\" aria-label=\"Previous slide\" title=\"Back\">\n      <svg viewBox=\"0 0 24 24\" width=\"18\" height=\"18\" aria-hidden=\"true\"><path d=\"M15 18l-6-6 6-6\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg>\n    <\/button>\n    <button class=\"gggNav gggNext\" aria-label=\"Next slide\" title=\"Next\">\n      <svg viewBox=\"0 0 24 24\" width=\"18\" height=\"18\" aria-hidden=\"true\"><path d=\"M9 6l6 6-6 6\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/><\/svg>\n    <\/button>\n  <\/div><!-- \/.gggStage -->\n<\/section>\n\n<style>\n\/* ======= FULL-BLEED STAGE (scoped) ======= *\/\n#gggIntroFlow{position:relative; background:#000;}\n#gggIntroFlow .gggStage{\n  position:relative;\n  width:100vw; height:100dvh;      \/* desktop + phones *\/\n  left:50%; margin-left:-50vw;     \/* center 100vw inside any WP container *\/\n  overflow:hidden; background:#000;\n}\n\n\/* ======= SLIDES ======= *\/\n#gggIntroFlow .gggSlide{\n  position:absolute; inset:0; display:grid; place-items:center;\n  opacity:0; visibility:hidden; transition:opacity .35s ease, visibility .35s ease;\n}\n#gggIntroFlow .gggSlide[aria-hidden=\"false\"]{opacity:1; visibility:visible;}\n\n\/* Images: fill bounds, never crop *\/\n#gggIntroFlow .gggSlide img{\n  width:100vw; height:100dvh; max-width:none; max-height:none;\n  object-fit:contain; object-position:center;\n  display:block; user-select:none; -webkit-user-drag:none;\n}\n\n\/* ======= WELCOME (centered) ======= *\/\n#gggIntroFlow .gggWelcome canvas{position:absolute; inset:0; width:100%; height:100%; display:block; pointer-events:none;} \/* don't block clicks *\/\n#gggIntroFlow .gggStarsBack{z-index:0;}\n#gggIntroFlow .gggStarsFront{z-index:1;}\n#gggIntroFlow .gggComets{z-index:2;}\n\n#gggIntroFlow .gggCenter{\n  position:relative; z-index:3; width:100%; height:100%;\n  display:flex; flex-direction:column; justify-content:center; align-items:center;\n  padding-inline:clamp(12px,4vw,28px); gap:clamp(12px,3vh,24px);\n}\n\n\/* Title animation (START HIDDEN & PAUSED) *\/\n#gggIntroFlow .gggTitle{\n  margin:0; text-align:center; line-height:1.02;\n  font-weight:800; letter-spacing:.08em;\n  font-size:clamp(36px,9vw,110px);\n  background:radial-gradient(120% 160% at 50% 0%, #e6f3ff 0%, #8fc5ff 35%, #7a5cff 65%, #1a1446 100%);\n  -webkit-background-clip:text; background-clip:text; color:transparent;\n  text-shadow:0 0 28px rgba(125,185,255,.35), 0 0 64px rgba(122,92,255,.25);\n  opacity:0;\n  animation:gggIn 1200ms ease-out forwards, gggSheen 5s linear infinite 1.2s, gggFloat 6s ease-in-out infinite 1.2s, gggGlow 3.5s ease-in-out infinite 1.2s;\n  animation-play-state: paused;\n  position:relative; will-change:transform,filter,text-shadow;\n}\n#gggIntroFlow .gggTitle.is-revealed{\n  opacity:1;\n  animation-play-state: running;\n}\n\n#gggIntroFlow .gggTitle::after{\n  content:attr(data-text); position:absolute; inset:0; pointer-events:none;\n  background:linear-gradient(115deg, transparent 35%, rgba(255,255,255,.7) 50%, transparent 65%);\n  -webkit-background-clip:text; background-clip:text; color:transparent; mix-blend-mode:screen;\n}\n@keyframes gggIn{0%{opacity:0;filter:blur(12px);letter-spacing:.2em;transform:translateY(24px) scale(.92)}60%{opacity:1;filter:blur(2px)}100%{opacity:1;filter:blur(0);letter-spacing:.08em;transform:translateY(0) scale(1)}}\n@keyframes gggSheen{0%{background-position:-200% 0}100%{background-position:200% 0}}\n@keyframes gggFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}\n@keyframes gggGlow{0%,100%{text-shadow:0 0 24px rgba(125,185,255,.32),0 0 48px rgba(122,92,255,.22)}50%{text-shadow:0 0 34px rgba(125,185,255,.48),0 0 72px rgba(122,92,255,.36)}}\n\n\/* Buttons *\/\n#gggIntroFlow .gggActions{display:flex; gap:clamp(10px,2.4vw,18px);}\n#gggIntroFlow .gggBtn,\n#gggIntroFlow .gggPlayBtn{\n  padding:10px 18px; border-radius:999px; border:1px solid rgba(255,255,255,.25);\n  background:rgba(0,0,0,.45); color:#eaf6ff;\n  font-size:clamp(14px,2.6vw,16px); letter-spacing:.4px; text-decoration:none;\n  box-shadow:0 0 16px rgba(0,0,0,.5), inset 0 0 0 1px rgba(255,255,255,.07);\n  cursor:pointer; transition:transform .15s ease, background .2s ease;\n}\n#gggIntroFlow .gggBtn:hover,\n#gggIntroFlow .gggPlayBtn:hover{background:rgba(255,255,255,.12);}\n#gggIntroFlow .gggBtn:active,\n#gggIntroFlow .gggPlayBtn:active{transform:scale(.97);}\n\n\/* Arrows (hidden on welcome) *\/\n#gggIntroFlow .gggNav{\n  position:absolute; top:50%; transform:translateY(-50%);\n  width:40px; height:40px; border-radius:999px; z-index:5;\n  display:grid; place-items:center; border:1px solid rgba(255,255,255,.25);\n  background:rgba(0,0,0,.45); color:#eaf6ff;\n  box-shadow:0 0 16px rgba(0,0,0,.5), inset 0 0 0 1px rgba(255,255,255,.07);\n  cursor:pointer;\n}\n#gggIntroFlow .gggPrev{left:clamp(10px,2.4vw,24px);}\n#gggIntroFlow .gggNext{right:clamp(10px,2.4vw,24px);}\n#gggIntroFlow[data-on-welcome=\"true\"] .gggNav{display:none;}\n<\/style>\n\n<script>\n(()=> {\n  const flow   = document.getElementById('gggIntroFlow');\n  const stage  = flow.querySelector('.gggStage');\n  const slides = Array.from(stage.querySelectorAll('.gggSlide'));\n\n  const nextArrow = stage.querySelector('.gggNext');\n  const prevArrow = stage.querySelector('.gggPrev');\n\n  const welcome = stage.querySelector('.gggWelcome');\n  const nextBtn = welcome.querySelector('.gggNextBtn');\n  const titleEl = welcome.querySelector('.gggTitle');\n\n  let index = 0; \/\/ start on the title\n  let titleShown = false;\n\n  function show(i){\n    index = (i + slides.length) % slides.length;\n    slides.forEach((s,k)=> s.setAttribute('aria-hidden', String(k !== index)));\n    flow.dataset.onWelcome = (index === 0) ? 'true' : 'false';\n  }\n  const next = ()=> show(index + 1);\n  const prev = ()=> show(index - 1);\n\n  \/\/ ----- TITLE REVEAL CONTROL -----\n  function revealTitleOnce(){\n    if (titleShown || !titleEl) return;\n    titleShown = true;\n    titleEl.classList.add('is-revealed'); \/\/ resumes animations + makes visible\n  }\n\n  \/\/ Reveal after typewriter finishes + 0 ms (immediate)\n  (function waitForTypewriter(){\n    const overlay = document.getElementById('gggTypewriterOverlay');\n    function startDelay(){ setTimeout(revealTitleOnce, 0); }\n    if (overlay){\n      if (overlay.classList.contains('ggg-hide')) { startDelay(); return; }\n      const mo = new MutationObserver((muts)=>{\n        for (const m of muts){\n          if (m.type === 'attributes' && m.attributeName === 'class'){\n            if (overlay.classList.contains('ggg-hide')) { mo.disconnect(); startDelay(); break; }\n          }\n          if (m.type === 'childList'){\n            if (!document.getElementById('gggTypewriterOverlay')) { mo.disconnect(); startDelay(); break; }\n          }\n        }\n      });\n      mo.observe(document.documentElement, { childList:true, subtree:true, attributes:true, attributeFilter:['class'] });\n    } else {\n      startDelay();\n    }\n  })();\n\n  \/\/ Reveal immediately if user clicks NEXT (or right arrow)\n  nextBtn.addEventListener('click', revealTitleOnce);\n  nextArrow.addEventListener('click', revealTitleOnce);\n\n  \/\/ ----- NAVIGATION -----\n  nextArrow.addEventListener('click', next);\n  prevArrow.addEventListener('click', prev);\n\n  nextBtn.addEventListener('click', ()=> show(1));\n\n  \/\/ Tap\/click to advance ONLY on slides 2\u201312\n  stage.addEventListener('click', (e)=>{\n    if (index === 0) return;\n    if (e.target.closest('.gggNav,button,svg,path')) return;\n    next();\n  });\n\n  \/\/ Keyboard on slides 2\u201312 (ignore while typing)\n  document.addEventListener('keydown', (e)=>{\n    if (index === 0) return;\n    const tag = document.activeElement?.tagName;\n    if (tag && \/INPUT|TEXTAREA|SELECT\/.test(tag)) return;\n    if (e.key === 'ArrowRight') next();\n    else if (e.key === 'ArrowLeft') prev();\n    else if (e.key === ' ' || e.key === 'Enter') next();\n  });\n\n  \/* ===== Starfield (welcome) ===== *\/\n  const backCvs   = welcome.querySelector('.gggStarsBack');\n  const frontCvs  = welcome.querySelector('.gggStarsFront');\n  const cometsCvs = welcome.querySelector('.gggComets');\n\n  function starsLayer(cvs, conf){\n    const ctx=cvs.getContext('2d',{alpha:true});\n    let w=0,h=0,dpr=1,stars=[],t=0;\n\n    function resize(){\n      dpr=Math.min(2, window.devicePixelRatio||1);\n      const cssW=stage.clientWidth, cssH=stage.clientHeight;\n      w=cvs.width=Math.floor(cssW*dpr); h=cvs.height=Math.floor(cssH*dpr);\n      const count=Math.floor(cssW*cssH*conf.density);\n      stars=new Array(count).fill(0).map(()=>({\n        x:Math.random()*w, y:Math.random()*h,\n        r:(Math.random()*(conf.sizeMax-conf.sizeMin)+conf.sizeMin)*dpr,\n        baseA:Math.random()*0.5+0.25, tw:Math.random()*conf.twinkle+0.1,\n        phase:Math.random()*Math.PI*2\n      }));\n    }\n    function draw(){\n      t+=1; ctx.clearRect(0,0,w,h);\n      for(const s of stars){\n        s.y += conf.speed*dpr; if(s.y>h){ s.y=-5; s.x=Math.random()*w; }\n        const pulse=(Math.sin(s.phase+t*0.02)+1)\/2;\n        ctx.globalAlpha=Math.max(0,Math.min(1,s.baseA+s.tw*(pulse-0.5)));\n        ctx.beginPath(); ctx.arc(s.x,s.y,s.r,0,Math.PI*2); ctx.fillStyle='#fff'; ctx.fill();\n      }\n      requestAnimationFrame(draw);\n    }\n    new ResizeObserver(resize).observe(stage);\n    resize(); draw();\n  }\n\n  function cometsLayer(cvs){\n    const ctx=cvs.getContext('2d',{alpha:true});\n    let w=0,h=0,dpr=1,comets=[];\n    function resize(){\n      dpr=Math.min(2,window.devicePixelRatio||1);\n      const cssW=stage.clientWidth, cssH=stage.clientHeight;\n      w=cvs.width=Math.floor(cssW*dpr); h=cvs.height=Math.floor(cssH*dpr);\n    }\n    function spawn(){\n      const x=Math.random()*w*0.5, y=-50;\n      const speed=(Math.random()*2+2)*dpr, len=Math.random()*120+80, ang=Math.PI\/3.2;\n      comets.push({x,y,vx:Math.cos(ang)*speed, vy:Math.sin(ang)*speed, life:0, lifeMax:120+Math.random()*80, len});\n    }\n    function draw(){\n      ctx.clearRect(0,0,w,h);\n      if(Math.random()<0.012) spawn();\n      for(let i=comets.length-1;i>=0;i--){\n        const c=comets[i]; c.life++; c.x+=c.vx; c.y+=c.vy;\n        const tx=c.x-c.vx*(c.len\/10), ty=c.y-c.vy*(c.len\/10);\n        const g=ctx.createLinearGradient(c.x,c.y,tx,ty);\n        g.addColorStop(0,'rgba(255,255,255,0.9)'); g.addColorStop(1,'rgba(255,255,255,0)');\n        ctx.strokeStyle=g; ctx.lineWidth=2*dpr;\n        ctx.beginPath(); ctx.moveTo(c.x,c.y); ctx.lineTo(tx,ty); ctx.stroke();\n        if(c.life>c.lifeMax || c.x>w+100 || c.y>h+100) comets.splice(i,1);\n      }\n      requestAnimationFrame(draw);\n    }\n    new ResizeObserver(resize).observe(stage);\n    resize(); draw();\n  }\n\n  starsLayer(backCvs,  {density:1\/7500, speed:0.03, sizeMin:0.6, sizeMax:1.2, twinkle:0.22});\n  starsLayer(frontCvs, {density:1\/3500, speed:0.08, sizeMin:0.9, sizeMax:1.8, twinkle:0.40});\n  cometsLayer(cometsCvs);\n\n  \/\/ Start on the title\n  show(0);\n})();\n<\/script>\n\n<!-- ===== PLAY \u2192 VIDEO hard-wire (drop right after Block 3) ===== -->\n<script>\n(function(){\n  if (window.__gggPlayWired) return; window.__gggPlayWired = true;\n\n  \/\/ Always scroll to video and start it (and MP3) on PLAY\n  window.kickGGG = function(){\n    const target = document.getElementById('gggIntroVideo');\n    if (target) target.scrollIntoView({behavior:'smooth', block:'start'});\n\n    if (typeof window.startGGGVideo === 'function'){\n      try { window.startGGGVideo(); } catch(e){}\n      return false;\n    }\n\n    \/\/ Fallbacks if startGGGVideo isn't defined yet\n    (function waitAndPlay(tries){\n      if (window.gggPlayer && typeof window.gggPlayer.playVideo === 'function'){\n        try { window.gggPlayer.playVideo(); } catch(e){}\n      } else if (tries < 50) {\n        setTimeout(()=>waitAndPlay(tries+1), 120);\n      }\n    })(0);\n\n    try {\n      const a = document.getElementById('gggAudio');\n      if (a){ a.currentTime=0; a.loop=true; a.play().catch(()=>{}); }\n    } catch(e){}\n\n    return false;\n  };\n\n  \/\/ Make sure PLAY sits above canvases and receives taps\n  try {\n    const center = document.querySelector('#gggIntroFlow .gggCenter');\n    if (center) center.style.zIndex = 10;\n    document.querySelectorAll('#gggIntroFlow canvas').forEach(c=> c.style.pointerEvents='none');\n  } catch(e){}\n})();\n<\/script>\n\n\n\n<!-- =========================================================\n  BLOCK 4 \u2014 Video + Audio + City Portals (hidden until PLAY)\n  ========================================================= -->\n<section id=\"gggIntroVideo\" aria-label=\"Gods Galaxy Game Video\" class=\"ggg-off\">\n  <canvas class=\"gggStarsBack\"><\/canvas>\n  <canvas class=\"gggStarsFront\"><\/canvas>\n  <canvas class=\"gggComets\"><\/canvas>\n\n  <div class=\"ggg-video-wrap\" hidden>\n    <div id=\"gggPlayer\" class=\"ggg-player\"><\/div>\n  <\/div>\n\n  <!-- Mobile rows -->\n  <div class=\"ggg-row ggg-row--top\">\n    <a class=\"ggg-portal\" href=\"https:\/\/godsgalaxygame.com\/GGG\/medayork-pyramid-2\/\"><span>MedaYork<\/span><\/a>\n    <a class=\"ggg-portal\" href=\"#\" data-coming><span>Miami<\/span><\/a>\n  <\/div>\n  <div class=\"ggg-row ggg-row--bottom\">\n    <a class=\"ggg-portal\" href=\"#\" data-coming><span>Orlando<\/span><\/a>\n    <a class=\"ggg-portal\" href=\"#\" data-coming><span>New York City<\/span><\/a>\n  <\/div>\n\n  <!-- Desktop row -->\n  <div class=\"ggg-row-desktop\">\n    <a class=\"ggg-portal\" href=\"https:\/\/godsgalaxygame.com\/GGG\/medayork-pyramid-2\/\"><span>MedaYork<\/span><\/a>\n    <a class=\"ggg-portal\" href=\"#\" data-coming><span>Miami<\/span><\/a>\n    <a class=\"ggg-portal\" href=\"#\" data-coming><span>Orlando<\/span><\/a>\n    <a class=\"ggg-portal\" href=\"#\" data-coming><span>New York City<\/span><\/a>\n  <\/div>\n\n  <audio id=\"gggAudio\" preload=\"auto\" src=\"http:\/\/godsgalaxygame.com\/GGG\/wp-content\/uploads\/2025\/10\/Screen_Recording_20251018_001819_Files-by-Google.mp3\"><\/audio>\n  <div class=\"ggg-toast\" hidden>Coming soon<\/div>\n<\/section>\n\n<style>\n\/* HIDE Block 4 until PLAY *\/\n#gggIntroVideo.ggg-off { display:none; }\n\n\/* >>> KEY LINE: hide the whole Block 3 while video is active <<< *\/\n.ggg-video-on #gggIntroFlow { display:none !important; }\n\n#gggIntroVideo{position:relative;min-height:100svh;background:#000;overflow:hidden;color:#fff;isolation:isolate}\n#gggIntroVideo canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}\n\n.ggg-video-wrap{position:fixed;inset:0;display:grid;place-items:center;z-index:999999}\n.ggg-player{width:100vw;aspect-ratio:16\/9;transform:translateY(3svh);background:#000;position:relative}\n.ggg-player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}\n@media (min-width:769px){.ggg-player{width:100vw;height:100vh;aspect-ratio:auto;transform:none}}\n\n.ggg-row,.ggg-row-desktop{\n  position:fixed;left:50%;transform:translateX(-50%);\n  width:calc(100vw - 40px);display:flex;gap:1rem;justify-content:center;align-items:center;\n  z-index:1000000;opacity:0;pointer-events:none;transition:opacity .6s ease;\n}\n.ggg-row--top{top:12px}\n.ggg-row--bottom{bottom:14px}\n.ggg-row-desktop{display:none;bottom:22px}\n@media (min-width:769px){.ggg-row{display:none}.ggg-row-desktop{display:flex}}\n\n.ggg-portal{\n  position:relative;display:inline-grid;place-items:center;min-width:150px;text-align:center;\n  padding:.95rem 1.5rem;border-radius:999px;text-decoration:none;text-transform:uppercase;\n  font:600 .95rem\/1 'Orbitron',system-ui,Arial,sans-serif;letter-spacing:.04em;color:#eaf4ff;\n  border:1px solid rgba(255,255,255,.32);\n  background:\n    radial-gradient(120% 160% at 50% 50%, #000 0%, #060606 55%, #0b0b0b 100%),\n    conic-gradient(from 0deg, rgba(255,255,255,.12), transparent 25%, rgba(255,255,255,.12) 50%, transparent 75%, rgba(255,255,255,.12));\n  box-shadow:0 0 24px rgba(120,120,255,.28), inset 0 0 22px rgba(0,0,0,.9);\n}\n.ggg-portal::before{content:\"\";position:absolute;inset:-45%;border-radius:50%;background:conic-gradient(from 0deg, rgba(255,255,255,.2), transparent 55%, rgba(255,255,255,.2));filter:blur(5px);mix-blend-mode:screen;animation:gggSwirl 6s linear infinite}\n.ggg-portal::after{content:\"\";position:absolute;inset:3px;border-radius:inherit;background:radial-gradient(60% 60% at 50% 50%, rgba(0,0,0,0), rgba(0,0,0,.85) 70%);box-shadow:inset 0 0 26px rgba(8,8,16,.88)}\n.ggg-portal span{position:relative;z-index:1}\n@keyframes gggSwirl{to{transform:rotate(360deg)}}\n\n#gggIntroVideo.ggg-show .ggg-row,\n#gggIntroVideo.ggg-show .ggg-row-desktop{opacity:1;pointer-events:auto}\n\n#gggIntroVideo .ggg-player iframe{pointer-events:none}\n\n.ggg-toast{position:fixed;left:50%;bottom:72px;transform:translateX(-50%);z-index:1000001;background:rgba(0,0,0,.82);color:#fff;padding:.65rem 1rem;border-radius:999px;border:1px solid rgba(255,255,255,.15)}\n.ggg-portal[data-coming]{\n  opacity: 0.35;\n  filter: grayscale(100%) brightness(0.55);\n  box-shadow: 0 0 10px rgba(255,255,255,0.08), inset 0 0 18px rgba(0,0,0,0.95);\n  border: 1px solid rgba(255,255,255,0.12);\n}\n\n.ggg-portal[data-coming]{\n  opacity: 0.75;\n  filter: brightness(0.82);\n  border: 1px solid rgba(255,255,255,0.22);\n  box-shadow:\n    0 0 14px rgba(255,255,255,0.12),\n    inset 0 0 18px rgba(0,0,0,0.75);\n}\n\n.ggg-portal[data-coming]{\n  opacity: 1;\n  filter: none;\n  border: 1px solid rgba(255,255,255,0.18);\n  box-shadow:\n    0 0 8px rgba(120,120,255,0.08),\n    inset 0 0 18px rgba(0,0,0,0.82);\n}\n\n.ggg-portal[data-coming] span{\n  color: rgba(255,255,255,0.42);\n  text-shadow: none;\n  letter-spacing: 0.04em;\n}\n\n.ggg-portal[data-coming]::before{\n  opacity: 0.15;\n}\n\n.ggg-portal[data-coming]::after{\n  opacity: 0.9;\n}\n<\/style>\n\n<script>\n\/* Called by PLAY (kickGGG) *\/\nwindow.startGGGVideo = (function(){\n  let requested=false, player=null;\n\n  function ensureYT(cb){\n    if(window.YT && window.YT.Player) return cb();\n    const s=document.createElement('script'); s.src='https:\/\/www.youtube.com\/iframe_api';\n    s.onload = cb; document.head.appendChild(s);\n  }\n  window.onYouTubeIframeAPIReady = function(){ if(requested && !player) createPlayer(); };\n\n  function createPlayer(){\n    const hero=document.getElementById('gggIntroVideo');\n    hero.classList.remove('ggg-off');          \/\/ show Block 4 now\n    document.documentElement.classList.add('ggg-video-on'); \/\/ << keep Block 3 hidden\n    document.body.style.overflow='hidden';\n\n    hero.querySelector('.ggg-video-wrap').hidden=false;\n\n    player = new YT.Player('gggPlayer',{\n      videoId:'Ar-PIhX1DDc',\n      playerVars:{playsinline:1,controls:0,modestbranding:1,rel:0,fs:0,loop:1,playlist:'Ar-PIhX1DDc',disablekb:1},\n      events:{\n        onReady:(e)=>{\n          try{ e.target.playVideo(); }catch(_){}\n          const a=document.getElementById('gggAudio'); try{ a.currentTime=0; a.play().catch(()=>{});}catch(_){}\n          setTimeout(()=> hero.classList.add('ggg-show'), 500);\n          initStars();\n          window.scrollTo(0,0);\n        },\n        onStateChange:(e)=>{\n          \/\/ re-assert the class on every state change (loop etc.)\n          document.documentElement.classList.add('ggg-video-on');\n          const S=YT.PlayerState;\n          if(e.data===S.ENDED){ try{ e.target.seekTo(0,true); e.target.playVideo(); }catch(_){}}  \/\/ loop\n          if(e.data===S.CUED||e.data===S.PAUSED){ try{ e.target.playVideo(); }catch(_){}}         \/\/ keep playing\n        }\n      }\n    });\n  }\n\n  return function start(){\n    if(requested) return; requested=true;\n    ensureYT(()=>{ if(!player) createPlayer(); });\n  };\n})();\n\n\/* Coming soon toast *\/\n(function(){\n  const root=document.getElementById('gggIntroVideo');\n  const toast=root.querySelector('.ggg-toast');\n  root.addEventListener('click',(e)=>{\n    const a=e.target.closest('a[data-coming]'); if(!a) return;\n    e.preventDefault(); toast.hidden=false;\n    clearTimeout(window._gggToastT); window._gggToastT=setTimeout(()=> toast.hidden=true,1600);\n  });\n})();\n\n\/* Starfield *\/\nfunction initStars(){\n  const hero=document.getElementById('gggIntroVideo');\n  const back=hero.querySelector('.gggStarsBack');\n  const front=hero.querySelector('.gggStarsFront');\n  const comets=hero.querySelector('.gggComets');\n\n  function starsLayer(cvs, conf){\n    const ctx=cvs.getContext('2d',{alpha:true}); let w=0,h=0,dpr=1,stars=[],t=0;\n    function resize(){\n      dpr=Math.min(2,window.devicePixelRatio||1);\n      const r=hero.getBoundingClientRect();\n      w=cvs.width=Math.floor(r.width*dpr); h=cvs.height=Math.floor(r.height*dpr);\n      const count=Math.floor(r.width*r.height*conf.density);\n      stars=new Array(count).fill(0).map(()=>({\n        x:Math.random()*w, y:Math.random()*h,\n        r:(Math.random()*(conf.sizeMax-conf.sizeMin)+conf.sizeMin)*dpr,\n        baseA:Math.random()*0.5+0.25, tw:Math.random()*conf.twinkle+0.1,\n        phase:Math.random()*Math.PI*2\n      }));\n    }\n    function draw(){\n      t+=1; ctx.clearRect(0,0,w,h);\n      for(const s of stars){\n        s.y += conf.speed*dpr; if(s.y>h){ s.y=-5; s.x=Math.random()*w; }\n        const pulse=(Math.sin(s.phase+t*0.02)+1)\/2;\n        ctx.globalAlpha=Math.max(0,Math.min(1,s.baseA+conf.tw*(pulse-0.5)));\n        ctx.beginPath(); ctx.arc(s.x,s.y,s.r,0,Math.PI*2); ctx.fillStyle='#fff'; ctx.fill();\n      }\n      requestAnimationFrame(draw);\n    }\n    new ResizeObserver(resize).observe(hero);\n    resize(); draw();\n  }\n\n  function cometsLayer(cvs){\n    const ctx=cvs.getContext('2d',{alpha:true}); let w=0,h=0,dpr=1,arr=[];\n    function resize(){\n      dpr=Math.min(2,window.devicePixelRatio||1);\n      const r=hero.getBoundingClientRect();\n      w=cvs.width=Math.floor(r.width*dpr); h=cvs.height=Math.floor(r.height*dpr);\n    }\n    function spawn(){\n      const x=Math.random()*w*0.5, y=-50;\n      const s=(Math.random()*2+2)*dpr, len=Math.random()*120+80, ang=Math.PI\/3.2;\n      arr.push({x,y,vx:Math.cos(ang)*s,vy:Math.sin(ang)*s,life:0,lifeMax:120+Math.random()*80,len});\n    }\n    function draw(){\n      ctx.clearRect(0,0,w,h);\n      if(Math.random()<0.012) spawn();\n      for(let i=arr.length-1;i>=0;i--){\n        const c=arr[i]; c.life++; c.x+=c.vx; c.y+=c.vy;\n        const tx=c.x-c.vx*(c.len\/10), ty=c.y-c.vy*(c.len\/10);\n        const g=ctx.createLinearGradient(c.x,c.y,tx,ty);\n        g.addColorStop(0,'rgba(255,255,255,.9)'); g.addColorStop(1,'rgba(255,255,255,0)');\n        ctx.strokeStyle=g; ctx.lineWidth=2*dpr;\n        ctx.beginPath(); ctx.moveTo(c.x,c.y); ctx.lineTo(tx,ty); ctx.stroke();\n        if(c.life>c.lifeMax || c.x>w+100 || c.y>h+100) arr.splice(i,1);\n      }\n      requestAnimationFrame(draw);\n    }\n    new ResizeObserver(resize).observe(hero);\n    resize(); draw();\n  }\n\n  starsLayer(back,  {density:1\/7500, speed:0.03, sizeMin:0.6, sizeMax:1.2, twinkle:0.22, tw:0.22});\n  starsLayer(front, {density:1\/3500, speed:0.08, sizeMin:0.9, sizeMax:1.8, twinkle:0.40, tw:0.40});\n  cometsLayer(comets);\n}\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>\u258c GODS GALAXY GAME NEXT PLAY MedaYork Miami Orlando New York City MedaYork Miami Orlando New York City Coming soon<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-382","page","type-page","status-publish","hentry"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/godsgalaxygame.com\/GGG\/wp-json\/wp\/v2\/pages\/382","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/godsgalaxygame.com\/GGG\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/godsgalaxygame.com\/GGG\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/godsgalaxygame.com\/GGG\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/godsgalaxygame.com\/GGG\/wp-json\/wp\/v2\/comments?post=382"}],"version-history":[{"count":208,"href":"https:\/\/godsgalaxygame.com\/GGG\/wp-json\/wp\/v2\/pages\/382\/revisions"}],"predecessor-version":[{"id":7095,"href":"https:\/\/godsgalaxygame.com\/GGG\/wp-json\/wp\/v2\/pages\/382\/revisions\/7095"}],"wp:attachment":[{"href":"https:\/\/godsgalaxygame.com\/GGG\/wp-json\/wp\/v2\/media?parent=382"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}