.nav-transition {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: #142b3a;
  background-image: radial-gradient(ellipse at center, #294352 0, #142b3a 64%);
  color: #fff;
  opacity: 0;
  pointer-events: none;
  transition: opacity 220ms ease;
}
.nav-transition[hidden] { display: none; }
.nav-transition.is-visible { opacity: 1; pointer-events: auto; }
.nav-transition.is-arriving { transition: none; }
.nav-transition.is-leaving { transition: opacity 220ms ease; pointer-events: none; }
.nav-transition__identity {
  display: flex;
  align-items: center;
  flex-direction: column;
  padding: 30px;
  transform: translateY(6px);
  transition: transform 500ms cubic-bezier(.2,.65,.3,1);
}
.nav-transition.is-visible .nav-transition__identity { transform: translateY(0); }
.nav-transition__emblem { width: 99px; height: 108px; margin-bottom: 23px; }
.nav-transition__emblem svg {
  display: block;
  width: 100%;
  height: 100%;
  fill: none;
  stroke: #c6a16a;
  stroke-width: 1.15;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.nav-transition__emblem text {
  fill: #d7b782;
  stroke: none;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 82px;
  font-weight: 400;
}
.nav-transition__frame {
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  animation: plastoaz-frame-draw 760ms cubic-bezier(.16,.7,.3,1) forwards;
}
.nav-transition__fine-frame {
  opacity: .45;
  transform-origin: 60px 60px;
  animation: plastoaz-frame-settle 900ms cubic-bezier(.16,.7,.3,1) both;
}
.nav-transition__accent { opacity: .65; stroke-width: 1; }
.nav-transition__wordmark {
  color: #f8f9f8;
  font-family: 'Manrope', Arial, sans-serif;
  font-size: 28px;
  font-weight: 750;
  line-height: 1;
  letter-spacing: 2px;
  animation: plastoaz-wordmark-in 440ms ease both;
}
.nav-transition__wordmark span { color: #c6a16a; }
.nav-transition__tagline {
  margin-top: 12px;
  color: #a7b7bf;
  font-family: 'DM Sans', Arial, sans-serif;
  font-size: 7px;
  line-height: 1.3;
  letter-spacing: 3px;
  animation: plastoaz-wordmark-in 440ms 45ms ease both;
}
.nav-transition__progress { width: 110px; height: 1px; margin-top: 35px; background: #ffffff16; overflow: hidden; }
.nav-transition__progress span {
  display: block;
  width: 100%;
  height: 100%;
  background: #c6a16a;
  transform-origin: left;
  animation: plastoaz-progress 760ms cubic-bezier(.18,.66,.3,1) both;
}
.plastoaz-page-changing, .plastoaz-page-changing * { cursor: progress !important; }
@keyframes plastoaz-frame-draw { to { stroke-dashoffset: 0; } }
@keyframes plastoaz-frame-settle { from { opacity: 0; transform: rotate(-9deg) scale(.97); } to { opacity: .45; transform: rotate(0) scale(1); } }
@keyframes plastoaz-wordmark-in { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
@keyframes plastoaz-progress { from { transform: scaleX(.08); } to { transform: scaleX(1); } }
@media (max-width: 600px) {
  .nav-transition__emblem { width: 83px; height: 92px; margin-bottom: 21px; }
  .nav-transition__wordmark { font-size: 25px; }
  .nav-transition__tagline { font-size: 6px; letter-spacing: 2.5px; }
}
@media (prefers-reduced-motion: reduce) {
  .nav-transition, .nav-transition__identity { transition: none !important; }
  .nav-transition__identity, .nav-transition__wordmark, .nav-transition__tagline, .nav-transition__fine-frame, .nav-transition__progress span { animation: none !important; transform: none !important; }
  .nav-transition__frame { animation: none !important; stroke-dashoffset: 0; }
}