/*
 * 我方新增样式 —— 不改上游任何 css 文件,同步时不冲突。
 * 只覆盖上游没有的三类东西:表单提示、我们补的隐私勾选框、我们加的「加载更多」与分页。
 * 命名一律 cms- 前缀,避免与 cbcn- 撞名。
 */

.cms-formtip {
  margin-top: 12px;
  line-height: 1.6;
  min-height: 1.6em;
}

/* 上游的隐私勾选只有一个孤立 label(for="contact" 却没有对应 input),input 由 JS 补出来 */
.cms-agree {
  width: 16px;
  height: 16px;
  margin-right: 8px;
  vertical-align: middle;
  cursor: pointer;
  accent-color: currentColor;
}

/* 职位卡上的部门 / 地点:上游卡片只画了「标题 + 橙色分类」,这两个位是我们 append 的
 * (mapping: jobs.yml)。字号颜色沿用上游 .cbcn-b1 grey,这里只给间距。 */
.cms-job-meta {
  margin-left: 12px;
}

/* 职位页「加载更多」:**只用于上游没有这个按钮时我们自己补的兜底节点**。
 *
 * ⚠️ 别再把这个类加到上游的 .cbcn-jobs-showmore 上:那个按钮上游有自己的
 * 148x51 橙色胶囊样式(cbcn-pc-jobs.css)+ cbcn-pc-rowCenter1 居中,
 * 这里的 display/margin/padding/border 会把它整个盖掉,变成一个左对齐的窄条
 * (2026-08-26 用户反馈)。接管上游节点时只接行为,不碰样式 —— 标记走 data-cms-more。 */
.cms-jobs-more {
  display: inline-block;
  margin: 24px auto 0;
  padding: 10px 28px;
  border: 1px solid currentColor;
  border-radius: 999px;
  cursor: pointer;
  text-align: center;
}

.cms-jobs-more:hover {
  opacity: 0.7;
}

/* 新闻列表分页:2026-08-26 起**复用上游那组按钮**(.cbcn-news-btn),不再 append 我方的一套 ——
 * 之前页面上同时有两个翻页控件:我方那个能用但样式自己写,上游那组好看却没有任何行为。
 * 上游已有 .cbcn-news-btn 的完整样式(圆形按钮),我们只补两件它没有的事:
 * 当前页不可点、到头的箭头置灰。 */
.cbcn-news-btnlist .cbcn-news-btn[aria-current='page'] {
  opacity: 0.5;
  pointer-events: none;
}

.cbcn-news-btnlist .cbcn-news-btn[aria-disabled='true'] {
  opacity: 0.35;
  pointer-events: none;
}

/* ── 语言切换 ────────────────────────────────────────────────
 * 上游 header 没有语言切换控件(设计稿漏项),节点由生成器注入。
 *
 * 2026-08-26 起它是 #headernav 里【和其它导航项同构】的一项
 * (a > li.cbcn-b2 > span),字号、间距、深浅两态、hover、移动端展开态
 * 全部继承上游导航自己的样式 —— 这里不再写任何几何/颜色规则。
 *
 * 之前是一个自带 float / 绝对定位 / 断点的独立节点:等于在上游导航旁边
 * 平行维护第二套样式,每次上游改 header 都要跟着对一遍,而且总差一点。
 */
/* ────────────────────────────────────────────────────────────────
 * model.html 底部 explore 的三个平台按钮:给一个最小宽度
 *
 * 上游 `.cbcn-explore-btn { width: 10.05rem; height: 48px; overflow: hidden }`——
 * **宽度跟着视口缩(html font-size 是 1.04166vw),高度写死 48px**。窗口一窄,
 * 容器就变得又扁又窄,里面 `object-fit: cover` 的 logo 被横向裁掉一截
 * (Hugging Face 只剩半个词)。实测上游站:1920 视口 201x48、1440 视口 151x48。
 *
 * 这是上游 CSS 自身的取舍,不是我们改坏的(2026-08-25 逐字节比对过 HTML/CSS/图片)。
 * 但窄窗口下确实难看,所以给个下限兜住。
 *
 * ⚠️ 写在这里而不是改 `css/cbcn-pc-model.css`:**我方对上游文件零修改**,
 * 否则每次上游同步都要重新确认一遍这处改动还在不在(见 UPSTREAM.md §四/§五)。
 * media 条件必须跟上游那段一致(≥1024px),否则会打到移动端版式上。
 * ──────────────────────────────────────────────────────────────── */
@media screen and (min-width: 1024px) {
  .cbcn-explore-btn {
    min-width: 180px;
  }
}

