.load-progress {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 80;
  width: 100%;
  height: 3px;
  background: rgba(255,255,255,.08);
}

.load-progress__bar {
  width: 8%;
  height: 100%;
  background: linear-gradient(90deg, #ff2d55, #00e5ff);
  transition: width .25s ease;
}

body.is-ready .load-progress {
  opacity: 0;
  pointer-events: none;
  transition: opacity .3s ease;
}

[data-img],
[data-bg] {
  opacity: 0;
  transition: opacity .35s ease;
}

[data-img].is-loaded,
[data-bg].is-loaded {
  opacity: 1;
}

.hero-video {
  opacity: 0;
  transition: opacity .45s ease;
}

.hero-video.is-ready {
  opacity: 1;
}