/* 全站统一加载 PSD 使用的简体中文字体，避免客户端回退到系统字体。 */

@font-face {
    font-family: "HarmonyOS Sans SC";
    src: url("https://wp-oss.j4c.cc/zbt/official/wp-content/themes/zbt-official-theme/assets/fonts/HarmonyOS_Sans_SC_Regular.ttf") format("truetype");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "HarmonyOS Sans SC";
    src: url("https://wp-oss.j4c.cc/zbt/official/wp-content/themes/zbt-official-theme/assets/fonts/HarmonyOS_Sans_SC_Bold.ttf") format("truetype");
    font-style: normal;
    font-weight: 700;
    font-display: swap;
}

/*
 * Reason: PSD 中的标题厚度和说明投影属于文字表现层，不应绑定某一个页面或固定字号；
 * 通过自定义属性暴露阴影、颜色和叠加方式，调用方可按字号、背景和断点进行微调。
 */

.zbt-text-effect {
    color: var(--zbt-text-effect-color, currentColor);
    text-shadow: var(--zbt-text-effect-shadow, none);
}

.zbt-text-effect--extruded {
    /* Reason: PSD 大标题只需要细薄的右下立体边缘；限制厚度与扩散，避免形成联系我们旧版的厚重黑影。 */
    --zbt-text-effect-shadow:
        0 1px 0 rgb(42 45 50 / 72%),
        1px 2px 0 rgb(31 33 37 / 56%),
        1px 3px 4px rgb(0 0 0 / 32%);
}

.zbt-text-effect--soft-shadow {
    --zbt-text-effect-shadow:
        1px 1px 1px #000,
        -1px -1px 1px rgb(0 0 0 / 30%),
        0 2px 4px rgb(0 0 0 / 85%);
}

/* Reason: 独立页面首屏统一采用“PSD 背景层 + HTML 内容层”，不同页面只提供尺寸和坐标变体。 */

.zbt-page-hero {
    position: relative;
    isolation: isolate;
    overflow: clip;
}

.zbt-page-hero > [class*="__dynamic"] {
    position: relative;
    z-index: 1;
}

:root {
    color-scheme: light;
    /* Reason: Header 由全站模板复用，所有页面必须从同一高度变量取得桌面、过渡和移动端的垂直基准。 */
    --zbt-header-block-size: 155px;
    /* Reason: 首页各桌面区块来自同一张 1920px PSD 画布；统一锚点避免后续模块以视口居中方式各自计算，造成横向漂移。 */
    --zbt-home-psd-canvas-inline-size: 1920px;
    /* Reason: 独立页面与首页共用 PSD 的 1920px 基准；4K 只增加两侧留白，不放大设计稿。 */
    --zbt-design-canvas-inline-size: 1920px;
    --zbt-design-scale-breakpoint: 92.0625rem;
    /* Reason: 视觉背景可以铺满视口，但业务内容必须在不同浏览器宽度下保持稳定的阅读和比较边界。 */
    --zbt-layout-gutter: clamp(24px, 4vw, 64px);
    --zbt-layout-content-max: 1224px;
    --zbt-layout-wide-max: 1440px;
    /* Reason: 新闻详情只需扩大自身阅读区域，不能把详情容器绑定到页头 Logo 或全站内容基线。 */
    --zbt-layout-article-title-max: 1360px;
    --zbt-layout-article-media-max: 1600px;
    --zbt-layout-article-body-max: 1440px;
    --zbt-home-psd-stage-inline-start: 215px;
    --zbt-home-psd-stage-inline-size: 1489px;
    --zbt-home-psd-title-inline-start: 347px;
    --zbt-home-psd-content-inline-start: 351px;
    --zbt-home-psd-canvas-background: #030303;
    --zbt-home-psd-background-image: url("https://wp-oss.j4c.cc/zbt/official/wp-content/uploads/2026/09/home-background-only-optimized.webp?zbt_asset=d037ff588533");
}

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

html {
    background: var(--aura-spec-color-canvas-neutral);
    /* Reason: 顶层页面不允许在边界继续回弹，避免露出浏览器的默认白色画布。 */
    overscroll-behavior: none;
}

body {
    margin: 0;
    background: var(--aura-spec-color-canvas-neutral);
    color: var(--aura-spec-color-text-neutral);
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", system-ui, sans-serif;
    font-size: var(--aura-litho-body-size-md);
    /* Reason: PSD 的常规文字均为 HarmonyOS Sans SC Regular；主题只内置 400/700，不能让全局 500 触发浏览器匹配或合成。 */
    font-weight: 400;
    line-height: var(--aura-litho-body-height-normal);
    overscroll-behavior: none;
}

img {
    display: block;
    max-inline-size: 100%;
}

a {
    color: inherit;
    text-decoration: none;
}

a:focus-visible,
button:focus-visible {
    outline: var(--aura-morph-surface-stroke-thin) solid var(--aura-spec-color-border-primary-diffuse);
    outline-offset: var(--aura-tectonic-gap-all-xs);
}

.wp-site-blocks {
    padding: 0;
}

/* Reason: PSD 的“背景”层是 #030303 回退色；“组 24/图层 23”提供全页黑蓝渐变，桌面端由统一背景图承载。 */

.zbt-layout-container {
    inline-size: min(100% - (var(--aura-tectonic-inset-inline-lg-fluid) * 2), var(--wp--style--global--content-size));
    margin-inline: auto;
}

/* Reason: 业务内容统一通过宽度变体选择边界，背景外壳不使用这些类，避免限宽规则误伤首屏和页脚。 */

.zbt-container,
.zbt-container--content {
    inline-size: min(calc(100% - (var(--zbt-layout-gutter) * 2)), var(--zbt-layout-content-max));
    max-inline-size: var(--zbt-layout-content-max);
    margin-inline: auto;
}

.zbt-container--wide {
    inline-size: min(calc(100% - (var(--zbt-layout-gutter) * 2)), var(--zbt-layout-wide-max));
    max-inline-size: var(--zbt-layout-wide-max);
    margin-inline: auto;
}

.zbt-container--article-title {
    inline-size: min(calc(100% - (var(--zbt-layout-gutter) * 2)), var(--zbt-layout-article-title-max));
    max-inline-size: var(--zbt-layout-article-title-max);
    margin-inline: auto;
}

.zbt-container--article-media {
    inline-size: min(calc(100% - (var(--zbt-layout-gutter) * 2)), var(--zbt-layout-article-media-max));
    max-inline-size: var(--zbt-layout-article-media-max);
    margin-inline: auto;
}

.zbt-container--article-body {
    inline-size: min(calc(100% - (var(--zbt-layout-gutter) * 2)), var(--zbt-layout-article-body-max));
    max-inline-size: var(--zbt-layout-article-body-max);
    margin-inline: auto;
}

.zbt-section-kicker {
    margin: 0 0 var(--aura-tectonic-outset-block-md);
    color: var(--aura-spec-color-text-primary);
    font-size: var(--aura-litho-caption-size-xs);
    font-weight: var(--aura-litho-heading-weight-bold);
    letter-spacing: var(--aura-litho-caption-spacing-expanded);
    line-height: var(--aura-litho-heading-height-tight);
    text-transform: uppercase;
}

.zbt-section-kicker--inverse {
    color: var(--aura-spec-color-text-neutral-diffuse);
}

.zbt-header {
    position: relative;
    z-index: 20;
    block-size: var(--zbt-header-block-size);
    min-block-size: var(--zbt-header-block-size);
    background: #030303;
    color: #fff;
}

/* Reason: WordPress 的模板部件外壳才拥有贯穿页面的滚动上下文；让外壳吸顶，避免内层 Header 因父级高度仅等于自身而失效。 */

.wp-block-template-part:has(> .zbt-header) {
    position: sticky;
    top: 0;
    z-index: 20;
}

/* Reason: 登录态管理栏位于页面最上层，吸顶外壳必须避开它；普通访客不增加任何顶部间距。 */

body.admin-bar .wp-block-template-part:has(> .zbt-header) {
    top: 32px;
}

@media (max-width: 48.875rem) {
body.admin-bar .wp-block-template-part:has(> .zbt-header) {
        top: 46px;
    }
}

/* Reason: 二级菜单覆盖首屏等不同背景时，页头只在视觉层延展，不能改变后续内容的文档流坐标。 */

@media (min-width: 53.1875rem) {
.zbt-header::after {
        position: absolute;
        z-index: -1;
        inset-block-start: 100%;
        inset-inline: 0;
        block-size: 0;
        background: #030303;
        box-shadow: 0 18px 26px rgba(3, 3, 3, 0);
        content: "";
        opacity: 0;
        pointer-events: none;
        transition:
            block-size 440ms cubic-bezier(0.34, 1.56, 0.64, 1),
            opacity 180ms ease-out,
            box-shadow 260ms ease-out;
    }

.zbt-header.zbt-header--submenu-active::after {
        block-size: var(--zbt-header-extension-height, 0px);
        box-shadow: 0 18px 26px rgba(3, 3, 3, 0.22);
        opacity: 1;
    }
}

.zbt-header__inner {
    display: flex;
    inline-size: 100%;
    max-inline-size: none;
    block-size: var(--zbt-header-block-size);
    min-block-size: var(--zbt-header-block-size);
    align-items: center;
    justify-content: flex-start;
    margin: 0;
    padding-inline: 55px;
    gap: 0;
}

.zbt-site-brand {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    inline-size: 260px;
    block-size: 71px;
    max-inline-size: 260px;
}

.zbt-site-brand img,
.zbt-site-brand .custom-logo {
    display: block;
    inline-size: 260px;
    block-size: 71px;
    max-block-size: none;
    object-fit: contain;
    object-position: left center;
}

.zbt-primary-navigation {
    flex: 0 0 auto;
    color: #fff;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 25px;
    font-weight: 400;
    line-height: 31px;
}

.zbt-header__inner > nav.zbt-primary-navigation {
    margin-left: 245px !important;
}

.zbt-primary-navigation .wp-block-navigation__container.zbt-primary-navigation {
    flex: 0 1 auto;
    margin-left: 0 !important;
}

.zbt-primary-navigation .wp-block-navigation__container {
    align-items: center;
    flex-wrap: nowrap;
    /* Reason: 以 PSD 文字图层的左边界为准，25px 浏览器字框需使用 117.5px 间距抵消累计宽度误差。 */
    gap: 117.5px !important;
}

.zbt-primary-navigation .wp-block-navigation-item__content {
    min-block-size: 31px;
    padding: 0;
    color: inherit;
    font: inherit;
    line-height: inherit;
    white-space: nowrap;
}

.zbt-primary-navigation .wp-block-navigation__container.zbt-primary-navigation > .wp-block-navigation-item > .wp-block-navigation-item__content {
    display: inline-flex;
    align-items: center;
    position: relative;
    z-index: 0;
}

/* Reason: PPT 要求悬浮底板不改变一级菜单的文字坐标和相邻菜单间距。 */

.zbt-primary-navigation .wp-block-navigation__container.zbt-primary-navigation > .wp-block-navigation-item > .wp-block-navigation-item__content::before {
    position: absolute;
    z-index: -1;
    inset-block-start: 50%;
    inset-inline-start: 50%;
    inline-size: max(128px, calc(100% + 28px));
    block-size: 43px;
    border-radius: 9px;
    background: #0032c8;
    content: "";
    display: none;
    opacity: 0;
    pointer-events: none;
    /* Reason: PSD/PPT 的蓝色底板从 y=55 开始，需相对 31px 行高中心上移 1px。 */
    transform: translate(-50%, calc(-50% - 1px));
}

/* Reason: "行业解决方案" 的 PSD 状态底板不是文字宽度推导值，实测为 185px。 */

.zbt-primary-navigation .wp-block-navigation__container.zbt-primary-navigation > .wp-block-navigation-item:nth-child(4) > .wp-block-navigation-item__content::before {
    inline-size: 185px;
    transform: translate(calc(-50% - 3px), calc(-50% - 1px));
}

.zbt-primary-navigation .wp-block-navigation__container.zbt-primary-navigation > .wp-block-navigation-item:hover > .wp-block-navigation-item__content::before,
.zbt-primary-navigation .wp-block-navigation__container.zbt-primary-navigation > .wp-block-navigation-item:focus-within > .wp-block-navigation-item__content::before,
.zbt-primary-navigation .wp-block-navigation__container.zbt-primary-navigation > .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content::before,
.zbt-primary-navigation .wp-block-navigation__container.zbt-primary-navigation > .wp-block-navigation-item.current-menu-parent > .wp-block-navigation-item__content::before,
.zbt-primary-navigation .wp-block-navigation__container.zbt-primary-navigation > .wp-block-navigation-item.current-menu-ancestor > .wp-block-navigation-item__content::before,
.zbt-primary-navigation .wp-block-navigation__container.zbt-primary-navigation > .wp-block-navigation-item.is-zbt-current > .wp-block-navigation-item__content::before,
.zbt-primary-navigation .wp-block-navigation__container.zbt-primary-navigation > .wp-block-navigation-item > .wp-block-navigation-item__content[aria-current="page"]::before {
    display: block;
    opacity: 1;
}

.zbt-primary-navigation .wp-block-navigation-submenu__toggle {
    display: none;
}

.zbt-primary-navigation .wp-block-navigation__submenu-container {
    min-inline-size: 15rem;
    padding: var(--aura-tectonic-inset-all-sm);
    background: var(--aura-spec-color-overlay-neutral);
    border: var(--aura-morph-surface-stroke-thin) solid var(--aura-spec-color-border-neutral-subtle);
    border-radius: var(--aura-morph-control-radius-squircle);
    box-shadow: var(--aura-spec-shadow-overlay-soft);
    color: var(--aura-spec-color-text-neutral-deep);
}

.zbt-primary-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
.zbt-primary-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus-visible {
    color: var(--aura-spec-color-text-primary);
    background: var(--aura-spec-color-surface-primary-diffuse);
}

@media (min-width: 53.1875rem) {
/* Reason: 下拉菜单保持白字列表；同色的页头延伸层由公共脚本按实际菜单高度覆盖其后方页面内容。 */

.zbt-primary-navigation .wp-block-navigation__container.zbt-primary-navigation > .wp-block-navigation-item.has-child::after {
        position: absolute;
        inset-block-start: 100%;
        inset-inline-start: -20px;
        inline-size: calc(100% + 40px);
        block-size: 28px;
        content: "";
    }

.zbt-primary-navigation .wp-block-navigation__submenu-container {
        inset-block-start: calc(100% + 28px) !important;
        inset-inline-start: 0 !important;
        inline-size: max-content !important;
        min-inline-size: max-content !important;
        min-width: max-content !important;
        padding: 0 !important;
        /* Reason: 底部空间由下方明确的占位节点承载，避免被 WordPress 的菜单高度规则吞掉。 */
        padding-block-end: 0 !important;
        background: transparent !important;
        border: 0 !important;
        border-radius: 0;
        box-shadow: none;
        color: #fff;
        max-block-size: 0;
        overflow: hidden;
        opacity: 0 !important;
        pointer-events: none;
        transform: translateY(-10px) scaleY(0.96);
        transform-origin: top center;
        transition:
            max-block-size 440ms cubic-bezier(0.34, 1.56, 0.64, 1),
            opacity 180ms ease-out,
            transform 420ms cubic-bezier(0.34, 1.56, 0.64, 1);
        visibility: hidden !important;
        will-change: max-block-size, opacity, transform;
    }

/* Reason: WordPress 默认悬浮态会立即隐藏下拉层；延后移除展开状态，才能完整播放收缩与淡出。 */

.zbt-primary-navigation .wp-block-navigation__container.zbt-primary-navigation > .wp-block-navigation-item.has-child.zbt-submenu-expanded > .wp-block-navigation__submenu-container {
        height: auto !important;
        max-block-size: var(--zbt-submenu-height, 32rem);
        pointer-events: auto;
        visibility: visible !important;
    }

.zbt-primary-navigation .wp-block-navigation__container.zbt-primary-navigation > .wp-block-navigation-item.has-child.zbt-submenu-visible > .wp-block-navigation__submenu-container {
        opacity: 1 !important;
        transform: translateY(0) scaleY(1);
    }

.zbt-primary-navigation .wp-block-navigation__container.zbt-primary-navigation > .wp-block-navigation-item.has-child.zbt-submenu-expanded.zbt-submenu-collapsing > .wp-block-navigation__submenu-container {
        max-block-size: 0;
        pointer-events: none;
    }

.zbt-primary-navigation .wp-block-navigation__submenu-container > .wp-block-navigation-item {
        opacity: 0;
        transform: translateY(-8px);
        transition:
            opacity 160ms ease-out,
            transform 320ms cubic-bezier(0.34, 1.56, 0.64, 1);
    }

.zbt-primary-navigation .wp-block-navigation__container.zbt-primary-navigation > .wp-block-navigation-item.has-child.zbt-submenu-visible > .wp-block-navigation__submenu-container > .wp-block-navigation-item {
        opacity: 1;
        transform: translateY(0);
    }

.zbt-primary-navigation .wp-block-navigation__container.zbt-primary-navigation > .wp-block-navigation-item.has-child.zbt-submenu-collapsing > .wp-block-navigation__submenu-container > .wp-block-navigation-item {
        transition-delay: 0ms;
    }

.zbt-primary-navigation .wp-block-navigation__submenu-container > .wp-block-navigation-item:nth-child(2) {
        transition-delay: 32ms;
    }

.zbt-primary-navigation .wp-block-navigation__submenu-container > .wp-block-navigation-item:nth-child(3) {
        transition-delay: 64ms;
    }

.zbt-primary-navigation .wp-block-navigation__submenu-container > .wp-block-navigation-item:nth-child(4) {
        transition-delay: 96ms;
    }

.zbt-primary-navigation .wp-block-navigation__submenu-container > .wp-block-navigation-item:nth-child(5) {
        transition-delay: 128ms;
    }

.zbt-primary-navigation .wp-block-navigation__submenu-container > .wp-block-navigation-item:nth-child(6) {
        transition-delay: 160ms;
    }

.zbt-primary-navigation .wp-block-navigation__submenu-container > .wp-block-navigation-item {
        margin: 0 0 24px;
    }

.zbt-primary-navigation .wp-block-navigation__submenu-container > .wp-block-navigation-item:last-child {
        margin-bottom: 0;
    }

/* Reason: 空白占位属于下拉容器内容，scrollHeight 和视觉高度都会稳定包含这 32px。 */

.zbt-primary-navigation .wp-block-navigation__submenu-container::after {
        display: block;
        flex: 0 0 32px;
        inline-size: 1px;
        block-size: 32px;
        content: "";
        pointer-events: none;
    }

.zbt-primary-navigation .wp-block-navigation__submenu-container > .wp-block-navigation-item > .wp-block-navigation-item__content {
        display: block !important;
        min-block-size: 28px !important;
        padding: 0 !important;
        color: #fff;
        font-size: 20px;
        font-weight: 400;
        line-height: 28px;
    }

.zbt-primary-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
.zbt-primary-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus-visible {
        color: #fff;
        background: transparent;
    }
}

@media (prefers-reduced-motion: reduce) {
.zbt-header::after,
.zbt-primary-navigation .wp-block-navigation__submenu-container,
.zbt-primary-navigation .wp-block-navigation__submenu-container > .wp-block-navigation-item {
        transition: none;
    }
}

.zbt-screen-reader-text {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}

/* Reason: 首页各入口仅共享 PSD 已确认的几何；颜色和高亮必须按区块变体显式定义，不能由默认色调覆盖。 */

/* Reason: 首屏“产品中心”主按钮按已确认交互保持深蓝默认、亮蓝高亮。 */

/* Reason: PSD 未提供白色入口的悬浮图层；高亮保留白色系，禁止被通用规则改成主色蓝。 */

/* Reason: 独立关于我们页面的默认视觉与后台动态内容必须处在同一 1920px 坐标画布，避免中等桌面宽度只缩放图片而留下高度或锚点误差。 */

.zbt-about-page-template,
.zbt-about-page {
    margin: 0;
    background: #fff;
}

.zbt-about-page-stage {
    position: relative;
    overflow: clip;
    background: #fff;
}

