#page-loader {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #000;
  transition: opacity 0.7s ease, visibility 0.7s ease;
}

#page-loader.is-hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.loader {
  position: relative;
  width: 128px;
  height: 128px;
}

.loader__glow,
.loader__core {
  display: none;
}

.loader__svg {
  position: relative;
  width: 100%;
  height: 100%;
  display: block;
}

.loader__track,
.loader__arc {
  fill: none;
  transform-box: fill-box;
  transform-origin: center;
}

.loader__track {
  stroke: rgba(252, 246, 230, 0.16);
  stroke-width: 5;
}

.loader__arc {
  stroke-linecap: round;
  stroke-width: 5;
}

.loader__arc--outer {
  stroke: url(#loader-grad-outer);
  stroke-dasharray: 92 198;
  animation: loader-spin 1.15s cubic-bezier(0.55, 0.05, 0.25, 1) infinite;
}

.loader__arc--inner {
  stroke: #ffe58a;
  stroke-dasharray: 48 154;
  animation: loader-spin-reverse 1.7s cubic-bezier(0.55, 0.05, 0.25, 1) infinite;
}

@keyframes loader-spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes loader-spin-reverse {
  to {
    transform: rotate(-360deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .loader__arc {
    animation: none;
  }
}
