/* Hero: cosmos background + atmospheric glow + flare from the supplied 2026 site, retinted to the eStreet accent.
   The globe itself is a real-time sphere (see index.html) textured with NASA Blue Marble, so every continent rotates into view. */
.top-bg-area{position:absolute;inset:0;overflow:hidden;background:#000 url(../img/bg/cosmos.jpg) center/cover no-repeat}
.top-bg-area:after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.4)}
.earth-top{--s:clamp(540px,94vh,1020px);position:absolute;z-index:2;width:var(--s);height:var(--s);left:calc(68% - var(--s)/2);top:calc(54% - var(--s)/2)}
.earth-top .earth-rotate{position:relative;width:100%;height:100%;border-radius:50%;background:radial-gradient(circle at 35% 30%,#0d2748,#050912 70%);
 box-shadow:0 0 60px rgba(0,160,255,.3),0 0 10px rgba(92,200,255,.5),0 0 1px rgba(92,200,255,.4),0 0 80px rgba(0,160,255,.2),0 0 1px rgba(255,255,255,.2)}
.earth-top canvas{position:absolute;inset:0;width:100%;height:100%;border-radius:50%}
.earth-top .earth-rotate.flare:before,.earth-top .earth-rotate.flare:after{opacity:.4;position:absolute;z-index:2;pointer-events:none;content:"";width:50%;height:27%;background:url(../img/earth-flare/azure-radiance.png) center/cover no-repeat;top:-13.5%;left:25%}
.earth-top .earth-rotate.flare:after{opacity:.7}
@media(max-width:960px){.earth-top{--s:170vw;left:50%;top:auto;bottom:calc(var(--s)*-.54);transform:translateX(-50%)}}