.figma-mobile-colleague,
.figma-mobile-filters,
.figma-mobile-jobs,
.figma-apply-confirm,
.mobile-detail-salary,
.mobile-process-image {
  display: none;
}

/* Footer legal links use the same left-to-right underline as the official site. */
.page .footer .copyright > a {
  position: relative;
  color: inherit;
  text-decoration: none;
}

.page .footer .copyright > a::after {
  content: "" !important;
  position: absolute;
  right: 0;
  bottom: -3px;
  left: 0;
  display: block !important;
  width: auto;
  height: 1px;
  background: currentColor;
  transform: scaleX(0) !important;
  transform-origin: left center;
  transition: transform 0.28s cubic-bezier(0.2, 0.7, 0.2, 1);
}

.page .footer .copyright > a:hover::after,
.page .footer .copyright > a:focus-visible::after {
  transform: scaleX(1) !important;
}

.success-mobile-nav {
  display: none;
}

.legal-mobile-nav {
  display: none;
}

@media (max-width: 639px) {
  :root {
    --mobile-blue: #1873f3;
    --mobile-ink: #12181f;
    --mobile-body: #3a3a3a;
    --mobile-muted: #909090;
    --mobile-line: #d9d9d9;
  }

  button,
  a,
  [role="button"],
  input[type="button"],
  input[type="submit"],
  input[type="reset"] {
    -webkit-tap-highlight-color: transparent;
  }

  button:focus,
  button:focus-visible,
  a:focus,
  a:focus-visible,
  [role="button"]:focus,
  [role="button"]:focus-visible,
  input[type="button"]:focus,
  input[type="button"]:focus-visible,
  input[type="submit"]:focus,
  input[type="submit"]:focus-visible,
  input[type="reset"]:focus,
  input[type="reset"]:focus-visible {
    outline: none !important;
  }

  html,
  body {
    width: 100%;
    min-width: 0;
    min-height: 0;
    margin: 0;
    overflow-x: hidden;
    background: #fff;
    scrollbar-width: none;
  }

  html::-webkit-scrollbar,
  body::-webkit-scrollbar {
    display: none;
  }

  .page {
    width: 100%;
    min-width: 0;
    background: #fff;
  }

  .reveal,
  .reveal.is-visible {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  /* Shared header from Figma Header/PageHeader. */
  .topbar,
  .topbar-inner,
  .mobile-jobs-header {
    box-sizing: border-box;
    width: 100%;
    height: 52px;
  }

  .topbar {
    padding: 0;
  }

  .topbar-inner,
  .mobile-jobs-header {
    padding: 16px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  .jobs-mobile-back-link {
    display: flex;
  }

  .jobs-page .mobile-jobs-header {
    display: none !important;
  }

  .topbar-inner::after {
    content: "关于云览";
    height: 20px;
    display: flex;
    align-items: center;
    color: #000;
    font-family: "Noto Sans SC", sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
  }

  .hero-logo-link,
  .mobile-jobs-header a {
    width: 149.333px;
    height: 20px;
    display: flex;
    align-items: center;
    align-self: center;
    gap: 5.333px;
  }

  .page:not(.recruit-page) .topbar-inner::after {
    display: none !important;
    content: none !important;
  }

  .page:not(.recruit-page) .intermediate-about-link {
    position: absolute;
    top: 16px;
    right: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    color: #000;
    font-family: "Noto Sans SC", sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    text-decoration: none;
  }

  .hero-logo-link::after,
  .mobile-jobs-header a::after {
    content: "校园招聘";
    box-sizing: border-box;
    width: 64.667px;
    height: 20px;
    padding: 1.333px 5.333px;
    border-radius: 4px;
    background: var(--mobile-blue);
    color: #fff;
    font-family: "SF Pro", Arial, sans-serif;
    font-size: 13.333px;
    font-weight: bolder;
    line-height: 17.432px;
    letter-spacing: .133px;
    white-space: nowrap;
  }

  .hero-logo-link .brand,
  .mobile-jobs-header img {
    content: url("https://akoss.bangcdn.net/cms/logo-company.webp");
    width: 79.333px !important;
    height: 20px !important;
    max-width: none !important;
    object-fit: cover;
    object-position: right center;
  }

  /* homepage-mobile: 430 x 3377.3726 */
  .page:not(.recruit-page) .hero {
    position: relative;
    width: 100%;
    height: 100svh !important;
    min-height: 100svh !important;
    overflow: hidden;
  }

  .page:not(.recruit-page) .hero-bg {
    content: url("https://akoss.bangcdn.net/cms/%E6%8B%9B%E8%81%98hero-8k%20%281%29.webp");
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    transform: none !important;
    animation: none !important;
    filter: none !important;
  }

  .page:not(.recruit-page) .topbar {
    position: absolute;
    inset: 0 0 auto;
    z-index: 5;
  }

  .page:not(.recruit-page) .desktop-hero-title,
  .page:not(.recruit-page) .hero-line {
    display: none !important;
  }

  .page:not(.recruit-page) .hero > .join-cta.deliver-button {
    box-sizing: border-box;
    position: absolute !important;
    z-index: 4;
    left: 50% !important;
    right: auto !important;
    top: auto !important;
    bottom: 62px !important;
    width: 138.636px !important;
    height: 40px !important;
    min-width: 138.636px;
    min-height: 40px;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    overflow: hidden;
    border: 0;
    border-radius: 90.909px;
    background: #f8f8f8;
    opacity: 1 !important;
    transform: translateX(-50%) !important;
  }

  .page:not(.recruit-page) .hero > .join-cta .join-cta-fill {
    position: absolute !important;
    left: 2.727px !important;
    top: 2.727px !important;
    width: 34.545px;
    height: 34.545px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 50%;
    background: var(--mobile-blue);
    transition: none;
  }

  .page:not(.recruit-page) .hero > .join-cta .deliver-icon,
  .page:not(.recruit-page) .hero > .join-cta .deliver-icon svg {
    width: 23.636px;
    height: 23.636px;
  }

  .page:not(.recruit-page) .hero > .join-cta .deliver-icon {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .page:not(.recruit-page) .hero > .join-cta .join-cta-hover-text {
    display: none !important;
  }

  .page:not(.recruit-page) .hero > .join-cta .join-cta-label {
    position: absolute !important;
    left: 55.455px !important;
    top: 10.4px !important;
    right: auto !important;
    bottom: auto !important;
    width: 65px;
    height: 19px;
    display: block;
    color: var(--mobile-blue);
    font-family: "Noto Sans SC", sans-serif;
    font-size: 16px;
    font-weight: bolder;
    line-height: 19.2px;
    letter-spacing: .16px;
    white-space: nowrap;
    opacity: 1 !important;
    transform: none !important;
  }

  .page:not(.recruit-page) .hero::after {
    content: "";
    position: absolute;
    left: calc(50% + 40px);
    top: 210px;
    width: 1361px;
    height: 224px;
    background: url("https://akoss.bangcdn.net/cms/%E8%A3%85%E9%A5%B0%E6%A0%87%E9%A2%98-%E7%A7%BB%E5%8A%A82.svg") center / 100% 100% no-repeat;
    transform: translateX(-50%) scale(0.75);
    transform-origin: center top;
    z-index: 2;
    pointer-events: none;
  }

  .page:not(.recruit-page) .section {
    box-sizing: border-box;
    width: 100%;
    padding-left: 20px;
    padding-right: 20px;
  }

  .page:not(.recruit-page) .section-title {
    width: auto;
    height: 29px;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 16px;
  }

  .page:not(.recruit-page) .section-title > span {
    width: 5px !important;
    height: 23px !important;
    flex: 0 0 5px !important;
    border-radius: 0 !important;
    background: var(--mobile-blue);
  }

  .page:not(.recruit-page) .section-title h2 {
    margin: 0;
    color: var(--mobile-ink);
    font-family: "Noto Sans SC", sans-serif;
    font-size: 24px;
    font-weight: bolder;
    line-height: 28.8px;
    letter-spacing: 0;
  }

  .why {
    height: 799px;
    min-height: 799px;
    padding-top: 64px;
    padding-bottom: 64px;
  }

  .why-grid {
    width: min(390px, 100%);
    height: 606px;
    margin: 36px auto 0;
    display: flex;
    flex-direction: column;
    gap: 36px !important;
  }

  .why-card {
    box-sizing: border-box;
    width: 100%;
    min-height: 0;
    padding: 0 !important;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 16px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  body .page #mobile-why .why-grid .why-card {
    padding: 0 !important;
  }

  .why-card:nth-child(1),
  .why-card:nth-child(2),
  .why-card:nth-child(3),
  .why-card:nth-child(4),
  .why-card:nth-child(5),
  .why-card:nth-child(6) {
    height: 71px;
    min-height: 71px;
  }
  .why-card:nth-child(1) img { content: url("https://akoss.bangcdn.net/cms/%E5%85%B3%E5%BF%83%E6%88%90%E9%95%BF.svg"); }
  .why-card:nth-child(2) img { content: url("https://akoss.bangcdn.net/cms/ai%E6%94%AF%E6%8C%81.svg"); }
  .why-card:nth-child(3) img { content: url("https://akoss.bangcdn.net/cms/%E5%BC%80%E6%94%BE%E5%B9%B3%E7%AD%89.svg"); }
  .why-card:nth-child(4) img { content: url("https://akoss.bangcdn.net/cms/%E5%AE%89%E5%BF%83%E4%BF%9D%E9%9A%9C.svg"); }
  .why-card:nth-child(5) img { content: url("https://akoss.bangcdn.net/cms/%E5%9B%A2%E9%98%9F%E5%85%B3%E6%80%80.svg"); }
  .why-card:nth-child(6) img { content: url("https://akoss.bangcdn.net/cms/%E4%BE%BF%E5%88%A9%E5%8A%9E%E5%85%AC.svg"); }

  .why-card img {
    width: 60px;
    height: 60px;
    flex: 0 0 60px;
    object-fit: contain;
  }

  .why-card > div {
    width: auto;
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: flex-start;
    text-align: left;
  }

  .why-card h3 {
    width: 100%;
    margin: 0;
    color: #000;
    font-family: "Noto Sans SC", sans-serif;
    font-size: 16px;
    font-weight: bolder;
    line-height: 19.2px;
    text-align: left;
  }

  .why-card p {
    width: 100%;
    margin: 0;
    color: #3a3a3a;
    font-family: "Noto Sans SC", sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 21px;
    text-align: left;
  }

  .why-card p br { display: none; }

  .colleagues {
    height: 723.373px;
    min-height: 723.373px;
    padding-top: 0;
    padding-bottom: 44px;
  }

  .colleague-panel {
    width: 390px;
    height: 546.373px;
    margin: 36px auto 0;
    position: relative;
    display: block;
    overflow: hidden;
  }

  .figma-mobile-colleague { display: none !important; }
  .colleague-panel > .person-card {
    box-sizing: border-box;
    width: 390px;
    height: 546.373px;
    padding: 0;
    position: relative;
    display: none !important;
    opacity: 1;
    pointer-events: auto;
    transform: none;
  }

  .colleague-panel > .person-card.is-visible-card {
    display: block !important;
  }

  .colleague-panel .hover-quote {
    box-sizing: border-box;
    left: 26px;
    top: 0;
    width: 338px;
    height: 230.6px;
    padding: 42px 31.5px 41.6px;
    border-radius: 7.137px;
    opacity: 1;
    pointer-events: none;
    transform: none;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .colleague-panel .hover-quote::after {
    left: 41px;
    bottom: -22px;
    width: 44px;
    height: 44px;
  }

  .colleague-panel .hover-quote p {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 275px;
    margin: 0;
    font-family: "PingFang SC", sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 18.303px;
  }

  .colleague-panel .quote-mark {
    font-size: 57.097px;
    line-height: 74.649px;
  }

  .colleague-panel .quote-open { left: 13px; top: 4.2px; }
  .colleague-panel .quote-close { right: 6px; bottom: -22px; }

  .colleague-panel .person-visual {
    position: absolute;
    left: 52.2px;
    top: 230.6px;
    width: 285.6px;
    height: 247px;
    overflow: hidden;
  }

  .colleague-panel .quote-shape {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 285.6px;
    height: 184px;
  }

  .colleague-panel .person-avatar,
  .colleague-panel .person-avatar.isaac,
  .colleague-panel .person-avatar.boya,
  .colleague-panel .person-avatar.new-person-a,
  .colleague-panel .person-avatar.new-person-b {
    left: 50%;
    bottom: 0;
    width: auto;
    height: 247px;
    max-width: 250px;
    transform: translateX(-50%);
    object-fit: contain;
  }

  .colleague-panel > .person-card > h3 {
    position: absolute;
    top: 488px;
    left: 0;
    width: 100%;
    margin: 0;
    font-family: "SF Pro", Arial, sans-serif;
    font-size: 20px;
    font-weight: bolder;
    line-height: 24px;
    text-align: center;
  }

  .colleague-panel > .person-card > p {
    position: absolute;
    top: 520px;
    left: 0;
    width: 100%;
    margin: 0;
    font-family: "PingFang SC", sans-serif;
    font-size: 14px;
    line-height: 18.303px;
    text-align: center;
  }

  .figma-mobile-colleague {
    width: 390px;
    height: 546.373px;
    display: block;
    position: relative;
  }

  .figma-mobile-quote {
    position: relative;
    width: 338px;
    height: 230.6px;
    margin-left: 26px;
  }

  .figma-mobile-quote::after {
    content: "";
    position: absolute;
    left: 41px;
    bottom: 0;
    border: 22px solid transparent;
    border-top-color: var(--mobile-blue);
    transform: rotate(12deg);
  }

  .figma-mobile-quote {
    box-sizing: border-box;
    padding: 42px 31.5px 41.6px;
    border-radius: 7.137px;
    background: var(--mobile-blue);
    color: #fff;
  }

  .figma-mobile-quote > span {
    position: absolute;
    font-family: Roboto, sans-serif;
    font-size: 57.097px;
    font-weight: 400;
    line-height: 74.649px;
  }

  .figma-mobile-quote > span:first-child { left: 13px; top: 4.2px; }
  .figma-mobile-quote > span:last-child { right: 6px; bottom: -31.2px; }

  .figma-mobile-quote p {
    width: 275px;
    margin: 0;
    font-family: "PingFang SC", sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 18.303px;
  }

  .colleague-panel > .person-card[data-colleague="0"] .hover-quote p {
    font-size: 13px !important;
  }

  .figma-mobile-person {
    position: absolute;
    left: 52.2px;
    top: 230.6px;
    width: 285.6px;
    height: 315.8px;
    text-align: center;
  }

  .figma-mobile-person img {
    position: absolute;
    left: 0;
    top: 0;
    width: 285.562px;
    height: 315.752px;
    content: url("./assets/figma-mobile-colleague-frame.png");
    object-fit: contain;
  }

  .figma-mobile-person h3 {
    position: absolute;
    top: 264.9px;
    left: 0;
    width: 100%;
    margin: 0;
    font-family: "SF Pro", Arial, sans-serif;
    font-size: 20px;
    font-weight: bolder;
    line-height: 32px;
  }

  .figma-mobile-person p {
    position: absolute;
    top: 297.8px;
    left: 0;
    width: 100%;
    margin: 0;
    font-family: "PingFang SC", sans-serif;
    font-size: 14px;
    line-height: 18.303px;
  }

  .figma-mobile-person h3,
  .figma-mobile-person p {
    display: none;
  }

  .slider-controls {
    width: 390px;
    height: 32px;
    margin: 36px auto 0;
    display: flex;
    justify-content: center;
    gap: 30px;
  }

  .slider-controls .arrow { width: 32px; height: 32px; }

  .process {
    height: auto;
    min-height: 916.346px;
    padding-top: 0;
    padding-bottom: 64px;
  }

  .process-grid {
    width: 251px;
    height: auto;
    margin: 36px auto 0;
    display: grid !important;
    grid-template-columns: 1fr;
    grid-auto-rows: 1fr;
    gap: 32px;
  }

  .mobile-process-image {
    display: none !important;
  }

  .process-card {
    box-sizing: border-box;
    position: relative;
    width: 251px;
    height: auto;
    min-height: 0;
    padding: 48px 24px 24px;
    display: flex;
    flex: none;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 0;
    overflow: visible;
    border-radius: 5.516px;
    background: #f8f8f8;
    transform: none;
  }

  .process-card:last-child {
    height: auto;
    min-height: 0;
    flex-basis: auto;
  }

  .process-card:hover {
    transform: none;
  }

  .process-card::after {
    content: "";
    position: absolute;
    top: 27px;
    left: 50%;
    display: block;
    width: 18.68px;
    height: 4.67px;
    margin: 0;
    border-radius: 22px;
    background: #1873f3;
    filter: blur(5.82px);
    transform: translateX(-50%);
  }

  .process-card:nth-child(1)::after,
  .process-card:nth-child(2)::after,
  .process-card:nth-child(3)::after,
  .process-card:nth-child(4)::after {
    margin-left: 0;
  }

  .process-card > strong,
  .process-card > h3,
  .process-card > p {
    align-self: center;
  }

  .process-card > img {
    position: absolute;
    top: -22px;
    left: 50%;
    width: 44px;
    height: 50px;
    max-height: none;
    object-fit: contain;
    transform: translateX(-50%);
  }

  .process-card:nth-child(1) > img { margin-left: 6.47px; }
  .process-card:nth-child(2) > img { margin-left: 5.18px; }
  .process-card:nth-child(3) > img { margin-left: -5.18px; }

  .process-card:nth-child(4) > img {
    width: 46px;
    height: 52.273px;
    margin-left: 5.82px;
  }

  .process-card strong {
    margin: 0 0 10px;
    color: #1873f3;
    font-size: 13.239px;
    font-weight: 500;
    line-height: 15.886px;
  }

  .process-card strong span {
    color: #1873f3;
  }

  .process-card h3 {
    width: 203px;
    margin: 0 0 10px;
    color: #000;
    font-family: "Noto Sans SC", sans-serif;
    font-size: 16px;
    font-weight: bolder;
    line-height: 19.2px;
    letter-spacing: 0;
    text-align: center;
  }

  .process-card p {
    width: 203px;
    margin: 0;
    color: #3a3a3a;
    font-size: 14px;
    font-weight: 400;
    line-height: 21px;
    text-align: center;
  }

  .process-card p br {
    display: none;
  }
  .faq {
    height: 457px;
    min-height: 457px;
    padding-top: 0;
    padding-bottom: 64px;
  }

  .faq-list {
    width: 390px;
    height: 328px;
    margin-top: 36px;
  }

  .faq-list article {
    box-sizing: border-box;
    width: 390px;
    height: 109px;
    min-height: 0;
    flex: 0 0 109px;
    padding: 16px 0;
    border: 0;
    border-top: 1px solid var(--mobile-line);
    display: flex;
    flex-direction: column;
    gap: 10px;
  }

  .faq-list article:first-child { height: 110px; }
  .faq-list article:first-child { flex-basis: 110px; }
  .faq-list article:last-child { border-bottom: 1px solid var(--mobile-line); }
  .faq-list h3 { margin: 0; color: #1873f3; font-family: "Noto Sans SC", sans-serif; font-size: 16px; font-weight: bold; line-height: 24px; text-align: justify; }
  .faq-list p { margin: 0; color: #3a3a3a; font-family: "Noto Sans SC", sans-serif; font-size: 14px; font-weight: 400; line-height: 21px; text-align: justify; }

  .campus-cta {
    box-sizing: border-box;
    width: 100%;
    height: 210px;
    min-height: 210px;
    padding: 0 0 64px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px !important;
  }

  .campus-cta h2 {
    width: 296.962px;
    height: 58px;
    margin: 0;
    overflow: visible;
    color: #000;
    font-family: "Noto Sans SC", sans-serif;
    font-size: 24px;
    font-weight: 500;
    line-height: 28.8px;
    text-align: center;
    white-space: normal;
  }

  .campus-cta .join-cta {
    box-sizing: border-box;
    position: relative !important;
    inset: auto !important;
    width: 138.636px !important;
    height: 40px !important;
    min-width: 138.636px;
    min-height: 40px;
    margin: 0 !important;
    padding: 2.727px 18.182px 2.727px 2.727px !important;
    display: flex !important;
    flex: 0 0 40px;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 18.182px !important;
    overflow: hidden;
    border: 0;
    border-radius: 90.909px;
    background: #f8f8f8;
    transform: none !important;
  }

  .campus-cta .join-cta-fill {
    position: absolute !important;
    left: 2.727px !important;
    top: 2.727px !important;
    width: 34.545px;
    height: 34.545px;
    flex: 0 0 34.545px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 50%;
    background: var(--mobile-blue);
    transition: none;
  }

  .campus-cta .deliver-icon {
    width: 23.636px;
    height: 23.636px;
    flex: 0 0 23.636px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .campus-cta .deliver-icon svg {
    width: 23.636px;
    height: 23.636px;
  }

  .campus-cta .join-cta-hover-text {
    display: none !important;
  }

  .campus-cta .join-cta-label {
    position: absolute !important;
    left: 55.455px !important;
    top: 10.4px !important;
    right: auto !important;
    bottom: auto !important;
    width: 65px;
    height: 19px;
    flex: 0 0 65px;
    display: block;
    color: var(--mobile-blue);
    font-family: "Noto Sans SC", sans-serif;
    font-size: 16px;
    font-weight: bolder;
    line-height: 19.2px;
    letter-spacing: .16px;
    text-align: left;
    white-space: nowrap;
    opacity: 1;
    transform: none;
    transition: none;
  }

  /* Shared mobile footer. */
  .footer {
    box-sizing: border-box;
    width: 100%;
    height: 223px;
    min-height: 223px;
    padding: 0 20px;
    overflow: hidden !important;
    background: #fff;
  }

  .footer-inner {
    box-sizing: border-box;
    width: 100% !important;
    height: 223px !important;
    min-height: 223px !important;
    padding: 32px 0 !important;
    border-top: 1px solid #d9d9d9 !important;
    display: flex !important;
    flex-direction: column;
    align-items: flex-start;
    gap: 0 !important;
    background: #fff;
  }

  .footer .company-logo { display: none !important; }
  .footer .brand-blue,
  .footer .unified-footer-logo { content: url("https://akoss.bangcdn.net/cms/logo-company.webp"); width: 110px !important; height: 20px !important; max-width: none !important; flex: 0 0 20px !important; object-fit: fill; }
  .footer .socials { width: 130.909px !important; height: 32px !important; margin: 24px 0 0 !important; padding: 0 !important; display: flex; align-items: center; gap: 17.455px; }
  .footer .socials > span,
  .footer .socials .social-popover { width: 32px; height: 32px; flex: 0 0 32px; }
  .footer .socials > img,
  .footer .social-popover > img { box-sizing: border-box; width: 32px !important; height: 32px !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; object-fit: contain; cursor: pointer; }
  .footer .social-popover-backdrop { position: fixed; inset: 0; z-index: 1000; display: block; background: rgba(0, 0, 0, .45); opacity: 0; visibility: hidden; transition: opacity .2s ease, visibility .2s ease; }
  .footer .social-popover-panel { box-sizing: border-box; position: fixed; z-index: 1001; left: 50%; top: 50%; bottom: auto; width: min(360px, calc(100vw - 40px)); padding: 24px; border: 0; border-radius: 8px; display: block !important; background: #fff; box-shadow: 0 8px 24px rgba(18, 24, 31, .14); color: #12181f; opacity: 0; visibility: hidden; pointer-events: none; transform: translate(-50%, -50%) scale(.98); transition: opacity .2s ease, transform .2s ease, visibility .2s ease; }
  .footer .social-popover.is-open .social-popover-backdrop { opacity: 1; visibility: visible; }
  .footer .social-popover.is-open .social-popover-panel { opacity: 1; visibility: visible; pointer-events: auto; transform: translate(-50%, -50%) scale(1); }
  .footer .social-popover-panel > img { display: block; width: 100% !important; height: auto !important; padding: 0 !important; border: 0 !important; border-radius: 4px; object-fit: contain; }
  .footer .social-popover-panel b { display: block; margin-top: 12px; color: #12181f; font-family: "Noto Sans SC", sans-serif; font-size: 14px; font-weight: 400; line-height: 21px; text-align: center; }
  .footer .social-popover-panel .copy-email { width: 64px; height: 32px; margin: 16px auto 0; padding: 0; border: 0; border-radius: 16px; display: block; background: #1873f3; color: #fff; font-family: "Noto Sans SC", sans-serif; font-size: 14px; cursor: pointer; }
  .footer .copyright { width: 390px !important; height: 34px !important; margin: 48px 0 0 !important; padding: 0 !important; border: 0; display: flex; flex-wrap: wrap; align-items: flex-start !important; align-content: flex-start !important; justify-content: flex-start !important; gap: 0 8px !important; color: #64676a; font-family: "Noto Sans SC", sans-serif; font-size: 10px; font-weight: 400; line-height: 12px; text-align: left !important; }
  .footer .copyright > :first-child { width: 100%; flex: 0 0 100%; height: 12px; margin: 0 0 10px; padding: 0; border: 0; text-align: left !important; }
  .footer .copyright > a[href*="doc-share"] { display: none !important; }
  .footer .copyright > a[href*="doc-share"] + span { display: none !important; }
  .footer .copyright > a,
  .footer .copyright > span { height: 12px; margin: 0; padding: 0; color: #64676a; font: inherit; line-height: 12px; white-space: nowrap; }

  /* legal-pages-mobile: shared dimensions from the calibrated recruitment pages. */
  .legal-page .recruit-top { display: none !important; }
  .legal-page .legal-mobile-nav { position: relative; inset: auto; display: block; }
  .legal-page .legal-content { box-sizing: border-box; width: 100%; margin: 0; padding: 48px 20px 64px; color: var(--mobile-ink); }
  .legal-page .legal-content h1 { margin: 0 0 8px; color: var(--mobile-ink); font-family: "Noto Sans SC", sans-serif; font-size: 21px; font-weight: bolder; line-height: 25.2px; }
  .legal-page .legal-content .legal-updated { margin: 0; color: var(--mobile-muted); font-family: "Noto Sans SC", sans-serif; font-size: 12px; font-weight: 400; line-height: 18px; }
  .legal-page .legal-content h2 { margin: 32px 0 8px; color: var(--mobile-ink); font-family: "Noto Sans SC", sans-serif; font-size: 16px; font-weight: bolder; line-height: 24px; }
  .legal-page .legal-content p:not(.legal-updated) { margin: 0; color: var(--mobile-body); font-family: "Noto Sans SC", sans-serif; font-size: 14px; font-weight: 400; line-height: 24px; text-align: left; }

  /* job-listings-mobile: 390 x 1265 */
  .jobs-page { min-height: 1265px; }
  .jobs-page .jobs-hero,
  .jobs-page .jobs-shell,
  .jobs-page .footer { display: none !important; }

  .mobile-jobs-header {
    display: flex !important;
    background: #fff;
  }

  .mobile-jobs-header > span { color: #000; font-family: "Noto Sans SC", sans-serif; font-size: 14px; font-weight: 500; line-height: 16.8px; }

  .figma-mobile-filters {
    box-sizing: border-box;
    width: 100%;
    height: 53px;
    padding: 24px 20px 0;
    display: flex;
    gap: 10px;
  }

  .figma-mobile-filters button {
    box-sizing: border-box;
    height: 29px;
    padding: 0 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--mobile-line);
    border-radius: 9999px;
    background: #fff;
    color: #64676a;
    font-family: "Noto Sans SC", sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 16.8px;
    white-space: nowrap;
  }

  .figma-mobile-filters button:first-child { width: 60px; }
  .figma-mobile-filters button:not(:first-child) { width: 74px; }
  .figma-mobile-filters button.is-active { border-color: var(--mobile-blue); color: var(--mobile-blue); }

  .figma-mobile-jobs {
    box-sizing: border-box;
    width: 100%;
    height: auto;
    min-height: 1160px;
    padding: 0 20px 32px;
    display: flex;
    flex-direction: column;
  }

  .figma-mobile-empty {
    width: 100%;
    min-height: 520px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .figma-mobile-empty[hidden] { display: none; }
  .figma-mobile-empty img { width: 300px; height: auto; }
  .figma-mobile-empty p { margin: 20px 0 0; color: #909090; font-size: 18px; line-height: 26px; }

  .figma-mobile-job {
    box-sizing: border-box;
    width: 100%;
    height: 160px;
    flex: 0 0 160px;
    padding: 24px 0;
    border-bottom: 1px solid #e5e4e4;
    display: flex;
    flex-direction: column;
    gap: 12px;
    color: inherit;
    text-decoration: none;
  }

  .figma-mobile-job[hidden] { display: none; }
  .figma-mobile-job > div { width: 100%; display: flex; align-items: flex-start; gap: 12px; }
  .figma-mobile-job h3 { width: auto; min-width: 0; margin: 0; flex: 1 1 auto; color: var(--mobile-ink); font-family: "Noto Sans SC", sans-serif; font-size: 16px; font-weight: bolder; line-height: 20px; }
  .figma-mobile-job strong { width: auto; height: 19px; flex: 0 0 auto; color: var(--mobile-blue); font-family: "Noto Sans SC", sans-serif; font-size: 16px; font-weight: bold; line-height: 19.2px; text-align: right; white-space: nowrap; }
  .figma-mobile-job p { width: 100%; margin: 0; color: var(--mobile-muted); font-family: "Noto Sans SC", sans-serif; font-weight: 400; }
  .figma-mobile-job > p:nth-child(2) { height: 14px; font-size: 12px; line-height: 14.4px; }
  .figma-mobile-job > p:nth-child(3) { height: 54px; overflow: hidden; font-size: 13px; line-height: 18.2px; }
  .figma-mobile-job .job-description-label { height: 18px; line-height: 18.2px; }
  .figma-mobile-job .job-description-text { display: -webkit-box; height: 36px; overflow: hidden; line-height: 18.2px; white-space: pre-line; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }

  /* Shared 58px PageHeader. */
  .mobile-back-link {
    box-sizing: border-box;
    width: 100%;
    height: 58px;
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 0;
    color: #151515;
    font-family: "PingFang SC", sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 25.6px;
    letter-spacing: .16px;
  }

  .mobile-back-link img { width: 23.981px; height: 23.981px; flex: 0 0 23.981px; }

  /* job-detail-mobile: 390 x 1037 */
  .detail-page .recruit-top,
  .detail-page .footer { display: none !important; }

  .detail-page { height: auto; min-height: 0; overflow: visible; }
  .detail-page .detail-shell { box-sizing: border-box; width: 100%; height: auto; min-height: 0; margin: 0; padding: 20px; display: block; }
  .detail-page .detail-heading { width: 100%; height: 19px; margin: 0; }
  .detail-page .detail-heading > div { width: 100%; height: 19px; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 24px; }
  .detail-page .detail-heading h1 { width: auto; min-width: 0; height: 19px; margin: 0; flex: 1 1 auto; overflow: visible; color: var(--mobile-ink); font-family: "Noto Sans SC", sans-serif; font-size: 16px; font-weight: bolder; line-height: 19.2px; white-space: nowrap; }
  .detail-page .detail-heading strong { display: block; width: auto; height: 19px; flex: 0 0 auto; color: var(--mobile-blue); font-family: "Noto Sans SC", sans-serif; font-size: 16px; font-weight: bold; line-height: 19.2px; white-space: nowrap; }
  .detail-page .detail-meta { width: 175.333px; height: 24px; margin-top: 24px; display: flex; gap: 12px; }
  .detail-page .detail-meta span { height: 24px; padding: 0; display: flex; align-items: center; gap: 0; border: 0; border-radius: 0; background: transparent; color: #64676a; font-family: "PingFang SC", sans-serif; font-size: 14px; font-weight: 400; line-height: 24px; white-space: nowrap; }
  .detail-page .detail-meta img { width: auto; height: 20px; }
  .detail-page .detail-block { box-sizing: border-box; width: 100%; margin: 32px 0 0; padding: 32px 0 0; border-top: 1px solid #e5e4e4; display: flex; flex-direction: column; gap: 14px; }
  .detail-page .detail-block:first-of-type,
  .detail-page .detail-block:nth-of-type(2) { height: auto; min-height: 0; }
  .detail-page .detail-block h2,
  .apply-page .form-section h2 { height: 19px; margin: 0; display: flex; align-items: center; gap: 8px; color: var(--mobile-ink); font-family: "Noto Sans SC", sans-serif; font-size: 16px; font-weight: bolder; line-height: 19.2px; }
  .detail-page .detail-block h2::before,
  .apply-page .form-section h2::before { content: ""; top: 2px; width: 5px !important; height: 15px !important; flex: 0 0 5px !important; border-radius: 0 !important; background: var(--mobile-blue); }
  .detail-page .detail-block ol { width: 100%; margin: 0; padding: 0; list-style: none; color: var(--mobile-ink); font-family: "Noto Sans SC", sans-serif; font-size: 14px; font-weight: 400; line-height: 21px; }
  .detail-page .detail-block ol li { margin: 0; }
  .detail-page .detail-block ol li::before { content: counter(list-item) ". "; }
  .detail-page .detail-submit { width: 100%; height: 43px; margin: 32px 0 0; border-radius: 999px; background: var(--mobile-blue); font-family: "Noto Sans SC", sans-serif; font-size: 16px; font-weight: bolder; line-height: 19.2px; }
  .desktop-submit-label { display: none; }
  .mobile-submit-label { display: inline; }
  .desktop-detail-salary { display: none; }
  .mobile-detail-salary { display: inline; }

  /* resume-form-mobile: 390 x 844 */
  .apply-page .recruit-top,
  .apply-page .footer { display: none !important; }
  .apply-page { height: auto; min-height: 844px; overflow: visible; }
  .apply-page .apply-shell { box-sizing: border-box; width: 100%; height: auto; margin: 0; padding: 20px; }
  .apply-page .apply-shell h1 { width: 100%; height: 49px; margin: 0 0 24px; padding: 0 0 24px; border-bottom: 1px solid #e5e4e4; color: var(--mobile-ink); font-family: "Noto Sans SC", sans-serif; font-size: 21px; font-weight: bolder; line-height: 25.2px; }
  .desktop-apply-title { display: none; }
  .mobile-apply-title { display: inline; }
  .apply-page .resume-form { width: 100%; display: block; }
  .apply-page .form-section { width: 100%; }
  .apply-page .upload-section { height: auto; display: flex; flex-direction: column; gap: 16px; }
  .apply-page .upload-content,
  .apply-page .upload-file-list { width: 100%; gap: 16px; }
  .apply-page .upload-file-copy strong { font-size: 13px; line-height: 18.2px; }
  .apply-page .upload-file-copy small { font-size: 10px; line-height: 16.5px; }
  .apply-page .upload-box { box-sizing: border-box; width: 100%; height: 154px; padding: 24px; border: 0; border-radius: 12px; display: flex; flex-direction: column; align-items: center; gap: 12px; background: #f8f8f8; }
  .apply-page .upload-icon { width: 40px; height: 40px; margin: 0; padding: 8px; border-radius: 999px; background: #fff; }
  .apply-page .upload-box strong { width: 302px; margin: 0; color: var(--mobile-blue); font-family: "Noto Sans SC", sans-serif; font-size: 13px; font-weight: 500; line-height: 18px; text-align: center; }
  .apply-page .upload-box span:last-child { width: 202.43px; margin: 0; color: #9ca3af; font-family: "Noto Sans SC", sans-serif; font-size: 10px; font-weight: 400; line-height: 12px; text-align: center; }
  .apply-page .info-section { box-sizing: border-box; width: 100%; height: 286px; margin-top: 24px; padding-top: 24px; border-top: 1px solid #e5e4e4; display: flex; flex-direction: column; gap: 16px; }
  .apply-page .field-stack { width: 100%; display: flex; flex-direction: column; gap: 16px; }
  .apply-page .field-stack label { width: 100%; height: 65px; display: flex; flex-direction: column; gap: 8px; color: var(--mobile-ink); font-family: "Noto Sans SC", sans-serif; font-size: 14px; font-weight: 500; line-height: 16.8px; }
  .apply-page .field-stack input { box-sizing: border-box; width: 100%; height: 40px; padding: 0 12px; border: 1px solid #e5e4e4; border-radius: 8px; color: var(--mobile-ink); font-family: "Noto Sans SC", sans-serif; font-size: 16px; line-height: 16.8px; }
  .apply-page .field-stack input::placeholder { font-size: 14px; }
  .apply-page .form-action { width: 100%; height: 75px; margin: 24px 0 0; display: flex; flex-direction: column; gap: 20px; }
  .apply-page .agree-line { width: 100%; height: 18px; display: flex; align-items: center; gap: 8px; color: var(--mobile-ink); font-family: "Noto Sans SC", sans-serif; font-size: 13px; font-weight: 400; line-height: 18px; }
  .apply-page .agree-line input { width: 14px; height: 14px; margin: 0; flex: 0 0 14px; }
  .apply-page .submit-apply { width: 100%; height: 37px; border-radius: 20px; background: var(--mobile-blue); font-family: "Noto Sans SC", sans-serif; font-size: 14px; font-weight: 500; line-height: 16.8px; }

  .figma-apply-confirm[hidden] { display: none; }
  .figma-apply-confirm { position: fixed; inset: 0; z-index: 999; display: grid; place-items: center; }
  .figma-apply-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.35); backdrop-filter: blur(4px); }
  .figma-apply-confirm > section { box-sizing: border-box; position: relative; width: 343px; height: 173px; padding: 24px; border: 1px solid #e5e5e5; border-radius: 12px; background: #fff; box-shadow: 0 4px 6px -4px rgba(0,0,0,.1), 0 10px 15px -3px rgba(0,0,0,.1); }
  .figma-confirm-copy { width: 295px; height: 69px; display: flex; gap: 10px; }
  .figma-confirm-icon { box-sizing: border-box; width: 20px; height: 20px; margin-top: .5px; flex: 0 0 20px; border: 2px solid #faad14; border-radius: 50%; color: #faad14; font-size: 12px; line-height: 16px; text-align: center; }
  .figma-confirm-copy > div { width: 261px; display: flex; flex-direction: column; gap: 12px; }
  .figma-confirm-copy h2 { height: 21px; margin: 0; color: #151515; font-family: "Noto Sans SC", sans-serif; font-size: 16px; font-weight: bolder; line-height: 20.8px; }
  .figma-confirm-copy p { height: 36px; margin: 0; color: #5d5d5d; font-family: "Noto Sans SC", sans-serif; font-size: 14px; font-weight: 500; line-height: 18.2px; }
  .figma-confirm-actions { width: 295px; height: 32px; margin-top: 24px; display: flex; justify-content: flex-end; gap: 12px; }
  .figma-confirm-actions button { box-sizing: border-box; width: 72px; height: 32px; padding: 8px 16px; border: 0; border-radius: 9999px; font-family: "SF Pro", Arial, sans-serif; font-size: 16px; font-weight: 510; line-height: 16px; white-space: nowrap; }
  .figma-confirm-actions button:first-child { background: #f7f7f7; color: #151515; }
  .figma-confirm-actions button:last-child { background: var(--mobile-blue); color: #fff; }

  /* submission-success-mobile: 390 x 844 */
  .success-page { height: auto; min-height: 100dvh; overflow: hidden; }
  .success-page .recruit-top { display: none !important; }
  .success-page .success-mobile-nav { position: relative; inset: auto; display: block; }
  .success-page .success-state { box-sizing: border-box; width: 100%; height: auto; min-height: 526px; max-height: none; margin: 0; padding: 60px 0; display: flex; flex: 1 0 526px; flex-direction: column; align-items: center; justify-content: center; gap: 24px; }
  .success-page .success-icon,
  .success-page .success-icon svg { width: 64px; height: 64px; }
  .success-page .success-state h1 { width: 96px; height: 36px; margin: 0; color: var(--mobile-ink); font-family: "PingFang SC", sans-serif; font-size: 24px; font-weight: bold; line-height: 36px; }
  .success-page .success-state p { width: 266px; height: 21px; margin: -16px 0 0; color: var(--mobile-muted); font-family: "PingFang SC", sans-serif; font-size: 14px; font-weight: 400; line-height: 21px; }
  .success-page .footer { display: none !important; }

  /* Homepage mobile fluid layout. Values stay unchanged; containers reflow. */
  .page:not(.recruit-page) .why {
    height: 799px;
    min-height: 799px;
  }

  .page:not(.recruit-page) .why-grid {
    width: 100%;
    height: 606px;
  }

  .page:not(.recruit-page) .why-card:nth-child(1),
  .page:not(.recruit-page) .why-card:nth-child(2),
  .page:not(.recruit-page) .why-card:nth-child(3),
  .page:not(.recruit-page) .why-card:nth-child(4),
  .page:not(.recruit-page) .why-card:nth-child(5),
  .page:not(.recruit-page) .why-card:nth-child(6) {
    height: 71px;
    min-height: 71px;
  }

  .page:not(.recruit-page) .colleague-panel,
  .page:not(.recruit-page) .colleague-panel > .person-card,
  .page:not(.recruit-page) .slider-controls {
    width: 100%;
  }

  .page:not(.recruit-page) .colleague-panel .hover-quote,
  .page:not(.recruit-page) .colleague-panel .person-visual {
    left: 50%;
    transform: translateX(-50%);
  }

  .page:not(.recruit-page) .faq {
    height: auto;
    min-height: 457px;
  }

  .page:not(.recruit-page) .faq-list,
  .page:not(.recruit-page) .faq-list article {
    width: 100%;
    height: auto;
  }

  .page:not(.recruit-page) .faq-list article {
    min-height: 109px;
    flex-basis: auto;
  }

  .page:not(.recruit-page) .faq-list article:first-child {
    min-height: 110px;
    flex-basis: auto;
  }

  .page:not(.recruit-page) .footer .copyright {
    width: 100% !important;
  }
}