/* ── 职位申请页的简历上传框 ────────────────────────────────────
 * apply.html 是我方新增页面,表单其余部分复用上游 .cbcn-contact-* 的样式;
 * 只有文件选择框上游没有,补在这里。原生 <input type=file> 各浏览器长得都不一样,
 * 藏起来用 label 包一层,外观与 .cbcn-contact-input 对齐。
 */
/* 简历上传:画成一个看得出能点的框。
 *
 * 原来是「底部一条下划线 + 75% 透明度的灰字」,和上面几个输入框的样式一致——
 * 但输入框是"往里打字"的,这个是"点一下选文件"的,长一样等于没提示。
 * 2026-08-26 用户反馈「没有上传附件的地方」:控件一直在、也可见(613×46),
 * 就是没人看得出它能点。改成虚线框 + 回形针图标 + 悬停变主题色。 */
.cms-apply-file {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  cursor: pointer;
  border: 1px dashed rgba(0, 0, 0, 0.28);
  border-radius: 8px;
  padding: 14px 16px;
  opacity: 1;
  transition: border-color 0.2s, color 0.2s, background-color 0.2s;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cms-apply-file::before {
  /* 回形针:用 CSS 画,不引第三方图标库,也不新增一次图片请求 */
  content: '';
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  background-color: currentColor;
  -webkit-mask: var(--cms-clip) center / contain no-repeat;
  mask: var(--cms-clip) center / contain no-repeat;
}

.cms-apply-file:hover {
  border-color: #ff5b00;
  color: #ff5b00;
  background-color: rgba(255, 91, 0, 0.04);
}

/* 选好文件之后:实线 + 主题色,和"还没选"一眼能分开 */
.cms-apply-file.cms-has-file {
  border-style: solid;
  border-color: #ff5b00;
  color: #ff5b00;
}

:root {
  --cms-clip: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48'/%3E%3C/svg%3E");
}

/* ────────────────────────────────────────────────────────────────
 * 页脚社交图标:我方把上游写死的内联 svg 换成了 <img class="cms-icon">(图标归后台管),
 * 但上游的尺寸规则是写给 svg 的:
 *
 *   #mainfootericonlist li svg { width: 1.2rem; height: 1.2rem }
 *
 * 换成 img 之后这条不再命中 —— 而 img 走 data-cbcn-src 懒加载,**加载前宽高是 0**,
 * 包在外面的 <a> 也就是 0×0,点不着(2026-08-26 用户反馈「社交媒体无法点击跳转」)。
 *
 * 上游的真实规则(cbcn-base.css,2026-08-27 重核):
 *   PC(min-width:1024)—— **没有尺寸规则**,svg 按自身 width/height 属性渲染(15~19px,逐个不同);
 *   移动(max-width:1023)—— li svg { width:1.2rem; height:1.2rem }。
 * 此前这里把两个断点写反了(PC 1.2rem / 移动 24px),PC 端 1.2rem 按上游的 rem 缩放算出来
 * 比原始图标大一圈,间距也跟着摊开(2026-08-27 用户对比截图反馈)。
 *
 * 运营上传的 6 个 svg 就是上游图标原件,自带 width/height 属性 —— PC 端不写尺寸、
 * 按图片固有尺寸渲染,与上游逐像素一致。只留一个 max 上限兜「传了无固有尺寸的图」
 * 这种脏数据(svg 无 width/height 时 <img> 会按 300px 默认宽渲染)。
 * ──────────────────────────────────────────────────────────────── */
#mainfootericonlist li .cms-icon {
  display: block;
  object-fit: contain;
  max-width: 2rem;
  max-height: 2rem;
}

#mainfootericonlist li > a {
  /* <a> 默认 inline,高度会被行高影响;设成 block 让它严丝合缝包住图标,点击区域就是图标本身 */
  display: block;
}

/* 垂直对齐(2026-08-27 用户反馈「上下没居中」):
 * 上游的 svg 是 inline,同一行盒里按基线对齐 —— 6 个高度不一(14~19px)的图标**底边齐平**,
 * 且行盒(≈1.4rem)让图标比行顶低一点。我们的 img 是 block(有链接 a>img、没链接裸 img,
 * 结构还不一样),全部变成顶对齐,底边参差。
 * 复刻上游几何:ul 是 flex(cbcn-pc-flexRow),flex-end 让每个 li 底对齐(li 内部结构无关);
 * min-height 恢复上游的行盒占位;padding-bottom 0.3rem 是基线到行底的下伸部,
 * 上游图标底边就停在这个位置(2026-08-27 逐像素量过:img bottom = ul bottom - 0.3rem)。 */
/* 2026-09-16 用户反馈「图标不一致」:B 站、小红书两个位后台没配图标,保留的是上游内联 svg(22 / 36px),
 * inline svg 在块级 <a> 里按基线排,底下多出行高下伸部,而且 36px 的小红书盒子比其它 14~19px 的图标高一截
 * —— 底对齐时这两个明显偏上。改成整行垂直居中,svg 也变 block 去掉基线间隙。 */
