@charset "utf-8";
/* 响应式媒体查询(移动优先,向上扩展) */

/* ===== 576px 手机横屏 ===== */
@media (min-width: 576px) {
    .zh-grid { grid-template-columns: repeat(2, 1fr); }
    .zh-bloglist { grid-template-columns: repeat(2, 1fr); }
    .zh-caselist { grid-template-columns: repeat(2, 1fr); }
}

/* ===== 768px 平板竖屏 ===== */
@media (min-width: 768px) {
    .zh-grid-2 { grid-template-columns: repeat(2, 1fr); }
    .zh-grid-3 { grid-template-columns: repeat(2, 1fr); }
    .zh-why-grid { grid-template-columns: repeat(2, 1fr); }
    .zh-scenes-grid { grid-template-columns: repeat(2, 1fr); }
    .zh-process { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.6rem; }
    .zh-process li { margin-bottom: 0; }
    .zh-footer-main { grid-template-columns: repeat(2, 1fr); }
    .zh-footer-bar .zh-container { flex-direction: row; justify-content: space-between; }
    .zh-form-grid { grid-template-columns: repeat(2, 1fr); }
    .zh-form-field.full { grid-column: 1 / -1; }
    .zh-quote-dialog { padding: 4rem 3.6rem; }
    .zh-hub-cats { grid-template-columns: repeat(2, 1fr); }
    .zh-hub-grid { grid-template-columns: repeat(2, 1fr); }
    .zh-pd-apps { grid-template-columns: repeat(2, 1fr); }
    .zh-pd-why { grid-template-columns: repeat(2, 1fr); }
    .zh-adv-grid { grid-template-columns: repeat(2, 1fr); }
    .zh-oem-grid { grid-template-columns: repeat(2, 1fr); }
    .zh-newslist { grid-template-columns: repeat(2, 1fr); gap: 2rem; }
    .zh-faqlist { grid-template-columns: repeat(2, 1fr); }
    .zh-pn { flex-direction: row; align-items: center; gap: 2.4rem; }
    .zh-pn-item + .zh-pn-item { border-top: 0; padding-top: 0; border-left: .1rem solid var(--zh-line); padding-left: 2.4rem; }
    .zh-casewall { grid-template-columns: repeat(3, 1fr); gap: 1.2rem; }
    .zh-prod-grid { grid-template-columns: repeat(3, 1fr); gap: 1.6rem; }
    .zh-testi-wall { grid-template-columns: repeat(2, 1fr); }
}

