@font-face {
  font-family: "Geologica";
  src: url("./assets/fonts/Geologica-Variable.ttf") format("truetype");
  font-style: normal;
  font-weight: 100 900;
  font-display: block;
}

@font-face {
  font-family: "Noto Sans SC";
  src: url("./assets/fonts/NotoSansSC-Variable.ttf") format("truetype");
  font-style: normal;
  font-weight: 100 900;
  font-display: block;
}

:root {
  --ink: #1e1e1e;
  --white: #ffffff;
  --mid-gray: #a9a9a9;
  --footer-background: #f6f6f6;
  --header-height: 117px;
  --header-margin: 36px;
  --footer-margin: 40px;
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-switch: cubic-bezier(0.22, 1, 0.36, 1);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  color: var(--ink);
  background: var(--white);
  font-family: "Geologica";
  font-synthesis: none;
  text-rendering: geometricPrecision;
  -webkit-font-smoothing: antialiased;
}

body {
  min-width: 320px;
  margin: 0;
  color: var(--ink);
  background: var(--white);
  overflow-x: hidden;
}

a,
button {
  color: inherit;
  font: inherit;
  -webkit-tap-highlight-color: transparent;
}

a {
  text-decoration: none;
}

button {
  padding: 0;
  border: 0;
  background: none;
}

.site-header {
  position: fixed;
  z-index: 100;
  top: 0;
  right: 0;
  left: 0;
  height: var(--header-height);
  background: var(--white);
  transform: translate3d(0, 0, 0);
  transition: transform 380ms var(--ease-out);
  will-change: transform;
}

.site-header::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 0.5px;
  background: var(--ink);
  content: "";
}

.site-header.is-hidden {
  transform: translate3d(0, calc(-1 * var(--header-height)), 0);
}

.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 100%;
  padding: 0 var(--header-margin);
}

.logo-button {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  transform: translate3d(0, 0, 0) scale(1);
  transform-origin: center;
  transition: transform 260ms var(--ease-out);
}

.logo-button img {
  display: block;
}

.logo-button:hover {
  transform: translate3d(0, -2px, 0) scale(1.025);
}

.logo-button:active,
.logo-button.is-clicked {
  transform: translate3d(0, 1px, 0) scale(0.94);
  transition-duration: 90ms;
}

.logo-button:focus-visible,
.header-link:focus-visible,
.language-option:focus-visible,
.footer-route:focus-visible {
  outline: 1px solid var(--ink);
  outline-offset: 6px;
}

.header-logo {
  width: 37px;
  height: 38px;
}

.header-logo img {
  width: 37px;
  height: 38px;
}

.header-actions {
  display: flex;
  align-items: center;
  gap: 61px;
}

.header-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 35px;
  color: var(--mid-gray);
  font-family: "Geologica";
  font-size: 18px;
  font-weight: 500;
  font-variation-settings: "wght" 500, "CRSV" 0, "SHRP" 0, "slnt" 0;
  letter-spacing: 0;
  line-height: 1;
  transform: translate3d(0, 0, 0);
  transition: color 220ms ease, transform 220ms var(--ease-out);
}

.header-link::after {
  position: absolute;
  right: 2px;
  bottom: 1px;
  left: 0;
  height: 1px;
  background: currentColor;
  content: "";
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform 300ms var(--ease-out);
}

.header-link.is-active {
  color: var(--ink);
}

.header-link:hover {
  color: var(--ink);
  transform: translate3d(0, -1px, 0);
}

.header-link:hover::after,
.header-link:focus-visible::after {
  transform: scaleX(1);
  transform-origin: left center;
}

.header-link:active,
.header-link.is-clicked {
  transform: translate3d(0, 1px, 0) scale(0.97);
  transition-duration: 80ms;
}

.language-toggle {
  position: relative;
  display: grid;
  flex: 0 0 121px;
  grid-template-columns: 57px 58px;
  width: 121px;
  height: 35px;
  padding: 0 3px;
  border-radius: 999px;
  background: var(--ink);
  box-shadow: 0 0 0 0 var(--ink);
  isolation: isolate;
  overflow: hidden;
  transform: translate3d(0, 0, 0) scale(1);
  transition: box-shadow 260ms ease, transform 260ms var(--ease-out);
}

