@font-face {
  font-family: "Alibaba PuHuiTi 3.0";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/AlibabaPuHuiTi-3-55-Regular.otf") format("opentype");
}

.zp-page-nav-hotspot {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2147483646;
  width: 100%;
  height: 5.73vw;
  min-height: 56px;
}

.zp-page-nav {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2147483647;
  display: flex;
  box-sizing: border-box;
  width: 100%;
  max-width: 100vw;
  padding: 1.6086vw 5.6301vw 0.8333vw;
  justify-content: space-between;
  align-items: center;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  color: #fff;
  font-family: "Alibaba PuHuiTi 3.0", "PingFang SC", "Hiragino Sans GB", sans-serif;
  background: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, 0) 100%);
  backdrop-filter: blur(17.115280151367188px);
  -webkit-backdrop-filter: blur(17.115280151367188px);
  transition: opacity 0.28s ease, visibility 0.28s;
}

.zp-page-nav.is-visible {
  pointer-events: auto;
  opacity: 1;
  visibility: visible;
}

.zp-page-nav__bg {
  display: none;
}

.zp-page-nav__back {
  position: relative;
  z-index: 1;
  display: block;
  width: 2.2734vw;
  height: 2.2734vw;
  flex-shrink: 0;
}

.zp-page-nav__back img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
}

.zp-page-nav__links {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 2.4799vw;
}

header.zp-page-nav .zp-page-nav__links a {
  color: #fff;
  text-align: center;
  font-family: "Alibaba PuHuiTi 3.0", sans-serif;
  font-size: 1.6086vw;
  font-style: normal;
  font-weight: 400;
  line-height: 3.2813vw;
  white-space: nowrap;
  text-decoration: none;
  letter-spacing: 0;
}

.zp-page-nav__links a[href*="#experience"] {
  text-transform: uppercase;
}

.zp-page-nav__links a:hover,
.zp-page-nav__back:hover {
  opacity: 0.72;
}