html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

#ui,
#page-container,
#page-container-inner {
  min-height: 100vh;
  max-width: 100vw;
  overflow-x: clip;
}

#projects-main-title {
  overflow: visible !important;
}

#projects-main-title {
  font-family: "Microsoft YaHei", "PingFang SC", "Noto Sans SC", Aeonik, Arial, sans-serif !important;
  line-height: 1.08 !important;
  letter-spacing: 0 !important;
  padding-top: 0.08em;
  padding-bottom: 0.04em;
  margin-top: -0.08em !important;
  margin-bottom: -0.04em !important;
  text-rendering: geometricPrecision;
  -webkit-font-smoothing: antialiased;
}

#projects-main-title-project-arrow path,
#projects .project-item-line-2-icon svg path {
  stroke: currentColor !important;
}

#project-details a,
#project-details button,
#project-details svg,
#project-details span,
#project-details p,
#project-details h1,
#project-details h2,
#project-details h3 {
  color: inherit;
}

#project-details-launch-cta,
#project-details-launch-cta-mobile,
#project-details-launch-cta-text,
#project-details-launch-cta-mobile-text,
#project-details-launch-cta-arrow,
#project-details-launch-cta-mobile-arrow {
  color: var(--project-details-btn-text, #192743) !important;
}

#project-details-meta,
#project-details-left,
#project-details-right,
#project-details-launch-cta,
#project-details-launch-cta-mobile {
  pointer-events: auto !important;
}

#project-details-launch-cta,
#project-details-launch-cta-mobile {
  position: relative !important;
  z-index: 20;
}

#about-capability-title #about-capability-title-line-2 {
  left: 0 !important;
}

@media (max-width: 812px) {
  #about-who {
    height: auto !important;
    min-height: 0 !important;
    padding-bottom: 0 !important;
    overflow: visible !important;
  }

  #about-who-subsection-container {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    height: auto !important;
    transform: none !important;
    will-change: auto !important;
  }

  .about-who-subsection {
    position: relative !important;
    float: none !important;
    width: 100% !important;
    height: auto !important;
    min-height: 100svh;
    transform: none !important;
  }

  #about-who-subsection-details {
    display: flex !important;
    flex-direction: column;
    justify-content: space-between;
    gap: 4rem;
    min-height: 100svh;
    font-size: clamp(1.5rem, 7vw, 2rem) !important;
    line-height: 1.18;
  }

  #about-who-desc-top,
  #about-who-desc-bottom {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    text-align: left !important;
  }

  #about-who-desc-bottom {
    right: auto !important;
    bottom: auto !important;
  }

  #about-who-desc-top > span span,
  #about-who-desc-bottom > span span {
    display: inline !important;
    margin: 0 !important;
  }

  #about-crosses {
    display: none !important;
  }

  #about-who-title-main-scroll {
    display: none !important;
  }

  #projects .project-item-line-2 {
    left: 0 !important;
    padding-left: 1.1em;
  }

  #projects .project-item-line-1 {
    font-size: clamp(0.75rem, 3.2vw, 1rem) !important;
    line-height: 1.35;
  }

  #projects .project-item-line-2-icon {
    left: 0 !important;
  }

  #project-details-title,
  #project-details-preview-title {
    max-width: 100%;
    font-size: clamp(2.6rem, 12vw, 4.2rem) !important;
    line-height: 1.02 !important;
    overflow-wrap: break-word;
    word-break: keep-all;
  }

  #project-details-preview {
    position: relative !important;
    left: 0 !important;
    top: auto !important;
    width: 100% !important;
    height: auto !important;
    clear: both;
    margin-top: 4rem !important;
  }

  #project-details-preview-inner {
    position: relative !important;
    left: 0 !important;
    top: auto !important;
    width: 100% !important;
    height: auto !important;
    padding: 3rem 0 !important;
  }

  #header-right-menu-btn {
    display: grid !important;
    place-items: center !important;
    overflow: hidden;
  }

  #header-right-menu-btn-inner {
    display: grid !important;
    place-items: center !important;
    right: auto !important;
    width: 100%;
    height: 100%;
    overflow: visible;
  }

  #header-right-menu-btn-dots,
  #header-right-menu-btn:hover #header-right-menu-btn-dots,
  #header-right-menu-btn.--opened #header-right-menu-btn-dots {
    position: relative !important;
    width: 1.28em !important;
    height: 1.02em !important;
    font-size: 1em !important;
    transform: none !important;
  }

  #header-right-menu-btn-dots::before,
  #header-right-menu-btn-dots::after,
  #header-right-menu-btn-dots .header-right-menu-btn-dot:first-child {
    content: "";
    position: absolute !important;
    left: 50% !important;
    right: auto !important;
    display: block !important;
    width: 100% !important;
    min-height: 2px;
    height: 0.15em !important;
    border-radius: 999px !important;
    background: currentColor !important;
  }

  #header-right-menu-btn-dots::before {
    top: 0;
    transform: translateX(-50%) !important;
  }

  #header-right-menu-btn-dots .header-right-menu-btn-dot:first-child {
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
  }

  #header-right-menu-btn-dots::after {
    bottom: 0;
    transform: translateX(-50%) !important;
  }

  #header-right-menu-btn-dots .header-right-menu-btn-dot:last-child {
    display: none !important;
  }
}

@media (max-width: 420px) {
  #about-who-subsection-details {
    font-size: clamp(1.35rem, 6.5vw, 1.75rem) !important;
  }

  #project-details-title,
  #project-details-preview-title {
    font-size: clamp(2.2rem, 11vw, 3.4rem) !important;
  }
}