.language-toggle:active {
  transform: translate3d(0, 0, 0) scale(0.985);
  transition-duration: 90ms;
}

.language-slider {
  position: absolute;
  z-index: -1;
  top: 3px;
  left: 3px;
  width: 56px;
  height: 29px;
  border-radius: 999px;
  background: var(--white);
  transform: translate3d(0, 0, 0);
  transition: transform 440ms var(--ease-switch), width 220ms var(--ease-out);
  will-change: transform;
}

.language-toggle.is-en .language-slider {
  transform: translate3d(59px, 0, 0);
}

.language-option {
  position: relative;
  display: grid;
  width: 100%;
  height: 35px;
  cursor: pointer;
  place-items: center;
  color: var(--mid-gray);
  line-height: 1;
  text-decoration-line: underline;
  text-decoration-color: transparent;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition: color 220ms ease, text-decoration-color 220ms ease, transform 220ms var(--ease-out);
}

.language-option:hover,
.language-option:focus-visible {
  color: var(--white);
  text-decoration-color: currentColor;
}

.language-option[aria-pressed="true"]:hover,
.language-option[aria-pressed="true"]:focus-visible {
  color: var(--ink);
}

.language-option[aria-pressed="true"] {
  color: var(--ink);
}

.language-option:active {
  transform: scale(0.9);
}

.language-option-cn {
  font-family: "Noto Sans SC";
  font-size: 16px;
  font-weight: 500;
  font-variation-settings: "wght" 500;
}

.language-option-en {
  font-family: "Geologica";
  font-size: 16px;
  font-weight: 400;
  font-variation-settings: "wght" 400, "CRSV" 0, "SHRP" 0, "slnt" 0;
  letter-spacing: 0.6px;
}

.page-stage {
  width: 100%;
  min-height: 0;
  padding-top: var(--header-height);
  background: var(--white);
}

.page-view {
  position: relative;
  width: 100%;
}

.page-view[hidden] {
  display: none;
}

.page-design-image {
  display: block;
  width: 100%;
  height: auto;
  user-select: none;
  -webkit-user-drag: none;
}

