/* 13.11 (Эрик): the hero planet = designer's variant B (rotating, layered fog; globe-core.js + hero-globe.js). The old bright 3D dot
   globe (#globe, globe.v3.js) stays hidden.
   v331 (Эрик: «сначала показывается картинка, а потом глобус — картинку убрать; пока грузится — туман, и глобус красиво появляется
   из тумана, как закончилась загрузка»): while loading only a soft drifting haze; when the planet is ready it rises out of it
   (blur → sharp, a slight zoom, fade), the haze thins. The picture (product-globe.jpg) is only for no WebGL / a lost context. */
.hero .world #globe{display:none!important}
.hero .world .globe-fallback,.hero .world.loaded .globe-fallback{display:none!important}
.hero .world.is-fallback .globe-fallback,.hero .world.is-lost .globe-fallback{display:block!important;animation:hg-drift 26s ease-in-out infinite alternate}
.hero .world::before{content:'';position:absolute;z-index:1;pointer-events:none;left:2%;right:-6%;top:6%;bottom:2%;border-radius:50%;
  background:radial-gradient(closest-side at 48% 50%,rgba(120,104,220,.20),rgba(80,70,170,.10) 45%,transparent 75%),
    radial-gradient(closest-side at 30% 62%,rgba(140,120,255,.10),transparent 70%),radial-gradient(closest-side at 70% 38%,rgba(90,120,230,.09),transparent 70%);
  filter:blur(18px);opacity:1;transition:opacity 2.4s ease 0.3s;animation:hg-haze 14s ease-in-out infinite alternate}
.hero .world.is-live::before{opacity:.35}
.hero .world.is-fallback::before{display:none}
.hero .world .globe-canvas{pointer-events:none;cursor:default;opacity:0;filter:blur(16px);scale:.94;
  transition:opacity 2.2s ease,filter 2.6s cubic-bezier(.2,.7,.2,1),scale 3s cubic-bezier(.2,.7,.2,1)} /* «scale», not transform: the phone layout centres the canvas with transform (Codex) */
.hero .world.is-live .globe-canvas{opacity:1;filter:none;scale:1}
.hero .world.is-fallback .globe-canvas{display:none}
@keyframes hg-haze{0%{transform:translate3d(-2%,1%,0) scale(1)}100%{transform:translate3d(2%,-1.5%,0) scale(1.06)}}
@keyframes hg-drift{0%{transform:scale(1) translate3d(0,0,0)}50%{transform:scale(1.035) translate3d(-1.2%,.6%,0)}100%{transform:scale(1.015) translate3d(.8%,-.4%,0)}}
@media (prefers-reduced-motion:reduce){.hero .world::before,.hero .world .globe-fallback{animation:none}.hero .world .globe-canvas{transition:opacity .6s ease;filter:none;scale:1}}