#mainfootericonlist li svg {
  display: block;
}

#mainfootericonlist {
  align-items: center;
  min-height: 1.4rem;
  padding-bottom: 0.3rem;
  box-sizing: border-box;
}

@media screen and (max-width: 1023px) {
  #mainfootericonlist li .cms-icon {
    width: 1.2rem;
    height: 1.2rem;
  }
}

/* 中文页脚右列不塌(2026-08-27 用户反馈「右侧导航整体靠右」):
 * 上游 footer 右列没有宽度规则 —— 列宽完全由**底行内容的自然宽度**撑出来
 * (邮箱 + 三链接 + 版权,space-between),wrapper 又是 space-between,列右锚定。
 * 英文内容撑出 ≈60.1rem,我们的 en 页与上游逐像素一致;中文「开源社区/文档中心/隐私政策」
 * 和中文版权比英文窄 ≈17rem,右列整体收窄 → 01-05 导航列表被推右 ≈286px(1920 实测)。
 * 给 zh 补一个与 en 实测等值的 min-width:1rem = vw/96,en 内容宽随字号同比缩放,
 * 主流桌面宽度下与 en 对齐(1440 处约差 3rem,远小于原来的 14rem)。
 * en 页不受影响(它的内容宽 ≥ 这个下限);备案号恢复后底行变宽,自然覆盖此下限。 */
@media screen and (min-width: 1024px) {
  html[lang="zh-CN"] .cbcn-mainfooter-right {
    min-width: 60.1rem;
  }
}

/* ── 新闻详情页翻页按钮的箭头(移动端)────────────────────────
 * 上游那两个箭头是写死尺寸的内联 svg:`width="13" height="60"`。
 * PC 的胶囊高 62px,60px 的箭头正好落在里面;移动端胶囊是 `3.1rem`(≈31px),
 * 而 svg 的 height 属性还是 60px —— 箭头比按钮还高,上下都戳出去(用户 2026-08-26 反馈)。
 * 上游的移动端块里只写了 `svg { position: relative }`,没有跟着改尺寸。
 *
 * 这里按上游自己在 PC 上的比例(箭头 ≈ 胶囊高)给移动端补一个高度。
 * media 条件抄上游那段(max-width: 1023px),不自己发明断点。
 * 已记进 internal/client/upstream-feedback.md,正解是他们在上游改。
 * ──────────────────────────────────────────────────────────── */
@media screen and (max-width: 1023px) {
  .cbcn-pagebtn-section a svg {
    height: 3.1rem;
  }
}

/* ────────────────────────────────────────────────────────────────
 * 未改版页面的移动端版式兜底(2026-08-26 首版,2026-08-27 收窄)
 *
 * 上游的改版是**按页推进**的:model 页 2026-08-27 已从线上站同步到新版
 * (cbcn-pc-model.css 自带 max-width:1023px 移动端块,本段对它退场),
 * 而 edp / index / productivity 还是旧版 —— 这三页的 `.cbcn-title-section` /
 * `.cbcn-explore-*` 在上游 CSS 里仍然一条移动端规则都没有,手机上是裸的。
 *
 * 兜底只打在"上游还没接管"的页面上,作用域靠生成器注入的 body[data-cms-page]
 * (explore 区几页共用同一套类名,CSS 按类名区分不了页面)。
 * 上游哪天给这几页出了自己的移动端,把对应页的选择器从这里摘掉即可。
 * 2026-08-26 首版里的 `.cbcn-series-*` 规则已随 model 同步整块删除。
 *
 * 写法一律抄上游自己在移动端的约定:rem、左右留白 1.5rem(= .cbcn-wap-safeRow)、
 * 圆角 1.5rem、字号交给 .cbcn-h1/.cbcn-b1 这些既有的排版类,不自己发明数值。
 * media 条件用上游那套断点(max-width: 1023px),不新造断点。
 * ──────────────────────────────────────────────────────────────── */