.page-route-hit {
  --page-route-underline-left: 16.041667vw;
  --page-route-underline-width: 5.381944vw;
  position: absolute;
  z-index: 1;
  left: 31.25%;
  width: 37.5%;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.page-route-hit::after {
  position: absolute;
  bottom: 1.25vw;
  left: var(--page-route-underline-left);
  width: var(--page-route-underline-width);
  height: 1px;
  background: var(--white);
  content: "";
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform 300ms var(--ease-out);
}

.page-route-hit:hover::after,
.page-route-hit:focus-visible::after {
  transform: scaleX(1);
  transform-origin: left center;
}

.page-route-hit:focus-visible {
  outline: 2px solid var(--white);
  outline-offset: -5px;
}

.page-route-hit-career-cn {
  --page-route-underline-left: 16.041667vw;
  --page-route-underline-width: 5.381944vw;
  top: 88.696172%;
  height: 4.126794%;
}

.page-route-hit-career-en {
  --page-route-underline-left: 15.208333vw;
  --page-route-underline-width: 7.048611vw;
  top: 87.796834%;
  height: 4.287599%;
}

.page-route-hit-contact-cn {
  --page-route-underline-left: 14.652778vw;
  --page-route-underline-width: 8.194444vw;
  top: 85.280374%;
  height: 5.373832%;
}

.page-route-hit-contact-en {
  --page-route-underline-left: 14.791667vw;
  --page-route-underline-width: 7.847222vw;
  top: 86.535662%;
  height: 4.730713%;
}

.site-footer {
  position: relative;
  width: 100%;
  height: 528px;
  padding: 51px var(--footer-margin) 40px;
  background: var(--footer-background);
}

.footer-top {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: 20px;
  width: 100%;
}

.footer-logo {
  grid-column: 1 / span 3;
  align-self: start;
  justify-self: start;
  width: 296px;
  height: 68px;
}

.footer-logo img {
  width: 296px;
  height: 68px;
}

.footer-navigation {
  display: grid;
  grid-column: 7 / 13;
  align-self: start;
  margin-top: 0;
}

.footer-route {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 94px;
  overflow: hidden;
  padding: 0 6px 0 0;
  color: var(--ink);
  isolation: isolate;
}

.footer-route:first-child {
  height: 86px;
}

.footer-route::after {
  position: absolute;
  right: 6px;
  bottom: 0;
  left: 2px;
  height: 0.5px;
  background: var(--ink);
  content: "";
  transition: background-color 180ms ease;
}

.footer-route-number,
.footer-route-label {
  position: relative;
  z-index: 1;
  text-decoration-line: underline;
  text-decoration-color: transparent;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.25em;
  transition: color 220ms ease, text-decoration-color 220ms ease;
}

.footer-route-number {
  font-family: "Geologica";
  font-size: 24px;
  font-weight: 400;
  font-variation-settings: "wght" 400, "CRSV" 0, "SHRP" 0, "slnt" 0;
  letter-spacing: 0;
  line-height: 1;
}

.footer-route-label {
  font-family: "Geologica";
  font-size: 24px;
  font-weight: 400;
  font-variation-settings: "wght" 400, "CRSV" 0, "SHRP" 0, "slnt" 0;
  letter-spacing: 0;
  line-height: 1;
}

.footer-route:hover .footer-route-number,
.footer-route:focus-visible .footer-route-number,
.footer-route:hover .footer-route-label,
.footer-route:focus-visible .footer-route-label {
  text-decoration-color: currentColor;
}

.footer-route:active,
.footer-route.is-clicked {
  transform: scale(0.992);
  transition: transform 80ms ease;
}

.footer-bottom {
  position: absolute;
  right: var(--footer-margin);
  bottom: 0;
  left: var(--footer-margin);
  font-family: "Geologica";
  font-size: 14px;
  font-weight: 400;
  font-variation-settings: "wght" 400, "CRSV" 0, "SHRP" 0, "slnt" 0;
  line-height: 1;
}

.footer-copyright {
  position: absolute;
  bottom: 34px;
  left: 0;
  color: var(--mid-gray);
  white-space: nowrap;
}

.footer-static-labels {
  position: absolute;
  right: 7px;
  bottom: 43px;
  display: flex;
  align-items: center;
  gap: 45px;
  color: var(--mid-gray);
  white-space: nowrap;
  user-select: text;
}

.footer-static-labels span {
  cursor: default;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 900px) {
  :root {
    --header-height: 92px;
    --header-margin: 20px;
    --footer-margin: 24px;
  }

  .header-actions {
    gap: clamp(18px, 4vw, 36px);
  }

  .header-link {
    font-size: 16px;
    letter-spacing: 0;
  }

  .site-footer {
    height: auto;
    min-height: 620px;
    padding-top: 40px;
  }

  .footer-top {
    display: flex;
    flex-direction: column;
    gap: 70px;
  }

  .footer-navigation {
    width: 100%;
  }

  .footer-bottom {
    position: static;
    display: flex;
    flex-direction: column-reverse;
    gap: 28px;
    padding-top: 92px;
  }

  .footer-copyright,
  .footer-static-labels {
    position: static;
  }

  .footer-static-labels {
    flex-wrap: wrap;
    gap: 18px 28px;
  }
}

@media (max-width: 620px) {
  .header-actions {
    gap: 14px;
  }

  .header-link {
    display: none;
  }

  .footer-logo,
  .footer-logo img {
    width: min(296px, 78vw);
    height: auto;
  }

  .footer-route-label {
    font-size: 24px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* Career position interactions and job detail pages. Header, footer and Contact rules above stay locked. */
.career-job-hit {
  --career-underline-top: 5.694444vw;
  --career-underline-width: 18vw;
  position: absolute;
  z-index: 2;
  left: 50.694444%;
  width: 44.375%;
  cursor: pointer;
  isolation: isolate;
  transform: translate3d(0, 0, 0) scale(1);
  transform-origin: center;
  transition: transform 120ms ease;
  -webkit-tap-highlight-color: transparent;
}

.career-job-hit::after {
  position: absolute;
  top: var(--career-underline-top);
  left: 0;
  width: var(--career-underline-width);
  height: 1px;
  background: var(--ink);
  content: "";
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform 300ms var(--ease-out);
}

.career-job-hit:hover::after,
.career-job-hit:focus-visible::after {
  transform: scaleX(1);
  transform-origin: left center;
}

.career-job-hit:active,
.career-job-hit.is-clicked {
  transform: translate3d(0, 1px, 0) scale(0.992);
  transition-duration: 70ms;
}

.career-job-hit:focus-visible {
  outline: 1px solid var(--ink);
  outline-offset: 3px;
}

.career-job-hit-cn.career-job-hit-1 {
  --career-underline-top: 6.875vw;
  --career-underline-width: 20.138889vw;
  top: 49.027778vw;
  height: 10.625vw;
}

.career-job-hit-cn.career-job-hit-2 {
  --career-underline-top: 5.694444vw;
  --career-underline-width: 16.597222vw;
  top: 61.388889vw;
  height: 11.319444vw;
}

.career-job-hit-cn.career-job-hit-3 {
  --career-underline-top: 5.694444vw;
  --career-underline-width: 29.236111vw;
  top: 74.444444vw;
  height: 11.319444vw;
}

.career-job-hit-cn.career-job-hit-4 {
  --career-underline-top: 5.694444vw;
  --career-underline-width: 17.847222vw;
  top: 87.5vw;
  height: 9.027778vw;
}

.career-job-hit-en.career-job-hit-1 {
  --career-underline-top: 5.625vw;
  --career-underline-width: 26.736111vw;
  top: 49.027778vw;
  height: 7.986111vw;
}

.career-job-hit-en.career-job-hit-2 {
  --career-underline-top: 4.513889vw;
  --career-underline-width: 34.861111vw;
  top: 58.75vw;
  height: 8.680556vw;
}

.career-job-hit-en.career-job-hit-3 {
  --career-underline-top: 4.513889vw;
  --career-underline-width: 20.763889vw;
  top: 69.166667vw;
  height: 8.680556vw;
}

.career-job-hit-en.career-job-hit-4 {
  --career-underline-top: 4.513889vw;
  --career-underline-width: 32.569444vw;
  top: 79.583333vw;
  height: 6.527778vw;
}

.job-page {
  overflow: hidden;
}

.job-canvas {
  --job-base-height: 79.166667vw;
  position: relative;
  width: 100%;
  min-height: var(--job-base-height);
  overflow: hidden;
  color: var(--ink);
  background: var(--white);
}

.job-design-image {
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
}

.job-content-cover {
  position: absolute;
  z-index: 1;
  top: 15.277778vw;
  right: 0;
  bottom: 0;
  left: 48.611111%;
  background: var(--white);
}

.job-title-layer {
  position: absolute;
  z-index: 2;
  top: 7.222222vw;
  left: 18.75%;
  width: 27.777778%;
  min-height: 15vw;
  padding: 0.694444vw 0.833333vw 0.833333vw
    1.527778vw;
  background: var(--white);
}

.job-title-layer h1 {
  max-width: 25vw;
  margin: 0;
  color: var(--ink);
  font-weight: 500;
  letter-spacing: 0;
}

.job-canvas[data-language="cn"] .job-title-layer h1 {
  font-family: "Noto Sans SC";
  font-size: 2.222222vw;
  font-variation-settings: "wght" 500;
  line-height: 1.38;
}

.job-canvas[data-language="en"] .job-title-layer h1 {
  font-family: "Geologica";
  font-size: 1.944444vw;
  font-variation-settings: "wght" 500, "CRSV" 0, "SHRP" 0, "slnt" 0;
  line-height: 1.27;
}

.job-generated-overview {
  position: relative;
  z-index: 2;
  width: 44.305556%;
  padding-top: 16.805556vw;
  padding-bottom: 11.111111vw;
  margin-left: 50.694444%;
  color: var(--ink);
}

.job-generated-overview[hidden] {
  display: none;
}

.job-generated-overview,
.job-generated-overview button {
  font-synthesis: none;
}

.job-canvas[data-language="cn"] .job-generated-overview {
  font-family: "Noto Sans SC";
}

.job-canvas[data-language="en"] .job-generated-overview {
  font-family: "Geologica";
}

.generated-job-section {
  margin: 0;
}

.generated-job-section + .generated-job-section {
  margin-top: 3.75vw;
}

.generated-job-heading {
  margin: 0 0 2.152778vw;
  color: var(--ink);
  font-size: 1.666667vw;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.25;
}

.job-canvas[data-language="cn"] .generated-job-heading {
  font-family: "Noto Sans SC";
  font-variation-settings: "wght" 500;
}

.job-canvas[data-language="en"] .generated-job-heading {
  font-family: "Geologica";
  font-variation-settings: "wght" 500, "CRSV" 0, "SHRP" 0, "slnt" 0;
}

.generated-job-list {
  padding: 0 0 0 1.527778vw;
  margin: 0;
  color: var(--ink);
  font-size: 1.25vw;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.47;
}

.job-canvas[data-language="cn"] .generated-job-list {
  font-family: "Noto Sans SC";
  font-variation-settings: "wght" 400;
}

.job-canvas[data-language="en"] .generated-job-list {
  font-family: "Geologica";
  font-variation-settings: "wght" 400, "CRSV" 0, "SHRP" 0, "slnt" 0;
}

.generated-job-list li {
  padding-left: 0.138889vw;
}

.generated-job-list li + li {
  margin-top: 0.555556vw;
}

.generated-application-button,
.job-submit-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 27.777778vw;
  height: 3.472222vw;
  padding: 0 1.388889vw;
  border: 0;
  border-radius: 999px;
  cursor: pointer;
  transition: color 180ms ease, transform 220ms var(--ease-out);
}

.generated-application-button {
  margin-top: 5.694444vw;
  color: var(--white);
  background: var(--ink);
}

.job-submit-button {
  color: transparent;
  background: transparent;
}

.job-canvas[data-language="cn"] .generated-application-button,
.job-canvas[data-language="cn"] .job-submit-button {
  font-family: "Noto Sans SC";
  font-size: 1.25vw;
  font-weight: 500;
  font-variation-settings: "wght" 500;
  letter-spacing: 0;
}

.job-canvas[data-language="en"] .generated-application-button,
.job-canvas[data-language="en"] .job-submit-button {
  font-family: "Geologica";
  font-size: 1.111111vw;
  font-weight: 500;
  font-variation-settings: "wght" 500, "CRSV" 0, "SHRP" 0, "slnt" 0;
  letter-spacing: 0;
}

.generated-application-button > span:first-child {
  text-decoration-line: underline;
  text-decoration-color: transparent;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.277778vw;
  transition: text-decoration-color 220ms ease;
}

.generated-application-button:hover > span:first-child,
.generated-application-button:focus-visible > span:first-child {
  text-decoration-color: currentColor;
}

.job-submit-button::after {
  position: absolute;
  bottom: 0.625vw;
  left: var(--submit-underline-left, 11.736111vw);
  width: var(--submit-underline-width, 4.305556vw);
  height: 1px;
  background: var(--white);
  content: "";
  opacity: 0;
  transform: scaleX(0);
  transform-origin: right center;
  transition: opacity 180ms ease, transform 300ms var(--ease-out);
}

.job-submit-button:hover:not(:disabled)::after,
.job-submit-button:focus-visible:not(:disabled)::after {
  opacity: 1;
  transform: scaleX(1);
  transform-origin: left center;
}

.job-canvas[data-language="cn"] .job-submit-button {
  --submit-underline-left: 11.736111vw;
  --submit-underline-width: 4.305556vw;
}

.job-canvas[data-language="en"] .job-submit-button {
  --submit-underline-left: 8.923611vw;
  --submit-underline-width: 9.930556vw;
}

.generated-application-button:active,
.generated-application-button.is-clicked,
.job-submit-button:active:not(:disabled),
.job-submit-button.is-clicked:not(:disabled) {
  transform: translate3d(0, 1px, 0) scale(0.985);
  transition-duration: 80ms;
}

.button-arrow {
  display: inline-block;
  font-family: "Geologica";
  transition: transform 260ms var(--ease-out);
}

.job-transparent-control {
  position: absolute;
  z-index: 5;
  border: 0;
  border-radius: 2px;
  color: transparent;
  background: transparent;
  cursor: pointer;
  transition: transform 120ms ease;
}

.job-transparent-control:focus-visible,
.generated-application-button:focus-visible,
.job-field-control:focus-visible,
.job-file-input:focus-visible,
.job-submit-button:focus-visible {
  outline: 1px solid var(--ink);
  outline-offset: 3px;
}

.job-transparent-control:active,
.job-transparent-control.is-clicked {
  transform: scale(0.97);
  transition-duration: 70ms;
}

.job-back-control {
  top: 7.222222vw;
  left: 3.75%;
  width: 4.583333vw;
  height: 4.583333vw;
  border-radius: 999px;
}

.job-back-control:hover,
.job-back-control:focus-visible {
  transform: translate3d(-0.208333vw, 0, 0);
}

.job-tab-control {
  --tab-underline-left: 0.555556vw;
  --tab-underline-width: 6.666667vw;
  top: 7.083333vw;
  height: 5.277778vw;
}

.job-tab-control::after,
.job-overview-cta-hit::after {
  position: absolute;
  height: 1px;
  content: "";
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform 300ms var(--ease-out);
}

.job-tab-control::after {
  bottom: 1.111111vw;
  left: var(--tab-underline-left);
  width: var(--tab-underline-width);
  background: var(--ink);
}

.job-tab-control:hover::after,
.job-tab-control:focus-visible::after,
.job-overview-cta-hit:hover::after,
.job-overview-cta-hit:focus-visible::after {
  transform: scaleX(1);
  transform-origin: left center;
}

.job-canvas[data-language="cn"] .job-tab-overview,
.job-canvas[data-language="cn"] .job-tab-application {
  --tab-underline-width: 6.666667vw;
}

.job-canvas[data-language="en"] .job-tab-overview {
  --tab-underline-width: 6.458333vw;
}

.job-canvas[data-language="en"] .job-tab-application {
  --tab-underline-width: 8.541667vw;
}

.job-tab-overview {
  left: 50.138889%;
  width: 11.805556%;
}

.job-tab-application {
  left: 63.541667%;
  width: 14.236111%;
}

.job-overview-cta-hit {
  --overview-cta-underline-left: 11.805556vw;
  --overview-cta-underline-width: 4.236111vw;
  left: 50.694444%;
  width: 27.777778%;
  border-radius: 999px;
}

.job-overview-cta-hit::after {
  bottom: 0.625vw;
  left: var(--overview-cta-underline-left);
  width: var(--overview-cta-underline-width);
  background: var(--white);
}

.job-canvas[data-language="cn"] .job-overview-cta-hit {
  --overview-cta-underline-left: 11.805556vw;
  --overview-cta-underline-width: 4.236111vw;
}

.job-canvas[data-language="en"] .job-overview-cta-hit {
  --overview-cta-underline-left: 9.340278vw;
  --overview-cta-underline-width: 9.0625vw;
}

.job-canvas[data-language="cn"] .job-overview-cta-hit {
  top: 64.375vw;
  height: 3.680556vw;
}

.job-canvas[data-language="en"] .job-overview-cta-hit {
  top: 88.611111vw;
  height: 3.472222vw;
}

.job-application-form {
  position: absolute;
  z-index: 4;
  inset: 0;
  pointer-events: none;
}

.job-application-form[hidden] {
  display: none;
}

.job-field-control,
.job-file-control,
.job-submit-button {
  position: absolute;
  left: 50.694444%;
  pointer-events: auto;
}

.job-field-control,
.job-file-control {
  width: 44.305556%;
  border: 0;
  border-radius: 0;
  color: var(--ink);
  background: transparent;
  box-shadow: none;
  font-size: 1.111111vw;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.35;
  transition: background-color 180ms ease, box-shadow 180ms ease;
}

.job-canvas[data-language="cn"] .job-field-control,
.job-canvas[data-language="cn"] .job-file-control {
  font-family: "Noto Sans SC";
  font-variation-settings: "wght" 400;
}

.job-canvas[data-language="en"] .job-field-control,
.job-canvas[data-language="en"] .job-file-control {
  font-family: "Geologica";
  font-variation-settings: "wght" 400, "CRSV" 0, "SHRP" 0, "slnt" 0;
}

.job-field-control {
  padding: 0 1.25vw;
  outline: 0;
  resize: none;
  appearance: none;
}

.job-field-control:focus,
.job-field-control:not(:placeholder-shown) {
  background: var(--footer-background);
  box-shadow: inset 0 0 0 1px rgb(30 30 30 / 9%);
}

.job-field-control:-webkit-autofill,
.job-field-control:-webkit-autofill:hover,
.job-field-control:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--ink);
  box-shadow: 0 0 0 1000px var(--footer-background) inset;
  transition: background-color 9999s ease-out 0s;
}

