/* V24 final two-point patch — 2026-08-20
   1) Mobile: visually blend the empty paragraph sky so it no longer reads as a black box.
   2) Laptop/desktop: move only the baked hero artwork slightly up/left; hero-copy remains fixed.
*/

/* Laptop / desktop only: nudge the artwork, not the live paragraph. */
@media (min-width: 621px){
  .hero-picture img{
    transform:translate(-1.15%,-2.2%) scale(1.024)!important;
    transform-origin:center top!important;
  }
}

/* Mobile only: add a very subtle, edge-less sky texture behind the paragraph.
   This keeps the logo, paragraph position, Earth and trust rows unchanged. */
@media (max-width: 620px){
  .hero-visual::before{
    content:""!important;
    display:block!important;
    position:absolute!important;
    z-index:2!important;
    left:0!important;
    right:0!important;
    top:24%!important;
    height:53%!important;
    pointer-events:none!important;
    background:
      radial-gradient(circle at 16% 18%,rgba(245,184,75,.24) 0 1px,transparent 1.7px),
      radial-gradient(circle at 78% 13%,rgba(255,255,255,.15) 0 .8px,transparent 1.5px),
      radial-gradient(circle at 34% 37%,rgba(232,171,62,.18) 0 .8px,transparent 1.5px),
      radial-gradient(circle at 88% 44%,rgba(255,255,255,.12) 0 .7px,transparent 1.4px),
      radial-gradient(circle at 12% 63%,rgba(255,255,255,.10) 0 .7px,transparent 1.4px),
      radial-gradient(circle at 64% 71%,rgba(238,175,59,.16) 0 .8px,transparent 1.5px),
      radial-gradient(circle at 45% 52%,rgba(255,255,255,.08) 0 .7px,transparent 1.4px),
      linear-gradient(to bottom,rgba(2,6,17,0) 0%,rgba(3,7,18,.18) 18%,rgba(3,7,18,.12) 80%,rgba(2,8,20,0) 100%)!important;
    opacity:.78!important;
    -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 16%,#000 84%,transparent 100%)!important;
    mask-image:linear-gradient(to bottom,transparent 0%,#000 16%,#000 84%,transparent 100%)!important;
  }
}
