/* 企业合作页（/enterprise）。只用 tokens.css 的令牌与 page.css 的网格；线稿规则照图形语言：
   1 px 线、直角、连线只走 0° 与 90°、箭头是 30° 的开口（半角 29.7°）。驻场流程图照 03-foundations/motif/diagrams/fde-flow 的结构重排成网页，文字可选、可换行。 */

/* ---------- 首屏标题：桌面三行、手机四行，按意群断 ---------- */
.fde-hero .t { width: min(100%, 648px); }
.fde-hero h1 .m { display: none; }
@media (max-width: 767px) {
  .fde-hero h1 .d { display: none; }
  .fde-hero h1 .m { display: block; }
}

/* ---------- 驻场流程图 ---------- */
.fm { --gap: var(--space-4); --zone: 144px; --cl: 96px; color: var(--senyu-ink); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--space-1); }
.fm b { display: block; font-weight: var(--w-ui); font-size: var(--fs-body); line-height: 1.4; }
/* 只选直接子元素：zh.js 会给中文里的拉丁字母包 span */
.fm .bx > span, .fm .st > span, .fm .ln > span { display: block; color: var(--senyu-n4); }
.fm em { font-style: normal; font-family: var(--font-mono); font-size: var(--fs-label); letter-spacing: var(--track-mono); color: var(--color-text-2); margin-right: var(--space-0-75); }
.fm .ln { grid-column: 1 / -1; margin-bottom: var(--space-1-5); }
.fm .ln b { font-size: var(--fs-small); }
.fm .ln > span { color: var(--color-text-2); }
.fm .bx, .fm .st { border: 1px solid var(--senyu-ink); padding: var(--space-1-5); }
.fm .bx > span, .fm .st > span { margin-top: var(--space-0-5); }
.fm .v { display: none; }
/* 手机：上排三个框排成三行，名字与说明同一行 */
@media (max-width: 1199px) {
  .fm .bx { grid-column: 1 / -1; display: flex; align-items: baseline; gap: var(--space-1); padding: var(--space-1) var(--space-1-5); }
  .fm .bx + .bx { margin-top: var(--space-1); }
  .fm .bx > span { margin-top: 0; }
}
.fm .cl { grid-column: 1 / -1; position: relative; margin: var(--space-3) 0; padding-bottom: var(--space-1); border-bottom: 1px solid var(--senyu-ink); }
.fm .cl > span { color: var(--senyu-n4); }
.fm .cl > span i { font-style: normal; }
.fm .sts { grid-column: 1 / -1; display: grid; row-gap: var(--gap); }
.fm .st { position: relative; }
.fm .st.on { background: var(--senyu-ink); border-color: var(--senyu-ink); color: var(--senyu-paper); }
.fm .st.on span { color: var(--senyu-n8); }
.fm .st.on em { color: var(--senyu-n7); }
/* 箭头：线是一个伪元素，30° 的开口是另一个（遮罩画出，颜色跟着字色） */
.fm .st:not(:last-child)::before, .fm .st:not(:last-child)::after, .fm .v::before, .fm .v::after { content: ""; position: absolute; background: currentColor; }
.fm .st:not(:last-child)::before { left: 50%; top: 100%; width: 1px; height: var(--gap); }
.fm .st:not(:last-child)::after, .fm .v::after { width: 10px; height: 9px; -webkit-mask: var(--hd) center / 100% 100% no-repeat; mask: var(--hd) center / 100% 100% no-repeat; }
.fm { --hd-dn: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 9'%3E%3Cpath d='M1 1L5 8L9 1' fill='none' stroke='%23000' stroke-width='1.2'/%3E%3C/svg%3E");
  --hd-up: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 9'%3E%3Cpath d='M1 8L5 1L9 8' fill='none' stroke='%23000' stroke-width='1.2'/%3E%3C/svg%3E");
  --hd-rt: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 10'%3E%3Cpath d='M1 1L8 5L1 9' fill='none' stroke='%23000' stroke-width='1.2'/%3E%3C/svg%3E"); }
.fm .st:not(:last-child)::after { --hd: var(--hd-dn); left: calc(50% - 4.5px); top: calc(100% + var(--gap) - 9px); }

@media (min-width: 1200px) {
  .fm { grid-template-columns: minmax(0, 2fr) repeat(5, minmax(0, 3fr)); grid-template-rows: auto var(--zone) auto; column-gap: var(--gap); }
  .fm .ln { grid-column: 1; margin: 0; padding-top: var(--space-1-5); }
  .fm .ln-a { grid-row: 1; }
  .fm .ln-b { grid-row: 3; }
  .fm .bx { grid-row: 1; }
  .fm .bx-eng { grid-column: 2; }
  .fm .bx-prd { grid-column: 4; }
  .fm .bx-map { grid-column: 5; }
  .fm .cl { grid-row: 2; grid-column: 1 / -1; margin: 0; padding: 0; border: 0; }
  .fm .cl::after { content: ""; position: absolute; left: 0; right: 0; top: var(--cl); border-top: 1px solid var(--senyu-ink); }
  /* 图注只占第 3 栏：左右两条竖线（工程师、产品）之间，放不下就换行，底边贴在接触线上方 */
  .fm .cl > span { position: absolute; bottom: calc(100% - var(--cl) + var(--space-1)); left: calc((100% - 5 * var(--gap)) * 5 / 17 + 2 * var(--gap)); width: calc((100% - 5 * var(--gap)) * 3 / 17); text-align: center; }
  .fm .cl > span i { display: block; }
  .fm .v { display: block; position: relative; grid-row: 2; z-index: 1; }
  .fm .v-eng { grid-column: 2; }
  .fm .v-prd { grid-column: 4; }
  .fm .v-map { grid-column: 5; }
  .fm .v::before { left: 50%; top: 0; bottom: 0; width: 1px; }
  .fm .v::after { --hd: var(--hd-dn); left: calc(50% - 4.5px); bottom: 0; }
  .fm .v.up::after { --hd: var(--hd-up); top: 0; bottom: auto; }
  .fm .v > span { font-style: normal; position: absolute; left: calc(50% + var(--space-1)); bottom: calc(100% - var(--cl) + var(--space-1)); white-space: nowrap; color: var(--senyu-n4); }
  .fm .sts { grid-row: 3; grid-column: 2 / -1; grid-template-columns: repeat(5, minmax(0, 1fr)); column-gap: var(--gap); }
  .fm .st:not(:last-child)::before { left: 100%; top: 50%; width: var(--gap); height: 1px; }
  .fm .st:not(:last-child)::after { --hd: var(--hd-rt); width: 9px; height: 10px; left: calc(100% + var(--gap) - 9px); top: calc(50% - 4.5px); }
}

/* ---------- 真实结果：三个数，数是主角 ---------- */
.res { display: grid; grid-template-columns: 1fr; row-gap: var(--space-4); }
.res > div { display: flex; flex-direction: column; padding-top: var(--space-1); border-top: 1px solid var(--senyu-ink); }
.res dd { order: -1; font-size: var(--fs-display); font-weight: var(--w-head); letter-spacing: var(--track-display); line-height: 1.2; font-variant-numeric: tabular-nums; white-space: nowrap; margin-bottom: var(--space-1-5); }
.res dd small { font-size: var(--fs-h3); font-weight: var(--w-ui); letter-spacing: 0; color: var(--color-text-2); margin: 0 var(--space-0-5); }
.res dd small:first-child { margin-left: 0; }
.res dt { color: var(--senyu-n4); }
@media (min-width: 768px) {
  .res { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--grid-gutter); }
}

