:root {
  --hero-image: url("/assets/beeline-giga-scene.jpg");
}

.hero-visual {
  background-image: linear-gradient(90deg, #fff 0%, #ffffffed 22%, #ffffff80 32%, #ffffff00 42%), var(--hero-image);
  background-position: center, right center;
  background-size: cover, auto 108%;
}

@media (max-width: 650px) {
  .hero-visual {
    background-image: var(--hero-image);
    background-position: center bottom;
    background-size: auto 430px;
  }
}