@media screen and (max-width: 1023px) {
  /* ── title:edp 那条(2026-08-26 加)已随上游 2026-09-02 删掉整个 .cbcn-title-section 而退场;
   * model 的由上游自己接管。现在没有页面还需要这段兜底。 ── */

  /* ── explore(index / productivity):PC 是一张浅灰大卡,移动端纵向排 ──
   * model 的 explore 上游已有移动端规则(绝对定位版式),与这套流式版式互斥,
   * 靠 body 标记隔离。 */
  body[data-cms-page="index"] .cbcn-explore-section,
  body[data-cms-page="productivity"] .cbcn-explore-section {
    padding: 3rem 1.5rem 3.5rem;
  }

  body[data-cms-page="index"] .cbcn-explore-item,
  body[data-cms-page="productivity"] .cbcn-explore-item {
    overflow: hidden;
    border-radius: 1.5rem;
    background: #F5F5F5;
    padding: 2rem 1.5rem 2.2rem;
  }

  body[data-cms-page="index"] .cbcn-explore-btnlist,
  body[data-cms-page="productivity"] .cbcn-explore-btnlist {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.8rem;
    margin-top: 1.6rem;
  }

  body[data-cms-page="index"] .cbcn-explore-morebtn,
  body[data-cms-page="productivity"] .cbcn-explore-morebtn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
  }

  body[data-cms-page="index"] .cbcn-explore-btn,
  body[data-cms-page="productivity"] .cbcn-explore-btn {
    width: auto;
    height: 3.4rem;
    padding: 0 1.2rem;
    display: inline-flex;
    align-items: center;
  }

  body[data-cms-page="index"] .cbcn-explore-btn img,
  body[data-cms-page="productivity"] .cbcn-explore-btn img {
    height: 1.8rem;
    width: auto;
    object-fit: contain;  /* PC 是 cover + 定宽,移动端定高,logo 不裁 */
  }
}

/* ────────────────────────────────────────────────────────────────
 * 窄桌面(1024–1365)下的顶部导航:别让它掉到 logo 下面一行
 *
 * 上游 header 是一行 float 布局:logo 左、#headerbtn(Get a Quote)右、#headernav 挤中间。
 * 尺寸用的是 vw 基准的 rem(1rem = 1.04166vw),但 logo 是写死的 195px、
 * #headerbtn 是写死的 144px —— 视口一窄,只有中间那段跟着缩,两头不缩。
 * 实测 1024px:logo 与按钮之间只剩 608px,而导航要 675px → float 换行,
 * 整条导航掉到 logo 下面(用户 2026-08-26 反馈「好多地方缩放会出问题」)。
 *
 * 这一处**上游自己就在临界点上**(不算我们加的语言切换也只差 2px),
 * 我们把语言项并进导航之后就越线了。按等比缩放的思路补偿:在会换行的那段宽度里
 * 把导航项的左右内边距和按钮外边距收一点,1366 以上恢复上游原值。
 * 数值只收不放,不改字号、不改高度,悬停展开的二级面板不受影响。
 * ──────────────────────────────────────────────────────────────── */
@media screen and (min-width: 1024px) and (max-width: 1365px) {
  #headernav li {
    padding: 0 1.15rem;   /* 上游 1.75rem */
  }

  #headerbtn {
    margin-left: 1.6rem;  /* 上游 3rem */
    margin-right: 1.2rem; /* 上游 2rem */
  }
}

/* 2026-10-21 右上角「产品商城」：上游把购物车图标钉在 left:17px、文字钉在 right:17px，
   按钮宽写死 144px（按英文 Get a Quote 留的）。中文四字只有 56px，文字贴在右侧，
   左侧空出约 70px。改成图标和文字成组居中，左右留白相等；宽度随文案走，英文长文案同样两侧等距。 */
@media screen and (min-width: 1024px) {
  #headerbtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    padding: 0 16px;
    gap: 8px;
    box-sizing: border-box;
  }

  #headerbtn svg,
  #headerbtn span {
    position: static;
    top: auto;
    right: auto;
    left: auto;
  }

  #headerbtn span {
    line-height: 1;
  }
}

/* 手机菜单里的同一颗按钮：只在菜单打开时改布局，避免把它从 display:none 里放出来。 */
@media screen and (max-width: 1023px) {
  #mainheader.active #headerbtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    padding: 0 1.1rem;
    gap: 0.45rem;
    box-sizing: border-box;
  }

  #mainheader.active #headerbtn svg,
  #mainheader.active #headerbtn span {
    position: static;
    top: auto;
    right: auto;
    left: auto;
  }

  #mainheader.active #headerbtn span {
    line-height: 1;
  }
}

/* 新闻头图换成视频后按片子比例显示。桌面 .cbcn-pc-fix 是 100vh + overflow:hidden，
   1920x700 的片子若再 cover 会裁掉左右。有视频时放开定高，整段画面都留在首屏里。 */
body[data-cms-page="news"] .cbcn-kv-section:has(video.cover) {
  height: auto;
  overflow: hidden;
}

body[data-cms-page="news"] .cbcn-kv-section video.cover {
  width: 100%;
  height: auto;
}

