/* About page: visual-first information design. */
.about-main .about-page-hero .page-hero-grid { grid-template-columns: minmax(0, 1.4fr) 430px; gap: 50px; }
.about-main .about-page-hero h1 { max-width: none; font-size: 58px; line-height: 1.12; }
.about-main .about-page-hero h1 em { display: block; }
.about-main .about-page-hero .page-hero-grid > div:first-child > p:last-child { max-width: 690px; }

.about-main .value-path-intro { margin-bottom: 48px; }
.about-main .value-path-intro h2 { max-width: none; white-space: nowrap; line-height: 1.08; }
.about-main .value-path-intro h2 em { margin-left: 12px; }
.about-main .value-path { position: relative; grid-template-columns: minmax(210px, .78fr) 64px minmax(260px, .95fr) 64px minmax(330px, 1.2fr); align-items: end; min-height: 292px; padding-top: 22px; border-top: 1px solid #d8d0c4; }
.about-main .value-path::before,
.about-main .value-path::after { position: absolute; top: -24px; color: #72817c; font-size: 9px; font-weight: 800; }
.about-main .value-path::before { content: "AI 价值升级"; left: 0; }
.about-main .value-path::after { content: "价值密度"; right: 0; }
.about-main .value-path article { grid-template-columns: 46px 1fr; align-content: center; padding: 25px 28px; }
.about-main .value-path-tool { min-height: 118px; background: #e6f0f3 !important; border-color: #79aabe !important; }
.about-main .value-path-process { min-height: 190px; background: #d7ece5 !important; border-color: #9bcfbe !important; }
.about-main .value-path-result { min-height: 262px; }
.about-main .value-path article > svg { width: 30px; }
.about-main .value-path article strong { margin-top: 7px; font-size: 22px; }
.about-main .value-path article b { display: block; margin-top: 12px; color: var(--muted); font-size: 11px; font-weight: 600; line-height: 1.5; }
.about-main .value-path article.value-path-process { grid-template-columns: 52px 1fr; }
.about-main .value-path article.value-path-process > svg { width: 36px; }
.about-main .value-path article.value-path-process > span { font-size: 10px; }
.about-main .value-path article.value-path-process small { font-size: 12px; }
.about-main .value-path article.value-path-process strong { margin-top: 10px; font-size: 29px; }
.about-main .value-path article.value-path-process b { margin-top: 16px; font-size: 12px; }
.about-main .value-path article.value-path-result { grid-template-columns: 58px 1fr; }
.about-main .value-path article.value-path-result > svg { width: 40px; }
.about-main .value-path article.value-path-result > span { font-size: 11px; }
.about-main .value-path article.value-path-result small { font-size: 13px; }
.about-main .value-path article.value-path-result strong { margin-top: 11px; font-size: 34px; }
.about-main .value-path-result b { color: #c4d6d0; }
.about-main .value-path-result .outcome-keywords { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; color: #fff; }
.about-main .value-path-result .outcome-keywords span { display: inline-flex; align-items: center; padding: 7px 10px; color: #fff; background: rgba(239, 91, 42, .9); border: 1px solid rgba(255, 194, 163, .3); font-size: 11px; font-weight: 800; line-height: 1; }
.about-main .value-path-arrow { align-self: end; grid-template-rows: auto auto; align-content: center; gap: 6px; color: #778a84; }
.about-main .value-path-arrow-one { min-height: 154px; }
.about-main .value-path-arrow-two { min-height: 226px; }
.about-main .value-path-arrow span { font-size: 9px; font-weight: 800; white-space: nowrap; }
.about-main .value-path-arrow svg { color: #dd643a; }

.about-main .loop-section-intro { grid-template-columns: 1fr auto; align-items: end; gap: 40px; margin-bottom: 34px; }
.about-main .loop-section-intro h2 { max-width: none; white-space: nowrap; line-height: 1.08; }
.about-main .loop-legend { display: flex; align-items: center; justify-content: flex-end; gap: 20px; padding-bottom: 7px; }
.about-main .loop-legend span { display: inline-flex; align-items: center; gap: 7px; color: #c1d2cd; font-size: 10px; white-space: nowrap; }
.about-main .loop-legend svg { width: 15px; color: #93d9bd; }
.about-main .loop-legend span:nth-child(2) svg { color: #ff9a78; }
.about-main .loop-legend span:nth-child(3) svg { color: #b8a5e0; }
.about-main .operating-loop-board { min-height: 680px; }
.about-main .loop-center { width: 300px; height: 190px; }
.about-main .loop-steps article { width: 190px; min-height: 112px; padding: 14px 14px 13px 53px; }
.about-main .loop-steps h3 { margin-bottom: 6px; }
.about-main .loop-steps p { color: #60716c; font-size: 9px; font-weight: 700; white-space: nowrap; }

.about-main .capability-section { padding: 78px 0 62px; }
.about-main .architecture-intro { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 40px; margin-bottom: 34px; }
.about-main .architecture-intro h2 { max-width: none; white-space: nowrap; }
.about-main .architecture-axis { display: flex; align-items: center; gap: 12px; padding-bottom: 8px; color: var(--ink-soft); }
.about-main .architecture-axis span { font-size: 11px; font-weight: 800; white-space: nowrap; }
.about-main .architecture-axis svg { width: 16px; color: #8b9c96; }
.about-main .architecture-matrix { border-top: 1px solid #b8c6c1; border-bottom: 1px solid #b8c6c1; }
.about-main .architecture-matrix-head,
.about-main .architecture-matrix .capability-band { display: grid; grid-template-columns: 220px 220px minmax(0, 1fr) 270px; gap: 0; }
.about-main .architecture-matrix-head { min-height: 44px; align-items: center; color: #677a74; background: rgba(255,255,255,.34); border-bottom: 1px solid #b8c6c1; }
.about-main .architecture-matrix-head span { padding: 0 20px; font-size: 10px; font-weight: 800; }
.about-main .architecture-matrix .capability-band { padding: 0; border: 0; border-bottom: 1px solid #c4cfcb; }
.about-main .architecture-matrix .capability-band:last-child { border-bottom: 0; }
.about-main .architecture-matrix .capability-band::before { display: none; }
.about-main .architecture-matrix .capability-band > div { min-width: 0; padding: 24px 20px; border-right: 1px solid #c4cfcb; }
.about-main .architecture-matrix .capability-band > div:last-child { border-right: 0; }
.about-main .architecture-level { display: grid; grid-template-columns: 32px 1fr; align-items: center; gap: 12px; }
.about-main .architecture-level > svg { width: 24px; color: #07867f; }
.about-main .architecture-level small,
.about-main .architecture-level strong { display: block; }
.about-main .architecture-level small { color: #6d807a; font-size: 9px; }
.about-main .architecture-level strong { margin-top: 5px; font-size: 22px; }
.about-main .capability-value { display: grid; align-content: center; gap: 8px; }
.about-main .capability-value strong { font-size: 18px; line-height: 1.35; }
.about-main .capability-value span { color: #6c7d78; font-size: 10px; }
.about-main .architecture-matrix .capability-features ul { display: flex; flex-wrap: wrap; align-content: center; gap: 8px; height: 100%; margin: 0; padding: 0; }
.about-main .architecture-matrix .capability-features li { padding: 7px 10px; color: #31514a; background: #dfece8; font-size: 10px; line-height: 1.2; list-style: none; }
.about-main .architecture-matrix .capability-features li::before { display: none; }
.about-main .architecture-matrix .capability-forms { display: flex; flex-wrap: wrap; align-content: center; gap: 8px; }
.about-main .architecture-matrix .capability-forms > div,
.about-main .architecture-matrix .platform-core-grid > div { min-height: 0; padding: 7px 10px; color: #076f6a; background: #dfece8; border: 0; font-size: 10px; font-weight: 800; line-height: 1.2; }
.about-main .architecture-matrix .capability-tool .capability-forms { display: grid; gap: 8px; }
.about-main .architecture-matrix .capability-tool .capability-forms > div { width: 100%; }
.about-main .architecture-matrix .capability-tool .capability-forms strong,
.about-main .architecture-matrix .capability-tool .capability-forms small { display: block; }
.about-main .architecture-matrix .capability-tool .capability-forms small { margin-top: 5px; color: #557069; font-size: 9px; font-weight: 400; line-height: 1.55; }
.about-main .architecture-matrix .capability-band { min-height: 136px; align-items: stretch; }
.about-main .architecture-matrix .capability-features ul,
.about-main .architecture-matrix .capability-forms,
.about-main .architecture-matrix .platform-core-grid { align-content: center; }
.about-main .architecture-matrix .capability-process .architecture-level > svg { color: #d36526; }
.about-main .architecture-matrix .capability-process .capability-features li,
.about-main .architecture-matrix .capability-process .capability-forms > div { color: #b7511d; background: #f4e5da; }
.about-main .architecture-matrix .capability-platform { grid-template-columns: 220px 220px minmax(0, 1fr) 270px; }
.about-main .architecture-matrix .capability-platform .architecture-level > svg { color: #66519b; }
.about-main .architecture-matrix .capability-platform .capability-features li,
.about-main .architecture-matrix .platform-core-grid > div { color: #5c4990; background: #e7e2f1; }
.about-main .architecture-matrix .platform-core-grid { display: flex; flex-wrap: wrap; align-content: center; gap: 8px; height: 100%; }
.about-main .architecture-conclusion { display: flex; align-items: center; gap: 11px; margin-top: 18px; padding: 14px 20px; }
.about-main .architecture-conclusion span { font-weight: 800; white-space: nowrap; }
.about-main .architecture-conclusion svg { width: 15px; color: #91d9bc; }
.about-main .architecture-conclusion strong { margin-left: auto; color: #fff; font-size: 11px; }

.about-main .enterprise-outcome-section .section-intro h2 { max-width: none; white-space: nowrap; }
.about-main .enterprise-outcome-section .section-intro h2 em { margin-left: 10px; }
.about-main .enterprise-outcomes p { font-weight: 700; }

/* Each chapter uses a distinct, restrained palette while keeping the brand colors coherent. */
.about-main .about-page-hero { background: #0c3031; }
.about-main .about-hero-visual { background: #153f40; border-color: rgba(180, 226, 211, .24); }
.about-main .value-path-section { background: #f5f0e8 !important; }
.about-main .value-path article { background: #fffdf9; border-color: #ded6ca; }
.about-main .value-path article.value-path-result { background: #1e4b46; border-color: #1e4b46; }
.about-main .capability-section { background: #edf2f4 !important; }
.about-main .architecture-matrix { border-color: #b8c6cc; }
.about-main .architecture-matrix-head { background: #dde6e9; border-color: #b8c6cc; }
.about-main .architecture-matrix .capability-band { background: rgba(255, 255, 255, .45); border-color: #c2ced2; }
.about-main .architecture-matrix .capability-band > div { border-color: #c2ced2; }
.about-main .architecture-conclusion { background: #203d49; }
.about-main .operating-loop-section { background: #192b37 !important; }
.about-main .operating-loop-board { background: #101e27; border-color: rgba(166, 204, 217, .2); }
.about-main .loop-route-base { stroke: rgba(132, 190, 205, .24); }
.about-main .loop-center { background: #1d3d46; border-color: rgba(137, 211, 208, .34); box-shadow: 0 0 0 16px rgba(29, 61, 70, .4); }
.about-main .dining-loop-section { color: var(--ink); background: #f3ebe2 !important; }
.about-main .dining-loop-intro h2 { color: #182522; }
.about-main .dining-loop-intro > p:not(.eyebrow) { color: #5e6a66; }
.about-main .dining-loop-image { border-color: #d4c5b8; opacity: 1; }
.about-main .dining-value { background: #fff9f3; border-left-color: #d65d36; box-shadow: 0 14px 34px rgba(81, 51, 35, .08); }
.about-main .dining-value > svg { color: #d65d36; }
.about-main .dining-value small { color: #8d6a5c; }
.about-main .dining-value strong { color: #ad4327; }
.about-main .dining-value span { color: #6b625d; }
.about-main .dining-loop-timeline { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid #cdbfb3; border-left: 1px solid #cdbfb3; }
.about-main .dining-loop-timeline article { min-height: 190px; grid-template-columns: 25px 28px minmax(0, 1fr); align-items: start; align-content: start; gap: 10px; padding: 20px 16px; border-right: 1px solid #d4c7bc; border-bottom: 1px solid #d4c7bc; }
.about-main .dining-loop-timeline article:nth-child(7) { grid-column: 1 / -1; min-height: 142px; }
.about-main .dining-loop-timeline article::after { display: none; }
.about-main .dining-loop-timeline article > span,
.about-main .dining-loop-timeline article:nth-child(-n+5) > span { color: #24796c; font-size: 10px; }
.about-main .dining-loop-timeline article > svg { width: 23px; color: #24796c; }
.about-main .dining-loop-timeline article:nth-child(6) > span,
.about-main .dining-loop-timeline article:nth-child(6) > svg { color: #cb5a35; }
.about-main .dining-loop-timeline article:nth-child(7) > span,
.about-main .dining-loop-timeline article:nth-child(7) > svg { color: #70599b; }
.about-main .dining-loop-timeline strong { color: #1c2926; font-size: 15px; line-height: 1.4; }
.about-main .dining-loop-timeline p { color: #68736f; }
.about-main .dining-role-split { display: grid; gap: 6px; margin-top: 9px; }
.about-main .dining-loop-timeline article:nth-child(7) .dining-role-split { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.about-main .dining-role-line { display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: start; gap: 7px; }
.about-main .dining-role-line > b { min-height: 21px; display: inline-flex; align-items: center; justify-content: center; padding: 4px 6px; font-size: 10px; line-height: 1; }
.about-main .dining-role-line > span { color: #4f5e59; font-size: 11px; font-weight: 500; line-height: 1.65; }
.about-main .dining-role-line .role-ai { color: #0b6d62; background: #dbeae5; }
.about-main .dining-role-line .role-human { color: #b84c2c; background: #f5ded2; }
.about-main .enterprise-outcome-section { background: #f1f3f6 !important; }
.about-main .future-capability-panel { background: #1e2c34; }
.about-main .enterprise-outcome-statement { background: #fbfcfd; border-color: #c9d1d5; }

@media (max-width: 1100px) {
  .about-main .about-page-hero .page-hero-grid { grid-template-columns: 1fr; }
  .about-main .about-page-hero h1 { max-width: 760px; font-size: 54px; }
  .about-main .about-hero-visual { width: min(100%, 720px); }
  .about-main .loop-section-intro { grid-template-columns: 1fr; }
  .about-main .loop-legend { justify-content: flex-start; }
  .about-main .architecture-matrix-head,
  .about-main .architecture-matrix .capability-band,
  .about-main .architecture-matrix .capability-platform { grid-template-columns: 180px 190px minmax(0, 1fr) 220px; }
  .about-main .operating-loop-board { min-height: 0; }
  .about-main .loop-steps article { width: auto; min-height: 0; }
  .about-main .loop-steps p { white-space: normal; }
}

@media (max-width: 820px) {
  .about-main .about-page-hero h1 { font-size: 46px; }
  .about-main .value-path-intro h2,
  .about-main .loop-section-intro h2,
  .about-main .architecture-intro h2,
  .about-main .enterprise-outcome-section .section-intro h2 { white-space: normal; }
  .about-main .value-path-intro h2 em,
  .about-main .enterprise-outcome-section .section-intro h2 em { margin-left: 0; }
  .about-main .value-path-intro { margin-bottom: 30px; }
  .about-main .value-path { grid-template-columns: 1fr; min-height: 0; padding-top: 0; border-top: 0; gap: 10px; }
  .about-main .value-path::before,
  .about-main .value-path::after { display: none; }
  .about-main .value-path article { min-height: 138px; }
  .about-main .value-path article.value-path-tool { width: 82%; }
  .about-main .value-path article.value-path-process { width: 91%; min-height: 154px; margin-left: 4.5%; grid-template-columns: 44px 1fr; }
  .about-main .value-path article.value-path-result { width: 100%; min-height: 184px; grid-template-columns: 48px 1fr; }
  .about-main .value-path article.value-path-process > svg { width: 31px; }
  .about-main .value-path article.value-path-process small { font-size: 11px; }
  .about-main .value-path article.value-path-process strong { font-size: 25px; }
  .about-main .value-path article.value-path-process b { margin-top: 12px; font-size: 11px; }
  .about-main .value-path article.value-path-result > svg { width: 34px; }
  .about-main .value-path article.value-path-result small { font-size: 11px; }
  .about-main .value-path article.value-path-result strong { font-size: 29px; }
  .about-main .value-path-result .outcome-keywords { gap: 6px; margin-top: 16px; }
  .about-main .value-path-result .outcome-keywords span { padding: 6px 8px; font-size: 10px; }
  .about-main .value-path-arrow { min-height: 36px; grid-template: 1fr / 1fr auto 1fr; }
  .about-main .value-path-arrow span { align-self: center; justify-self: end; }
  .about-main .value-path-arrow svg { transform: rotate(45deg); }
  .about-main .loop-legend { flex-wrap: wrap; gap: 10px 18px; }
  .about-main .architecture-intro { grid-template-columns: 1fr; }
  .about-main .architecture-axis { padding-bottom: 0; }
  .about-main .architecture-matrix-head { display: none; }
  .about-main .architecture-matrix { display: grid; gap: 14px; border: 0; }
  .about-main .architecture-matrix .capability-band { min-height: 0; }
  .about-main .architecture-matrix .capability-band,
  .about-main .architecture-matrix .capability-platform { grid-template-columns: 1fr 1fr; border: 1px solid #c4cfcb; }
  .about-main .architecture-matrix .capability-band > div { padding: 18px; border-right: 1px solid #c4cfcb; border-bottom: 1px solid #c4cfcb; }
  .about-main .architecture-matrix .capability-band > div:nth-child(2n) { border-right: 0; }
  .about-main .architecture-matrix .capability-band > div:nth-last-child(-n+2) { border-bottom: 0; }
  .about-main .architecture-level { grid-column: 1 / -1; border-right: 0 !important; }
  .about-main .architecture-matrix .capability-band > .architecture-level { border-bottom: 1px solid #c4cfcb; }
  .about-main .architecture-conclusion { flex-wrap: wrap; }
  .about-main .architecture-conclusion strong { width: 100%; margin: 3px 0 0; }
  .about-main .dining-loop-timeline { grid-template-columns: 1fr; border-left: 0; }
  .about-main .dining-loop-timeline article,
  .about-main .dining-loop-timeline article:nth-child(7) { min-height: 0; grid-column: auto; grid-template-columns: 32px 36px minmax(0, 1fr); align-items: center; padding: 18px 0; border-right: 0; }
  .about-main .dining-loop-timeline article:nth-child(7) .dining-role-split { grid-template-columns: 1fr; gap: 6px; }
  .about-main .dining-role-line { grid-template-columns: 38px minmax(0, 1fr); gap: 8px; }
  .about-main .dining-role-line > span { font-size: 11px; }
}

@media (max-width: 560px) {
  .about-main .about-page-hero h1 { font-size: 32px; }
  .about-main .value-path-intro h2,
  .about-main .loop-section-intro h2,
  .about-main .architecture-intro h2,
  .about-main .enterprise-outcome-section .section-intro h2 { font-size: 34px; }
  .about-main .value-path-intro h2 em,
  .about-main .enterprise-outcome-section .section-intro h2 em { display: block; }
  .about-main .value-path article { grid-template-columns: 38px 1fr; padding: 20px; }
  .about-main .value-path-tool { width: 88%; }
  .about-main .value-path-process { width: 94%; margin-left: 3%; }
  .about-main .architecture-axis { gap: 8px; }
  .about-main .architecture-matrix .capability-band,
  .about-main .architecture-matrix .capability-platform { grid-template-columns: 1fr; }
  .about-main .architecture-matrix .capability-band > div { border-right: 0; border-bottom: 1px solid #c4cfcb; }
  .about-main .architecture-matrix .capability-band > div:nth-last-child(-n+2) { border-bottom: 1px solid #c4cfcb; }
  .about-main .architecture-matrix .capability-band > div:last-child { border-bottom: 0; }
  .about-main .architecture-level { grid-column: auto; }
}