.zbt-about-page-stage--hero {
    /* Reason: Photoshop 无文字首屏背景为 1920 × 768px；保持完整高度才能容纳标题、两行说明与厂区画面。 */
    block-size: 768px;
    overflow: clip;
    z-index: 2;
    background-color: #030303;
    background-image: linear-gradient(90deg, rgb(0 50 200 / 78%) 0%, rgb(0 50 200 / 32%) 45%, rgb(3 3 3 / 0%) 72%), var(--zbt-about-hero-background);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.zbt-about-page-stage--hero .zbt-about-page-stage__default img {
    block-size: 768px;
}

.zbt-about-page-stage__default {
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 0;
    inline-size: var(--zbt-home-psd-canvas-inline-size);
    block-size: 100%;
}

.zbt-about-page-stage__default img {
    display: block;
    inline-size: var(--zbt-home-psd-canvas-inline-size);
    max-inline-size: none;
    block-size: 100%;
    object-fit: fill;
    pointer-events: none;
    user-select: none;
}

.zbt-about-page-hero__dynamic {
    position: relative;
    display: grid;
    inline-size: var(--zbt-home-psd-canvas-inline-size);
    block-size: 768px;
    align-items: start;
    background: transparent;
}

.zbt-about-page-hero__content {
    inline-size: 1226px;
    margin: 0 auto;
    padding-top: 207px;
    padding-bottom: 2px;
}

.zbt-about-page-hero__content h1,
.zbt-about-page-hero__content p {
    margin: 0;
    color: #fff;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
}

.zbt-about-page-hero__content h1 {
    font-size: 74px;
    font-weight: 700;
    line-height: 103px;
}

.zbt-about-page-hero__content p {
    margin-top: 65px;
    font-size: 32px;
    font-weight: 700;
    line-height: 72px;
}

@media (min-width: 92.0625rem) and (max-width: 119.9375rem) {
.zbt-about-page-stage--hero {
        block-size: calc(100vw * 768 / 1920);
    }

.zbt-about-page-stage--hero .zbt-about-page-stage__default,
.zbt-about-page-stage--hero .zbt-about-page-hero__dynamic {
        transform: scale(calc(100vw / 1920px));
        transform-origin: top left;
    }
}

@media (max-width: 92rem) {
.zbt-about-page-stage--hero {
        /* Reason: 在 1472px 断点与桌面比例高度连续衔接，窄屏仍保留两段文字的最低可读空间。 */
        block-size: clamp(500px, 40vw, 768px);
        min-block-size: 0;
    }

.zbt-about-page-hero__dynamic {
        inline-size: 100%;
        block-size: 100%;
    }

.zbt-about-page-hero__content {
        inline-size: min(calc(100% - 96px), 1200px);
        padding-top: clamp(72px, 10vw, 120px);
    }

.zbt-about-page-hero__content h1 {
        font-size: 58px;
        line-height: 76px;
    }

.zbt-about-page-hero__content p {
        margin-top: 38px;
        font-size: 24px;
        line-height: 44px;
    }
}

@media (max-width: 48rem) {
.zbt-about-page-stage--hero {
        min-block-size: 500px;
    }

.zbt-about-page-hero__content {
        inline-size: calc(100% - 48px);
        padding-top: 72px;
    }

.zbt-about-page-hero__content h1 {
        font-size: 42px;
        line-height: 56px;
    }

.zbt-about-page-hero__content p {
        margin-top: 28px;
        font-size: 19px;
        line-height: 34px;
    }
}

.zbt-about-page-stage--company {
    /* Reason: 数据卡在企业简介画布内约于 1200px 结束；原始 1704px 阶段会在宽屏留下约 500px 无内容空白。收紧裁切高度仍保留稳定的底部呼吸空间，且不改变卡片、文字和背景的相对坐标。 */
    block-size: 1380px;
    background: #f3f3f3;
}

.zbt-about-page-stage--company .zbt-about-page-stage__default img {
    block-size: 1704px;
}

.zbt-about-page-company__dynamic {
    position: relative;
    inline-size: var(--zbt-home-psd-canvas-inline-size);
    block-size: 1704px;
    background: #f3f3f3 url("https://wp-oss.j4c.cc/zbt/official/wp-content/uploads/2026/09/about-page-company-background-optimized.webp?zbt_asset=4f6b364ee788") center / cover no-repeat;
}

/* Reason: 企业简介的文字、数据和组合视觉始终需要由后台字段与单图资源共同输出，不能被旧整图默认态隐藏。 */

.has-psd-default .zbt-about-page-company__dynamic {
    display: block;
}

.zbt-about-page-company__layout {
    position: relative;
    inline-size: 1220px;
    block-size: 100%;
    margin: 0 auto;
}

.zbt-about-page-company__copy {
    position: absolute;
    /* Reason: PSD 标题全局 y=1062px，企业简介区块在首屏后从 y=923px 开始，因此文案组锚定为区块内 y=139px。 */
    inset-block-start: 139px;
    inset-inline-start: 0;
    inline-size: 530px;
}

.zbt-about-page-company__copy h2 {
    margin: 0;
    color: #0032c8;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 59px;
    font-weight: 700;
    line-height: 1;
}

.zbt-about-page-company__content {
    /* Reason: 后台正文由一个换行段落输出；按浏览器实际字体度量收敛到 PSD 为数据卡预留的纵向区域。 */
    margin-top: 54px;
    color: #1a1a1a;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 19.5px;
    font-weight: 400;
    line-height: 40px;
}

.zbt-about-page-company__content p {
    margin: 0;
}

.zbt-about-page-company__content p:first-child {
    font-weight: 700;
}

.zbt-about-page-company__visual {
    position: absolute;
    /* Reason: 企业简介的组合视觉与标题组保持统一的 PSD 相对关系，视觉上沿高于标题上沿 48px。 */
    inset-block-start: 91px;
    inset-inline-start: 599px;
    inline-size: 730px;
    block-size: 730px;
}

.zbt-about-page-company__visual-image {
    position: relative;
    z-index: 0;
    display: block;
    inline-size: 100%;
    block-size: 100%;
}

.zbt-about-page-company__video-preview {
    position: absolute;
    inset-block-start: 50%;
    inset-inline-start: 50%;
    z-index: 2;
    inline-size: min(82%, 600px);
    aspect-ratio: 16 / 9;
    overflow: hidden;
    /* Reason: 封面态与播放态必须使用同一外轮廓，避免切换播放后直角边缘破坏企业简介组合视觉。 */
    border-radius: 22px;
    border: 1px solid rgb(255 255 255 / 78%);
    background: #030303;
    box-shadow: 0 20px 80px rgb(0 0 0 / 32%);
    transform: translate(-50%, -50%);
}

.zbt-about-page-company__video-poster {
    display: block;
    inline-size: 100%;
    block-size: 100%;
    border-radius: inherit;
    object-fit: cover;
}

.zbt-about-page-company__video-trigger {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: grid;
    place-items: center;
    margin: 0;
    padding: 0;
    border: 0;
    background: rgb(3 3 3 / 8%);
    cursor: pointer;
    transition: background 180ms ease;
}

.zbt-about-page-company__video-trigger:hover {
    background: rgb(3 3 3 / 20%);
}

.zbt-about-page-company__video-trigger:focus-visible {
    outline: 4px solid #00e4ff;
    outline-offset: -8px;
}

.zbt-about-page-company__video-play-icon {
    display: grid;
    inline-size: 78px;
    block-size: 78px;
    place-items: center;
    border: 2px solid rgb(255 255 255 / 88%);
    border-radius: 50%;
    background: rgb(3 3 3 / 34%);
    box-shadow: 0 8px 26px rgb(0 0 0 / 36%);
}

.zbt-about-page-company__video-play-icon::before {
    inline-size: 0;
    block-size: 0;
    margin-inline-start: 6px;
    border-block: 14px solid transparent;
    border-inline-start: 22px solid #fff;
    content: "";
}

.zbt-about-page-company__video-player {
    position: absolute;
    inset: 0;
    z-index: 4;
    display: grid;
    place-items: center;
    border-radius: 50%;
    /* Reason: 播放时保留底层蓝白圆环原色，播放器只覆盖自身视频框，不能再额外叠加灰色遮罩。 */
    background: transparent;
    opacity: 1;
    transition: opacity 220ms ease;
}

.zbt-about-page-company__video-player[hidden] {
    display: none;
}

.zbt-about-page-company__video-frame {
    position: relative;
    inline-size: min(82%, 600px);
    overflow: hidden;
    border: 1px solid rgb(255 255 255 / 65%);
    border-radius: 22px;
    background: #030303;
    box-shadow: 0 20px 80px rgb(0 0 0 / 32%);
}

.zbt-about-page-company__video-media {
    display: block;
    inline-size: 100%;
    aspect-ratio: 16 / 9;
    block-size: auto;
    /* 原生视频控件在部分浏览器会自行绘制背景，继承圆角确保其不会越过播放框裁剪边界。 */
    border-radius: inherit;
    background: #030303;
}

.zbt-about-page-company__video-control {
    position: absolute;
    z-index: 2;
    display: grid;
    place-items: center;
    inline-size: 38px;
    block-size: 38px;
    margin: 0;
    padding: 0;
    border: 1px solid rgb(255 255 255 / 55%);
    border-radius: 50%;
    background: rgb(3 3 3 / 72%);
    color: #fff;
    cursor: pointer;
    font-size: 21px;
    line-height: 1;
}

.zbt-about-page-company__video-control:hover,
.zbt-about-page-company__video-control:focus-visible {
    background: #0032c8;
}

.zbt-about-page-company__video-control:focus-visible {
    outline: 3px solid #00e4ff;
    outline-offset: 3px;
}

.zbt-about-page-company__video-control--close {
    /* Reason: 使用物理定位避免窄屏布局上下文重算逻辑定位后，把关闭按钮挤到视频框外。 */
    top: 14px;
    right: 14px;
    bottom: auto;
    left: auto;
    font-size: 27px;
}

.zbt-about-page-company__stats {
    position: absolute;
    /* Reason: 数据卡紧随正文和组合视觉结束位置，避免继承旧整图锚点后在桌面端留下无意义的大段空白。 */
    inset-block-start: 842px;
    inset-inline-start: 2px;
    display: grid;
    grid-template-columns: repeat(2, 589px);
    gap: 44px 39px;
    margin: 0;
}

.zbt-about-page-company__stat {
    display: grid;
    min-block-size: 157px;
    align-content: center;
    padding: 22px 110px;
    border-radius: 10px;
    background: linear-gradient(90deg, #0032c8 0%, #00cce1 100%);
    color: #fff;
}

.zbt-about-page-company__stat dt,
.zbt-about-page-company__stat dd {
    margin: 0;
    color: inherit;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
}

.zbt-about-page-company__stat dt {
    font-size: 42px;
    font-weight: 700;
    line-height: 54px;
    white-space: nowrap;
}

.zbt-about-page-company__stat dd {
    margin-top: 8px;
    font-size: 26px;
    line-height: 30px;
}

@media (min-width: 92.0625rem) and (max-width: 119.9375rem) {
.zbt-about-page-stage--company {
        block-size: calc(100vw * 1380 / 1920);
    }

.zbt-about-page-stage--company .zbt-about-page-stage__default,
.zbt-about-page-stage--company .zbt-about-page-company__dynamic {
        transform: scale(calc(100vw / 1920px));
        transform-origin: top left;
    }
}

@media (max-width: 92rem) {
.zbt-about-page-stage--company {
        block-size: auto;
        min-block-size: 0;
    }

.has-psd-default .zbt-about-page-stage--company .zbt-about-page-stage__default {
        display: none;
    }

.has-psd-default .zbt-about-page-company__dynamic {
        display: block;
    }

.zbt-about-page-company__dynamic {
        inline-size: 100%;
        block-size: auto;
        min-block-size: 0;
        padding-block: 96px;
        background-size: auto 100%;
    }

.zbt-about-page-company__layout {
        display: grid;
        inline-size: min(calc(100% - 96px), 1200px);
        block-size: auto;
        grid-template-columns: minmax(0, 1fr) minmax(360px, 0.9fr);
        align-items: start;
        column-gap: 54px;
    }

.zbt-about-page-company__copy,
.zbt-about-page-company__visual,
.zbt-about-page-company__stats {
        position: static;
    }

.zbt-about-page-company__visual {
        position: relative;
        /* Reason: 该元素从桌面绝对坐标切为栅格项；必须清除桌面偏移，才能在右列内按可用宽度缩放。 */
        inset: auto;
    }

.zbt-about-page-company__copy {
        inline-size: auto;
    }

.zbt-about-page-company__copy h2 {
        font-size: 50px;
    }

.zbt-about-page-company__content {
        margin-top: 46px;
        font-size: 21px;
        line-height: 38px;
    }

.zbt-about-page-company__visual {
        /* Reason: 图 1 的窄桌面版式要求组合视觉与标题组从同一行开始，不能沿用旧的垂直下沉锚点。 */
        inline-size: min(100%, 580px);
        block-size: auto;
        aspect-ratio: 1;
        justify-self: end;
        margin-block-start: -48px;
    }

.zbt-about-page-company__stats {
        grid-column: 1 / -1;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 28px;
        margin-top: 64px;
    }

.zbt-about-page-company__stat {
        min-block-size: 145px;
        padding: 24px 8%;
    }

.zbt-about-page-company__stat dt {
        font-size: 34px;
        white-space: normal;
    }
}

@media (max-width: 48rem) {
.zbt-about-page-company__dynamic {
        padding-block: 64px;
    }

.zbt-about-page-company__layout {
        inline-size: calc(100% - 48px);
        grid-template-columns: 1fr;
        row-gap: 44px;
    }

.zbt-about-page-company__copy h2 {
        font-size: 40px;
    }

.zbt-about-page-company__content {
        margin-top: 32px;
        font-size: 17px;
        line-height: 31px;
    }

.zbt-about-page-company__visual {
        justify-self: center;
        inline-size: min(100%, 380px);
        /* Reason: 单列布局中视觉图必须排在正文之后；取消双列窄桌面的上移量，避免与正文末行重叠。 */
        margin-block-start: 0;
    }

.zbt-about-page-company__video-player {
        position: fixed;
        /* Reason: 窄屏播放器是阻塞式覆盖层，必须越过吸顶页头，确保其位于全部页面文字与内容之上。 */
        z-index: 40;
        inset: 0;
        inline-size: 100vw;
        block-size: 100dvh;
        border-radius: 0;
        background: rgb(3 3 3 / 88%);
    }

.zbt-about-page-company__video-frame {
        inline-size: min(92vw, 760px);
        border-radius: 16px;
    }

.zbt-about-page-company__stats {
        grid-template-columns: 1fr;
        gap: 18px;
        margin-top: 0;
    }

.zbt-about-page-company__stat {
        min-block-size: 120px;
        padding-inline: 11%;
    }

.zbt-about-page-company__stat dt {
        font-size: 28px;
        line-height: 38px;
    }

.zbt-about-page-company__stat dd {
        font-size: 19px;
        line-height: 25px;
    }
}

.zbt-about-page-stage--history {
    block-size: 1225px;
    background: linear-gradient(156deg, #00b4fa 0%, #0032c8 100%);
}

.zbt-about-page-stage--history .zbt-about-page-stage__default img {
    block-size: 1225px;
}

.zbt-about-page-history__dynamic {
    position: relative;
    inline-size: var(--zbt-home-psd-canvas-inline-size);
    block-size: 1225px;
    background: linear-gradient(180deg, #00b1f9 0%, #0036c9 100%);
    color: #fff;
}

.zbt-about-page-history__layout {
    position: relative;
    inline-size: 1220px;
    block-size: 100%;
    margin: 0 auto;
}

.zbt-about-page-history__layout h2 {
    position: absolute;
    inset-block-start: 88px;
    inset-inline-start: -1px;
    margin: 0;
    color: #fff;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 59px;
    font-weight: 700;
    line-height: 1;
}

.zbt-about-page-history__content {
    position: absolute;
    inset-block-start: 202px;
    inset-inline-start: -3px;
    inline-size: 1223px;
    color: #fff;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 22px;
    line-height: 42px;
}

.zbt-about-page-history__content p {
    margin: 0;
    font-weight: 400;
}

.zbt-about-page-history__content p:first-child {
    font-weight: 700;
}

.zbt-about-page-history__track {
    /* Reason: 曲线放在时间轴容器内，桌面沿用 PSD 横向坐标，窄屏可随时间轴高度一起缩放。 */
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: -350px;
    z-index: 0;
    inline-size: 1920px;
    block-size: 1225px;
    overflow: visible;
    pointer-events: none;
}

.zbt-about-page-history__track-path--vertical {
    display: none;
}

.zbt-about-page-history__track path {
    fill: none;
    stroke: #fff;
    stroke-linecap: round;
    stroke-width: 16px;
}

.zbt-about-page-history__timeline {
    position: absolute;
    inset: 0;
    z-index: 1;
    inline-size: 1220px;
    block-size: 1225px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.zbt-about-page-history__item {
    position: relative;
    display: flex;
    box-sizing: border-box;
    align-items: stretch;
    justify-content: center;
    inline-size: 215px;
    block-size: 186px;
}

.zbt-about-page-history__item::after {
    position: absolute;
    z-index: 1;
    inline-size: 42px;
    block-size: 42px;
    border-radius: 50%;
    background: radial-gradient(circle, #0048d0 0 5px, #fff 5px 12px, #0048d0 12px 17px, #fff 17px 21px);
    content: "";
}

/* Reason: 桌面仍沿用 PSD 的伪元素节点；独立节点仅供窄屏真实曲线测量与绘制使用。 */

.zbt-about-page-history__node {
    display: none;
}

.zbt-about-page-history__item article {
    display: flex;
    box-sizing: border-box;
    inline-size: 100%;
    block-size: 100%;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    padding: 24px 20px;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 10px 20px rgb(0 42 158 / 24%);
    color: #0032c8;
    text-align: center;
}

.zbt-about-page-history__item:nth-child(1) {
    position: absolute;
    inset-block-start: 743px;
    inset-inline-start: 44px;
}

.zbt-about-page-history__item:nth-child(2) {
    position: absolute;
    inset-block-start: 999px;
    inset-inline-start: 271px;
}

.zbt-about-page-history__item:nth-child(3) {
    position: absolute;
    inset-block-start: 743px;
    inset-inline-start: 497px;
}

.zbt-about-page-history__item:nth-child(4) {
    position: absolute;
    inset-block-start: 980px;
    inset-inline-start: 704px;
    inline-size: 305px;
    block-size: 187px;
}

.zbt-about-page-history__item:nth-child(5) {
    position: absolute;
    inset-block-start: 643px;
    inset-inline-start: 950px;
}

.zbt-about-page-history__item:nth-child(1)::after,
.zbt-about-page-history__item:nth-child(3)::after,
.zbt-about-page-history__item:nth-child(5)::after {
    inset-block-start: 197px;
    inset-inline-start: 87px;
}

.zbt-about-page-history__item:nth-child(2)::after {
    inset-block-start: -50px;
    inset-inline-start: 87px;
}

.zbt-about-page-history__item:nth-child(4)::after {
    inset-block-start: -50px;
    inset-inline-start: 133px;
}

.zbt-about-page-history__item h3,
.zbt-about-page-history__item p {
    margin: 0;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
}

.zbt-about-page-history__item h3 {
    order: 2;
    flex: 0 0 auto;
    margin-top: 12px;
    padding: 7px 28px;
    border-radius: 999px;
    background: #0032c8;
    color: #fff;
    font-size: 24px;
    line-height: 34px;
}

.zbt-about-page-history__item p {
    display: grid;
    min-block-size: 76px;
    align-content: center;
    justify-items: center;
    margin: 0;
    font-size: 22px;
    font-weight: 700;
    line-height: 38px;
}

.zbt-about-page-history__item.is-bottom article {
    justify-content: flex-start;
}

.zbt-about-page-history__item.is-bottom h3 {
    order: 0;
    margin-top: 0;
}

.zbt-about-page-history__item.is-bottom p {
    order: 2;
    min-block-size: 0;
    margin-top: 20px;
}

/* Reason: 历史节点原响应式规则带有上下位置的卡片外边距；桌面改为绝对坐标后必须清零。 */

.zbt-about-page-history__item.is-top article,
.zbt-about-page-history__item.is-bottom article {
    margin: 0;
}

/* Reason: 横向 PSD 中 Today 卡片应悬浮在曲线与节点之上；只抬高卡片本身，节点仍固定为曲线锚点。 */
@media (min-width: 75.0625rem) {
.zbt-about-page-history__item:nth-child(5) article {
    position: relative;
    z-index: 2;
    transform: translateY(-24px);
}
}

/*
 * Reason: 桌面时间轴使用固定 1920px 画布后再整体等比缩放。卡片标题必须在画布坐标中
 * 预留足够的字宽，并只遵循后台录入的换行，不能因浏览器缩放或中等桌面宽度再次软换行。
 */

@media (min-width: 92.0625rem) {
.zbt-about-page-history__item article {
        padding-inline: 14px;
    }

.zbt-about-page-history__item h3 {
        margin-top: 10px;
        padding: 6px 24px;
        font-size: 22px;
        line-height: 30px;
    }

.zbt-about-page-history__item p {
        inline-size: 100%;
        min-inline-size: 0;
        min-block-size: 68px;
        font-size: 20px;
        line-height: 34px;
        letter-spacing: 0;
        text-size-adjust: 100%;
        white-space: nowrap;
    }
}

@media (min-width: 92.0625rem) and (max-width: 119.9375rem) {
.zbt-about-page-stage--history {
        block-size: calc(100vw * 1225 / 1920);
    }

.zbt-about-page-stage--history .zbt-about-page-stage__default,
.zbt-about-page-stage--history .zbt-about-page-history__dynamic {
        transform: scale(calc(100vw / 1920px));
        transform-origin: top left;
    }
}

/* Reason: 1200px 至 1472px 仍保留横向 PSD 时间轴，只把 1920px 画布按容器宽度等比缩放。 */
@media (min-width: 75.0625rem) and (max-width: 92rem) {
.zbt-about-page-stage--history {
        block-size: calc(100cqi * 1225 / 1920);
    }

.zbt-about-page-stage--history .zbt-about-page-stage__default,
.zbt-about-page-stage--history .zbt-about-page-history__dynamic {
        transform: scale(calc(100cqi / 1920px));
        transform-origin: top left;
    }

.zbt-about-page-history__dynamic {
        inline-size: 1920px;
        block-size: 1225px;
        padding-block: 0;
    }

.zbt-about-page-history__layout {
        inline-size: 1220px;
        block-size: 1225px;
    }

.zbt-about-page-history__layout h2,
.zbt-about-page-history__content,
.zbt-about-page-history__timeline {
        position: absolute;
    }

.zbt-about-page-history__layout h2 {
        inset-block-start: 88px;
        inset-inline-start: -1px;
        font-size: 59px;
    }

.zbt-about-page-history__content {
        inset-block-start: 202px;
        inset-inline-start: -3px;
        inline-size: 1223px;
        margin-top: 0;
        font-size: 22px;
        line-height: 42px;
    }

.zbt-about-page-history__timeline {
        inset: 0;
        inline-size: 1220px;
        block-size: 1225px;
        margin-top: 0;
    }

.zbt-about-page-history__track {
        inset-inline-start: -350px;
        inline-size: 1920px;
        block-size: 1225px;
        display: block;
    }

.zbt-about-page-history__track-path--horizontal {
        display: block;
    }

.zbt-about-page-history__track-path--vertical {
        display: none;
    }

.zbt-about-page-history__item,
.zbt-about-page-history__item.is-top,
.zbt-about-page-history__item.is-bottom {
        position: absolute;
        display: flex;
        box-sizing: border-box;
        inline-size: 215px;
        block-size: 186px;
        min-block-size: 0;
        grid-template-columns: none;
        justify-items: normal;
    }

.zbt-about-page-history__item:nth-child(1) { inset-block-start: 743px; inset-inline-start: 44px; }
.zbt-about-page-history__item:nth-child(2) { inset-block-start: 999px; inset-inline-start: 271px; }
.zbt-about-page-history__item:nth-child(3) { inset-block-start: 743px; inset-inline-start: 497px; }
.zbt-about-page-history__item:nth-child(4) { inset-block-start: 980px; inset-inline-start: 704px; inline-size: 305px; block-size: 187px; }
.zbt-about-page-history__item:nth-child(5) { inset-block-start: 643px; inset-inline-start: 950px; }

.zbt-about-page-history__item article,
.zbt-about-page-history__item.is-top article,
.zbt-about-page-history__item.is-bottom article {
        display: flex;
        box-sizing: border-box;
        inline-size: 100%;
        block-size: 100%;
        flex-direction: column;
        align-items: center;
        justify-content: flex-end;
        padding: 24px 20px;
    }

.zbt-about-page-history__item h3,
.zbt-about-page-history__item p {
        margin: 0;
        font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    }

.zbt-about-page-history__item h3 {
        order: 2;
        flex: 0 0 auto;
        margin-top: 12px;
        padding: 7px 28px;
        font-size: 24px;
        line-height: 34px;
    }

.zbt-about-page-history__item p {
        display: grid;
        min-block-size: 76px;
        align-content: center;
        justify-items: center;
        font-size: 22px;
        line-height: 38px;
        white-space: normal;
    }

.zbt-about-page-history__item.is-bottom article {
        justify-content: flex-start;
    }

.zbt-about-page-history__item.is-bottom h3 {
        order: 0;
        margin-top: 0;
    }

.zbt-about-page-history__item.is-bottom p {
        order: 2;
        min-block-size: 0;
        margin-top: 20px;
    }
}

@media (max-width: 75rem) {
.zbt-about-page-stage--history {
        block-size: auto;
    }

.zbt-about-page-history__dynamic {
        inline-size: 100%;
        block-size: auto;
        padding-block: 88px 96px;
    }

.zbt-about-page-history__layout {
        inline-size: min(calc(100% - 96px), 1200px);
        block-size: auto;
    }

.zbt-about-page-history__layout h2,
.zbt-about-page-history__content,
.zbt-about-page-history__timeline {
        position: static;
    }

.zbt-about-page-history__track {
        inset-inline-start: 0;
        inline-size: 100%;
        block-size: 100%;
        overflow: visible;
        display: block;
    }

.zbt-about-page-history__track-path--horizontal {
        display: none;
    }

.zbt-about-page-history__track-path--vertical {
        display: block;
    }

.zbt-about-page-history__layout h2 {
        font-size: 50px;
    }

.zbt-about-page-history__content {
        inline-size: auto;
        margin-top: 42px;
        font-size: 21px;
        line-height: 38px;
    }

.zbt-about-page-history__timeline {
        position: relative;
        /* Reason: 卡片、节点和曲线必须处于同一坐标系，窗口变化时由同一容器连续缩放。 */
        --zbt-history-row-size: clamp(142px, 15cqi, 180px);
        --zbt-history-card-gap: clamp(26px, 5cqi, 64px);
        --zbt-history-card-inline-size: clamp(176px, 39cqi, 300px);
        z-index: 1;
        inset-block-start: 0;
        inset-inline-start: 0;
        display: grid;
        inline-size: auto;
        block-size: auto;
        grid-template-columns: 1fr;
        grid-auto-rows: var(--zbt-history-row-size);
        gap: clamp(8px, 1.2cqi, 16px);
        margin-top: 72px;
        isolation: isolate;
    }

.zbt-about-page-history__item,
.zbt-about-page-history__item.is-top,
.zbt-about-page-history__item.is-bottom {
        position: relative;
        inset: auto;
        display: grid;
        box-sizing: border-box;
        inline-size: auto;
        block-size: var(--zbt-history-row-size);
        min-block-size: 0;
        align-self: auto;
        /* Reason: 每个节点固定使用中线两侧的独立列，卡片才能贴近节点而不是被推到容器边缘。 */
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        justify-items: stretch;
        z-index: 1;
    }

.zbt-about-page-history__item::after {
        display: none;
    }

/* Reason: 节点为曲线的唯一锚点；JavaScript 会读取其实际中心，因而卡片与文字高度变化不会造成线条错位。 */

.zbt-about-page-history__node {
        position: absolute;
        z-index: 3;
        display: block;
        inset-block-start: 50%;
        inline-size: clamp(28px, 3.4cqi, 38px);
        block-size: clamp(28px, 3.4cqi, 38px);
        border-radius: 50%;
        background: radial-gradient(circle, #0048d0 0 4px, #fff 4px 10px, #0048d0 10px 14px, #fff 14px 17px);
        box-shadow: 0 0 0 3px rgb(0 60 198 / 16%);
        transform: translate(-50%, -50%);
    }

.zbt-about-page-history__item:nth-child(odd) .zbt-about-page-history__node,
.zbt-about-page-history__item:nth-child(even) .zbt-about-page-history__node { inset-inline-start: 50%; }

.zbt-about-page-history__item article,
.zbt-about-page-history__item.is-top article,
.zbt-about-page-history__item.is-bottom article {
        position: relative;
        z-index: 2;
        display: flex;
        box-sizing: border-box;
        inline-size: min(var(--zbt-history-card-inline-size), calc(100% - var(--zbt-history-card-gap)));
        block-size: auto;
        min-block-size: clamp(104px, 10.5cqi, 132px);
        margin: 0;
        padding: clamp(14px, 1.7cqi, 20px) clamp(12px, 1.8cqi, 20px);
        border: 1px solid rgb(255 255 255 / 82%);
        box-shadow: 0 clamp(8px, 1.2cqi, 14px) clamp(18px, 2.4cqi, 28px) rgb(0 42 158 / 28%), 0 3px 8px rgb(0 42 158 / 16%);
        justify-content: center;
        transition: inline-size 220ms ease, min-block-size 220ms ease, padding 220ms ease, box-shadow 220ms ease;
    }

.zbt-about-page-history__item:nth-child(odd) article {
        grid-column: 2;
        justify-self: start;
        margin-inline-start: var(--zbt-history-card-gap);
    }

.zbt-about-page-history__item:nth-child(even) article {
        grid-column: 1;
        justify-self: end;
        margin-inline-end: var(--zbt-history-card-gap);
    }

.zbt-about-page-history__item p {
        min-block-size: 0;
        font-size: clamp(16px, 1.7cqi, 20px);
        line-height: 1.55;
    }

.zbt-about-page-history__item h3 {
        margin-top: clamp(8px, 1cqi, 12px);
        padding: clamp(5px, .55cqi, 7px) clamp(18px, 2cqi, 24px);
        font-size: clamp(18px, 1.8cqi, 22px);
        line-height: 1.25;
    }

.zbt-about-page-history__item.is-bottom h3 { margin-top: 0; }

.zbt-about-page-history__item.is-bottom p { margin-top: clamp(10px, 1.5cqi, 16px); }
}

@media (max-width: 48rem) {
.zbt-about-page-history__dynamic {
        padding-block: 64px 72px;
    }

.zbt-about-page-history__layout {
        inline-size: calc(100% - 48px);
    }

.zbt-about-page-history__layout h2 {
        font-size: 40px;
    }

.zbt-about-page-history__content {
        margin-top: 30px;
        font-size: 17px;
        line-height: 31px;
    }

.zbt-about-page-history__timeline {
        margin-top: 48px;
    }

.zbt-about-page-history__item {
        min-block-size: 0;
    }

.zbt-about-page-history__timeline {
        --zbt-history-row-size: clamp(128px, 35vw, 150px);
        --zbt-history-card-gap: clamp(18px, 5vw, 28px);
        --zbt-history-card-inline-size: clamp(148px, 43vw, 220px);
        gap: clamp(6px, 2vw, 10px);
    }

.zbt-about-page-history__item article,
.zbt-about-page-history__item.is-top article,
.zbt-about-page-history__item.is-bottom article {
        inline-size: min(var(--zbt-history-card-inline-size), calc(100% - var(--zbt-history-card-gap)));
        min-block-size: clamp(96px, 27vw, 112px);
        padding: clamp(12px, 3.5vw, 16px) clamp(10px, 3vw, 14px);
    }

.zbt-about-page-history__item h3 {
        margin-top: clamp(8px, 2vw, 10px);
        padding: 6px 18px;
        font-size: 18px;
        line-height: 24px;
    }

.zbt-about-page-history__item p {
        font-size: 16px;
        line-height: 1.5;
    }
}

@media (prefers-reduced-motion: no-preference) and (max-width: 75rem) {
.zbt-about-page-history__timeline {
        animation: zbt-about-history-vertical-in 220ms ease-out both;
    }
}

@keyframes zbt-about-history-vertical-in {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.zbt-about-page-stage--innovation {
    block-size: 1855px;
    background: #fff;
}

.zbt-about-page-stage--innovation .zbt-about-page-stage__default img {
    block-size: 1855px;
}

.zbt-about-page-innovation__dynamic {
    position: relative;
    inline-size: var(--zbt-home-psd-canvas-inline-size);
    block-size: 1855px;
    background: #fff;
}

.has-psd-default .zbt-about-page-innovation__dynamic {
    z-index: 1;
    display: block;
    background: transparent;
    pointer-events: none;
}

/* Reason: 默认桌面画面必须始终由 PSD 整图承载，交互层只覆盖四张卡，不能替换模块标题和正文。 */

.has-psd-default .zbt-about-page-innovation__layout h2,
.has-psd-default .zbt-about-page-innovation__content {
    visibility: hidden;
}

.has-psd-default .zbt-about-page-innovation__dynamic .zbt-about-page-innovation__card {
    opacity: 0;
    pointer-events: auto;
}

.has-psd-default .zbt-about-page-innovation__cards:has(.zbt-about-page-innovation__card:hover) .zbt-about-page-innovation__card.is-accent,
.has-psd-default .zbt-about-page-innovation__cards:not(:has(.zbt-about-page-innovation__card:hover)):has(.zbt-about-page-innovation__card:focus-visible) .zbt-about-page-innovation__card.is-accent,
.has-psd-default .zbt-about-page-innovation__cards:has(.zbt-about-page-innovation__card:hover) .zbt-about-page-innovation__card:hover,
.has-psd-default .zbt-about-page-innovation__cards:not(:has(.zbt-about-page-innovation__card:hover)):has(.zbt-about-page-innovation__card:focus-visible) .zbt-about-page-innovation__card:focus-visible {
    opacity: 1;
}

.zbt-about-page-innovation__layout {
    position: relative;
    inline-size: 1220px;
    block-size: 100%;
    margin: 0 auto;
}

.zbt-about-page-innovation__layout h2 {
    position: absolute;
    inset-block-start: 189px;
    inset-inline-start: 0;
    margin: 0;
    color: #0032c8;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 59px;
    font-weight: 700;
    line-height: 1;
}

.zbt-about-page-innovation__content {
    position: absolute;
    inset-block-start: 303px;
    inset-inline-start: -1px;
    inline-size: 1220px;
    color: #1a1a1a;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 24px;
    line-height: 46px;
}

.zbt-about-page-innovation__content p {
    margin: 0;
}

.zbt-about-page-innovation__content p:first-child {
    font-weight: 700;
}

.zbt-about-page-innovation__cards {
    position: absolute;
    inset-block-start: 694px;
    inset-inline-start: 0;
    display: grid;
    inline-size: 1218px;
    grid-template-columns: repeat(2, 577px);
    gap: 51px 64px;
}

.zbt-about-page-innovation__card {
    position: relative;
    block-size: 402px;
    overflow: hidden;
    padding: 55px 58px;
    border-radius: 18px;
    background: var(--zbt-about-innovation-card-background, #f2f2f2);
    color: var(--zbt-about-innovation-card-color, #0032c8);
}

.zbt-about-page-innovation__card[data-innovation-card="0"] {
    --zbt-about-innovation-gear-neutral: url("https://wp-oss.j4c.cc/zbt/official/wp-content/uploads/2026/08/about-page-innovation-design-neutral.png?zbt_asset=03c6b2c574b0");
    --zbt-about-innovation-gear-accent: url("https://wp-oss.j4c.cc/zbt/official/wp-content/uploads/2026/08/about-page-innovation-design.png?zbt_asset=b9d9834ce3f0");
}

.zbt-about-page-innovation__card[data-innovation-card="1"] {
    --zbt-about-innovation-gear-neutral: url("https://wp-oss.j4c.cc/zbt/official/wp-content/uploads/2026/08/about-page-innovation-manufacturing.png?zbt_asset=2c7f741d2591");
    --zbt-about-innovation-gear-accent: url("https://wp-oss.j4c.cc/zbt/official/wp-content/uploads/2026/08/about-page-innovation-manufacturing-accent.png?zbt_asset=45477769d6c7");
}

.zbt-about-page-innovation__card[data-innovation-card="2"] {
    --zbt-about-innovation-gear-neutral: url("https://wp-oss.j4c.cc/zbt/official/wp-content/uploads/2026/08/about-page-innovation-quality.png?zbt_asset=6a1f2fc574fb");
    --zbt-about-innovation-gear-accent: url("https://wp-oss.j4c.cc/zbt/official/wp-content/uploads/2026/08/about-page-innovation-quality-accent.png?zbt_asset=372261ff0dab");
}

.zbt-about-page-innovation__card[data-innovation-card="3"] {
    --zbt-about-innovation-gear-neutral: url("https://wp-oss.j4c.cc/zbt/official/wp-content/uploads/2026/08/about-page-innovation-core.png?zbt_asset=802c461e4025");
    --zbt-about-innovation-gear-accent: url("https://wp-oss.j4c.cc/zbt/official/wp-content/uploads/2026/08/about-page-innovation-core-accent.png?zbt_asset=c58fdc1f828b");
}

.zbt-about-page-innovation__card {
    --zbt-about-innovation-gear-image: var(--zbt-about-innovation-gear-neutral);
}

.zbt-about-page-innovation__card.is-accent {
    --zbt-about-innovation-card-background: #0032c8;
    --zbt-about-innovation-card-color: #fff;
    --zbt-about-innovation-gear-image: var(--zbt-about-innovation-gear-accent);
}

.zbt-about-page-innovation__card > img {
    display: none;
}

.zbt-about-page-innovation__card::after {
    position: absolute;
    z-index: 0;
    inset: 0;
    background: var(--zbt-about-innovation-gear-image) center / 100% 100% no-repeat;
    content: "";
    pointer-events: none;
}

/* Reason: 悬浮某一项时取消数据首卡的默认强调，只保留当前指针或键盘焦点所在卡片的完整蓝色视觉。 */

.zbt-about-page-innovation__cards:has(.zbt-about-page-innovation__card:hover) .zbt-about-page-innovation__card,
.zbt-about-page-innovation__cards:not(:has(.zbt-about-page-innovation__card:hover)):has(.zbt-about-page-innovation__card:focus-visible) .zbt-about-page-innovation__card {
    --zbt-about-innovation-card-background: #f2f2f2;
    --zbt-about-innovation-card-color: #0032c8;
    --zbt-about-innovation-gear-image: var(--zbt-about-innovation-gear-neutral);
}

.zbt-about-page-innovation__cards:has(.zbt-about-page-innovation__card:hover) .zbt-about-page-innovation__card:hover,
.zbt-about-page-innovation__cards:not(:has(.zbt-about-page-innovation__card:hover)):has(.zbt-about-page-innovation__card:focus-visible) .zbt-about-page-innovation__card:focus-visible {
    --zbt-about-innovation-card-background: #0032c8;
    --zbt-about-innovation-card-color: #fff;
    --zbt-about-innovation-gear-image: var(--zbt-about-innovation-gear-accent);
}

.zbt-about-page-innovation__card h3,
.zbt-about-page-innovation__card ul {
    position: relative;
    z-index: 1;
    margin: 0;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
}

.zbt-about-page-innovation__card h3 {
    font-size: 50px;
    font-weight: 700;
    line-height: 1;
}

.zbt-about-page-innovation__card ul {
    display: grid;
    gap: 13px;
    margin-top: 47px;
    padding: 0;
    list-style: none;
    font-size: 22px;
    line-height: 1.2;
}

.zbt-about-page-innovation__card li {
    display: flex;
    align-items: center;
    gap: 16px;
}

.zbt-about-page-innovation__card li::before {
    display: inline-grid;
    inline-size: 19px;
    block-size: 19px;
    flex: 0 0 auto;
    place-items: center;
    border: 2px solid currentcolor;
    border-radius: 50%;
    content: "✓";
    font-size: 13px;
    line-height: 1;
}

@media (min-width: 92.0625rem) and (max-width: 119.9375rem) {
.zbt-about-page-stage--innovation {
        block-size: calc(100vw * 1855 / 1920);
    }

.zbt-about-page-stage--innovation .zbt-about-page-stage__default,
.zbt-about-page-stage--innovation .zbt-about-page-innovation__dynamic {
        transform: scale(calc(100vw / 1920px));
        transform-origin: top left;
    }
}

@media (max-width: 92rem) {
.zbt-about-page-stage--innovation {
        block-size: auto;
    }

.has-psd-default .zbt-about-page-stage--innovation .zbt-about-page-stage__default {
        display: none;
    }

.has-psd-default .zbt-about-page-innovation__dynamic {
        display: block;
        background: #fff;
        pointer-events: auto;
    }

.has-psd-default .zbt-about-page-innovation__layout h2,
.has-psd-default .zbt-about-page-innovation__content {
        visibility: visible;
    }

.has-psd-default .zbt-about-page-innovation__dynamic .zbt-about-page-innovation__card {
        opacity: 1;
    }

.zbt-about-page-innovation__dynamic {
        inline-size: 100%;
        block-size: auto;
        padding-block: 88px;
    }

.zbt-about-page-innovation__layout {
        inline-size: min(calc(100% - 96px), 1200px);
        block-size: auto;
    }

.zbt-about-page-innovation__layout h2,
.zbt-about-page-innovation__content,
.zbt-about-page-innovation__cards {
        position: static;
    }

.zbt-about-page-innovation__layout h2 {
        font-size: 50px;
    }

.zbt-about-page-innovation__content {
        inline-size: auto;
        margin-top: 42px;
        font-size: 21px;
        line-height: 38px;
    }

.zbt-about-page-innovation__cards {
        inline-size: auto;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 33px 40px;
        margin-top: 64px;
    }

.zbt-about-page-innovation__card {
        block-size: auto;
        min-block-size: 330px;
        padding: 42px;
    }

.zbt-about-page-innovation__card h3 {
        font-size: 42px;
    }
}

@media (max-width: 48rem) {
.zbt-about-page-innovation__dynamic {
        padding-block: 64px;
    }

.zbt-about-page-innovation__layout {
        inline-size: calc(100% - 48px);
    }

.zbt-about-page-innovation__layout h2 {
        font-size: 40px;
    }

.zbt-about-page-innovation__content {
        margin-top: 30px;
        font-size: 17px;
        line-height: 31px;
    }

.zbt-about-page-innovation__cards {
        grid-template-columns: 1fr;
        gap: 20px;
        margin-top: 46px;
    }

.zbt-about-page-innovation__card {
        min-block-size: 265px;
        padding: 30px;
    }

.zbt-about-page-innovation__card h3 {
        font-size: 34px;
    }

.zbt-about-page-innovation__card ul {
        gap: 10px;
        margin-top: 28px;
        font-size: 18px;
    }
}

.zbt-about-page-stage--qualification {
    /* Reason: 背景图在 PSD 中从 y=5330 开始，标题从 y=5417 开始；向上覆盖 87px 才能保留标题上方的蓝色留白。 */
    margin-block-start: -87px;
    block-size: 963px;
    background: #0032c8;
}

.zbt-about-page-stage--qualification .zbt-about-page-stage__default img {
    block-size: 963px;
}

.zbt-about-page-qualification__dynamic {
    position: relative;
    /* 资质项整体下移且受限于合理区间；固定画布缩放与窄屏流式布局均复用该变量。 */
    --zbt-about-page-qualification-items-offset: clamp(36px, 4vw, 64px);
    inline-size: var(--zbt-home-psd-canvas-inline-size);
    block-size: 963px;
    overflow: hidden;
    background: #0032c8;
    color: #fff;
}

.zbt-about-page-qualification__background {
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 0;
    z-index: 0;
    display: block;
    inline-size: 1920px;
    block-size: 963px;
    max-inline-size: none;
    object-fit: fill;
    pointer-events: none;
    user-select: none;
}

.zbt-about-page-qualification__layout {
    position: relative;
    z-index: 1;
    inline-size: 1220px;
    block-size: 100%;
    margin: 0 auto;
}

.zbt-about-page-qualification__layout h2 {
    position: absolute;
    inset-block-start: 87px;
    inset-inline-start: -3px;
    margin: 0;
    color: #fff;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 59px;
    font-weight: 700;
    line-height: 1;
}

.zbt-about-page-qualification__content {
    position: absolute;
    /* Reason: Photoshop 坐标记录的是字形可见边界，浏览器行盒需上移 12px 才能让首行字形落在 y=201。 */
    inset-block-start: 189px;
    inset-inline-start: -4px;
    inline-size: 1110px;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 21.7px;
    line-height: 43px;
}

.zbt-about-page-qualification__content p {
    margin: 0;
}

.zbt-about-page-qualification__content p:first-child {
    font-weight: 700;
}

.zbt-about-page-qualification__items {
    position: absolute;
    inset-block-start: calc(352px + var(--zbt-about-page-qualification-items-offset));
    inset-inline-start: 184px;
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    inline-size: 893px;
    gap: 38px 26px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.zbt-about-page-qualification__items li {
    position: relative;
    display: flex;
    grid-column: span 3;
    min-block-size: 96px;
    align-items: center;
    justify-content: center;
    /* 两侧 32px 月桂与各 6px 间距共占 76px，保持原有文字可用宽度。 */
    gap: 6px;
    padding: 0;
    color: #fff;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 27px;
    text-align: center;
}

/* 桌面端固定四列；第二行的三项各向内偏移一列，形成稳定且居中的 4+3 队列。 */
.zbt-about-page-qualification__items li:nth-child(5) {
    grid-column: 2 / span 3;
}

.zbt-about-page-qualification__label {
    /* 标签占满条目高度并自行居中，多行文字以整体中心而非首行基线与两侧月桂的中轴对齐。 */
    display: flex;
    align-self: stretch;
    align-items: center;
    justify-content: center;
    min-inline-size: 0;
}

.zbt-about-page-qualification__laurel {
    /* 月桂参与 Flex 排列，随资质文字宽度移动；清除旧定位偏移以消除中等屏宽的大留白。 */
    position: static;
    inset: auto;
    display: block;
    flex: 0 0 auto;
    inline-size: 32px;
    /* 素材已裁去底部透明留白，保留 57px 高度以和文字块沿条目中轴居中。 */
    block-size: 57px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.zbt-about-page-qualification__laurel--left {
    background-image: url("https://wp-oss.j4c.cc/zbt/official/wp-content/uploads/2026/08/about-page-qualification-laurel-top-left.png?zbt_asset=4932a8e6864d");
}

.zbt-about-page-qualification__laurel--right {
    background-image: url("https://wp-oss.j4c.cc/zbt/official/wp-content/uploads/2026/08/about-page-qualification-laurel-top-right.png?zbt_asset=222ea66f547a");
}

.zbt-about-page-qualification__image {
    display: none;
}

@media (min-width: 92.0625rem) and (max-width: 119.9375rem) {
.zbt-about-page-stage--qualification {
        margin-block-start: calc(100vw * -87 / 1920);
        block-size: calc(100vw * 963 / 1920);
    }

.zbt-about-page-stage--qualification .zbt-about-page-stage__default,
.zbt-about-page-stage--qualification .zbt-about-page-qualification__dynamic {
        transform: scale(calc(100vw / 1920px));
        transform-origin: top left;
    }
}

@media (max-width: 92rem) {
.zbt-about-page-stage--qualification {
        margin-block-start: 0;
        block-size: auto;
    }

.has-psd-default .zbt-about-page-stage--qualification .zbt-about-page-stage__default {
        display: none;
    }

.has-psd-default .zbt-about-page-qualification__dynamic {
        display: block;
    }

.zbt-about-page-qualification__dynamic {
        inline-size: 100%;
        block-size: auto;
        min-block-size: 963px;
        padding-block: 88px 64px;
    }

.zbt-about-page-qualification__background {
        inset-block-start: 0;
        inset-inline-start: 50%;
        inline-size: auto;
        block-size: 100%;
        transform: translateX(-50%);
    }

.zbt-about-page-qualification__layout {
        display: grid;
        inline-size: min(calc(100% - 96px), 1200px);
        block-size: auto;
    }

.zbt-about-page-qualification__layout h2,
.zbt-about-page-qualification__content,
.zbt-about-page-qualification__items {
        position: static;
    }

.zbt-about-page-qualification__layout h2 {
        font-size: 50px;
    }

.zbt-about-page-qualification__content {
        inline-size: auto;
        margin-top: 42px;
        font-size: 21px;
        line-height: 38px;
    }

.zbt-about-page-qualification__items {
    inline-size: auto;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 32px 24px;
    margin-top: calc(56px + var(--zbt-about-page-qualification-items-offset));
}

/* 平板端固定三列；第七项独占末行并保持居中，不受容器余量影响。 */
.zbt-about-page-qualification__items li {
    grid-column: span 2;
}

.zbt-about-page-qualification__items li:nth-child(5) {
    grid-column: span 2;
}

.zbt-about-page-qualification__items li:nth-child(7) {
    grid-column: 3 / span 2;
}
}

@media (max-width: 48rem) {
.zbt-about-page-qualification__dynamic {
        padding-top: 64px;
    }

.zbt-about-page-qualification__layout {
        inline-size: calc(100% - 48px);
    }

.zbt-about-page-qualification__layout h2 {
        font-size: 40px;
    }

.zbt-about-page-qualification__content {
        margin-top: 30px;
        font-size: 17px;
        line-height: 31px;
    }

.zbt-about-page-qualification__items {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 18px 12px;
        margin-top: calc(38px + var(--zbt-about-page-qualification-items-offset));
    }

.zbt-about-page-qualification__items li {
        grid-column: span 2;
        min-block-size: 72px;
        /* 两侧 24px 月桂与各 4px 间距共占 56px，保持窄屏文字可用宽度。 */
        gap: 4px;
        padding-inline: 0;
        font-size: 15px;
        line-height: 22px;
    }

.zbt-about-page-qualification__laurel {
        inline-size: 24px;
        /* 保持桌面 32:57 的比例，避免窄屏重新引入垂直透明留白。 */
        block-size: 43px;
    }

    /* 手机端固定两列；最后一项跨中间两轨，避免落在左侧形成视觉失衡。 */
    .zbt-about-page-qualification__items li:nth-child(7) {
        grid-column: 2 / span 2;
    }
}

.zbt-about-page-stage--recruitment {
    block-size: 809px;
    background: #030303;
}

.zbt-about-page-stage--recruitment .zbt-about-page-stage__default img {
    block-size: 809px;
}

.zbt-about-page-recruitment__dynamic {
    position: relative;
    inline-size: var(--zbt-home-psd-canvas-inline-size);
    block-size: 809px;
    overflow: hidden;
    background: #030303;
    color: #fff;
}

.zbt-about-page-recruitment__dynamic::before {
    /* Reason: 资质认证背景图已经包含 PSD 的完整斜切底边，招聘区不能再次绘制蓝色过渡。 */
    display: none;
}

.has-psd-default .zbt-about-page-recruitment__dynamic {
    display: none;
}

.zbt-about-page-recruitment__layout {
    position: relative;
    inline-size: 1220px;
    block-size: 100%;
    margin: 0 auto;
}

.zbt-about-page-recruitment__layout h2 {
    position: absolute;
    inset-block-start: 190px;
    inset-inline-start: 0;
    margin: 0;
    color: #fff;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 59px;
    font-weight: 700;
    line-height: 1;
}

.zbt-about-page-recruitment__banner {
    position: absolute;
    inset-block-start: 299px;
    inset-inline-start: 0;
    display: grid;
    inline-size: 1219px;
    block-size: 401px;
    place-items: center;
    overflow: hidden;
    border-radius: 20px;
    background: #0438b5 var(--zbt-about-page-recruitment-background) center / cover no-repeat;
    color: #fff;
    text-decoration: none;
}

.zbt-about-page-recruitment__banner:focus-visible {
    outline: 3px solid #fff;
    outline-offset: 4px;
}

.zbt-about-page-recruitment__description {
    display: grid;
    gap: 20px;
    justify-items: center;
    padding-inline: 48px;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 58px;
    font-weight: 700;
    line-height: 1;
    text-align: center;
}

.zbt-about-page-recruitment__description span {
    display: block;
}

@media (min-width: 92.0625rem) and (max-width: 119.9375rem) {
.zbt-about-page-stage--recruitment {
        block-size: calc(100vw * 809 / 1920);
    }

.zbt-about-page-stage--recruitment .zbt-about-page-stage__default,
.zbt-about-page-stage--recruitment .zbt-about-page-recruitment__dynamic {
        transform: scale(calc(100vw / 1920px));
        transform-origin: top left;
    }
}

@media (max-width: 92rem) {
.zbt-about-page-stage--recruitment {
        block-size: auto;
    }

.has-psd-default .zbt-about-page-stage--recruitment .zbt-about-page-stage__default {
        display: none;
    }

.has-psd-default .zbt-about-page-recruitment__dynamic {
        display: block;
    }

.zbt-about-page-recruitment__dynamic {
        inline-size: 100%;
        block-size: auto;
        min-block-size: 0;
        padding-block: 88px 112px;
    }

.zbt-about-page-recruitment__layout {
        display: grid;
        inline-size: min(calc(100% - 96px), 1200px);
        block-size: auto;
    }

.zbt-about-page-recruitment__layout h2,
.zbt-about-page-recruitment__banner {
        position: static;
    }

.zbt-about-page-recruitment__layout h2 {
        font-size: 50px;
    }

.zbt-about-page-recruitment__banner {
        inline-size: 100%;
        block-size: auto;
        aspect-ratio: 1219 / 401;
        margin-top: 54px;
    }

.zbt-about-page-recruitment__description {
        gap: 16px;
        font-size: clamp(28px, 4.5vw, 54px);
    }
}

@media (max-width: 48rem) {
.zbt-about-page-recruitment__dynamic {
        padding-block: 64px 76px;
    }

.zbt-about-page-recruitment__layout {
        inline-size: calc(100% - 48px);
    }

.zbt-about-page-recruitment__layout h2 {
        font-size: 40px;
    }

.zbt-about-page-recruitment__banner {
        margin-top: 32px;
        border-radius: 12px;
    }

.zbt-about-page-recruitment__description {
        gap: 8px;
        padding-inline: 20px;
        font-size: clamp(22px, 7.2vw, 32px);
    }
}

.zbt-about-page-stage--contact {
    block-size: 1769px;
    background: #030303;
}

.zbt-about-page-stage--contact .zbt-about-page-stage__default img {
    block-size: 1769px;
}

.zbt-about-page-contact__dynamic {
    position: relative;
    inline-size: var(--zbt-home-psd-canvas-inline-size);
    block-size: 1769px;
    background: #030303;
    color: #fff;
}

.has-psd-default .zbt-about-page-contact__dynamic {
    display: none;
}

.zbt-about-page-contact__layout {
    position: relative;
    inline-size: 1220px;
    block-size: 100%;
    margin: 0 auto;
}

.zbt-about-page-contact__layout h2 {
    position: absolute;
    inset-block-start: 70px;
    inset-inline-start: -3px;
    margin: 0;
    color: #fff;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 59px;
    font-weight: 700;
    line-height: 1;
}

.zbt-about-page-contact__divider {
    position: absolute;
    inset-block-start: 168px;
    inset-inline-start: -135px;
    inline-size: 1489px;
    block-size: 1px;
    background: #0032c8;
}

.zbt-about-page-contact__content {
    position: absolute;
    inset-block-start: 240px;
    inset-inline: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 316px;
    align-items: start;
    gap: 80px;
}

.zbt-about-page-contact__details h3 {
    margin: 0;
    color: #fff;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 35px;
    font-weight: 700;
    line-height: 42px;
}

.zbt-about-page-contact__list {
    display: grid;
    gap: 24px;
    margin: 69px 0 0;
}

.zbt-about-page-contact__list > div {
    display: flex;
    min-block-size: 57px;
    align-items: center;
    gap: 22px;
}

.zbt-about-page-contact__list dt {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 25px;
    color: #fff;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 27px;
    line-height: 31px;
    white-space: nowrap;
}

.zbt-about-page-contact__list dt img {
    display: block;
    inline-size: 27px;
    block-size: 31px;
    object-fit: contain;
}

.zbt-about-page-contact__list dd {
    min-inline-size: 0;
    margin: 0;
    color: #fff;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 27px;
    line-height: 31px;
}

.zbt-about-page-contact__wechat {
    display: grid;
    justify-items: center;
    gap: 26px;
    padding-top: 13px;
}

.zbt-about-page-contact__qr {
    display: grid;
    inline-size: 316px;
    block-size: 316px;
    overflow: hidden;
    place-items: center;
    border-radius: 19px;
    background: #fff;
}

.zbt-about-page-contact__qr img {
    inline-size: 100%;
    block-size: 100%;
    object-fit: contain;
}

.zbt-about-page-contact__wechat p {
    margin: 0;
    color: #fff;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 27px;
    line-height: 31px;
}

@media (min-width: 92.0625rem) and (max-width: 119.9375rem) {
.zbt-about-page-stage--contact {
        block-size: calc(100vw * 1769 / 1920);
    }

.zbt-about-page-stage--contact .zbt-about-page-stage__default,
.zbt-about-page-stage--contact .zbt-about-page-contact__dynamic {
        transform: scale(calc(100vw / 1920px));
        transform-origin: top left;
    }
}

@media (max-width: 92rem) {
.zbt-about-page-stage--contact {
        block-size: auto;
    }

.has-psd-default .zbt-about-page-stage--contact .zbt-about-page-stage__default {
        display: none;
    }

.has-psd-default .zbt-about-page-contact__dynamic {
        display: block;
    }

.zbt-about-page-contact__dynamic {
        inline-size: 100%;
        block-size: auto;
        min-block-size: 0;
        padding-block: 72px;
    }

.zbt-about-page-contact__layout {
        inline-size: min(calc(100% - 96px), 1200px);
        block-size: auto;
    }

.zbt-about-page-contact__layout h2,
.zbt-about-page-contact__divider,
.zbt-about-page-contact__content {
        position: static;
    }

.zbt-about-page-contact__layout h2 {
        margin-bottom: 48px;
        font-size: 48px;
        line-height: 58px;
    }

.zbt-about-page-contact__divider {
        inline-size: 100%;
        margin-bottom: 72px;
    }

.zbt-about-page-contact__content {
        grid-template-columns: minmax(0, 1fr) 280px;
        gap: 48px;
    }

.zbt-about-page-contact__details h3 {
        font-size: 30px;
        line-height: 40px;
    }

.zbt-about-page-contact__list {
        margin-top: 48px;
    }

.zbt-about-page-contact__list dt,
.zbt-about-page-contact__list dd {
        font-size: 21px;
        line-height: 30px;
    }

.zbt-about-page-contact__qr {
        inline-size: 280px;
        block-size: 280px;
    }
}

@media (max-width: 70rem) {
.zbt-about-page-contact__dynamic {
        padding-block: 56px;
    }

.zbt-about-page-contact__layout {
        inline-size: min(calc(100% - 64px), 960px);
    }

.zbt-about-page-contact__layout h2 {
        margin-bottom: 40px;
        font-size: 40px;
        line-height: 48px;
    }

.zbt-about-page-contact__divider {
        margin-bottom: 56px;
    }

.zbt-about-page-contact__content {
        grid-template-columns: minmax(0, 1fr) 220px;
        gap: 32px;
    }

.zbt-about-page-contact__details h3 {
        font-size: 26px;
    }

.zbt-about-page-contact__list {
        gap: 16px;
        margin-top: 40px;
    }

.zbt-about-page-contact__list > div {
        gap: 14px;
    }

.zbt-about-page-contact__list dt,
.zbt-about-page-contact__list dd {
        font-size: 17px;
        line-height: 26px;
    }

.zbt-about-page-contact__list dt {
        gap: 15px;
    }

.zbt-about-page-contact__list dt img {
        inline-size: 22px;
        block-size: 26px;
    }

.zbt-about-page-contact__qr {
        inline-size: 220px;
        block-size: 220px;
    }

.zbt-about-page-contact__wechat p {
        font-size: 20px;
    }
}

@media (max-width: 48rem) {
.zbt-about-page-contact__dynamic {
        padding-block: 48px;
    }

.zbt-about-page-contact__layout {
        inline-size: calc(100% - 48px);
    }

.zbt-about-page-contact__layout h2 {
        margin-bottom: 32px;
        font-size: 36px;
        line-height: 44px;
    }

.zbt-about-page-contact__divider {
        margin-bottom: 40px;
    }

.zbt-about-page-contact__content {
        grid-template-columns: 1fr;
        gap: 44px;
    }

.zbt-about-page-contact__details h3 {
        font-size: 24px;
        line-height: 34px;
    }

.zbt-about-page-contact__list {
        gap: 18px;
        margin-top: 32px;
    }

.zbt-about-page-contact__list > div {
        display: grid;
        grid-template-columns: 120px minmax(0, 1fr);
        gap: 12px;
        min-block-size: 32px;
    }

.zbt-about-page-contact__list dt,
.zbt-about-page-contact__list dd {
        font-size: 16px;
        line-height: 24px;
    }

.zbt-about-page-contact__list dt {
        gap: 10px;
    }

.zbt-about-page-contact__list dt img {
        inline-size: 20px;
        block-size: 24px;
    }

.zbt-about-page-contact__wechat {
        justify-items: start;
    }

.zbt-about-page-contact__qr {
        inline-size: min(316px, 100%);
        block-size: auto;
        aspect-ratio: 1;
    }
}

@media (max-width: 35rem) {
.zbt-about-page-contact__dynamic {
        padding-block: 44px;
    }

.zbt-about-page-contact__layout h2 {
        margin-bottom: 28px;
        font-size: 32px;
        line-height: 40px;
    }

.zbt-about-page-contact__divider {
        margin-bottom: 32px;
    }

.zbt-about-page-contact__list > div {
        grid-template-columns: 108px minmax(0, 1fr);
    }

.zbt-about-page-contact__list dt,
.zbt-about-page-contact__list dd {
        font-size: 15px;
    }
}

.zbt-contact-page {
    margin: 0;
    overflow: hidden;
    background: #030303;
}

.zbt-contact-page-stage {
    position: relative;
    overflow: clip;
}

.zbt-contact-page-stage__default {
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 0;
    inline-size: var(--zbt-home-psd-canvas-inline-size);
    block-size: 100%;
}

.zbt-contact-page-stage__default img {
    display: block;
    inline-size: var(--zbt-home-psd-canvas-inline-size);
    max-inline-size: none;
    block-size: 100%;
    object-fit: fill;
    pointer-events: none;
    user-select: none;
}

.zbt-contact-page-stage--hero {
    block-size: 799px;
    background: var(--zbt-contact-hero-background, url("https://wp-oss.j4c.cc/zbt/official/wp-content/uploads/2026/09/contact-page-hero-background-optimized.webp?zbt_asset=0832bfd320f8")) center / cover no-repeat;
}

.zbt-contact-page-hero__dynamic {
    position: relative;
    display: grid;
    inline-size: var(--zbt-home-psd-canvas-inline-size);
    block-size: 799px;
    align-items: start;
    background: transparent;
    color: #fff;
}

.zbt-contact-page-hero__content {
    inline-size: 1224px;
    margin: 0 auto;
    padding-top: 202px;
}

.zbt-contact-page-hero__content h1,
.zbt-contact-page-hero__content p {
    margin: 0;
    color: #fff;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
}

.zbt-contact-page-hero__content h1 {
    font-size: 98px;
    font-weight: 700;
    line-height: 104px;
    letter-spacing: .9px;
    white-space: nowrap;
}

.zbt-contact-page-hero__content p {
    max-inline-size: 1130px;
    margin-top: 50px;
    font-size: 32px;
    font-weight: 700;
    line-height: 72px;
    transform: translateX(3px);
}

.zbt-contact-page-stage--services {
    block-size: 1535px;
    background: #fff;
}

.zbt-contact-page-services__layout {
    position: relative;
    inline-size: var(--zbt-home-psd-canvas-inline-size);
    block-size: 1535px;
    color: #0032c8;
}

.zbt-contact-page-services__layout h2 {
    position: absolute;
    inset-block-start: 106px;
    inset-inline-start: 349px;
    margin: 0;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 53.5px;
    font-weight: 700;
    line-height: 1;
}

.zbt-contact-page-services__grid {
    position: absolute;
    inset-block-start: 260px;
    inset-inline: 0;
    display: grid;
    grid-template-columns: repeat(2, 960px);
    grid-template-rows: repeat(2, 636px);
}

.zbt-contact-page-services__card {
    position: relative;
    overflow: hidden;
    margin: 0;
    background: #f6f6f6;
    border-inline-end: 1px solid #fff;
    border-block-end: 1px solid #fff;
    color: #0032c8;
    cursor: default;
    outline: none;
    transition: background-color 120ms ease, color 120ms ease;
}

.zbt-contact-page-services__card h3,
.zbt-contact-page-services__card p {
    position: absolute;
    z-index: 1;
    margin: 0;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    transition: color 120ms ease;
}

.zbt-contact-page-services__card h3 {
    inset-block-start: 81px;
    inset-inline: 0;
    font-size: 53px;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    transform: translateX(-42px);
}

.zbt-contact-page-services__card p {
    inset-block-start: 178px;
    inset-inline: 48px;
    color: #1a1a1a;
    font-size: 22px;
    font-weight: 300;
    line-height: 28px;
    text-align: center;
    transform: translateY(-5px);
}

/* Reason: PSD 四张服务卡的正文不是共享一个视觉中心；逐卡保留原始文字锚点，避免把卡内文案整体机械居中。 */

.zbt-contact-page-services__card:nth-child(1) p {
    transform: translate(-13px, -5px);
}

.zbt-contact-page-services__card:nth-child(n + 2) p {
    transform: translate(-41px, -5px);
}

.zbt-contact-page-services__card img {
    position: absolute;
    inset-block-start: 316px;
    inset-inline-start: 50%;
    z-index: 1;
    display: block;
    max-inline-size: none;
    max-block-size: 187px;
    object-fit: contain;
    transform: translateX(calc(-50% - 34px));
    filter: brightness(0) saturate(100%) invert(14%) sepia(93%) saturate(5693%) hue-rotate(231deg) brightness(72%) contrast(139%);
    transition: filter 120ms ease;
}

/* Reason: PPT 仅定义鼠标经过的卡片变蓝，默认状态不能把 PSD 示例中的首张蓝卡当作固定选中项。 */

.zbt-contact-page-services__card:hover,
.zbt-contact-page-services__card:focus-visible {
    background: #0032c8;
    color: #fff;
}

.zbt-contact-page-services__card:hover p,
.zbt-contact-page-services__card:focus-visible p {
    color: #fff;
}

.zbt-contact-page-services__card:hover img,
.zbt-contact-page-services__card:focus-visible img {
    filter: brightness(0) invert(1);
}

.zbt-contact-page-stage--message {
    block-size: 1094px;
    background: #030303;
}

.zbt-contact-page-message__dynamic {
    position: relative;
    inline-size: var(--zbt-home-psd-canvas-inline-size);
    block-size: 1094px;
    /* 留言区只使用纯色底，白色表单结构由真实控件绘制，不能重复烘焙在背景中。 */
    background: #030303;
    color: #fff;
}

.zbt-contact-page-message__layout {
    position: relative;
    inline-size: 1222px;
    block-size: 100%;
    margin: 0 auto;
}

.zbt-contact-page-message__layout h2,
.zbt-contact-page-message__description {
    margin: 0;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
}

.zbt-contact-page-message__layout h2 {
    position: absolute;
    inset-block-start: 164px;
    inset-inline-start: 0;
    font-size: 53.5px;
    font-weight: 700;
    line-height: 1;
}

.zbt-contact-page-message__description {
    position: absolute;
    inset-block-start: 280px;
    inset-inline-start: 1px;
    color: #fff;
    font-size: 22px;
    font-weight: 300;
    line-height: 1;
}

.zbt-contact-page-message__notice {
    position: absolute;
    inset-block-start: 298px;
    inset-inline-start: 0;
    z-index: 3;
    margin: 0;
    padding: 8px 12px;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 16px;
    line-height: 24px;
}

.zbt-contact-page-message__notice.is-success {
    color: #c8f2d4;
    background: rgb(19 131 78 / 88%);
}

.zbt-contact-page-message__notice.is-error {
    color: #ffe2e2;
    background: rgb(184 37 37 / 88%);
}

.zbt-contact-page-message__form {
    position: absolute;
    inset: 0;
}

.zbt-contact-page-message__fields {
    position: absolute;
    inset-block-start: 348px;
    inset-inline-start: 0;
    inline-size: 1220px;
    block-size: 415px;
}

.zbt-contact-page-message__field {
    position: absolute;
    display: block;
}

.zbt-contact-page-message__field input,
.zbt-contact-page-message__field textarea {
    display: block;
    inline-size: 100%;
    block-size: 100%;
    resize: none;
    border: 0;
    border-radius: 0;
    color: #030303;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 24px;
    line-height: 30px;
    outline: none;
}

.zbt-contact-page-message__field input {
    padding: 0 44px;
}

.zbt-contact-page-message__field textarea {
    padding: 16px 50px;
}

/* 单层提示模拟原placeholder，使用独立元素使末尾星号可单独着色。
 * 原生placeholder仅保留空格用于判断空值；有内容时隐藏提示，避免覆盖用户输入。 */
.zbt-contact-page-message__label {
    position: absolute;
    z-index: 1;
    inset-block-start: 50%;
    inset-inline-start: 44px;
    max-inline-size: calc(100% - 88px);
    color: #757575;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 24px;
    line-height: 30px;
    transform: translateY(-50%);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    pointer-events: none;
}
.zbt-contact-page-message__field--message .zbt-contact-page-message__label {
    inset-block-start: 16px;
    inset-inline-start: 50px;
    max-inline-size: calc(100% - 100px);
    transform: none;
}
.zbt-contact-page-message__required { color: #c62828; margin-inline-start: 4px; }
/* 字段名称保留给辅助技术，但不能参与控件内部排版或形成第二行。 */
.zbt-contact-page-message__field .screen-reader-text {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}
.zbt-contact-page-message__field:has(input:not(:placeholder-shown)) .zbt-contact-page-message__label,
.zbt-contact-page-message__field:has(textarea:not(:placeholder-shown)) .zbt-contact-page-message__label {
    visibility: hidden;
}

.zbt-contact-page-message__field input:focus,
.zbt-contact-page-message__field textarea:focus {
    outline: 2px solid #00c2ff;
    outline-offset: -2px;
}

.zbt-contact-page-message__field--name,
.zbt-contact-page-message__field--company,
.zbt-contact-page-message__field--phone,
.zbt-contact-page-message__field--email,
.zbt-contact-page-message__field--region,
.zbt-contact-page-message__field--product {
    inset-inline-start: 1px;
    inline-size: 594px;
    block-size: 52px;
}

.zbt-contact-page-message__field--name { inset-block-start: 0; }

.zbt-contact-page-message__field--company { inset-block-start: 73px; }

.zbt-contact-page-message__field--phone { inset-block-start: 145px; }

.zbt-contact-page-message__field--email { inset-block-start: 218px; }

.zbt-contact-page-message__field--region { inset-block-start: 290px; }

.zbt-contact-page-message__field--product { inset-block-start: 363px; }

.zbt-contact-page-message__field--message {
    inset-block-start: 0;
    inset-inline-start: 627px;
    inline-size: 594px;
    block-size: 415px;
}

.zbt-contact-page-message__form button {
    position: absolute;
    inset-block-start: 820px;
    inset-inline-start: 353px;
    display: grid;
    inline-size: 515px;
    block-size: 105px;
    place-items: center;
    border: 0;
    border-radius: 53px;
    background: #0032c8;
    color: #fff;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 28px;
    font-weight: 400;
    line-height: 1;
    cursor: pointer;
}

.zbt-contact-page-stage--details {
    block-size: 2228px;
    background: #030303;
}

.zbt-contact-page-details__dynamic {
    position: relative;
    display: none;
    inline-size: var(--zbt-home-psd-canvas-inline-size);
    block-size: 2228px;
    background: #030303;
    color: #fff;
}

.zbt-contact-page-details__layout {
    position: relative;
    inline-size: 1220px;
    block-size: 100%;
    margin: 0 auto;
}

.zbt-contact-page-details__layout h2 {
    position: absolute;
    inset-block-start: 129px;
    inset-inline-start: -3px;
    margin: 0;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 59px;
    font-weight: 700;
    line-height: 1;
}

.zbt-contact-page-details__divider {
    position: absolute;
    inset-block-start: 226px;
    inset-inline-start: -135px;
    inline-size: 1489px;
    block-size: 1px;
    background: #0032c8;
}

.zbt-contact-page-details__content {
    position: absolute;
    inset-block-start: 298px;
    inset-inline: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 316px;
    gap: 80px;
}

.zbt-contact-page-details__content h3,
.zbt-contact-page-details__content p {
    margin: 0;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
}

.zbt-contact-page-details__content h3 {
    font-size: 35px;
    font-weight: 700;
    line-height: 42px;
}

.zbt-contact-page-details__content dl {
    display: grid;
    gap: 24px;
    margin: 69px 0 0;
}

.zbt-contact-page-details__content dl > div {
    display: flex;
    min-block-size: 57px;
    align-items: center;
    gap: 22px;
}

.zbt-contact-page-details__content dt {
    display: inline-flex;
    align-items: center;
    gap: 25px;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 27px;
    line-height: 31px;
    white-space: nowrap;
}

.zbt-contact-page-details__content dt img {
    display: block;
    inline-size: 27px;
    block-size: 31px;
    object-fit: contain;
}

.zbt-contact-page-details__content dd {
    margin: 0;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 27px;
    line-height: 31px;
}

.zbt-contact-page-details__wechat {
    display: grid;
    justify-items: center;
    gap: 26px;
    padding-top: 13px;
}

.zbt-contact-page-details__qr {
    display: grid;
    inline-size: 316px;
    block-size: 316px;
    overflow: hidden;
    place-items: center;
    border-radius: 19px;
    background: #fff;
}

.zbt-contact-page-details__qr img {
    inline-size: 100%;
    block-size: 100%;
    object-fit: contain;
}

.zbt-contact-page-details__wechat p {
    font-size: 27px;
    line-height: 31px;
}

@media (min-width: 92.0625rem) and (max-width: 119.9375rem) {
.zbt-contact-page-stage--hero { block-size: calc(100vw * 799 / 1920); }

.zbt-contact-page-stage--services { block-size: calc(100vw * 1535 / 1920); }

.zbt-contact-page-stage--message { block-size: calc(100vw * 1094 / 1920); }

.zbt-contact-page-stage--details { block-size: calc(100vw * 2228 / 1920); }

.zbt-contact-page-stage--hero .zbt-contact-page-hero__dynamic,
.zbt-contact-page-services__layout,
.zbt-contact-page-message__dynamic,
.zbt-contact-page-stage--details .zbt-contact-page-stage__default,
.zbt-contact-page-details__dynamic {
        transform: scale(calc(100vw / 1920px));
        transform-origin: top left;
    }
}

@media (max-width: 92rem) {
.zbt-contact-page-stage--hero,
.zbt-contact-page-stage--services,
.zbt-contact-page-stage--message,
.zbt-contact-page-stage--details {
        block-size: auto;
    }

.zbt-contact-page-details__dynamic {
        display: block;
    }

.zbt-contact-page-hero__dynamic {
        inline-size: 100%;
        block-size: auto;
        min-block-size: 560px;
    }

.zbt-contact-page-hero__content {
        inline-size: min(calc(100% - 96px), 1200px);
        padding-block: 140px;
    }

.zbt-contact-page-hero__content h1 { font-size: 58px; line-height: 76px; }

.zbt-contact-page-hero__content p { margin-top: 38px; font-size: 24px; line-height: 44px; transform: none; }

.zbt-contact-page-services__layout {
        inline-size: 100%;
        block-size: auto;
        padding-top: 96px;
    }

.zbt-contact-page-services__layout h2 {
        position: static;
        inline-size: min(calc(100% - 96px), 1200px);
        margin: 0 auto 72px;
        font-size: 48px;
        line-height: 58px;
    }

.zbt-contact-page-services__grid {
        position: static;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: none;
    }

.zbt-contact-page-services__card { min-block-size: 470px; }

.zbt-contact-page-services__card h3 { inset-block-start: 72px; font-size: 46px; transform: none; }

.zbt-contact-page-services__card p,
.zbt-contact-page-services__card:nth-child(n) p { inset-block-start: 148px; font-size: 19px; line-height: 30px; transform: none; }

.zbt-contact-page-services__card img { inset-block-start: 252px; max-block-size: 156px; transform: translateX(-50%) scale(.84); }

.zbt-contact-page-message__dynamic {
        inline-size: 100%;
        block-size: auto;
        padding-block: 96px;
        background: #030303;
    }

.zbt-contact-page-message__layout {
        inline-size: min(calc(100% - 96px), 1200px);
        block-size: auto;
    }

.zbt-contact-page-message__layout h2,
.zbt-contact-page-message__description,
.zbt-contact-page-message__notice,
.zbt-contact-page-message__form,
.zbt-contact-page-message__fields,
.zbt-contact-page-message__field,
.zbt-contact-page-message__form button {
        position: static;
    }

.zbt-contact-page-message__layout h2 { font-size: 48px; line-height: 58px; }

.zbt-contact-page-message__description { margin-top: 28px; font-size: 22px; line-height: 34px; }

.zbt-contact-page-message__notice { display: inline-block; margin-top: 20px; }

.zbt-contact-page-message__form { display: block; margin-top: 48px; }

.zbt-contact-page-message__fields { display: grid; inline-size: 100%; block-size: auto; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }

.zbt-contact-page-message__field,
.zbt-contact-page-message__field--name,
.zbt-contact-page-message__field--company,
.zbt-contact-page-message__field--phone,
.zbt-contact-page-message__field--email,
.zbt-contact-page-message__field--region,
.zbt-contact-page-message__field--product,
.zbt-contact-page-message__field--message { inline-size: auto; block-size: 58px; }

/* Reason: 中等宽度仍保留桌面端的阅读顺序，六项基本信息固定在左列，留言框独占右列，避免自动排布把字段跳到右侧。 */

.zbt-contact-page-message__field--name,
.zbt-contact-page-message__field--company,
.zbt-contact-page-message__field--phone,
.zbt-contact-page-message__field--email,
.zbt-contact-page-message__field--region,
.zbt-contact-page-message__field--product { grid-column: 1; }

.zbt-contact-page-message__field--message { grid-column: 2; grid-row: 1 / span 6; block-size: auto; }

.zbt-contact-page-message__field input,
.zbt-contact-page-message__field textarea { background: #fff !important; }

/* 响应式字段不再绝对定位，但内部标签仍须相对每个字段定位。 */
.zbt-contact-page-message__field { position: relative; inset: auto; }

.zbt-contact-page-message__form button { inline-size: min(515px, 100%); margin: 48px auto 0; }

.zbt-contact-page-details__dynamic {
        inline-size: 100%;
        block-size: auto;
        min-block-size: 0;
        padding-block: 96px 140px;
    }

.zbt-contact-page-details__layout {
        inline-size: min(calc(100% - 96px), 1200px);
        block-size: auto;
    }

.zbt-contact-page-details__layout h2,
.zbt-contact-page-details__divider,
.zbt-contact-page-details__content { position: static; }

.zbt-contact-page-details__layout h2 { margin-bottom: 48px; font-size: 48px; line-height: 58px; }

.zbt-contact-page-details__divider { inline-size: 100%; margin-bottom: 72px; }

.zbt-contact-page-details__content { grid-template-columns: minmax(0, 1fr) 280px; gap: 48px; }

.zbt-contact-page-details__content h3 { font-size: 30px; line-height: 40px; }

.zbt-contact-page-details__qr { inline-size: 280px; block-size: 280px; }
}

@media (max-width: 48rem) {
.zbt-contact-page-hero__dynamic { min-block-size: 500px; }

.zbt-contact-page-hero__content { inline-size: calc(100% - 48px); padding-block: 96px; }

.zbt-contact-page-hero__content h1 { font-size: 42px; line-height: 56px; }

.zbt-contact-page-hero__content p { margin-top: 28px; font-size: 19px; line-height: 34px; }

.zbt-contact-page-services__layout { padding-top: 64px; }

.zbt-contact-page-services__layout h2 { inline-size: calc(100% - 48px); margin-bottom: 40px; font-size: 36px; line-height: 44px; }

.zbt-contact-page-services__grid { grid-template-columns: 1fr; }

.zbt-contact-page-services__card { min-block-size: 356px; }

.zbt-contact-page-services__card h3 { inset-block-start: 54px; font-size: 36px; }

.zbt-contact-page-services__card p { inset-block-start: 114px; inset-inline: 24px; font-size: 16px; line-height: 26px; }

.zbt-contact-page-services__card img { inset-block-start: 196px; transform: translateX(-50%) scale(.64); }

.zbt-contact-page-message__dynamic { padding-block: 64px; }

.zbt-contact-page-message__layout { inline-size: calc(100% - 48px); }

.zbt-contact-page-message__layout h2 { font-size: 36px; line-height: 44px; }

.zbt-contact-page-message__description { font-size: 17px; line-height: 28px; }

.zbt-contact-page-message__fields { grid-template-columns: 1fr; gap: 14px; }

.zbt-contact-page-message__field--message { grid-column: auto; grid-row: auto; block-size: 180px; }

.zbt-contact-page-message__form { margin-top: 36px; }

.zbt-contact-page-message__form button { block-size: 64px; margin-top: 32px; border-radius: 32px; font-size: 21px; }

.zbt-contact-page-details__dynamic { padding-block: 64px 96px; }

.zbt-contact-page-details__layout { inline-size: calc(100% - 48px); }

.zbt-contact-page-details__layout h2 { margin-bottom: 32px; font-size: 36px; line-height: 44px; }

.zbt-contact-page-details__divider { margin-bottom: 40px; }

.zbt-contact-page-details__content { grid-template-columns: 1fr; gap: 44px; }

.zbt-contact-page-details__content h3 { font-size: 24px; line-height: 34px; }

.zbt-contact-page-details__content dl { gap: 18px; margin-top: 32px; }

.zbt-contact-page-details__content dl > div { display: grid; grid-template-columns: 122px minmax(0, 1fr); gap: 12px; min-block-size: 32px; }

.zbt-contact-page-details__content dt,
.zbt-contact-page-details__content dd { font-size: 16px; line-height: 24px; }

.zbt-contact-page-details__content dt { gap: 10px; }

.zbt-contact-page-details__content dt img { inline-size: 20px; block-size: 24px; }

.zbt-contact-page-details__wechat { justify-items: start; }

.zbt-contact-page-details__qr { inline-size: min(316px, 100%); block-size: auto; aspect-ratio: 1; }
}

@media (max-width: 35rem) {
.zbt-contact-page-hero__content h1 {
        white-space: normal;
    }
}

.zbt-site-footer h2 {
    margin: 0;
    color: var(--aura-spec-color-text-neutral-deep);
    font-size: var(--aura-litho-display-size-2xl);
    font-weight: var(--aura-litho-heading-weight-bold);
    line-height: var(--aura-litho-heading-height-tight);
}

/* Reason: 中间桌面宽度仍使用 PSD 视觉。介绍层、数据层、按钮和统计项必须整体缩放，且区块的叠接量与高度同样按画布比例变化，不能只缩放局部背景图。 */

/* Reason: 默认 PSD 图与真实卡片在首次切换时短暂交叉显示，避免静态图层直接消失。 */

/* Reason: 自定义背景意味着管理员已偏离 PSD 默认内容，保留可维护的真实 HTML，并用统一蓝色蒙层维持区块层级。 */

/* Reason: 默认态是一张 1920 × 1003px 的 PSD 原生整图。桌面收缩时，容器和整图必须使用同一宽高比，避免背景、厂区图、图标、文字与分隔线被拆成不同的缩放基准。 */

.zbt-site-footer {
    background: var(--aura-spec-color-canvas-neutral-deep);
    color: var(--aura-spec-color-text-neutral-diffuse);
}

.zbt-site-footer__contact {
    padding-block: var(--aura-tectonic-inset-block-lg-fluid);
    border-top: var(--aura-morph-surface-stroke-thin) solid var(--aura-spec-color-border-primary);
}

.zbt-site-footer__contact .zbt-section-kicker {
    color: var(--aura-spec-color-text-neutral-diffuse);
}

.zbt-site-footer__divider {
    block-size: var(--aura-morph-surface-stroke-thin);
    margin-top: var(--aura-tectonic-outset-block-lg);
    background: var(--aura-spec-color-border-primary);
}

.zbt-site-footer__content {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 12rem;
    align-items: start;
    gap: var(--aura-tectonic-gap-all-xl);
    padding-top: var(--aura-tectonic-inset-all-xl);
}

.zbt-site-footer h2 {
    color: var(--aura-spec-color-text-neutral-diffuse);
    font-size: var(--aura-litho-heading-size-xl);
}

.zbt-site-footer__list {
    display: grid;
    gap: var(--aura-tectonic-gap-all-md);
    margin: var(--aura-tectonic-outset-block-xl) 0 0;
}

.zbt-site-footer__list > div {
    display: grid;
    grid-template-columns: 6rem minmax(0, 1fr);
    gap: var(--aura-tectonic-gap-all-md);
}

.zbt-site-footer__list dt {
    color: color-mix(in oklch, var(--aura-spec-color-text-neutral-diffuse) 62%, transparent);
}

.zbt-site-footer__list dd {
    margin: 0;
    color: var(--aura-spec-color-text-neutral-diffuse);
}

.zbt-site-footer__wechat {
    display: grid;
    justify-items: center;
    gap: var(--aura-tectonic-gap-all-sm);
}

.zbt-site-footer__qr {
    display: grid;
    inline-size: 10rem;
    aspect-ratio: 1;
    overflow: hidden;
    place-items: center;
    background: var(--aura-spec-color-surface-neutral);
    border-radius: var(--aura-morph-control-radius-squircle);
}

.zbt-site-footer__qr img {
    inline-size: 100%;
    block-size: 100%;
    object-fit: contain;
}

.zbt-site-footer__wechat p {
    margin: 0;
    color: var(--aura-spec-color-text-neutral-diffuse);
    font-size: var(--aura-litho-body-size-sm);
}

.zbt-footer-navigation {
    padding-block: var(--aura-tectonic-inset-all-lg);
    border-top: var(--aura-morph-surface-stroke-thin) solid color-mix(in oklch, var(--aura-spec-color-text-neutral-diffuse) 18%, transparent);
}

.zbt-footer-navigation__links {
    color: color-mix(in oklch, var(--aura-spec-color-text-neutral-diffuse) 74%, transparent);
    font-size: var(--aura-litho-body-size-sm);
}

.zbt-footer-navigation__links .wp-block-navigation-item__content:hover,
.zbt-footer-navigation__links .wp-block-navigation-item__content:focus-visible {
    color: var(--aura-spec-color-text-primary-radiant);
}

.zbt-site-footer__copyright {
    padding-block: var(--aura-tectonic-inset-all-md);
    border-top: var(--aura-morph-surface-stroke-thin) solid color-mix(in oklch, var(--aura-spec-color-text-neutral-diffuse) 12%, transparent);
    color: color-mix(in oklch, var(--aura-spec-color-text-neutral-diffuse) 56%, transparent);
    font-size: var(--aura-litho-caption-size-xs);
}

.zbt-basic-template {
    min-block-size: 100svh;
    padding-block: calc(var(--aura-tectonic-inset-block-xl-fluid) + 5.5rem) var(--aura-tectonic-inset-block-xl-fluid);
}

.zbt-basic-template__item {
    padding: var(--aura-tectonic-inset-all-xl);
    background: var(--aura-spec-color-surface-neutral);
    border-bottom: var(--aura-morph-surface-stroke-thin) solid var(--aura-spec-color-border-neutral-subtle);
}

@supports (corner-shape: superellipse(1.5)) {
.zbt-site-footer__qr {
        corner-shape: superellipse(1.5);
    }
}

@media (max-width: 62rem) {
.zbt-header__inner {
        min-block-size: 5rem;
    }

.zbt-primary-navigation .wp-block-navigation-item__content {
        padding-inline: var(--aura-tectonic-gap-all-xs);
    }
}

@media (max-width: 48rem) {
.zbt-header {
        background: var(--aura-spec-color-canvas-neutral-deep);
    }

.zbt-primary-navigation .wp-block-navigation__responsive-container-open {
        color: var(--aura-spec-color-text-neutral-diffuse);
    }

.zbt-primary-navigation .wp-block-navigation__responsive-container.is-menu-open {
        padding: var(--aura-tectonic-inset-all-xl);
        background: var(--aura-spec-color-overlay-neutral);
        color: var(--aura-spec-color-text-neutral-deep);
    }

.zbt-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
        color: var(--aura-spec-color-text-neutral-deep);
    }

.zbt-primary-navigation .wp-block-navigation__responsive-container-close {
        color: var(--aura-spec-color-text-neutral-deep);
    }

.zbt-site-footer__content {
        grid-template-columns: 1fr;
    }

.zbt-site-footer__wechat {
        justify-items: start;
    }
}

@media (max-width: 35rem) {
.zbt-site-brand {
        max-inline-size: 9.5rem;
    }

.zbt-site-footer__list > div {
        grid-template-columns: 1fr;
        gap: 0;
    }
}

@media (max-width: 75rem) {
.zbt-header__inner {
        padding-inline: 35px;
    }

.zbt-site-brand,
.zbt-site-brand img,
.zbt-site-brand .custom-logo {
        inline-size: 210px;
        block-size: auto;
    }

.zbt-primary-navigation {
        margin-left: auto;
        font-size: 19px;
        line-height: 28px;
    }

.zbt-primary-navigation .wp-block-navigation__container {
        gap: clamp(1.5rem, 4vw, 4.5rem) !important;
    }

.zbt-primary-navigation .wp-block-navigation-item__content {
        min-block-size: 28px;
    }

.zbt-primary-navigation .current-menu-item > .wp-block-navigation-item__content,
.zbt-primary-navigation .current-menu-ancestor > .wp-block-navigation-item__content {
        min-block-size: 38px;
        margin-inline: -26px;
        padding-inline: 26px;
    }
}

@media (max-width: 48rem) {
/* Reason: 桌面导航使用固定 245px 间距；移动端必须由自动外边距把菜单按钮保持在视口内。 */

.zbt-header__inner > nav.zbt-primary-navigation {
        margin-left: auto !important;
    }

:root {
        --zbt-header-block-size: 88px;
    }

.zbt-header {
        background: #030303;
    }

.zbt-header__inner {
        padding-inline: 24px;
    }

.zbt-site-brand,
.zbt-site-brand img,
.zbt-site-brand .custom-logo {
        inline-size: 176px;
    }

.zbt-primary-navigation {
        margin-left: auto;
    }

.zbt-primary-navigation .wp-block-navigation__responsive-container-open {
        color: #fff;
    }

.zbt-primary-navigation .wp-block-navigation__responsive-container.is-menu-open {
        padding: 2rem;
        background: #fff;
        color: #030303;
    }

.zbt-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
        color: #030303;
    }

/* Reason: 品牌字标保持原始宽高比，在窄屏按内容区等比例缩小，避免文字换行或横向溢出。 */
}

/* Reason: 550-768px 已切换为折叠菜单，但仍可保留首屏右侧齿轮；将背景向右回退，避免齿轮压入标题和正文。 */

/* Reason: 页头在菜单仍可容纳时必须连续缩放，不能因中等视口而把菜单自动推至右边缘。 */

@media (min-width: 53.1875rem) {
:root {
        --zbt-header-block-size: clamp(5.5rem, 8.0729vw, 9.6875rem);
    }

.zbt-header__inner {
        padding-inline: clamp(1.5rem, 2.8646vw, 3.4375rem);
    }

.zbt-site-brand,
.zbt-site-brand img,
.zbt-site-brand .custom-logo {
        inline-size: clamp(10rem, 13.5417vw, 16.25rem);
        max-inline-size: clamp(10rem, 13.5417vw, 16.25rem);
        block-size: auto;
    }

.zbt-header__inner > nav.zbt-primary-navigation {
        margin-left: clamp(4rem, 12.7604vw, 15.3125rem) !important;
    }

.zbt-primary-navigation {
        font-size: clamp(1rem, 1.3021vw, 1.5625rem);
        line-height: clamp(1.5rem, 1.6146vw, 1.9375rem);
    }

.zbt-primary-navigation .wp-block-navigation__container {
        gap: clamp(1.5rem, calc(10vw - 4.5rem), 7.34375rem) !important;
    }

.zbt-primary-navigation .wp-block-navigation-item__content {
        min-block-size: clamp(1.5rem, 1.6146vw, 1.9375rem);
        line-height: clamp(1.5rem, 1.6146vw, 1.9375rem);
    }

.zbt-primary-navigation .wp-block-navigation__container.zbt-primary-navigation > .wp-block-navigation-item > .wp-block-navigation-item__content::before {
        inline-size: clamp(5.5rem, 6.6667vw, 8rem);
        block-size: clamp(2rem, 2.2396vw, 2.6875rem);
        border-radius: clamp(0.375rem, 0.46875vw, 0.5625rem);
        transform: translate(-50%, calc(-50% - clamp(0px, 0.0521vw, 1px)));
    }

.zbt-primary-navigation .wp-block-navigation__container.zbt-primary-navigation > .wp-block-navigation-item:nth-child(4) > .wp-block-navigation-item__content::before {
        inline-size: clamp(7.5rem, 9.6354vw, 11.5625rem);
        transform: translate(calc(-50% - clamp(0px, 0.15625vw, 3px)), calc(-50% - clamp(0px, 0.0521vw, 1px)));
    }
}

/* Reason: 此区间已无法保持完整菜单，但仍需让 Logo 和菜单按钮在临界宽度平稳衔接。 */

@media (min-width: 48.0625rem) and (max-width: 53.125rem) {
:root {
        --zbt-header-block-size: 5.5rem;
    }

.zbt-header__inner {
        padding-inline: 1.5rem;
    }

.zbt-site-brand,
.zbt-site-brand img,
.zbt-site-brand .custom-logo {
        inline-size: 10rem;
        max-inline-size: 10rem;
        block-size: auto;
    }
}

/* Reason: 完整菜单达到最小可读尺寸后才收起，避免平板与窄桌面出现横向溢出。 */

@media (max-width: 53.125rem) {
.zbt-header__inner > nav.zbt-primary-navigation {
        margin-left: auto !important;
    }

.zbt-primary-navigation .wp-block-navigation__responsive-container-open:not(.always-shown) {
        display: flex;
    }

.zbt-primary-navigation .wp-block-navigation__responsive-container:not(.is-menu-open) {
        display: none;
    }

.zbt-primary-navigation .wp-block-navigation__responsive-container.is-menu-open {
        padding: clamp(2rem, 5vw, 4rem);
        background: #fff;
        color: #030303;
    }

.zbt-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
        display: block;
        inline-size: min(100%, 44rem);
        margin: 3.5rem auto 0;
    }

.zbt-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container.zbt-primary-navigation {
        display: flex;
        align-items: stretch;
        justify-content: flex-start;
        flex-direction: column;
        inline-size: 100%;
        gap: 0 !important;
    }

.zbt-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
        align-items: stretch;
        inline-size: 100%;
    }

.zbt-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        min-block-size: 3.25rem;
        padding-block: 0.625rem;
        color: #030303;
        font-size: 22px;
        line-height: 1.45;
        white-space: normal;
        word-break: break-word;
    }

.zbt-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container.zbt-primary-navigation > .wp-block-navigation-item > .wp-block-navigation-item__content {
        font-weight: 600;
    }

.zbt-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
        position: static !important;
        display: block !important;
        inline-size: 100% !important;
        min-inline-size: 0 !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 0 0 1.5rem !important;
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        color: #030303;
    }

.zbt-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container > .wp-block-navigation-item {
        margin: 0 !important;
    }

.zbt-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
        min-block-size: 2.75rem !important;
        color: #030303;
        font-size: 18px;
        font-weight: 400;
        line-height: 1.45;
    }

.zbt-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container.zbt-primary-navigation > .wp-block-navigation-item > .wp-block-navigation-item__content::before {
        display: none;
    }

.zbt-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item.is-zbt-current > .wp-block-navigation-item__content,
.zbt-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item > .wp-block-navigation-item__content[aria-current="page"] {
        color: #0032c8;
    }

.zbt-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
        color: #030303;
    }
}

/* Reason: 1920px 以下没有对应 PSD，保持同一内容语义重排，不能缩放桌面画面或产生横向滚动。 */

@media (max-width: 92rem) {
/* Reason: 动态 HTML 区块退出 PSD 画布后，按钮尺寸必须随可用宽度连续变化，同时保留 310:105 的设计比例。 */
}

/* Reason: 1920px 保持 PSD 几何，小于内容容器时改用同一语义结构重排，避免固定统计坐标造成横向溢出。 */

/* Reason: 产品中心以 PSD 卡片边界、Photoshop 原生线稿与真实 HTML 文案共同复刻，任何后台文本更新都不会退回含文字位图。 */

/* Reason: 四张卡默认同为浅色；当前悬浮或键盘聚焦的卡片独占蓝色高亮。 */

/* Reason: 1473–1919px 仍使用 PSD 默认视觉。产品、行业默认整图和行业动态回退必须在同一 1920px 画布中等比缩放，避免不同容器基准造成左右锚点、点击覆盖层和切换态跳变。 */

@media (min-width: 92.0625rem) and (max-width: 119.9375rem) {
/* Reason: 默认 PNG 与透明链接覆盖层共享同一缩放画布，确保视觉和可点击区域始终重合。 */

/* Reason: 用户切换行业方案或后台改为真实数据后，动态层沿用默认整图的 1920px 坐标，避免从静态态切入后整体左移。 */

/* Reason: 企业优势默认整图和后台动态回退必须与其它首页展示台共用同一 1920px 画布，避免仅按内容区宽度缩放而出现左右锚点和高度偏差。 */
}

/* Reason: 小于 PSD 桌面基准时重排为真实内容，避免固定像素卡片导致横向溢出或图片拉伸。 */

/* Reason: 企业优势仅有桌面 PSD。低于桌面基准时必须显示真实内容而非压缩整图，避免文字失真、裁切及横向溢出。 */

@media (max-width: 70rem) {
/* Reason: 最后一行只占两列时，末项也是视觉行末，右侧不能留下孤立空白。 */
}

.zbt-site-footer {
    background: #030303;
    color: var(--aura-spec-color-text-neutral-diffuse);
}

/*
 * Reason: 联系方式是全站公共 Block，不同页面可通过 contactClass 覆盖以下变量；
 * 标题、分隔线、内容列和二维码保持同一组比例，避免页面分别复制 Footer 结构。
 */

.zbt-site-footer__contact {
    --zbt-footer-contact-title-color: var(--aura-spec-color-text-neutral-diffuse);
    --zbt-footer-contact-divider-color: var(--aura-spec-color-surface-primary);
    --zbt-footer-contact-qr-size: 316px;
}

.zbt-site-footer__contact-title {
    color: var(--zbt-footer-contact-title-color);
}

.zbt-site-footer__contact-layout > .zbt-site-footer__divider {
    background: var(--zbt-footer-contact-divider-color);
}

.zbt-site-footer__qr {
    inline-size: var(--zbt-footer-contact-qr-size);
    block-size: var(--zbt-footer-contact-qr-size);
}

.zbt-site-footer__contact {
    position: relative;
    block-size: 882px;
    padding: 0;
    border-top: 0;
    overflow: clip;
    background: #030303;
}

.zbt-site-footer__contact-default {
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 0;
    inline-size: var(--zbt-home-psd-canvas-inline-size);
    block-size: 882px;
    overflow: clip;
}

.zbt-site-footer__contact-default > img {
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 0;
    inline-size: var(--zbt-home-psd-canvas-inline-size);
    max-inline-size: none;
    block-size: 882px;
    pointer-events: none;
    user-select: none;
}

.zbt-site-footer__contact-dynamic {
    position: relative;
    display: block;
    inline-size: var(--zbt-home-psd-canvas-inline-size);
    block-size: 882px;
    background: #030303;
}

.zbt-site-footer__contact.has-psd-default .zbt-site-footer__contact-dynamic {
    display: none;
}

.zbt-site-footer__contact-layout {
    position: relative;
    block-size: 100%;
    inline-size: var(--zbt-home-psd-canvas-inline-size);
    margin: 0;
}

.zbt-site-footer__contact-title {
    position: absolute;
    inset-block-start: 49px;
    /* 原因：标题与下方联系内容共用 1224px 内容边界，宽屏不再沿用单独的 PSD 标题坐标。 */
    inset-inline-start: calc((1920px - var(--zbt-layout-content-max)) / 2);
    margin: 0;
    color: var(--aura-spec-color-text-neutral-diffuse);
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 54px;
    font-weight: 700;
    line-height: 1;
}

.zbt-site-footer .zbt-site-footer__contact-title {
    /* 原因：单独提高字号声明的优先级，覆盖页脚通用 h2；不影响窄屏定位等布局规则。 */
    font-size: 54px;
}

.zbt-site-footer__contact-layout > .zbt-site-footer__divider {
    position: absolute;
    inset-block-start: 146px;
    /* 原因：蓝线与标题、联系内容使用同一居中内容区，避免宽屏两端超出正文。 */
    inset-inline-start: calc((1920px - var(--zbt-layout-content-max)) / 2);
    inline-size: var(--zbt-layout-content-max);
    block-size: 1px;
    margin: 0;
    background: var(--aura-spec-color-surface-primary);
}

.zbt-site-footer__content {
    position: absolute;
    inset-block-start: 218px;
    /* 原因：公司信息和二维码的左右边界与标题、蓝线保持一致。 */
    inset-inline: calc((1920px - var(--zbt-layout-content-max)) / 2);
    display: grid;
    grid-template-columns: minmax(0, 1fr) 316px;
    grid-template-rows: auto auto;
    align-items: start;
    column-gap: 80px;
    row-gap: 69px;
    padding: 0;
}

/* Reason: 全站页脚关闭二维码后不能保留原二维码列，联系方式应占用完整内容宽度。 */

.zbt-site-footer__content--without-qr {
    grid-template-columns: minmax(0, 1fr);
}

.zbt-site-footer__details {
    /* 原因：公司名称占第一行，联系列表与二维码共用第二行；保留 details 的语义结构。 */
    display: grid;
    grid-column: 1;
    grid-row: 1 / span 2;
    grid-template-rows: subgrid;
}

.zbt-site-footer__details h3 {
    margin: 0;
    color: var(--aura-spec-color-text-neutral-diffuse);
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 35px;
    font-weight: 700;
    line-height: 42px;
}

.zbt-site-footer__list {
    display: grid;
    grid-row: 2;
    align-self: center;
    gap: 24px;
    margin: 0;
}

.zbt-site-footer__list > div {
    display: flex;
    min-block-size: 57px;
    align-items: center;
    gap: 22px;
    margin: 0;
}

.zbt-site-footer__list dt {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 25px;
    color: var(--aura-spec-color-text-neutral-diffuse);
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 27px;
    font-weight: 400;
    line-height: 31px;
    white-space: nowrap;
}

.zbt-site-footer__list dt img {
    display: block;
    inline-size: 27px;
    block-size: 31px;
    object-fit: contain;
}

.zbt-site-footer__list dd {
    min-inline-size: 0;
    margin: 0;
    color: var(--aura-spec-color-text-neutral-diffuse);
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 27px;
    font-weight: 400;
    line-height: 31px;
}

.zbt-site-footer__wechat {
    position: relative;
    display: grid;
    grid-column: 2;
    grid-row: 2;
    align-self: center;
    justify-items: center;
    gap: 26px;
    padding-top: 0;
}

.zbt-site-footer__qr {
    display: grid;
    inline-size: 316px;
    block-size: 316px;
    overflow: hidden;
    place-items: center;
    border-radius: 19px;
    background: var(--aura-spec-color-text-neutral-diffuse);
}

.zbt-site-footer__qr img {
    inline-size: 100%;
    block-size: 100%;
    object-fit: contain;
}

.zbt-site-footer__wechat p {
    /* 原因：二维码说明放在图下方，但不计入对齐高度，使二维码本身与联系列表中心重合。 */
    position: absolute;
    top: calc(100% + 26px);
    inline-size: 100%;
    margin: 0;
    color: var(--aura-spec-color-text-neutral-diffuse);
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 27px;
    font-weight: 400;
    line-height: 31px;
    text-align: center;
}

.zbt-site-footer__copyright {
    block-size: 136px;
    padding: 0;
    overflow: hidden;
    border-top: 0;
    background: #030303;
    color: var(--aura-spec-color-text-neutral-diffuse);
}

.zbt-site-footer__copyright:not(.has-psd-default) .zbt-layout-container {
    padding-block: 42px;
    color: color-mix(in oklch, var(--aura-spec-color-text-neutral-diffuse) 72%, transparent);
    font-size: var(--aura-litho-caption-size-xs);
    text-align: center;
}

/* Reason: 新闻与联系区的默认图、可点击覆盖层及后台动态回退必须共用 1920px PSD 坐标画布；仅缩放图片会令分隔线、内容锚点和区块高度在中等桌面宽度脱节。 */

@media (min-width: 92.0625rem) and (max-width: 119.9375rem) {
.zbt-site-footer__contact {
        block-size: calc(100vw * 882 / 1920);
    }

.zbt-site-footer__contact-default,
.zbt-site-footer__contact-dynamic {
        inline-size: var(--zbt-home-psd-canvas-inline-size);
        block-size: 882px;
        transform: scale(calc(100vw / 1920px));
        transform-origin: top left;
    }
}

@media (max-width: 92rem) {
.zbt-site-footer__contact {
        block-size: auto;
        min-block-size: 0;
        padding-block: 72px;
    }

.zbt-site-footer__contact.has-psd-default .zbt-site-footer__contact-default {
        display: none;
    }

.zbt-site-footer__contact.has-psd-default .zbt-site-footer__contact-dynamic {
        display: block;
    }

.zbt-site-footer__contact-dynamic {
        inline-size: auto;
        block-size: auto;
    }

.zbt-site-footer__contact-layout {
        block-size: auto;
        inline-size: min(calc(100% - 96px), 1200px);
        margin-inline: auto;
    }

.zbt-site-footer__contact-title {
        position: static;
        margin-bottom: 48px;
        font-size: 48px;
        line-height: 58px;
    }

.zbt-site-footer__contact-layout > .zbt-site-footer__divider {
        position: static;
        inline-size: 100%;
        margin-bottom: 72px;
    }

.zbt-site-footer__content {
        position: static;
        grid-template-columns: minmax(0, 1fr) 280px;
        column-gap: 48px;
        row-gap: 48px;
    }

.zbt-site-footer__details h3 {
        font-size: 30px;
        line-height: 40px;
    }

.zbt-site-footer__list {
        margin-top: 0;
    }

.zbt-site-footer__list dt,
.zbt-site-footer__list dd {
        font-size: 21px;
        line-height: 30px;
    }

.zbt-site-footer__qr {
        inline-size: 280px;
        block-size: 280px;
    }
}

@media (max-width: 70rem) {
.zbt-site-footer__contact {
        min-block-size: 0;
        padding-block: 56px;
    }

.zbt-site-footer__contact-layout {
        inline-size: min(calc(100% - 64px), 960px);
    }

.zbt-site-footer__contact-title {
        margin-bottom: 40px;
        font-size: 40px;
        line-height: 48px;
    }

.zbt-site-footer__contact-layout > .zbt-site-footer__divider {
        margin-bottom: 56px;
    }

.zbt-site-footer__content {
        grid-template-columns: minmax(0, 1fr) 220px;
        gap: 32px;
    }

.zbt-site-footer__details h3 {
        font-size: 26px;
    }

.zbt-site-footer__list {
        gap: 16px;
        margin-top: 40px;
    }

.zbt-site-footer__list > div {
        gap: 14px;
    }

.zbt-site-footer__list dt,
.zbt-site-footer__list dd {
        font-size: 17px;
        line-height: 26px;
    }

.zbt-site-footer__list dt {
        gap: 15px;
    }

.zbt-site-footer__list dt img {
        inline-size: 22px;
        block-size: 26px;
    }

.zbt-site-footer__qr {
        inline-size: 220px;
        block-size: 220px;
    }

.zbt-site-footer__wechat p {
        font-size: 20px;
    }
}

@media (max-width: 48rem) {
.zbt-site-footer__contact {
        padding-block: 48px;
    }

.zbt-site-footer__contact-layout {
        inline-size: calc(100% - 48px);
    }

.zbt-site-footer__contact-title {
        margin-bottom: 32px;
        font-size: 36px;
        line-height: 44px;
    }

.zbt-site-footer__contact-layout > .zbt-site-footer__divider {
        margin-bottom: 40px;
    }

.zbt-site-footer__content {
        grid-template-columns: 1fr;
        gap: 44px;
    }

.zbt-site-footer__details h3 {
        font-size: 24px;
        line-height: 34px;
    }

.zbt-site-footer__list {
        gap: 18px;
        margin-top: 32px;
    }

.zbt-site-footer__list > div {
        display: grid;
        grid-template-columns: 120px minmax(0, 1fr);
        gap: 12px;
        min-block-size: 32px;
    }

.zbt-site-footer__list dt,
.zbt-site-footer__list dd {
        font-size: 16px;
        line-height: 24px;
    }

.zbt-site-footer__list dt {
        gap: 10px;
    }

.zbt-site-footer__list dt img {
        inline-size: 20px;
        block-size: 24px;
    }

.zbt-site-footer__wechat {
        justify-items: start;
    }

.zbt-site-footer__qr {
        inline-size: min(316px, 100%);
        block-size: auto;
        aspect-ratio: 1;
    }
}

@media (max-width: 35rem) {
.zbt-site-footer__contact {
        padding-block: 44px;
    }

.zbt-site-footer__contact-layout {
        inline-size: calc(100% - 48px);
    }

.zbt-site-footer__contact-title {
        margin-bottom: 28px;
        font-size: 32px;
        line-height: 40px;
    }

.zbt-site-footer__contact-layout > .zbt-site-footer__divider {
        margin-bottom: 32px;
    }

.zbt-site-footer__list > div {
        grid-template-columns: 108px minmax(0, 1fr);
    }

.zbt-site-footer__list dt,
.zbt-site-footer__list dd {
        font-size: 15px;
    }
}

/* Reason: 1472px 以下取消整图缩放后，真实 HTML 的字号必须承接上一档的 1920px 画布倍率；各类文字按自身 PSD 基准独立收缩，并在窄屏保留最低可读尺寸。 */

@media (max-width: 92rem) {
.zbt-site-footer__contact-title {
        font-size: clamp(32px, 2.8vw, 42px);
        line-height: 1.18;
    }

.zbt-site-footer__details h3 {
        font-size: clamp(26px, 1.823vw, 35px);
        line-height: 1.2;
    }

.zbt-site-footer__list dt,
.zbt-site-footer__list dd,
.zbt-site-footer__wechat p {
        font-size: clamp(17px, 1.417vw, 27px);
        line-height: 1.148;
    }
}

/* 原因：流式页脚的标题、蓝线和联系内容共用同一容器，二维码贴齐该容器右缘。 */

@media (max-width: 92rem) {
.zbt-site-footer__contact {
        --zbt-footer-contact-qr-size: min(280px, 24vw);
        padding-block: 72px 62px;
    }

.zbt-site-footer__contact-layout {
        inline-size: min(80%, 1200px);
    }

.zbt-site-footer .zbt-site-footer__contact-title {
        /* Reason: 必须高于前置的 Footer 二级标题归零规则，否则部分响应式宽度下标题会贴住分隔线。 */
        margin-block-end: clamp(32px, 3vw, 44px);
        /* 原因：在 1472px 断点承接 54px 桌面画布的等比例缩放，并始终大于公司名称。 */
        font-size: clamp(40px, 2.8125vw, 54px);
        line-height: 1.12;
    }

.zbt-site-footer__contact-layout > .zbt-site-footer__divider {
        /* 原因：蓝线只占内容容器宽度，窗口收缩时不会向两侧额外溢出。 */
        inline-size: 100%;
        margin-block-end: 52px;
        margin-inline-start: 0;
    }

.zbt-site-footer__content {
        column-gap: 48px;
        row-gap: 36px;
    }

.zbt-site-footer__list {
        gap: 14px;
        margin-block-start: 0;
    }

.zbt-site-footer__list > div {
        /* Reason: 原 57px 最小高度再叠加 16–24px gap，联系行中心距过大；保留图标和文字的舒适高度，同时收紧纵向节奏。 */
        min-block-size: 48px;
    }

.zbt-site-footer__wechat {
        gap: 20px;
        padding-top: 0;
    }

.zbt-site-footer__wechat p {
        top: calc(100% + 20px);
    }
}

@media (max-width: 48rem) {
.zbt-site-footer__contact {
        --zbt-footer-contact-qr-size: min(316px, 100%);
        padding-block: 48px;
    }

.zbt-site-footer__contact-layout {
        inline-size: calc(100% - 48px);
    }

.zbt-site-footer .zbt-site-footer__contact-title {
        margin-block-end: 32px;
        font-size: 36px;
        line-height: 44px;
    }

.zbt-site-footer__contact-layout > .zbt-site-footer__divider {
        inline-size: 100%;
        margin-block-end: 40px;
        margin-inline-start: 0;
    }

.zbt-site-footer__content {
        grid-template-columns: 1fr;
        gap: 44px;
    }

.zbt-site-footer__details {
        /* 原因：移动端二维码回到联系信息下方，撤销桌面共享网格行。 */
        display: block;
        grid-column: auto;
        grid-row: auto;
    }

.zbt-site-footer__list {
        gap: 12px;
        margin-block-start: 28px;
        grid-row: auto;
    }

.zbt-site-footer__list > div {
        min-block-size: 36px;
    }

.zbt-site-footer__wechat {
        grid-column: auto;
        grid-row: auto;
        align-self: start;
        justify-items: start;
        padding-top: 8px;
    }

.zbt-site-footer__wechat p {
        position: static;
        inline-size: auto;
        text-align: start;
    }
}

@media (max-width: 35rem) {
.zbt-site-footer__contact {
        padding-block: 44px;
    }

.zbt-site-footer .zbt-site-footer__contact-title {
        margin-block-end: 28px;
        /* 原因：最窄屏仍让标题明显大于公司名称，并保持单列页脚的可读性。 */
        font-size: 36px;
        line-height: 44px;
    }

.zbt-site-footer__contact-layout > .zbt-site-footer__divider {
        margin-block-end: 32px;
    }
}

/* Reason: 桌面首页以 PSD 的“图层 23 + 背景”导出图作为统一渐变底图；正文、链接和后台字段仍由真实 HTML 覆盖。 */

@media (min-width: 92.0625rem) {
body.home .wp-site-blocks {
        background-color: var(--zbt-home-psd-canvas-background);
        background-image: var(--zbt-home-psd-background-image);
        background-position: top center;
        background-repeat: no-repeat;
        background-size: min(1920px, 100vw) auto;
    }

body.home .zbt-home,
body.home .zbt-site-footer,
body.home .zbt-site-footer__contact,
body.home .zbt-site-footer__contact-dynamic,
body.home .zbt-site-footer__copyright {
        background-color: transparent;
    }
}

/* 新闻动态独立页面：默认桌面画布按 5新闻动态.psd 的 1920px 坐标渲染。 */

.zbt-news-page {
    overflow: hidden;
    background: #fff;
}

/* 新闻详情页专用：固定在内容右侧，窄屏收缩为右下角单列，避免遮挡正文。 */

.zbt-article-toolbar {
    position: fixed;
    z-index: 30;
    top: 50%;
    right: max(24px, calc((100vw - 1440px) / 2));
    display: grid;
    gap: 5px;
    width: 54px;
    overflow: visible;
    transform: translateY(-50%);
}

.zbt-article-toolbar__item {
    position: relative;
    width: 54px;
    height: 54px;
}

.zbt-article-toolbar__button {
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    margin: 0;
    padding: 0;
    color: #9ba1ab;
    border: 1px solid #cbd0d8;
    background: #fff;
    cursor: pointer;
}

.zbt-article-toolbar__button:hover,
.zbt-article-toolbar__button:focus-visible,
.zbt-article-toolbar__button[aria-expanded='true'] {
    color: #3158bd;
    border-color: #8fa3d7;
    background: #fff;
    outline: 2px solid rgb(49 88 189 / 24%);
    outline-offset: 2px;
}

.zbt-article-toolbar__icon {
    display: block;
    width: 25px;
    height: 25px;
}

.zbt-article-toolbar__contact,
.zbt-article-toolbar__qr {
    position: absolute;
    top: 50%;
    right: calc(100% + 12px);
    z-index: 1;
    border: 1px solid #d5d9df;
    background: #fff;
    box-shadow: 0 5px 16px rgb(28 54 91 / 16%);
    transform: translateY(-50%);
}

/* 面板由按钮交互切换，不能让下方布局样式覆盖原生 hidden 属性。 */

.zbt-article-toolbar__contact[hidden],
.zbt-article-toolbar__qr[hidden] {
    display: none;
}

.zbt-article-toolbar__contact::after,
.zbt-article-toolbar__qr::after {
    position: absolute;
    top: 50%;
    right: -7px;
    width: 12px;
    height: 12px;
    border-top: 1px solid #d5d9df;
    border-right: 1px solid #d5d9df;
    background: #fff;
    content: '';
    transform: translateY(-50%) rotate(45deg);
}

.zbt-article-toolbar__contact {
    width: 340px;
    min-height: 92px;
}

.zbt-article-toolbar__contact a {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    align-items: center;
    column-gap: 18px;
    min-height: 92px;
    padding: 16px 24px;
    color: #1a1a1a;
    text-decoration: none;
}

.zbt-article-toolbar__contact a:hover,
.zbt-article-toolbar__contact a:focus-visible {
    color: #3158bd;
    outline: none;
}

.zbt-article-toolbar__contact-icon {
    display: block;
    width: 42px;
    height: 42px;
    color: #8c939d;
}

.zbt-article-toolbar__contact strong,
.zbt-article-toolbar__contact small {
    display: block;
}

.zbt-article-toolbar__contact strong {
    color: #3158bd;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.18;
}

.zbt-article-toolbar__contact small {
    margin-top: 5px;
    color: #343434;
    font-size: 12px;
    line-height: 1.25;
}

.zbt-article-toolbar__qr {
    display: grid;
    gap: 8px;
    width: 142px;
    padding: 12px;
    color: #27384f;
    font-size: 13px;
    line-height: 1.4;
    text-align: center;
}

.zbt-article-toolbar__qr img {
    display: block;
    width: 118px;
    height: 118px;
    object-fit: contain;
}

/* 新闻正文由原生文章编辑器输出，样式只约束阅读版式，不改变富文本语义。 */

.zbt-news-article {
    padding: 64px 0 112px;
    background: #f4f6f9;
}

.zbt-news-article__hero-media {
    width: min(920px, calc(100% - 48px));
    margin: 0 auto;
    aspect-ratio: 16 / 8.5;
    overflow: hidden;
    background: #edf1f5;
    box-shadow: 0 12px 36px rgb(28 54 91 / 8%);
}

.zbt-news-article__hero-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.zbt-news-article__inner {
    width: min(920px, calc(100% - 48px));
    margin: 28px auto 0;
    background: #fff;
    box-shadow: 0 12px 36px rgb(28 54 91 / 6%);
}

.zbt-news-article__header {
    padding: 64px 72px 0;
    text-align: left;
}

.zbt-news-article__title {
    max-width: none;
    margin: 0;
    color: #1b2638;
    font-size: 38px;
    font-weight: 700;
    line-height: 1.42;
}

.zbt-news-article__meta {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 7px 0;
    margin-top: 20px;
    color: #8b95a4;
    font-size: 14px;
    line-height: 1.6;
}

.zbt-news-article__meta a { color: inherit; text-decoration: none; }

.zbt-news-article__meta a:hover,
.zbt-news-article__meta a:focus-visible { color: #0032c8; text-decoration: underline; }

.zbt-news-article__meta > * + *::before { margin: 0 12px; color: #c3cad4; content: '·'; }

.zbt-news-article__content {
    max-width: none;
    margin: 0;
    padding: 44px 72px 64px;
    color: #313c4d;
    font-size: 18px;
    line-height: 1.95;
}

.zbt-news-article__content > *:first-child { margin-top: 0; }

.zbt-news-article__content > *:last-child { margin-bottom: 0; }

.zbt-news-article__content p { margin: 0 0 24px; }

.zbt-news-article__content h2,
.zbt-news-article__content h3,
.zbt-news-article__content h4 { margin: 46px 0 20px; color: #172033; line-height: 1.42; }

.zbt-news-article__content h2 { font-size: 30px; }

.zbt-news-article__content h3 { font-size: 24px; }

.zbt-news-article__content h4 { font-size: 20px; }

.zbt-news-article__content ul,
.zbt-news-article__content ol { padding-left: 1.5em; margin: 0 0 24px; }

.zbt-news-article__content img { display: block; max-width: 100%; height: auto; margin: 34px auto; }

.zbt-news-article__content figure { max-width: 100%; margin: 34px auto; }

.zbt-news-article__content figcaption { margin-top: 10px; color: #778394; font-size: 14px; text-align: center; }

.zbt-news-article__content table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; }

.zbt-news-article__content th,
.zbt-news-article__content td { padding: 11px 14px; border: 1px solid #dce3ed; }

.zbt-news-article__content blockquote { margin: 34px 0; padding: 18px 22px; border-left: 3px solid #0032c8; background: #f3f7ff; color: #506078; }

.zbt-news-article__footer {
    display: grid;
    gap: 28px;
    padding: 30px 72px 64px;
    border-top: 1px solid #e8ecf1;
}

.zbt-news-article__adjacent { display: grid; gap: 14px; min-width: 0; }

.zbt-news-article__adjacent-item { display: grid; grid-template-columns: 64px minmax(0, 1fr); align-items: baseline; gap: 14px; }

.zbt-news-article__adjacent-label { color: #8b95a4; font-size: 14px; }

.zbt-news-article__adjacent a { overflow: hidden; color: #334258; font-size: 16px; line-height: 1.6; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }

.zbt-news-article__adjacent a:hover,
.zbt-news-article__adjacent a:focus-visible { color: #0032c8; }

.zbt-news-article__adjacent em { color: #a2abb7; font-size: 16px; font-style: normal; }

.zbt-news-article__share { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: 14px; padding-top: 26px; color: #8b95a4; font-size: 14px; line-height: 48px; border-top: 1px solid #eef1f4; }

.zbt-news-article__share-label { flex: 0 0 auto; }

.zbt-share-component { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: 14px; min-height: 48px; font-family: inherit; }

/* Reason: 分享库默认的圆形实底高亮与页面阅读区不协调；用低对比卡片承载图标，只让当前悬浮、聚焦或展开的平台获得品牌色反馈。 */

.zbt-share-component .social-share-icon { box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; margin: 0; padding: 0; border: 1px solid #e1e8f0; border-radius: 14px; background: #fff; color: #8998ad; font-family: socialshare !important; font-size: 23px; line-height: 1; text-align: center; text-decoration: none; outline: 0; box-shadow: 0 1px 2px rgb(24 48 82 / 4%); transition: color 180ms ease, background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease; }

.zbt-share-component .social-share-icon::before { display: block; line-height: 1; }

.zbt-share-component .social-share-icon:hover,
.zbt-share-component .social-share-icon:focus-visible { transform: translateY(-2px); }

.zbt-share-component .icon-wechat:hover,
.zbt-share-component .icon-wechat:focus-visible,
.zbt-share-component .icon-wechat.is-open { border-color: #11bd6d; background: #eefbf5; color: #07ad5a; box-shadow: 0 10px 22px rgb(7 193 96 / 16%), inset 0 0 0 1px rgb(7 193 96 / 9%); }

.zbt-share-component .icon-qq:hover,
.zbt-share-component .icon-qq:focus-visible { border-color: #36a9e8; background: #eef8fe; color: #1296db; box-shadow: 0 10px 22px rgb(18 150 219 / 15%), inset 0 0 0 1px rgb(18 150 219 / 8%); }

.zbt-share-component .icon-weibo:hover,
.zbt-share-component .icon-weibo:focus-visible { border-color: #ef4a5f; background: #fff2f4; color: #e6162d; box-shadow: 0 10px 22px rgb(230 22 45 / 14%), inset 0 0 0 1px rgb(230 22 45 / 8%); }

/* Reason: 分享库以 top、固定高度和更高选择器定位二维码；这里必须完整覆盖，才能让浮层始终位于卡片上方且不压住分享行。 */

.zbt-share-component.social-share .icon-wechat:hover .wechat-qrcode { display: none; }

.zbt-share-component.social-share .icon-wechat.is-open { z-index: 2; }

.zbt-share-component.social-share .icon-wechat.is-open .wechat-qrcode { display: block; animation: zbt-share-popover-in 180ms cubic-bezier(0.16, 1, 0.3, 1) both; }

.zbt-share-component.social-share .icon-wechat .wechat-qrcode { --zbt-share-popover-offset-x: 0%; box-sizing: border-box; z-index: 20; top: auto; right: -14px; bottom: 60px; left: auto; width: 220px; height: 208px; padding: 12px; border: 1px solid #e7edf3; border-radius: 16px; background: #fff; box-shadow: 0 20px 46px rgb(20 45 76 / 17%); transform: translateX(var(--zbt-share-popover-offset-x)); }

.zbt-share-component.social-share .icon-wechat .wechat-qrcode,
.zbt-share-component.social-share .icon-wechat .wechat-qrcode * { font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif !important; }

.zbt-share-component.social-share .icon-wechat .wechat-qrcode h4 { display: table; height: auto; margin: 0 auto 5px; padding: 3px 8px; border-radius: 7px; background: #edf9f3; color: #078d4c; font-size: 12px; font-weight: 700; line-height: 1.4; }

.zbt-share-component.social-share .icon-wechat .wechat-qrcode .qrcode { box-sizing: border-box; width: 112px; height: 112px; margin: 0 auto 5px; padding: 4px; border: 1px solid #edf1f4; border-radius: 10px; background: #fff; box-shadow: inset 0 1px 2px rgb(21 49 83 / 5%); }

.zbt-share-component.social-share .icon-wechat .wechat-qrcode .qrcode table { width: 102px !important; height: 102px !important; margin: 0 !important; }

.zbt-share-component.social-share .icon-wechat .wechat-qrcode .help p { margin: 0; color: #718196; font-size: 12px; line-height: 1.55; }

.zbt-share-component.social-share .icon-wechat .wechat-qrcode::after { right: 29px; bottom: -13px; left: auto; border-width: 8px 7px 6px; border-color: #fff transparent transparent; filter: drop-shadow(0 1px 0 #e7edf3); }

@keyframes zbt-share-popover-in {
    from { opacity: 0; transform: translateX(var(--zbt-share-popover-offset-x)) translateY(8px) scale(0.96); }
    to { opacity: 1; transform: translateX(var(--zbt-share-popover-offset-x)) translateY(0) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
.zbt-share-component .social-share-icon { transition: none; }

.zbt-share-component.social-share .icon-wechat.is-open .wechat-qrcode { animation: none; }
}

@media (max-width: 680px) {
.zbt-news-article { padding: 0 0 80px; background: #fff; }

.zbt-news-article__hero-media,
.zbt-news-article__inner { width: 100%; }

.zbt-news-article__hero-media { width: 100%; aspect-ratio: 16 / 9; }

.zbt-news-article__inner { margin-top: 0; box-shadow: none; }

.zbt-news-article__header { padding: 48px 20px 0; }

.zbt-news-article__title { font-size: 29px; line-height: 1.35; }

.zbt-news-article__meta { gap: 5px 0; margin-top: 18px; font-size: 13px; }

.zbt-news-article__meta > * + *::before { margin: 0 9px; }

.zbt-news-article__content { padding: 38px 20px 46px; font-size: 16px; line-height: 1.9; }

.zbt-news-article__content h2 { font-size: 24px; }

.zbt-news-article__content h3 { font-size: 21px; }

.zbt-news-article__footer { gap: 24px; padding: 26px 20px 48px; }

.zbt-news-article__adjacent-item { grid-template-columns: 56px minmax(0, 1fr); gap: 10px; }

.zbt-news-article__adjacent a,
.zbt-news-article__adjacent em { font-size: 15px; }

.zbt-news-article__share { justify-content: flex-start; line-height: 46px; }

.zbt-share-component { gap: 12px; min-height: 46px; }

.zbt-share-component .social-share-icon { width: 46px; height: 46px; border-radius: 13px; }

.zbt-share-component.social-share .icon-wechat .wechat-qrcode { --zbt-share-popover-offset-x: -50%; right: auto; bottom: 58px; left: 50%; width: min(220px, calc(100vw - 32px)); }

.zbt-share-component.social-share .icon-wechat .wechat-qrcode::after { right: auto; left: 50%; transform: translateX(-50%); }
}

@media (max-width: 680px) {
.zbt-article-toolbar {
        top: auto;
        right: 14px;
        bottom: 18px;
        transform: none;
    }

.zbt-article-toolbar__contact {
        width: min(340px, calc(100vw - 96px));
        top: auto;
        right: calc(100% + 12px);
        bottom: 0;
        transform: none;
    }

.zbt-article-toolbar__contact a {
        grid-template-columns: 38px minmax(0, 1fr);
        column-gap: 12px;
        min-height: 76px;
        padding: 14px 16px;
    }

.zbt-article-toolbar__contact-icon {
        width: 38px;
        height: 38px;
    }

.zbt-article-toolbar__contact strong {
        font-size: 18px;
        white-space: nowrap;
    }

.zbt-article-toolbar__qr {
        top: auto;
        right: calc(100% + 12px);
        bottom: 0;
        transform: none;
    }
}

.zbt-news-page__hero {
    position: relative;
    block-size: 799px;
    overflow: hidden;
    background-color: #31557d;
    background-image: linear-gradient(90deg, rgb(0 50 200 / 82%), rgb(0 50 200 / 47%) 55%, rgb(3 3 3 / 30%)), var(--zbt-news-page-hero-background);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.zbt-news-page__hero-default,
.zbt-news-page__hero-default img {
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 0;
    inline-size: 1920px;
    block-size: 799px;
}

.zbt-news-page__hero-default {
    overflow: hidden;
}

.zbt-news-page__hero-default img {
    display: block;
    max-inline-size: none;
    object-fit: fill;
    pointer-events: none;
    user-select: none;
}

.zbt-news-page__hero-dynamic {
    position: relative;
    display: grid;
    inline-size: 1920px;
    block-size: 799px;
    align-items: start;
    background: transparent;
    color: #fff;
}

.zbt-news-page__hero-content {
    inline-size: 1224px;
    margin: 0 auto;
    padding-top: 191px;
}

.zbt-news-page__hero-content h1,
.zbt-news-page__hero-content p {
    margin: 0;
    color: #fff;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
}

.zbt-news-page__hero-content h1 {
    font-size: 74px;
    font-weight: 700;
    line-height: 104px;
}

.zbt-news-page__hero-content p {
    max-inline-size: 1130px;
    margin-top: 65px;
    font-size: 32px;
    font-weight: 700;
    line-height: 72px;
}

.zbt-news-page__archive {
    position: relative;
    block-size: 1296px;
    overflow: hidden;
    background: #fff;
}

.zbt-news-page__archive-layout {
    position: relative;
    inline-size: 1920px;
    block-size: 1296px;
    margin: 0;
}

.zbt-news-page__grid {
    position: absolute;
    inset-block-start: 91px;
    inset-inline-start: 350px;
    display: grid;
    grid-template-columns: repeat(3, 384px);
    grid-auto-rows: 516px;
    gap: 44px 35px;
}

.zbt-news-page__card {
    inline-size: 384px;
    margin: 0;
    background: transparent;
}

.zbt-news-page__empty {
    position: absolute;
    inset-block-start: 180px;
    inset-inline: 0;
    margin: 0;
    color: #666;
    font-size: 24px;
    text-align: center;
}

.zbt-news-page__pagination {
    position: absolute;
    inset-block-end: 34px;
    inset-inline: 0;
    display: flex;
    justify-content: center;
    gap: 12px;
}

.zbt-news-page__pagination a {
    display: grid;
    inline-size: 36px;
    block-size: 36px;
    place-items: center;
    border-radius: 50%;
    color: #0032c8;
    font-size: 16px;
}

.zbt-news-page__pagination a.is-current,
.zbt-news-page__pagination a:hover,
.zbt-news-page__pagination a:focus-visible {
    background: #0032c8;
    color: #fff;
}

@media (min-width: 92.0625rem) and (max-width: 119.9375rem) {
.zbt-news-page__hero,
.zbt-news-page__archive { block-size: calc(100vw * 799 / 1920); }

.zbt-news-page__archive { block-size: calc(100vw * 1296 / 1920); }

.zbt-news-page__hero-default,
.zbt-news-page__hero-dynamic,
.zbt-news-page__archive-layout {
        transform: scale(calc(100cqi / 1920px));
        transform-origin: top left;
    }
}

@media (max-width: 92rem) {
.zbt-news-page__hero {
        block-size: auto;
        min-block-size: 560px;
    }

.zbt-news-page__hero-dynamic {
        display: grid;
        inline-size: 100%;
        block-size: auto;
        min-block-size: 560px;
    }

.zbt-news-page__hero-content {
        inline-size: min(calc(100% - 96px), 1200px);
        padding-block: 140px;
    }

.zbt-news-page__hero-content h1 { font-size: 58px; line-height: 76px; }

.zbt-news-page__hero-content p { margin-top: 38px; font-size: 24px; line-height: 44px; }

.zbt-news-page__archive {
        block-size: auto;
        min-block-size: 1296px;
        padding-block: 96px 140px;
    }

.zbt-news-page__archive-layout {
        inline-size: min(calc(100% - 96px), 1200px);
        block-size: auto;
        margin-inline: auto;
    }

.zbt-news-page__grid {
        position: static;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-auto-rows: auto;
        gap: 28px;
    }

.zbt-news-page__card {
        inline-size: min(384px, 100%);
        block-size: auto;
    }

.zbt-news-page__pagination {
        position: static;
        margin-top: 52px;
    }
}

@media (max-width: 48rem) {
.zbt-news-page__hero,
.zbt-news-page__hero-dynamic { min-block-size: 500px; }

.zbt-news-page__hero-content {
        inline-size: calc(100% - 48px);
        padding-block: 96px;
    }

.zbt-news-page__hero-content h1 { font-size: 42px; line-height: 56px; }

.zbt-news-page__hero-content p { margin-top: 28px; font-size: 19px; line-height: 34px; }

.zbt-news-page__archive { min-block-size: 0; padding-block: 64px 96px; }

.zbt-news-page__archive-layout { inline-size: calc(100% - 48px); }

.zbt-news-page__grid { grid-template-columns: 1fr; gap: 20px; }

.zbt-news-page__card { inline-size: min(275px, 100%); }
}

/*
 * 全站独立页面的宽屏画布规范。
 * Reason: 首页已经以 1920px 画布居中；独立页面的 PSD 默认层、动态层和列表也必须使用同一
 * 个横向坐标系，否则在 3840px 视口会从左边开始渲染，形成与首页不一致的视觉基准。
 * 该规则只处理 >= 1921px 的桌面端；1473-1920px 的等比缩放和 1472px 以下的响应式规则
 * 由各页面已有断点继续负责，避免改变移动端内容流和交互。
 */

@media (min-width: 120.0625rem) {
.zbt-about-page-stage__default,
.zbt-contact-page-stage__default,
.zbt-news-page__hero-default {
        inset-inline-start: 50%;
        transform: translateX(-50%);
    }

.zbt-about-page-hero__dynamic,
.zbt-about-page-company__dynamic,
.zbt-about-page-history__dynamic,
.zbt-about-page-innovation__dynamic,
.zbt-about-page-qualification__dynamic,
.zbt-about-page-recruitment__dynamic,
.zbt-about-page-contact__dynamic,
.zbt-contact-page-hero__dynamic,
.zbt-contact-page-services__layout,
.zbt-contact-page-message__dynamic,
.zbt-contact-page-details__dynamic,
.zbt-news-page__hero-dynamic,
.zbt-news-page__archive-layout {
        margin-inline: auto;
    }
}

/*
 * 全站设计画布第二阶段收口。
 * Reason: 页面主体、Header 和 Footer 必须共享同一横向基准；背景属于全宽外壳，文字与交互
 * 属于居中的 PSD 内容画布。这样 4K 只扩展背景外壳，不会把固定画布裁成左蓝右图的状态。
 */

@media (min-width: 92.0625rem) {
.zbt-about-page,
.zbt-contact-page,
.zbt-news-page,
.zbt-site-footer {
        container-type: inline-size;
    }
}

@media (min-width: 120.0625rem) {
/* Header 内容跟随页面 1920px 画布居中，黑色背景仍然铺满视口。 */

.zbt-header__inner {
        inline-size: min(var(--zbt-design-canvas-inline-size), 100%);
        max-inline-size: var(--zbt-design-canvas-inline-size);
        margin-inline: auto;
    }

.zbt-header__inner > nav.zbt-primary-navigation {
        margin-left: 245px !important;
    }

/* Footer 默认图和动态内容使用同一个居中锚点，避免联系方式区域左对齐。 */

.zbt-site-footer__contact-default,
.zbt-site-footer__contact-dynamic {
        inset-inline-start: 50%;
        margin-inline: 0;
        transform: translateX(-50%);
    }

.zbt-site-footer__contact-layout {
        margin-inline: auto;
    }

/* 首屏摄影背景延伸到全宽外壳；正文仍由 1920px 内容画布承载。 */

.zbt-about-page-stage--hero,
.zbt-news-page__hero,
.zbt-contact-page-stage--hero {
        background-position: center;
        background-repeat: no-repeat;
        background-size: var(--zbt-design-canvas-inline-size) auto;
    }

.zbt-about-page-stage--hero {
        background-color: #030303;
        background-image: var(
            --zbt-about-hero-background,
            url("https://wp-oss.j4c.cc/zbt/official/wp-content/uploads/2026/09/about-page-hero-background-optimized.webp?zbt_asset=87d44edb8662")
        );
    }

.zbt-news-page__hero {
        background-color: #31557d;
        background-image: var(
            --zbt-news-page-hero-background,
            url("https://wp-oss.j4c.cc/zbt/official/wp-content/uploads/2026/09/news-page-hero-background-optimized.webp?zbt_asset=10836357c935")
        );
    }

.zbt-contact-page-stage--hero {
        background-color: #31557d;
        background-image: var(
            --zbt-contact-hero-background,
            url("https://wp-oss.j4c.cc/zbt/official/wp-content/uploads/2026/09/contact-page-hero-background-optimized.webp?zbt_asset=0832bfd320f8")
        );
    }

.zbt-about-page-hero__dynamic,
.zbt-news-page__hero-dynamic,
.zbt-contact-page-hero__dynamic {
        background: transparent;
    }

.zbt-contact-page-stage--message {
        background-color: #030303;
        background-image: none;
        background-position: center;
        background-repeat: no-repeat;
        background-size: var(--zbt-design-canvas-inline-size) auto;
    }

.zbt-contact-page-message__dynamic {
        background: transparent;
    }
}

/*
 * 中等桌面端使用实际容器宽度参与比例计算。
 * Reason: 100vw 包含浏览器滚动条，而页面内容宽度使用 clientWidth；直接使用 100vw 会在
 * 1473px 与 1920px 临界点多出约 15px，并被 overflow: clip 单侧裁掉。cqi 以真实容器宽度为基准，
 * 再将固定画布以中心锚点缩放，可保持左右误差对称。
 */

@media (min-width: 92.0625rem) and (max-width: 120rem) {
.zbt-about-page-stage--hero { block-size: calc(100cqi * 768 / 1920); }

.zbt-about-page-stage--company { block-size: calc(100cqi * 1380 / 1920); }

.zbt-about-page-stage--history { block-size: calc(100cqi * 1225 / 1920); }

.zbt-about-page-stage--innovation { block-size: calc(100cqi * 1855 / 1920); }

.zbt-about-page-stage--qualification {
        margin-block-start: calc(100cqi * -87 / 1920);
        block-size: calc(100cqi * 963 / 1920);
    }

.zbt-about-page-stage--recruitment { block-size: calc(100cqi * 809 / 1920); }

.zbt-about-page-stage--contact { block-size: calc(100cqi * 1769 / 1920); }

.zbt-contact-page-stage--hero { block-size: calc(100cqi * 799 / 1920); }

.zbt-contact-page-stage--services { block-size: calc(100cqi * 1535 / 1920); }

.zbt-contact-page-stage--message { block-size: calc(100cqi * 1094 / 1920); }

.zbt-contact-page-stage--details { block-size: calc(100cqi * 2228 / 1920); }

.zbt-news-page__hero { block-size: calc(100cqi * 799 / 1920); }

.zbt-news-page__archive { block-size: calc(100cqi * 1296 / 1920); }

.zbt-site-footer__contact { block-size: calc(100cqi * 882 / 1920); }

/* 中等桌面端仍把摄影背景放在全宽外壳，避免背景跟随前景层偏移。 */

.zbt-about-page-stage--hero,
.zbt-news-page__hero,
.zbt-contact-page-stage--hero,
.zbt-contact-page-stage--message {
        background-position: center;
        background-repeat: no-repeat;
        background-size: 100cqi auto;
    }

.zbt-about-page-stage--hero {
        background-color: #030303;
        background-image: var(
            --zbt-about-hero-background,
            url("https://wp-oss.j4c.cc/zbt/official/wp-content/uploads/2026/09/about-page-hero-background-optimized.webp?zbt_asset=87d44edb8662")
        );
    }

.zbt-news-page__hero {
        background-color: #31557d;
        background-image: var(
            --zbt-news-page-hero-background,
            url("https://wp-oss.j4c.cc/zbt/official/wp-content/uploads/2026/09/news-page-hero-background-optimized.webp?zbt_asset=10836357c935")
        );
    }

.zbt-contact-page-stage--hero {
        background-color: #31557d;
        background-image: var(
            --zbt-contact-hero-background,
            url("https://wp-oss.j4c.cc/zbt/official/wp-content/uploads/2026/09/contact-page-hero-background-optimized.webp?zbt_asset=0832bfd320f8")
        );
    }

.zbt-contact-page-stage--message {
        background-color: #030303;
        background-image: none;
    }

.zbt-about-page-hero__dynamic,
.zbt-news-page__hero-dynamic,
.zbt-contact-page-hero__dynamic,
.zbt-contact-page-message__dynamic {
        background: transparent;
    }

.zbt-about-page-stage__default,
.zbt-contact-page-stage__default,
.zbt-news-page__hero-default,
.zbt-site-footer__contact-default {
        inset-inline-start: 0;
        transform: scale(calc(100cqi / 1920px));
        transform-origin: top left;
    }

.zbt-about-page-hero__dynamic,
.zbt-about-page-company__dynamic,
.zbt-about-page-history__dynamic,
.zbt-about-page-innovation__dynamic,
.zbt-about-page-qualification__dynamic,
.zbt-about-page-recruitment__dynamic,
.zbt-about-page-contact__dynamic,
.zbt-contact-page-hero__dynamic,
.zbt-contact-page-services__layout,
.zbt-contact-page-message__dynamic,
.zbt-contact-page-details__dynamic,
.zbt-news-page__hero-dynamic,
.zbt-news-page__archive-layout,
.zbt-site-footer__contact-dynamic {
        inset-inline-start: 0;
        margin-inline: 0;
        transform: scale(calc(100cqi / 1920px));
        transform-origin: top left;
    }

/*
 * Reason: 早期桌面规则以“阶段 + 动态层”限定选择器，并按 100vw 缩放；其优先级高于上方的
 * 通用 100cqi 规则。父阶段高度已按真实内容宽度 100cqi 计算，若动态层继续按包含滚动条的
 * 100vw 缩放，1473px 至 1920px 区间会产生横向裁切与纵向错位。因此必须在相同限定层级
 * 统一覆盖全部关于我们动态层，确保父子几何使用同一个宽度基准。
 */

.zbt-about-page-stage--hero .zbt-about-page-hero__dynamic,
.zbt-about-page-stage--company .zbt-about-page-company__dynamic,
.zbt-about-page-stage--history .zbt-about-page-history__dynamic,
.zbt-about-page-stage--innovation .zbt-about-page-innovation__dynamic,
.zbt-about-page-stage--qualification .zbt-about-page-qualification__dynamic,
.zbt-about-page-stage--recruitment .zbt-about-page-recruitment__dynamic,
.zbt-about-page-stage--contact .zbt-about-page-contact__dynamic,
.zbt-contact-page-stage--hero .zbt-contact-page-hero__dynamic,
.zbt-news-page__hero .zbt-news-page__hero-dynamic {
        inset-inline-start: 0;
        transform: scale(calc(100cqi / 1920px));
        transform-origin: top left;
    }
}

/*
 * Reason: 部分 Firefox/LibreWolf 版本支持 100cqi，但不支持
 * scale(calc(100cqi / 1920px))。脚本只会在该表达式不受支持且处于中等桌面区间时
 * 添加兜底类，因此 Chrome 及其它已有布局不会进入这些规则。
 */
@media (min-width: 92.0625rem) and (max-width: 120rem) {
.zbt-about-page.zbt-about-page--canvas-scale-fallback .zbt-about-page-stage__default,
.zbt-about-page.zbt-about-page--canvas-scale-fallback .zbt-about-page-hero__dynamic,
.zbt-about-page.zbt-about-page--canvas-scale-fallback .zbt-about-page-company__dynamic,
.zbt-about-page.zbt-about-page--canvas-scale-fallback .zbt-about-page-history__dynamic,
.zbt-about-page.zbt-about-page--canvas-scale-fallback .zbt-about-page-innovation__dynamic,
.zbt-about-page.zbt-about-page--canvas-scale-fallback .zbt-about-page-qualification__dynamic,
.zbt-about-page.zbt-about-page--canvas-scale-fallback .zbt-about-page-recruitment__dynamic,
.zbt-about-page.zbt-about-page--canvas-scale-fallback .zbt-about-page-contact__dynamic {
        transform: scale(var(--zbt-about-page-canvas-scale, 1));
        transform-origin: top left;
    }
}

/*
 * 原因：部分 Firefox/LibreWolf 版本会拒绝 scale(calc(100cqi / 1920px))，
 * 导致新闻页的 1920px 固定画布未缩放，而父级归档区已按 cqi 计算高度并裁切内容。
 * 当脚本检测到该表达式不受支持时，使用实际容器宽度计算出的纯数字缩放值保持父子几何一致。
 */
@media (min-width: 92.0625rem) and (max-width: 120rem) {
/* 联系页默认层和全部动态层同步缩放，尤其避免留言、服务卡片和二维码保持1920px尺寸。 */
.zbt-contact-page.zbt-contact-page--canvas-scale-fallback .zbt-contact-page-stage__default,
.zbt-contact-page.zbt-contact-page--canvas-scale-fallback .zbt-contact-page-hero__dynamic,
.zbt-contact-page.zbt-contact-page--canvas-scale-fallback .zbt-contact-page-services__layout,
.zbt-contact-page.zbt-contact-page--canvas-scale-fallback .zbt-contact-page-message__dynamic,
.zbt-contact-page.zbt-contact-page--canvas-scale-fallback .zbt-contact-page-details__dynamic {
        transform: scale(var(--zbt-contact-page-canvas-scale, 1));
        transform-origin: top left;
    }

.zbt-news-page.zbt-news-page--canvas-scale-fallback .zbt-news-page__hero-default,
.zbt-news-page.zbt-news-page--canvas-scale-fallback .zbt-news-page__hero-dynamic,
.zbt-news-page.zbt-news-page--canvas-scale-fallback .zbt-news-page__archive-layout {
        transform: scale(var(--zbt-news-page-canvas-scale, 1));
        transform-origin: top left;
    }
}

/*
 * 原因：部分 Firefox/LibreWolf 不解析含 cqi 的 scale()，使页脚 1920px 画布保持原尺寸并被裁切。
 * 仅在脚本检测到该兼容问题时，以页脚真实容器宽度计算纯数字缩放；支持原表达式的浏览器继续走原规则。
 */
@media (min-width: 92.0625rem) and (max-width: 120rem) {
.zbt-site-footer.zbt-site-footer--canvas-scale-fallback .zbt-site-footer__contact-default,
.zbt-site-footer.zbt-site-footer--canvas-scale-fallback .zbt-site-footer__contact-dynamic {
        transform: scale(var(--zbt-site-footer-canvas-scale, 1));
        transform-origin: top left;
    }
}

/* Reason: Firefox 兼容兜底也覆盖 1200px 至 1472px 的横向时间轴，竖向布局不使用固定画布缩放。 */
@media (min-width: 75.0625rem) and (max-width: 92rem) {
.zbt-about-page.zbt-about-page--canvas-scale-fallback .zbt-about-page-stage--history .zbt-about-page-stage__default,
.zbt-about-page.zbt-about-page--canvas-scale-fallback .zbt-about-page-stage--history .zbt-about-page-history__dynamic {
        transform: scale(var(--zbt-about-page-canvas-scale, 1));
        transform-origin: top left;
    }
}

/*
 * 独立页面公共首屏。
 * Reason: 三页只允许背景素材和其原始高度存在差异；标题、说明、遮罩关系与响应式几何
 * 必须复用联系我们的设计基准，避免页面各自维护后形成不同的阅读起点和换行节奏。
 */

.zbt-page-hero {
    position: relative;
    isolation: isolate;
    --zbt-page-hero-background-top-crop: 0px;
    block-size: 799px;
    overflow: clip;
    background-color: #31557d;
    background-image: var(--zbt-page-hero-overlay, none), var(--zbt-page-hero-background);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

/* Reason: 业务页 PSD 的背景图与其底部过渡条是分离图层；以受控预设复用同一结构，同时保留关于我们、新闻动态的细微色彩差异。 */

.zbt-page-hero--bottom-boundary-standard,
.zbt-page-hero--bottom-boundary-about,
.zbt-page-hero--bottom-boundary-news {
    --zbt-page-hero-bottom-boundary-size: 16px;
}

.zbt-page-hero--bottom-boundary-standard::after,
.zbt-page-hero--bottom-boundary-about::after,
.zbt-page-hero--bottom-boundary-news::after {
    position: absolute;
    z-index: 0;
    inset-inline: 0;
    inset-block-end: 0;
    block-size: var(--zbt-page-hero-bottom-boundary-size);
    content: "";
    pointer-events: none;
}

.zbt-page-hero--bottom-boundary-standard::after {
    background: linear-gradient(90deg, #0033c8 0%, #0073e1 50%, #00b2f9 100%);
}

.zbt-page-hero--bottom-boundary-about::after {
    background: linear-gradient(102deg, #0131bf 0%, #0874d8 50%, #03abed 100%);
}

.zbt-page-hero--bottom-boundary-news::after {
    background:
        linear-gradient(180deg, rgb(0 50 200 / 76%) 0%, rgb(0 50 200 / 0%) 86%),
        linear-gradient(90deg, #0033c8 0%, #0073e1 50%, #00b2f9 100%);
}

/* Reason: 联系我们、新闻动态的无文字首屏素材误带 16px 深色行；仅裁掉该来源行，首屏容器与 Header 的文档流高度保持不变。 */

/* 裁切层比首屏向上多出指定高度，cover 同时保证横向铺满与纵向无露底。
 * 标题仍在原画布中；不放大或拉伸前景，也不更改后台图片及 OSS 映射地址。 */
.zbt-page-hero--background-cropped {
    background-image: none;
}

.zbt-page-hero--background-cropped::before {
    position: absolute;
    z-index: -1;
    inset-inline: 0;
    inset-block-start: calc(0px - var(--zbt-page-hero-background-top-crop));
    inset-block-end: 0;
    content: "";
    background-image: var(--zbt-page-hero-overlay, none), var(--zbt-page-hero-background);
    /* cover 放大时以中心锚点裁切溢出画面，避免来源顶部色带随放大重新露出。 */
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%, cover;
    pointer-events: none;
}

/* Reason: 关于我们素材的原始首屏高度为 768px，保留背景画面比例，不拉伸为其它页面高度。 */

.zbt-page-hero--about {
    block-size: 768px;
    background-color: #030303;
}

.zbt-page-hero--news {
}

.zbt-page-hero__canvas {
    position: relative;
    z-index: 1;
    inline-size: var(--zbt-design-canvas-inline-size);
    block-size: 100%;
    margin-inline: auto;
}

.zbt-page-hero__content {
    inline-size: 1224px;
    margin: 0 auto;
    padding-top: 202px;
}

.zbt-page-hero__content h1,
.zbt-page-hero__content p {
    margin: 0;
    color: #fff;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
}

.zbt-page-hero__content h1 {
    font-size: 98px;
    font-weight: 700;
    line-height: 104px;
    letter-spacing: .9px;
    white-space: nowrap;
}

.zbt-page-hero__content p {
    max-inline-size: 1130px;
    margin-top: 50px;
    font-size: 32px;
    font-weight: 700;
    line-height: 72px;
    transform: translateX(3px);
}

@media (min-width: 120.0625rem) {
.zbt-page-hero:not(.zbt-page-hero--background-cropped) {
        /* 超宽屏只扩展背景；1920px 前景画布继续居中。 */
        background-size: 100% 100%, cover;
    }
}

@media (min-width: 92.0625rem) and (max-width: 120rem) {
.zbt-page-hero--bottom-boundary-standard,
.zbt-page-hero--bottom-boundary-about,
.zbt-page-hero--bottom-boundary-news {
        --zbt-page-hero-bottom-boundary-size: calc(100cqi * 16 / 1920);
    }

.zbt-page-hero--about {
        block-size: calc(100cqi * 768 / 1920);
    }

.zbt-page-hero--contact,
.zbt-page-hero--news {
        block-size: calc(100cqi * 799 / 1920);
    }

.zbt-page-hero:not(.zbt-page-hero--background-cropped) {
        /* 背景覆盖整个首屏，不再以画布宽度限制图片的绘制范围。 */
        background-size: 100% 100%, cover;
    }

.zbt-page-hero__canvas {
        margin-inline: 0;
        transform: scale(calc(100cqi / 1920px));
        transform-origin: top left;
    }
}

@media (max-width: 92rem) {
.zbt-page-hero,
.zbt-page-hero--about {
        block-size: auto;
        min-block-size: 560px;
        background-size: cover;
    }

.zbt-page-hero__canvas {
        inline-size: 100%;
        min-block-size: 560px;
        transform: none;
    }

.zbt-page-hero--background-cropped {
        /* 窄屏仍由独立背景层负责裁切，不把来源图片重新绘制在首屏外层。 */
        background-image: none;
    }

/* Reason: 该横线只存在于桌面 PSD；窄屏使用封面裁切后的连续背景，避免额外色带破坏移动端构图。 */

.zbt-page-hero--bottom-boundary-standard::after,
.zbt-page-hero--bottom-boundary-about::after,
.zbt-page-hero--bottom-boundary-news::after {
        display: none;
    }

.zbt-page-hero__content {
        inline-size: min(calc(100% - 96px), 1200px);
        padding-block: 140px;
    }

.zbt-page-hero__content h1 {
        font-size: 58px;
        line-height: 76px;
    }

.zbt-page-hero__content p {
        margin-top: 38px;
        font-size: 24px;
        line-height: 44px;
        transform: none;
    }
}

@media (max-width: 48rem) {
.zbt-page-hero,
.zbt-page-hero--about,
.zbt-page-hero__canvas {
        min-block-size: 500px;
    }

.zbt-page-hero__content {
        inline-size: calc(100% - 48px);
        padding-block: 96px;
    }

.zbt-page-hero__content h1 {
        font-size: 42px;
        line-height: 56px;
        white-space: normal;
    }

.zbt-page-hero__content p {
        margin-top: 28px;
        font-size: 19px;
        line-height: 34px;
    }
}

/*
 * 新闻详情页。
 * Reason: 详情页遵循新闻线框的单列阅读顺序，首图、标题、元信息、正文和页尾操作共享同一居中宽度；
 * 不再用独立的窄白卡承载正文，避免大图偏左、正文被压缩和页尾操作脱离内容流。
 */

.zbt-news-article {
    padding: 0 max(24px, calc((100% - 1812px) / 2)) 112px;
    overflow: clip;
    background: #fff;
}

.zbt-news-article__hero-media {
    inline-size: min(calc(100% - (var(--zbt-layout-gutter) * 2)), var(--zbt-layout-article-media-max));
    max-inline-size: var(--zbt-layout-article-media-max);
    aspect-ratio: 1812 / 818;
    margin: 0 auto;
    overflow: hidden;
    background: #e7e7e7;
}

.zbt-news-article__hero-media img {
    display: block;
    inline-size: 100%;
    block-size: 100%;
    margin: 0;
    object-fit: cover;
}

.zbt-news-article__inner {
    inline-size: min(calc(100% - (var(--zbt-layout-gutter) * 2)), var(--zbt-layout-article-media-max));
    max-inline-size: var(--zbt-layout-article-media-max);
    margin: 0 auto;
    /* Reason: 间距同时受视口宽度和高度约束，避免矮屏保留过大的图片到标题空白。 */
    padding: clamp(40px, min(4vw, 6vh), 64px) 0 0;
    background: transparent;
    box-shadow: none;
}

/* Reason: 没有首图时从标题区开始阅读，保留适度顶部呼吸感但不留下媒体占位高度。 */

.zbt-news-article--no-hero .zbt-news-article__inner {
    padding-top: clamp(36px, min(4vw, 6vh), 52px);
}

.zbt-news-article__header {
    /* Reason: 旧版详情规则曾给 header 叠加 64px 顶部内边距，必须在最终规则中清零。 */
    padding: 0;
    text-align: center;
}

.zbt-news-article__title {
    max-inline-size: var(--zbt-layout-article-title-max);
    margin: 0 auto;
    color: #252b35;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 56px;
    font-weight: 700;
    line-height: 1.28;
    overflow-wrap: anywhere;
}

.zbt-news-article__meta {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 14px 40px;
    margin-top: 44px;
    color: #7b8490;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 24px;
    line-height: 1.55;
}

.zbt-news-article__meta a {
    color: inherit;
    text-decoration: none;
}

.zbt-news-article__meta a:hover,
.zbt-news-article__meta a:focus-visible {
    color: #0032c8;
    text-decoration: underline;
}

.zbt-news-article__content {
    max-inline-size: var(--zbt-layout-article-body-max);
    margin-inline: auto;
    /* Reason: 正文起始位置只由这里的间距控制；不能再叠加旧规则的顶部内边距或固定最小高度，否则短文和无首图文章会出现大块无意义空白。 */
    min-block-size: 0;
    margin-top: 28px;
    padding-block-start: 0;
    color: #323844;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 20px;
    line-height: 2;
}

/* Reason: WordPress 的 has-large-font-size 是编辑器展示级字号，不适合新闻首段说明。 */

.zbt-news-article__content .has-large-font-size {
    font-size: 24px !important;
    line-height: 1.8;
}

.zbt-news-article__content > *:first-child {
    margin-top: 0;
}

.zbt-news-article__content p {
    margin: 0 0 28px;
}

.zbt-news-article__content h2,
.zbt-news-article__content h3,
.zbt-news-article__content h4 {
    margin: 58px 0 24px;
    color: #202834;
    font-size: inherit;
    font-weight: 700;
    line-height: 1.55;
}

.zbt-news-article__content ul,
.zbt-news-article__content ol {
    margin: 0 0 28px;
    padding-inline-start: 1.5em;
}

.zbt-news-article__content img {
    display: block;
    max-inline-size: 100%;
    block-size: auto;
    margin: 40px auto;
}

.zbt-news-article__content table {
    display: block;
    max-inline-size: 100%;
    overflow-x: auto;
    border-collapse: collapse;
}

.zbt-news-article__content th,
.zbt-news-article__content td {
    padding: 12px 16px;
    border: 1px solid #dce3ed;
}

.zbt-news-article__content blockquote {
    margin: 36px 0;
    padding: 20px 24px;
    border-inline-start: 4px solid #0032c8;
    background: #f3f7ff;
    color: #435064;
}

.zbt-news-article__footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    /* Reason: 页尾属于详情内容列，不能在已限宽的详情外壳内再次扣除页面边距。 */
    inline-size: min(100%, var(--zbt-layout-article-body-max));
    max-inline-size: var(--zbt-layout-article-body-max);
    gap: 48px;
    margin-inline: auto;
    margin-top: 70px;
    padding-top: 0;
    border: 0;
}

.zbt-news-article__adjacent {
    display: grid;
    gap: 16px;
    min-inline-size: min(100%, 540px);
    color: #6f7884;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 20px;
    line-height: 1.55;
}

.zbt-news-article__adjacent-item {
    display: flex;
    min-inline-size: 0;
    gap: 4px;
}

.zbt-news-article__adjacent-label {
    flex: 0 0 auto;
}

.zbt-news-article__adjacent a,
.zbt-news-article__share a {
    color: #0032c8;
    text-decoration: none;
}

.zbt-news-article__adjacent a:hover,
.zbt-news-article__adjacent a:focus-visible,
.zbt-news-article__share a:hover,
.zbt-news-article__share a:focus-visible {
    text-decoration: underline;
}

.zbt-news-article__adjacent em {
    color: #8f97a2;
    font-style: normal;
}

.zbt-news-article__share {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 14px;
    color: #171c24;
    font-family: "HarmonyOS Sans SC", "Microsoft YaHei", sans-serif;
    font-size: 22px;
    line-height: 1.5;
}

.zbt-news-article__share button {
    margin: 0;
    padding: 0;
    color: #0032c8;
    font: inherit;
    line-height: inherit;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.zbt-news-article__share button:hover,
.zbt-news-article__share button:focus-visible {
    color: #001f7d;
    text-decoration: underline;
    outline: none;
}

@media (max-width: 92rem) {
.zbt-news-article {
        padding-inline: 48px;
        padding-bottom: 88px;
    }

.zbt-news-article__hero-media {
        aspect-ratio: 16 / 9;
    }

.zbt-news-article__inner {
        padding-top: clamp(40px, min(4vw, 6vh), 56px);
    }

.zbt-news-article__title {
        font-size: 46px;
    }

.zbt-news-article__meta {
        font-size: 20px;
    }

.zbt-news-article__content {
        margin-top: 24px;
        font-size: 18px;
    }

.zbt-news-article__content .has-large-font-size {
        font-size: 21px !important;
    }
}

@media (max-width: 48rem) {
.zbt-news-article {
        padding-inline: 24px;
        padding-bottom: 64px;
    }

.zbt-news-article__inner {
        padding-top: 40px;
    }

.zbt-news-article--no-hero .zbt-news-article__inner {
        padding-top: 32px;
    }

.zbt-news-article__title {
        font-size: 30px;
        line-height: 1.38;
    }

.zbt-news-article__meta {
        display: grid;
        gap: 10px;
        margin-top: 26px;
        font-size: 16px;
    }

.zbt-news-article__content {
        margin-top: 20px;
        padding-block-start: 0;
        font-size: 16px;
        line-height: 1.9;
    }

.zbt-news-article__content .has-large-font-size {
        font-size: 18px !important;
        line-height: 1.8;
    }

.zbt-news-article__content p,
.zbt-news-article__content ul,
.zbt-news-article__content ol {
        margin-bottom: 22px;
    }

.zbt-news-article__footer {
        display: grid;
        gap: 34px;
        margin-top: 48px;
    }

.zbt-news-article__adjacent {
        min-inline-size: 0;
        font-size: 16px;
    }

.zbt-news-article__share {
        justify-content: flex-start;
        font-size: 17px;
    }
}

/* Reason: 移动端文章图片和文章壳恢复全宽内容流，仅保留页面两侧安全边距，不能沿用桌面媒体上限计算。 */

@media (max-width: 680px) {
.zbt-news-article__hero-media,
.zbt-news-article__inner {
        inline-size: 100%;
        max-inline-size: none;
    }

.zbt-news-article__content,
.zbt-news-article__footer {
        inline-size: 100%;
        max-inline-size: none;
    }

.zbt-news-article__footer {
        margin-inline: 0;
    }
}