.job-file-control {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  cursor: pointer;
}

.job-file-control::after {
  position: absolute;
  bottom: 2.638889vw;
  left: 50%;
  width: var(--file-underline-width, 5.555556vw);
  height: 1px;
  background: var(--ink);
  content: "";
  transform: translateX(-50%) scaleX(0);
  transform-origin: right center;
  transition: transform 300ms var(--ease-out);
}

.job-file-control:hover::after,
.job-file-control:focus-within::after {
  transform: translateX(-50%) scaleX(1);
  transform-origin: left center;
}

.job-canvas[data-language="en"] .job-file-control {
  --file-underline-width: 7.916667vw;
}

.job-file-control.has-file::after {
  display: none;
}

.job-file-control.has-file:hover .job-file-name,
.job-file-control.has-file:focus-within .job-file-name {
  text-decoration-line: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.208333vw;
}

.job-file-control.has-file {
  justify-content: flex-start;
  padding: 0 1.25vw;
  background: var(--footer-background);
}

.job-file-input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
  opacity: 0;
}

.job-file-name {
  position: relative;
  z-index: 1;
  display: block;
  max-width: 100%;
  overflow: hidden;
  color: var(--ink);
  text-overflow: ellipsis;
  white-space: nowrap;
  pointer-events: none;
}