/* ────────────────────────────────────────────────────────────────
 * 职位卡正文(后台富文本 descriptionHtml)的字重与颜色 —— 客户 0915「岗位字体太实了」
 *
 * 上游模板这一位是 <p class="cbcn-b1 grey cbcn-jobs-desc">,我们注入的是带 <p><ul><li> 的富文本。
 * p 里不能嵌块级元素,浏览器解析时把 p 提前闭合,<ul> 与内层 <p> 变成 .cbcn-jobs-item 的直接子元素,
 * 丢了 grey —— 于是正文是纯黑,strong 小标题也是粗黑,整块看着「太实」。这里把它们拉回上游正文的灰色。
 *
 * 2026-09-16 客户「招聘字号太大了,颜色浅一些」:同一个原因也丢了 .cbcn-b1 的字号,正文继承 body 的 20px
 * (上游 cbcn-b1 是 PC 16px / 移动端 1rem)。字号按 cbcn-b1 补回,颜色取上游 .wt .grey 的 0.5,小标题比正文深一档。
 * ──────────────────────────────────────────────────────────────── */
.cbcn-jobs-item > ul,
.cbcn-jobs-item > ol,
.cbcn-jobs-item > p:not(.pcab) {
  color: rgba(0, 0, 0, 0.5);
  font-weight: 400;
  line-height: 1.6;
}

.cbcn-jobs-item strong {
  font-weight: 500;
  color: rgba(0, 0, 0, 0.65);
}

@media screen and (min-width: 1024px) {
  .cbcn-jobs-item > ul,
  .cbcn-jobs-item > ol,
  .cbcn-jobs-item > p:not(.pcab) {
    font-size: 16px;
  }
}

@media screen and (max-width: 1023px) {
  .cbcn-jobs-item > ul,
  .cbcn-jobs-item > ol,
  .cbcn-jobs-item > p:not(.pcab) {
    font-size: 1rem;
  }
}

/* 高管简介(leadership):后台 bioHtml 自带 <p> 分段,注进上游的 p.cbcn-b1.grey 以后,浏览器遇到内层 <p>
   会把外层 p 提前闭合 —— 段落落成 slide 下的兄弟节点,丢了 grey 与 cbcn-b1,显示成黑字(Figma 9-28「文字改灰色」)。
   这里按上游那两个类的取值补回:颜色 = .wt .grey,字号 = .cbcn-b1 的 PC / 移动端两档。 */
.wt .cbcn-leadership-desc > p {
  color: rgba(0, 0, 0, 0.5);
  font-weight: 400;
  line-height: normal;
}

@media screen and (min-width: 1024px) {
  .cbcn-leadership-desc > p {
    font-size: 16px;
  }
}

@media screen and (max-width: 1023px) {
  .cbcn-leadership-desc > p {
    font-size: 1rem;
  }
}

/* 参数块产品 logo(product1 / product3)移动端高度:上游 a966981(2026-09-28)把我方回提的 logo 样式搬进正文时
   只搬了 PC 档,移动端那段没跟过去,img 按原图尺寸(594×78 / 442×72)撑出视口。取值同原回提块。 */
@media screen and (max-width: 1023px) {
  .cbcn-param-logo {
    display: block;
    width: auto;
    height: 1.8rem;
    margin-bottom: 1.8rem;
    padding-bottom: 0;
  }
}

/* 公司页发展历程(PC):中文站月份与说明字号 18px → 20px(客户 2026-09-29「每个月份的小字稍微大两个字号」)。
   只放中文:英文句子长,同样调到 1rem 时 2026 那屏(6 条)在 1920×1080 / 1440×900 / 1366×768 都会压到翻页按钮(实测),
   英文保持上游的 0.9rem。上游只有英文模板、没有中文站,所以这条留在我方,不回提。 */
@media screen and (min-width: 1024px) {
  html[lang="zh-CN"] .cbcn-history-month,
  html[lang="zh-CN"] .cbcn-history-desc {
    font-size: 1rem;
  }
}

/* 首屏文字移动端定位:上游 f72a5ed(2026-10-09「kv 样式改组件样式」)把 company / developer / index / jobs / model / productivity
   六页的 .cbcn-kv-txt 改名 .cbcn-mainkv-txt,PC 定位收进 cbcn-common-pc.css(min-width: 1024px),
   但各页 max-width: 1023px 段里的 .cbcn-kv-txt 规则没跟着改名 —— 手机上首屏文字失去绝对定位、掉出图外。
   取值逐页照抄上游那几条旧规则(选择器换名,数值不动)。上游补上移动端后整段删掉。 */
