html {
  overflow: hidden;
  height: 100vh;
}
body {
  transform-style: preserve-3d;
  overflow-y: scroll;
  overflow-x: hidden;
  perspective: 1px;
  height: 100vh;
  width: 100vw;
}

header {
  width: 100%;
  min-height: 100vh;
  position: relative;
  transform-style: preserve-3d;
  z-index: -1;
}

header::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("/assets/images/hero.jpg") top center;
  background-size: cover;
  z-index: -1;
  transform: translateZ(-1px) scale(2.2);
}