.job-submit-button {
  width: 27.777778%;
}

.job-submit-button.is-submitted,
.job-submit-button:disabled {
  color: var(--white);
  background: var(--mid-gray);
  cursor: default;
}

.job-canvas[data-language="cn"] .job-field-1 {
  top: 19.861111vw;
  height: 3.194444vw;
}

.job-canvas[data-language="cn"] .job-field-2 {
  top: 27.569444vw;
  height: 3.194444vw;
}

.job-canvas[data-language="cn"] .job-field-3 {
  top: 35.277778vw;
  height: 3.194444vw;
}

.job-canvas[data-language="cn"] .job-field-4 {
  top: 42.986111vw;
  height: 3.194444vw;
}

.job-canvas[data-language="cn"] .job-field-5 {
  top: 50.694444vw;
  height: 8.333333vw;
}

.job-canvas[data-language="cn"] .job-field-6 {
  top: 63.541667vw;
  height: 8.333333vw;
  padding-top: 0.972222vw;
}

.job-canvas[data-language="cn"] .job-submit-button {
  top: 77.708333vw;
  height: 3.402778vw;
}

.job-canvas[data-language="en"] .job-field-1 {
  top: 19.236111vw;
  height: 3.194444vw;
}

.job-canvas[data-language="en"] .job-field-2 {
  top: 26.666667vw;
  height: 3.194444vw;
}

.job-canvas[data-language="en"] .job-field-3 {
  top: 34.097222vw;
  height: 3.194444vw;
}

.job-canvas[data-language="en"] .job-field-4 {
  top: 41.527778vw;
  height: 3.194444vw;
}

.job-canvas[data-language="en"] .job-field-5 {
  top: 48.958333vw;
  height: 8.333333vw;
}

.job-canvas[data-language="en"] .job-field-6 {
  top: 61.527778vw;
  height: 8.333333vw;
  padding-top: 0.972222vw;
}

.job-canvas[data-language="en"] .job-submit-button {
  top: 75.694444vw;
  height: 3.472222vw;
}

@media (max-width: 620px) {
  .job-title-layer {
    left: 17.5%;
    width: 30%;
  }
}