/* ---------- 企业培训 ---------- */
#training > .r.g { margin-top: var(--space-8); padding-top: var(--space-1); border-top: 1px solid var(--color-border); row-gap: var(--space-2); }
#training .r .k { color: var(--color-text-2); }
#training .b > h3 + * { margin-top: var(--space-2); }
.shi .lede { color: var(--senyu-n4); max-width: 32em; }

/* 势、人、术：一个字是一栏的入口，字号用大数字一档 */
.sr { display: grid; grid-template-columns: 1fr; row-gap: var(--space-4); margin-top: var(--space-6); }
.sr li { display: flex; flex-direction: column; gap: var(--space-1); padding-top: var(--space-2); border-top: 1px solid var(--senyu-ink); }
.sr .ch { font-size: var(--fs-display); font-weight: var(--w-head); line-height: 1; margin-bottom: var(--space-2); }
.sr .q { color: var(--color-text-2); }
.sr .t-small { color: var(--senyu-n4); }
@media (min-width: 768px) {
  .sr { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--grid-gutter); }
}
@media (min-width: 1200px) {
  .sr .ch { font-size: var(--fs-big-1); }
}

/* 术的两类：买得到的退后一档，买不到的是墨色 */
.buy { display: grid; grid-template-columns: 1fr; row-gap: var(--space-4); }
.buy .col { color: var(--color-text-2); }
.buy .col.on { color: var(--senyu-ink); }
.buy ul { border-top: 1px solid var(--color-border); }
.buy .on ul { border-top-color: var(--senyu-ink); }
.buy ul { margin-top: var(--space-1); }
.buy li { display: grid; grid-template-columns: 6.5em 1fr; column-gap: var(--space-1); padding: var(--space-1) 0; border-bottom: 1px solid var(--color-border); }
.buy li b { font-weight: var(--w-ui); }
.buy .col:not(.on) li b { font-weight: var(--w-text); }
.buy li span { color: var(--senyu-n4); }
.buy .col:not(.on) li span { color: var(--color-text-2); }
.buy .mark { margin-top: var(--space-2); font-weight: var(--w-ui); }
@media (min-width: 768px) {
  .buy { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--grid-gutter); }
}