/* Four independent layers reproduce the original homepage's translucent spheres. */
body.home-page.js-home-page > .bg-img.babel-home-motion {
  position: relative;
  isolation: isolate;
  background-image: linear-gradient(180deg, #f9f9f9 1%, #eaf4fd 73%, #f9fcff);
}
body.home-page.js-home-page > .bg-img > .babel-home-motion__clip {
  position: absolute;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
}
.babel-home-motion__sphere {
  position: absolute;
  border-radius: 50%;
  will-change: transform, opacity;
  backface-visibility: hidden;
}
.babel-home-motion__sphere--far-left {
  left: calc(50% - 1290px);
  top: 380px;
  width: 920px;
  height: 920px;
  background: radial-gradient(circle at 62% 42%, rgba(32, 177, 253, .012), rgba(32, 177, 253, .027));
}
.babel-home-motion__sphere--left {
  left: calc(50% - 945px);
  top: 225px;
  width: 1090px;
  height: 1090px;
  background: radial-gradient(circle at 60% 45%, rgba(16, 185, 254, .018), rgba(16, 185, 254, .047));
}
.babel-home-motion__sphere--rear {
  left: calc(50% - 320px);
  top: -90px;
  width: 1440px;
  height: 1440px;
  background: radial-gradient(circle, rgba(248, 251, 254, .015) 0%, rgba(180, 224, 254, .022) 37%, rgba(16, 185, 254, .045) 100%);
}
.babel-home-motion__sphere--front {
  left: calc(50% + 210px);
  top: 350px;
  width: 1080px;
  height: 1080px;
  background: radial-gradient(circle at 38% 46%, rgba(8, 162, 254, .015), rgba(8, 162, 254, .055));
}
@media (prefers-reduced-motion: reduce) {
  body.home-page.js-home-page > .bg-img.babel-home-motion {
    background-image: linear-gradient(180deg, #f9f9f9 1%, #eaf4fd 73%, #f9fcff), url("background-original.png");
  }
  body.home-page.js-home-page > .bg-img > .babel-home-motion__clip { display: none; }
}