@media screen and (max-width: 1023px) {
  .cbcn-mainkv-txt {
    position: absolute;
    left: 1.5rem;
  }

  body[data-cms-page="company"] .cbcn-mainkv-txt {
    bottom: 3.6rem;
  }

  body[data-cms-page="index"] .cbcn-mainkv-txt {
    bottom: 1.5rem;
  }

  body[data-cms-page="developer"] .cbcn-mainkv-txt,
  body[data-cms-page="productivity"] .cbcn-mainkv-txt {
    bottom: 3.4rem;
  }

  body[data-cms-page="jobs"] .cbcn-mainkv-txt,
  body[data-cms-page="model"] .cbcn-mainkv-txt {
    bottom: 2.25rem;
    left: 0;
    padding: 0 1.5rem;
  }

  body[data-cms-page="model"] .cbcn-mainkv-txt {
    width: 100%;
  }
}

/* 首页科研方案卡：当前 CMS 图片仍指向旧素材，临时显示上游新版科研头图。
   仅匹配旧 media URL；后台换成其他图片后此规则自动失效。 */
.cbcn-solution-section .cbcn-solution-item:first-child
  .cbcn-solution-imgdiv[style*="03f8754a-2ff9-4989-b28d-10a061cee2a8.png"] {
  background-image: url("/images/pc/index/solution1.png") !important;
}

/* 新闻富文本：普通回车按段落留 20px；图片段落及标题继续沿用原版式。 */
body[data-cms-page="newsdetail"] .cbcn-detail-content p:not(:has(img, video, iframe)) {
  margin-top: 20px;
  margin-bottom: 0;
}

.cbcn-contact-form > .cms-formtip { text-align: center; width: 100%; }
.cbcn-contact-form > .cms-formtip-success { margin-top: 20px; color: #000; }

/* 2026-10-15: 中文公司介绍跟随本地历程正文 1rem，英文沿用上游 0.9rem。 */
@media screen and (min-width: 1024px) {
  html[lang="zh-CN"] .cbcn-philosophy-p2 { font-size: 1rem; }
}

/* 新闻头图标题与公共主标题一致；覆盖上游移动端的 1.5rem。 */
@media screen and (max-width: 1023px) {
  body[data-cms-page="news"] .cbcn-kv-p2 {
    font-size: 2rem;
  }
}

/* ────────────────────────────────────────────────────────────────
   2026-10-17 微信反馈（乐佩 10-16）样式项
   ──────────────────────────────────────────────────────────────── */

/* 英文站 logo 不带中文「星海图」：页头 / 页脚是内联 svg（viewBox 188×57 / 143×43），下半部是中文字形，
   英文站按上半部裁掉；页头下移让英文字标回到原来的垂直中心，页脚收回被裁掉的那块空白。 */
html[lang="en"] #headerlogo {
  clip-path: inset(0 0 49% 0);
  transform: translateY(23%);
}
html[lang="en"] #mainfooterlogo {
  clip-path: inset(0 0 49% 0);
  margin-bottom: -21px;
}

/* 新闻详情长标题：两侧留白，不顶到页边（PC）。 */
@media screen and (min-width: 1024px) {
  body[data-cms-page="newsdetail"] .cbcn-kv-p2 {
    max-width: 72%;
    margin-left: auto;
    margin-right: auto;
  }
}

/* 新闻页头图下小字。2026-10-19 字号对齐公司 / 招聘页首屏副标（PC 1.7rem）。
   2026-10-21 头图换回视频，标题和副标改白。主题 class 同时改回 bk。
   片子左半是浅灰线稿，白字加淡黑阴影，否则贴在灰底上看不清。 */
body[data-cms-page="news"] .cbcn-kv-p2,
body[data-cms-page="news"] .cbcn-kv-p3 {
  color: #fff;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45), 0 0 18px rgba(0, 0, 0, 0.35);
}
body[data-cms-page="news"] .cbcn-kv-p3 {
  margin-top: 0;
}
@media screen and (min-width: 1024px) {
  body[data-cms-page="news"] .cbcn-kv-p3 {
    font-size: 1.7rem;
  }
}
/* 2026-10-19 头图换 Figma 机器人群像（V97，3840×1552，机器人在右 58%）：首屏满屏 cover，上游按水平居中裁，
   1440×900 下左侧留白被裁掉、标题压到机器人腿上。改按 35% 裁：左下文字不压图，三个机器人都还在画面里。 */
@media screen and (min-width: 1024px) {
  body[data-cms-page="news"] #cbcn-dom-container .cbcn-kv-section img {
    object-position: 35% top;
  }
  /* 小字放到 1.7rem 后英文一行约 900px，会压到机器人；限宽折成两行（中文仍一行）。 */
  body[data-cms-page="news"] .cbcn-kv-p3 {
    max-width: 36rem;
  }
}
/* 手机端英文小字较长，右侧留出与左侧相同的边距，不顶到屏幕边。
   2026-10-21 白字之后去掉浅色头图用的白描边。 */
@media screen and (max-width: 1023px) {
  body[data-cms-page="news"] .cbcn-kv-txt {
    right: 1.5rem;
  }
}

