html.hero-loading,html.page-loading{overflow:hidden}
.hero-loader{
  position:fixed;
  inset:0;
  z-index:1000;
  display:grid;
  place-items:center;
  padding:32px;
  background:var(--navy-black,#001e2b);
  color:var(--gold,#fdda72);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .45s ease,visibility .45s ease;
}
.hero-loading .hero-loader,.page-loading #pageLoader{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition:none;
}
.hero-loader[hidden]{display:none}
.hero-slide .hero-media .hero-video-poster{
  position:absolute;
  inset:0;
  z-index:1;
  animation:none;
  transform:none;
  pointer-events:none;
}
.hero-loader-content{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:28px;
}
.hero-loader-mark{width:clamp(80px,8vw,112px);height:auto;overflow:visible}
.hero-loader-outline{
  fill:none;
  stroke:currentColor;
  stroke-width:7;
  stroke-linejoin:round;
  animation:heroLoaderTrace 3.4s cubic-bezier(.65,0,.35,1) infinite;
}
.hero-loader-solid{
  fill:currentColor;
  opacity:0;
  animation:heroLoaderFill 3.4s cubic-bezier(.65,0,.35,1) infinite;
}
.hero-loader-label{
  font-size:.65rem;
  font-weight:500;
  line-height:1.5;
  letter-spacing:.24em;
  text-indent:.24em;
  text-transform:uppercase;
}
@keyframes heroLoaderTrace{
  0%{stroke-dashoffset:1;opacity:1}
  42%{stroke-dashoffset:0;opacity:1}
  88%{stroke-dashoffset:0;opacity:.55}
  98%,100%{stroke-dashoffset:0;opacity:0}
}
@keyframes heroLoaderFill{
  0%,42%{opacity:0}
  62%,88%{opacity:1}
  98%,100%{opacity:0}
}
@media (prefers-reduced-motion:reduce){
  .hero-loader{transition:none}
  .hero-loader-outline{animation:none;stroke-dashoffset:0}
  .hero-loader-solid{animation:none;opacity:0}
}
