/* ============================================================
   Header dropdown for the Technology nav item (site-wide).
   Visual spec from the Mira Figma (node 904:859):
   280px panel, black/88 + blur(10), inset glow, 60px option
   pills — Enterprise highlighted, Personal dimmed.
   ============================================================ */

/* the navbar containers clip children by default; the panel must escape */
.navbar_container { overflow: visible; }

.dp-nav-dd {
  position: relative;
  display: flex;
  align-items: stretch;
  height: 100%;
}
.dp-nav-dd > .navbar_left-link { height: 100%; }

.dp-nav-dd_panel {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 10;
  width: 17.5rem;               /* 280 */
  padding: 1.25rem;             /* 20 */
  display: flex;
  flex-direction: column;
  grid-row-gap: 0.5rem;
  row-gap: 0.5rem;              /* 8 */
  background-color: rgba(0, 0, 0, 0.88);
  border: 1px solid rgba(255, 255, 255, 0.2);
  box-shadow: inset 0 0 2.5rem 0 rgba(255, 255, 255, 0.1);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-0.5rem);
  pointer-events: none;
  transition: opacity 0.18s ease, transform 0.22s cubic-bezier(0.33, 1, 0.68, 1),
    visibility 0s linear 0.25s;
}
.dp-nav-dd:hover .dp-nav-dd_panel,
.dp-nav-dd:focus-within .dp-nav-dd_panel {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
  transition: opacity 0.18s ease, transform 0.22s cubic-bezier(0.33, 1, 0.68, 1);
}

.dp-nav-dd_item {
  display: flex;
  align-items: center;
  height: 3.75rem;              /* 60 */
  padding: 1rem 1.5rem;         /* 16 24 */
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.875rem;
  line-height: 1;
  white-space: nowrap;
  transition: color 0.2s ease, box-shadow 0.2s ease;
}
.dp-nav-dd_item.is--primary {
  background-color: rgba(255, 255, 255, 0.05);
  box-shadow: inset 0 0 0.625rem 0 rgba(255, 255, 255, 0.2);
  color: #fff;
}
.dp-nav-dd_item:hover {
  color: #fff;
  box-shadow: inset 0 0 1.25rem 0 rgba(255, 255, 255, 0.4);
}

/* ------------------------------------------------------------
   Mobile tweaks (≤991): the exported .menu-icon carries a
   -0.5rem margin that shoves the burger lines against the
   viewport edge. The design gives the burger cell 71px with the
   lines centered (24px air on both sides), so widen the button
   and center the icon instead.
   ------------------------------------------------------------ */
@media screen and (max-width: 991px) {
  /* same width as the EN/CN language cell next to it */
  .navbar_menu-button {
    width: 3.4375rem;
    flex: none;
  }
  .navbar_menu-button .menu-icon {
    margin: 0 auto;
  }
}

/* ------------------------------------------------------------
   Mobile menu: the 行业版/个人版 rows form the design's sub-panel
   (menu frame 957:4805): a 20px-inset box on white/8, 75px rows,
   left-aligned dim labels with a thin chevron-right, and an
   inset hairline between the rows. The full-width dividers that
   would cross the panel are hidden.
   ------------------------------------------------------------ */
.mobile_navbar-divider:has(+ .mobile_navbar-link.dp-nav-sub) {
  display: none;
}

.mobile_navbar-link.dp-nav-sub {
  position: relative;
  justify-content: space-between;
  width: 100%;                    /* full-bleed, same as parent rows */
  height: 4.6875rem;              /* 75 */
  padding: 0 1.5rem;              /* 24 */
  background-color: rgba(255, 255, 255, 0.08);
}
/* first row of the panel (follows the 产品技术 row) */
.mobile_navbar-link:not(.dp-nav-sub) + .mobile_navbar-divider + .dp-nav-sub {
  border-top: 1px solid rgba(255, 255, 255, 0.15);
}
/* last row: the menu's own full-width divider below closes the box */
.dp-nav-sub + .mobile_navbar-divider + .dp-nav-sub {
  margin-bottom: 0;
}
.dp-nav-sub + .mobile_navbar-divider + .dp-nav-sub::before {
  content: "";
  position: absolute;
  top: 0;
  left: 1.5rem;
  right: 1.5rem;
  height: 1px;
  background-color: rgba(255, 255, 255, 0.18);
}

.dp-nav-sub .mobile_navbar-label {
  opacity: 0.6;
  font-size: 0.875rem;
}

/* thin chevron-right (9x17 per the design render) */
.mobile_navbar-link.dp-nav-sub::after {
  content: "";
  width: 0.5625rem;
  height: 1.0625rem;
  background: no-repeat center / contain
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='17' viewBox='0 0 9 17'%3E%3Cpath d='M1 1l7 7.5L1 16' stroke='white' stroke-opacity='.6' fill='none' stroke-width='1.5'/%3E%3C/svg%3E");
}

/* Webflow marks the 行业版 row w--current at runtime (its href is the
   current page); keep the sub rows dim per the design */
.mobile_navbar-link.dp-nav-sub.w--current {
  border-color: rgba(255, 255, 255, 0.15);
  box-shadow: none;
}

/* chevron-down on the 产品技术 row that owns the group */
.mobile_navbar-link:not(.dp-nav-sub):has(+ .mobile_navbar-divider + .dp-nav-sub) {
  position: relative;
}
.mobile_navbar-link:not(.dp-nav-sub):has(+ .mobile_navbar-divider + .dp-nav-sub)::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 1.75rem;
  width: 1.0625rem;
  height: 0.5625rem;
  transform: translateY(-50%);
  background: no-repeat center / contain
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='9' viewBox='0 0 17 9'%3E%3Cpath d='M1 1l7.5 7L16 1' stroke='white' stroke-opacity='.6' fill='none' stroke-width='1.5'/%3E%3C/svg%3E");
}

@media (prefers-reduced-motion: reduce) {
  .dp-nav-dd_panel {
    transition: opacity 0.01ms;
    transform: none;
  }
}