/* 生产力页底部 CTA 按钮：文案变长（咨询解决方案 / Inquire About Solutions），不再用上游写死的 7.4rem 宽。 */
@media screen and (min-width: 1024px) {
  body[data-cms-page="productivity"] .cbcn-explore-morebtn {
    width: auto;
    min-width: 7.4rem;
    padding: 0 1.4rem;
  }
}

/* 橙色按钮点击后不出浏览器默认蓝色焦点圈；键盘 Tab 仍保留可见焦点。 */
.cbcn-links-morebtn:focus,
.cbcn-explore-morebtn:focus {
  outline: none;
}
.cbcn-links-morebtn:focus-visible,
.cbcn-explore-morebtn:focus-visible {
  outline: 2px solid #FF5B00;
  outline-offset: 3px;
}

/* 2026-10-19 客户「productivitydetail 正文白底」：正文 section 由 mapping 换成 wt，
   这里盖掉上游的黑色渐变背景、半透明白数据卡，以及手机端写死的白色正文。 */
body[data-cms-page="productivitydetail"] .cbcn-detail-section {
  background: #fff;
}
body[data-cms-page="productivitydetail"] .cbcn-detail-card {
  background: #F2F2F2;
  backdrop-filter: none;
}
@media screen and (max-width: 1023px) {
  body[data-cms-page="productivitydetail"] .cbcn-detail-section p:not(.grey) {
    color: #000;
  }
}

/* 2026-10-19 客户「生产力解决方案的 logo 都更新了大小，间距保持统一」（Figma 10-16 `8748:813`）：
   logo 换成按设计坐标导出的同高透明图（V99：设计高度带 63px，logo 视觉高约 44px，宽度随 logo），
   改为定高、宽度自适应、统一间距（设计 110px，按 1920 设计稿 = 5.5rem；手机端按同比例）。
   跑马灯是两份列表平移 -50%，宽度改 max-content 才能无缝循环。 */
body[data-cms-page="productivity"] .cbcn-partner-list {
  width: max-content;
}
body[data-cms-page="productivity"] .cbcn-partner-item {
  width: auto;
  height: 3.15rem;
  margin-right: 5.5rem;
}
body[data-cms-page="productivity"] .cbcn-partner-item img {
  width: auto;
  height: 100%;
}
@media screen and (max-width: 1023px) {
  body[data-cms-page="productivity"] .cbcn-partner-item {
    height: 3.2rem;
    margin-right: 5.6rem;
  }
}
/* 上游入场动画 .showA 初始 top:50px + opacity:0，外层 .cbcn-partner-listdiv 是 overflow:hidden、高度 = logo 高（约 47px），
   下移 50px 后列表被整排裁掉 → 懒加载与入场动画都判定不可见，logo 永远不出来（原方框 168px 高时只裁一截所以没事）。
   这一排取消位移，只保留淡入。 */
body[data-cms-page="productivity"] .cbcn-partner-list.showA,
body[data-cms-page="productivity"] .cbcn-partner-p1.showA {
  top: 0;
}

/* ────────────────────────────────────────────────────────────────
   2026-10-20 微信反馈（乐佩 10-20，「今晚改完我确认」）样式项
   ──────────────────────────────────────────────────────────────── */

/* EDP「Covering the Full Embodied AI Development Workflow」四行（「严重乱码」那处）：
   上游每行是 flex 行 = 图标 + 标题（同一个 p.cbcn-h5）| 说明，说明 line-height 4.4rem 只容一行。
   英文说明比中文长，说明把标题那格挤窄，标题被折到图标下面、压到下一行上。
   标题格不收缩、说明格吃剩余宽度并可两行，行内垂直居中。 */
@media screen and (min-width: 1024px) {
  body[data-cms-page="edp"] .cbcn-harder-item {
    align-items: center;
  }
  body[data-cms-page="edp"] .cbcn-harder-item > p.cbcn-h5 {
    flex: 0 0 12rem;
    white-space: nowrap;
    line-height: normal;
  }
  body[data-cms-page="edp"] .cbcn-harder-item > p.cbcn-harder-item-p2 {
    flex: 1 1 0;
    min-width: 0;
    line-height: 1.5;
  }
}

/* 教育科研方案页 Empowering Developer Innovation 四张卡（客户「标题一行统一，放不下就缩字号」）：
   英文卡片标题 1.2rem 在 237px 宽里折成两行，各卡说明起点不齐；缩到 1.1rem 不换行（最长那条 230px）。 */
@media screen and (min-width: 1024px) {
  html[lang="en"] .cbcn-innovation-item-p1 {
    font-size: 1.1rem;
    white-space: nowrap;
  }
}