/* ===== 992px 平板横屏·小笔电 ===== */
@media (min-width: 992px) {
    .zh-topbar-welcome { display: block; }
    .zh-menu-btn { display: none; }
    .zh-navbar .zh-container { position: relative; }
    .zh-nav { display: block; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
    .zh-nav ul { display: flex; align-items: center; gap: .4rem; }
    .zh-nav ul li { position: relative; }
    .zh-nav ul li > a { position: relative; display: block; padding: 2.4rem 1.8rem; font-size: 1.8rem; font-weight: 700; color: var(--zh-ink); transition: color .4s ease; }
    .zh-nav ul li > a::after { content: ""; position: absolute; left: 50%; top: 50%; width: 4.4rem; height: 4.4rem; margin: -2.6rem 0 0 -2.2rem; border-radius: 0; clip-path: polygon(50% 0, 100% 28%, 100% 100%, 0 100%, 0 28%); background: linear-gradient(135deg, var(--zh-orange), var(--zh-orange-d)); transform: scale(0); transition: transform .4s ease; z-index: -1; }
    .zh-nav ul li > a:hover, .zh-nav ul li.current-menu-item > a, .zh-nav ul li.current-menu-ancestor > a { color: #fff; }
    .zh-nav ul li > a:hover::after, .zh-nav ul li.current-menu-item > a::after, .zh-nav ul li.current-menu-ancestor > a::after { transform: scale(1); }
    .zh-nav ul li::before, .zh-nav ul li::after { content: ""; position: absolute; top: 50%; width: .4rem; height: .4rem; margin-top: -.2rem; border-radius: 50%; background: var(--zh-orange); opacity: 0; transition: all .4s ease .1s; }
    .zh-nav ul li::before { left: 50%; }
    .zh-nav ul li::after { right: 50%; }
    .zh-nav ul li:hover::before { opacity: 1; left: 0; }
    .zh-nav ul li:hover::after { opacity: 1; right: 0; }
    .zh-nav ul li .sub-menu { position: absolute; left: 0; top: 100%; min-width: 22rem; background: #fff; border-radius: .6rem; box-shadow: 0 1rem 2.8rem rgba(27, 38, 49, .16); padding: .8rem 0; opacity: 0; visibility: hidden; transform: translateY(1rem); transition: all .3s ease; z-index: 60; }
    .zh-nav ul li:hover > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }
    .zh-nav ul li .sub-menu li a { display: block; padding: 1rem 2rem; font-size: 1.4rem; font-weight: 400; color: var(--zh-body); white-space: nowrap; }
    .zh-nav ul li .sub-menu li a:hover { color: var(--zh-blue); background: var(--zh-bg); padding-left: 2.4rem; }
    .zh-nav-cta { display: inline-flex; }
    .zh-search-panel { right: 0; }
    .zh-hero2-inner { padding: 8rem 0 12rem; }
    .zh-hero-txt h2 { font-size: 4.4rem; }
    .zh-hero-feats { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: -7rem; padding: 1.6rem 3.2rem; }
    .zh-hero-feat { padding: 0 2.4rem; }
    .zh-hero-feat + .zh-hero-feat { border-top: 0; border-left: .1rem solid var(--zh-line); }
    .zh-hero-feat:first-child { padding-left: 0; }
    .zh-hero-feat:last-child { padding-right: 0; }
    .zh-grid-3 { grid-template-columns: repeat(3, 1fr); }
    .zh-bloglist { grid-template-columns: repeat(4, 1fr); }
    .zh-caselist { grid-template-columns: repeat(4, 1fr); }
    .zh-container { padding-left: 2.4rem; padding-right: 2.4rem; }
    .zh-contact-start { padding: 10rem 0 15rem; }
    .zh-contact-start h2 { font-size: 3.6rem; }
    .zh-cs-cover { display: block; }
    .zh-about-split { grid-template-columns: 1fr 1fr; }
    .zh-about-left, .zh-about-right { padding: 9rem 0; }
    .zh-about-left { justify-content: flex-end; }
    .zh-about-right { justify-content: flex-start; }
    .zh-about-inner { width: 100%; max-width: min(48vw, 84.5rem); }
    .zh-about-left .zh-about-inner { padding-right: 3rem; }
    .zh-about-right .zh-about-inner { padding-left: 3rem; }
    .zh-about-title { font-size: 6.4rem; }
    .zh-about-right h2 { font-size: 3.4rem; }
    .zh-about-stat b { font-size: 4.8rem; }
    .zh-about-stat--area b { font-size: 3.4rem; }
    .zh-about-stat--area b i { font-size: 1.6rem; }
    .zh-outline { height: 200vh; }
    .zh-outline-mosaic { transform: translate(-50%, -50%) rotate(-6deg) scale(1.4); }
    .zh-outline-cell { width: 22vw; }
    .zh-outline-cell img { aspect-ratio: 4 / 3; }
    .zh-outline-slogan { font-size: 6vw; }
    .zh-env-grid { grid-template-columns: 20fr 45fr 35fr; }
    .zh-env-cell { aspect-ratio: auto; }
    .zh-env-col:nth-child(1) .zh-env-cell:nth-child(1) { height: 48rem; }
    .zh-env-col:nth-child(1) .zh-env-cell:nth-child(2) { height: 26rem; }
    .zh-env-row .zh-env-cell { height: 26rem; }
    .zh-env-col:nth-child(2) > .zh-env-cell { height: 48rem; }
    .zh-env-col:nth-child(3) .zh-env-cell:nth-child(1) { height: 46rem; }
    .zh-env-col:nth-child(3) .zh-env-cell:nth-child(2) { height: 28rem; }
    .zh-why-grid { grid-template-columns: repeat(3, 1fr); }
    .zh-scenes-grid { grid-template-columns: repeat(4, 1fr); }
    .zh-process { grid-template-columns: repeat(3, 1fr); gap: 4rem 1.6rem; }
        .zh-process li:not(:last-child):not(:nth-child(3n))::after { display: block; }
        .zh-process li:nth-child(n+2):not(:nth-child(3n+1)) .ico::after { display: block; }
    .zh-nf { grid-template-columns: 1.2fr 1fr; }
    .zh-archive-layout { grid-template-columns: 1fr 34rem; align-items: start; }
    .zh-ccard { flex-direction: row; gap: 0; background: #fff; border-radius: 2.8rem; box-shadow: 0 1.2rem 4rem rgba(27, 38, 49, .1); }
    .zh-ccard-info, .zh-ccard-form { flex: 1 1 50%; padding: 4.8rem 4rem; background: transparent; border-radius: 0; box-shadow: none; }
    .zh-ccard-info { border-right: .1rem solid var(--zh-line); }
    .zh-ccard-title { font-size: 3rem; }
    .zh-ccard-form h2 { font-size: 2.6rem; }
    .zh-pd-top { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); align-items: start; }
    .zh-pd-apps { grid-template-columns: repeat(3, 1fr); }
    .zh-pd-why { grid-template-columns: repeat(3, 1fr); }
    .zh-adv-grid { grid-template-columns: repeat(4, 1fr); }
    .zh-pd-pack-gal { grid-template-columns: repeat(4, 1fr); }
    .zh-prod-layout { flex-direction: row; align-items: stretch; gap: 2.4rem; }
    .zh-prod-side { flex: 0 0 22%; }
    .zh-prod-side-head h2 { font-size: 3rem; }
    .zh-prod-cats { display: block; margin: 2.4rem 0; overflow: visible; }
    .zh-prod-cats li + li { margin-top: .6rem; }
    .zh-prod-cats button { width: 100%; justify-content: space-between; }
    .zh-prod-cats button i { display: inline-block; }
    .zh-casewall-cap { padding: 2.4rem 1.6rem 1.4rem; font-size: 1.6rem; }
    .zh-casewall { grid-template-columns: repeat(4, 1fr); gap: 1.6rem; }
    .zh-prod-grid { grid-template-columns: repeat(4, 1fr); gap: 1.6rem; }
    .zh-casewall-cell { will-change: transform; }
    .zh-float { display: flex; }
    .zh-mega { display: flex; }
    .zh-social-qr { display: block; }
    .zh-bottombar { display: none; }
    .zh-cta-band { background-attachment: fixed; }
    .zh-testi-wall { display: block; height: 60rem; }
    .zh-testi-card { position: absolute; width: 27%; }
    .zh-testi-card:nth-child(1) { left: 0; top: 32%; }
    .zh-testi-card:nth-child(2) { left: 24%; top: 4%; }
    .zh-testi-card:nth-child(3) { left: 26%; top: 60%; }
    .zh-testi-card:nth-child(4) { left: 40%; top: 32%; z-index: 10; }
    .zh-testi-card:nth-child(5) { left: 56%; top: 0; }
    .zh-testi-card:nth-child(6) { left: 72%; top: 46%; }
    .zh-svc-cta .zh-container { flex-direction: row; align-items: center; justify-content: space-between; text-align: left; }
    .zh-svc-cta-main h2 { font-size: 3rem; }
    .zh-svc-cta-actions { justify-content: flex-start; }
    .zh-digest-head h2 { font-size: 2.8rem; }
    .zh-sec { padding: 6.4rem 0; }
    .zh-nordic .zh-sec { padding: 8rem 0; }
    .zh-page-hero { padding: 5.6rem 0; }
    .zh-page-hero .hero-title { font-size: 3.4rem; }
    .zh-footer-about p { width: 80%;  }
    /* 1.8.8 手机端收紧值的桌面恢复 */
    .zh-topbar .zh-container { min-height: 4rem; }
    .zh-navbar .zh-container { min-height: 7rem; }
    .zh-logo img { max-height: 4.4rem; }
    .zh-logo-text b { font-size: 2.2rem; letter-spacing: .1rem; }
    .zh-logo-text span { font-size: 1.2rem; letter-spacing: .1rem; }
    .zh-cta-band h2 { font-size: 3rem; }
    .zh-article-head h1 { font-size: 3.6rem; }
    .zh-pdtabs-nav button { flex: none; }
    .zh-article-meta.bar .m:nth-child(-n+2) { display: flex; }
        .zh-article-meta.bar .m + .m { border-left: .1rem solid var(--zh-line); padding-left: 2.4rem; }
    .zh-article-meta .back { margin-left: 0; }
    .zh-why-inline .zh-why-item { padding: 2.4rem 2rem 2.4rem 2.4rem; }
    .zh-adv-item { display: block; padding: 3.2rem 2rem; text-align: center; }
    .zh-adv-ico { width: 7.2rem; height: 7.2rem; margin: 0 auto 1.8rem; }
    .zh-adv-item p { margin-top: 1rem; }
}

/* ===== 1200px 桌面 ===== */
@media (min-width: 1200px) {
    .zh-mega--product { right: auto; left: calc(50% - 24rem); }
    .zh-mega--case { right: auto; left: calc(50% - 24rem); }
    .zh-grid { grid-template-columns: repeat(4, 1fr); }
    .zh-footer-main { grid-template-columns: 2fr 1fr 1fr 1.4fr; gap: 0; }
    .zh-footer-main > .zh-footer-col { padding: 0 3.2rem; border-left: .1rem solid rgba(255, 255, 255, .08); }
    .zh-footer-main > .zh-footer-col:first-child { padding-left: 0; border-left: 0; }
    .zh-footer-main > .zh-footer-col:last-child { padding-right: 0; }
    .zh-hero-txt h2 { font-size: 5.2rem; }
    .zh-sec { padding: 7.2rem 0; }
    .zh-nordic .zh-sec { padding: 9.6rem 0; }
    .zh-nordic .zh-sec-head h2 { font-size: 3rem; }
    .zh-sec-head h2 { font-size: 3.2rem; }
    .zh-process { grid-template-columns: repeat(6, 1fr); gap: 1.6rem; }
    .zh-process li { padding: 2rem 1.4rem; }
        .zh-process li:not(:last-child)::after { display: block; }
        .zh-process li:nth-child(even):not(:last-child)::after { bottom: auto; top: calc(100% + .6rem); border-top: 0; border-bottom: .2rem dashed rgba(0, 70, 199, .4); border-radius: 0 0 50% 50% / 0 0 100% 100%; }
        .zh-process li:nth-child(odd) .ico::after { display: none; }
        .zh-process li:nth-child(even) .ico::after { display: block; }
        .zh-process li:nth-child(odd):not(:first-child) p::after { display: block; }
    .zh-prod-side-head h2 { font-size: 3.4rem; }
}

/* ===== 无障碍:减弱动效偏好下停用跑马灯 ===== */
@media (prefers-reduced-motion: reduce) {
    .zh-mq-track.is-ready { animation: none; }
    .zh-reveal.is-visible-hide { opacity: 1; transform: none; }
    .zh-reveal.is-visible-show { transition: none; }
    .wow { visibility: visible !important; animation: none !important; }
    .zh-hero-wipe .zh-pm-canvas { animation: none; }
    .zh-split > span { transform: none !important; transition: none !important; }
    .zh-outline { height: 100vh; }
    .zh-outline-layer { clip-path: none; }
    .zh-outline-mosaic { transform: translate(-50%, -50%) scale(1.4); }
    .zh-outline-row:nth-child(odd), .zh-outline-row:nth-child(even) { transform: none; }
    .zh-outline-vignette { opacity: 1; }
    .zh-outline-slogan--dark { display: none; }
    .zh-outline-slogan--light { left: 50%; transform: translate(-50%, -50%); width: 90%; white-space: normal; text-align: center; }
    .zh-process li .ico::after, .zh-process li p::after { animation: none; }
    .zh-float-item[data-zh-quote] .ico { animation: none; }
}

/* ===== 404 桌面加高 ===== */
@media (min-width: 992px) {
    .zh-404 { padding: 12rem 0; }
    .zh-404 h1 { font-size: 3.2rem; }
}