.hero-flow {
  --flow-line: 56, 107, 181;
  --flow-light: 37, 103, 212;
  --flow-guide: 87, 118, 155;
  position: absolute;
  top: 0;
  right: -4%;
  width: 59%;
  height: 100%;
  z-index: -1;
  pointer-events: none;
  mask-image: linear-gradient(90deg, transparent, #000 18%, #000 88%, transparent);
}
.dark .hero-flow {
  --flow-line: 103, 158, 219;
  --flow-light: 151, 202, 255;
  --flow-guide: 97, 139, 184;
}
@media (max-width: 1000px) {
  .hero-flow { top: auto; bottom: 0; right: 0; width: 100%; height: 150px; }
  .hero-copy { padding-bottom: 145px; }
}
@media (max-width: 520px) {
  .hero-flow { height: 120px; }
  .hero-copy { padding-bottom: 125px; }
}