/* R1 两屏（「主标题和副标题间距也有点太紧」）：副文案离标题 10px → 1.5rem，并收窄成两行左右的段落。 */
@media screen and (min-width: 1024px) {
  body[data-cms-page="product2"] .cbcn-ai-p2,
  body[data-cms-page="product2"] .cbcn-construction-p3 {
    margin-top: 1.5rem;
    max-width: 42rem;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (max-width: 1023px) {
  body[data-cms-page="product2"] .cbcn-ai-p2,
  body[data-cms-page="product2"] .cbcn-construction-p3 {
    margin-top: 1.5rem;
  }
}

/* 中文联系表单「姓」「名」合并为「姓名」（客户 10-20）：第一格占位由 V101 改为「姓名*」，
   第二格（名）中文站隐藏；后端 lastName 本来就不必填，英文站保留 First Name / Last Name。 */
html[lang="zh-CN"] .cbcn-contact-typelist + .cbcn-contact-input + .cbcn-contact-input {
  display: none;
}

/* 新闻详情正文（「间距、行间距、两侧的间距、图片大小排版不好看」）：
   上游 676px 窄栏 + 20px 字 + 30px 行高，字大行密；图片上方 121px 空白。
   PC 改 860px 栏宽、17px 字、1.85 行高，段距 1.1em，图片上下 40px。 */
@media screen and (min-width: 1024px) {
  body[data-cms-page="newsdetail"] .cbcn-detail-content {
    width: min(860px, 72vw);
  }
  body[data-cms-page="newsdetail"] .cbcn-detail-section p,
  body[data-cms-page="newsdetail"] .cbcn-detail-section li {
    font-size: 17px;
    line-height: 1.85;
  }
  body[data-cms-page="newsdetail"] .cbcn-detail-content p:not(:has(img, video, iframe)) {
    margin-top: 1.1em;
  }
  body[data-cms-page="newsdetail"] .cbcn-detail-section img {
    margin-top: 40px;
    margin-bottom: 8px;
    border-radius: 16px;
  }
  body[data-cms-page="newsdetail"] .cbcn-detail-section img:first-child {
    margin-top: 0;
  }
  body[data-cms-page="newsdetail"] .cbcn-detail-content h2 {
    margin-top: 48px;
    line-height: 1.4;
  }
}

/* 新闻详情上下篇（「为啥这个空格太大」）：按钮 188px 宽、箭头和字分在两头；两颗按钮又分在页面最两边。
   按钮按内容收紧、箭头贴字；两颗按钮与正文栏对齐；上下留白收小。 */
@media screen and (min-width: 1024px) {
  body[data-cms-page="newsdetail"] .cbcn-pagebtn-section {
    padding-top: 72px;
    padding-bottom: 120px;
  }
  body[data-cms-page="newsdetail"] .cbcn-pagebtn-section > div {
    width: min(860px, 72vw);
    margin: 0 auto;
  }
  body[data-cms-page="newsdetail"] .cbcn-pagebtn-section a {
    width: auto;
    min-width: 132px;
    padding: 0 28px;
    justify-content: center;
    gap: 12px;
  }
}

/* 隐私政策（「现在是字大、间距小，就不舒展；两边的宽间距可以更小一些」）：
   上游 676px 栏 + 18px 字 + 30px 行高、段间无距。PC 栏宽 960px、16px 字、1.9 行高、段距 0.9em，小标题加粗留白。 */
@media screen and (min-width: 1024px) {
  body[data-cms-page="policy"] .cbcn-detail-content {
    width: min(960px, 76vw);
  }
  body[data-cms-page="policy"] .cbcn-detail-section p {
    font-size: 16px;
    line-height: 1.9;
    margin-top: 0.9em;
  }
}

/* EDP 工作流四行（手机端）：上游每行定高 4.4rem、单行行高，英文说明折行后溢出、几行文字叠在一起
   （v0.1.108 上线后手机实测发现，客户说的「严重乱码」很可能是这一版）。改成「图标 + 标题」一行、说明在下、行高自适应。 */
@media screen and (max-width: 1023px) {
  body[data-cms-page="edp"] .cbcn-harder-item {
    height: auto;
    min-height: 4.4rem;
    flex-direction: column !important;
    align-items: flex-start;
    justify-content: center;
    padding: 1.2rem 0;
  }
  body[data-cms-page="edp"] .cbcn-harder-item > p {
    line-height: 1.5;
  }
  body[data-cms-page="edp"] .cbcn-harder-item > p.cbcn-h5 {
    display: flex;
    align-items: center;
  }
  body[data-cms-page="edp"] .cbcn-harder-item svg {
    top: 0;
    flex: 0 0 auto;
  }
  body[data-cms-page="edp"] .cbcn-harder-item > p.cbcn-harder-item-p2 {
    margin-top: 0.5rem;
  }
}