.xsh-card-cover-image { position:absolute; z-index:0; inset:0; width:100%; height:100%; object-fit:cover; opacity:.8; filter:saturate(.9); }
.xsh-card-cover::before,.xsh-card-cover::after { z-index:1; }
.xsh-card-cover span,.xsh-card-cover b { z-index:2; }
.xsh-card-content h3,.xsh-card-content p { display:-webkit-box; overflow:hidden; -webkit-box-orient:vertical; }
.xsh-card-content h3 { -webkit-line-clamp:2; }
.xsh-card-content p { -webkit-line-clamp:3; }

/* ONE PLATFORM：与静态交付页保持同一套区块尺寸与视觉参数 */
.xsh-ecosystem-section { padding:72px 0; background:#fff; }
.xsh-ecosystem-section .xsh-section-head { margin-bottom:34px; }
.xsh-ecosystem-section .xsh-section-head-split { display:flex; align-items:end; justify-content:space-between; gap:36px; }
.xsh-ecosystem-section .xsh-section-head h2 { margin:4px 0 0; font-size:clamp(30px,3vw,42px); line-height:1.24; letter-spacing:-1.2px; }
.xsh-ecosystem-section .xsh-section-head p { max-width:700px; margin:13px 0 0; color:var(--xsh-muted); font-size:15px; }
.xsh-ecosystem-section .xsh-section-kicker { color:var(--xsh-blue); font-size:10px; font-weight:900; letter-spacing:1.5px; }
.xsh-ecosystem-section .xsh-text-link { flex:0 0 auto; color:var(--xsh-blue-dark)!important; font-size:13px; font-weight:800; }
.xsh-ecosystem-section .xsh-text-link span { margin-left:5px; }
.xsh-ecosystem-section .xsh-ecosystem-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:17px; }
.xsh-ecosystem-section .xsh-ecosystem-card { min-height:338px; position:relative; overflow:hidden; padding:24px; border:1px solid var(--xsh-line); border-radius:18px; background:linear-gradient(180deg,#fff,#fbfdff); box-shadow:0 8px 25px rgba(28,64,119,.055); transition:transform .22s,border-color .22s,box-shadow .22s; }
.xsh-ecosystem-section .xsh-ecosystem-card::after { content:""; position:absolute; width:110px; height:110px; right:-54px; top:-62px; border:1px solid rgba(52,112,205,.08); border-radius:50%; box-shadow:inset 0 0 0 19px rgba(51,111,206,.025); pointer-events:none; }
.xsh-ecosystem-section .xsh-ecosystem-card:hover { transform:translateY(-5px); border-color:#b8d2f5; box-shadow:0 18px 44px rgba(28,81,158,.12); }
.xsh-ecosystem-section .xsh-featured-card { grid-column:1/-1; min-height:338px; display:grid; grid-template-columns:minmax(0,1.22fr) minmax(390px,.78fr); gap:62px; align-items:center; padding:32px 36px; color:#fff!important; border-color:#173e7b; background:radial-gradient(circle at 85% 12%,rgba(72,136,232,.2),transparent 34%),linear-gradient(145deg,#0e294f,#174680); box-shadow:0 18px 40px rgba(16,48,93,.18); }
.xsh-ecosystem-section .xsh-featured-card::before { content:""; position:absolute; inset:0; opacity:.16; background-image:linear-gradient(rgba(156,193,246,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(156,193,246,.16) 1px,transparent 1px); background-size:32px 32px; mask-image:linear-gradient(to right,#000,transparent 72%); }
.xsh-ecosystem-section .xsh-featured-card::after { width:250px; height:250px; right:-72px; top:-134px; border-color:rgba(178,207,249,.13); box-shadow:inset 0 0 0 43px rgba(174,204,248,.035); }
.xsh-ecosystem-section .xsh-featured-card .xsh-eco-copy { align-self:center; }
.xsh-ecosystem-section .xsh-featured-card .xsh-eco-copy > * { position:relative; z-index:1; }
.xsh-ecosystem-section .xsh-featured-card .xsh-eco-copy p { max-width:610px; }
.xsh-ecosystem-section .xsh-eco-tag { display:inline-flex; width:max-content; padding:4px 8px; border-radius:6px; color:#526b8e; background:#edf3fb; font-size:9px; font-weight:800; }
.xsh-ecosystem-section .xsh-featured-card .xsh-eco-tag { color:#dfeaff; background:rgba(255,255,255,.11); }
.xsh-ecosystem-section .xsh-eco-card-top,.xsh-ecosystem-section .xsh-eco-heading-row { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.xsh-ecosystem-section .xsh-eco-live { display:inline-flex; align-items:center; gap:6px; color:#9ee6cc; font-size:9px; font-weight:800; }
.xsh-ecosystem-section .xsh-eco-live i { width:6px; height:6px; border-radius:50%; background:#3bd39f; box-shadow:0 0 0 4px rgba(59,211,159,.12); }
.xsh-ecosystem-section .xsh-ecosystem-card h3 { margin:15px 0 8px; font-size:21px; line-height:1.25; }
.xsh-ecosystem-section .xsh-featured-card h3 { margin-top:16px; font-size:27px; }
.xsh-ecosystem-section .xsh-ecosystem-card p { margin:0; color:#6e7f97; font-size:12px; line-height:1.8; }
.xsh-ecosystem-section .xsh-featured-card p { color:#c3d3eb; }
.xsh-ecosystem-section .xsh-ecosystem-card > b,.xsh-ecosystem-section .xsh-eco-copy > b { position:absolute; right:25px; bottom:24px; left:25px; z-index:1; color:var(--xsh-blue-dark); font-size:11px; }
.xsh-ecosystem-section .xsh-ecosystem-card b i { float:right; font-style:normal; }
.xsh-ecosystem-section .xsh-featured-card .xsh-eco-copy > b { position:static; display:flex; align-items:center; justify-content:space-between; margin-top:17px; color:#fff; }
.xsh-ecosystem-section .xsh-featured-card .xsh-eco-copy > b i { float:none; }
.xsh-ecosystem-section .xsh-eco-icon { width:45px; height:45px; display:grid; place-items:center; border-radius:13px; color:#1e65d9; background:#e9f2ff; box-shadow:inset 0 0 0 1px rgba(49,111,210,.04); font-size:13px; font-weight:900; }
.xsh-ecosystem-section .xsh-eco-icon.xsh-purple { color:#6851dc; background:#efebff; }
.xsh-ecosystem-section .xsh-eco-icon.xsh-green { color:#087a5d; background:#e2f6ee; }
.xsh-ecosystem-section .xsh-eco-icon.xsh-amber { color:#976713; background:#fff2d4; }
.xsh-ecosystem-section .xsh-eco-icon.xsh-blue { color:#1e65d9; background:#e9f2ff; }
.xsh-ecosystem-section .xsh-eco-mini-panel { position:relative; z-index:1; margin-top:16px; padding:12px; border:1px solid #e6edf7; border-radius:11px; background:#f7faff; }
.xsh-ecosystem-section .xsh-workflow-mini > div { display:grid; grid-template-columns:23px 1fr 23px 1fr 23px; align-items:center; }
.xsh-ecosystem-section .xsh-workflow-mini i { width:23px; height:23px; display:grid; place-items:center; border-radius:7px; color:#6e56dc; background:#ece8ff; font-size:8px; font-style:normal; font-weight:900; }
.xsh-ecosystem-section .xsh-workflow-mini div span { height:1px; background:#d9d2fb; }
.xsh-ecosystem-section .xsh-workflow-mini small,.xsh-ecosystem-section .xsh-learning-mini small { display:block; margin-top:7px; color:#8796aa; font-size:8px; }
.xsh-ecosystem-section .xsh-delivery-mini { display:grid; grid-template-columns:repeat(2,1fr); gap:7px; }
.xsh-ecosystem-section .xsh-delivery-mini span { padding:8px; border-radius:8px; background:#fff; }
.xsh-ecosystem-section .xsh-delivery-mini i,.xsh-ecosystem-section .xsh-delivery-mini strong { display:block; }
.xsh-ecosystem-section .xsh-delivery-mini i { color:#8a98aa; font-size:7px; font-style:normal; }
.xsh-ecosystem-section .xsh-delivery-mini strong { margin-top:2px; color:#08785a; font-size:11px;font-weight: bolder;}
.xsh-ecosystem-section .xsh-learning-mini > div { display:flex; align-items:center; justify-content:space-between; color:#728197; font-size:8px; }
.xsh-ecosystem-section .xsh-learning-mini > div b { color:#96640e; font-size:9px; }
.xsh-ecosystem-section .xsh-learning-mini > i { height:5px; display:block; overflow:hidden; margin-top:8px; border-radius:99px; background:#e9eef6; }
.xsh-ecosystem-section .xsh-learning-mini > i em { width:68%; height:100%; display:block; border-radius:inherit; background:linear-gradient(90deg,#f0b63e,#ffcf65); }
.xsh-ecosystem-section .xsh-model-mini { display:flex; align-items:center; flex-wrap:wrap; gap:5px; }
.xsh-ecosystem-section .xsh-model-mini > span { padding:5px 7px; border-radius:6px; color:#2665c7; background:#e8f1ff; font-size:7px; font-weight:800; }
.xsh-ecosystem-section .xsh-model-mini small { margin-left:auto; display:inline-flex; align-items:center; gap:5px; color:#6a7d95; font-size:7px; }
.xsh-ecosystem-section .xsh-model-mini small i { width:6px; height:6px; border-radius:50%; background:#19aa7b; }
.xsh-ecosystem-section .xsh-studio-visual { position:relative; z-index:1; align-self:center; min-width:0; padding:17px; border:1px solid rgba(162,197,241,.28); border-radius:17px; background:linear-gradient(145deg,rgba(16,48,88,.82),rgba(8,30,60,.64)); box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 18px 38px rgba(2,15,36,.16); transform:none; }
.xsh-ecosystem-section .xsh-studio-visual::before { content:""; position:absolute; width:130px; height:130px; right:-70px; top:-76px; border:1px solid rgba(116,174,246,.12); border-radius:50%; box-shadow:inset 0 0 0 23px rgba(85,148,231,.025); pointer-events:none; }
.xsh-ecosystem-section .xsh-visual-bar { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:12px; }
.xsh-ecosystem-section .xsh-visual-brand { display:flex; align-items:center; gap:8px; }
.xsh-ecosystem-section .xsh-visual-brand > span { display:flex; gap:4px; }
.xsh-ecosystem-section .xsh-visual-brand > span i { width:5px; height:5px; border-radius:50%; background:#6f98cd; }
.xsh-ecosystem-section .xsh-visual-brand strong { color:#dceaff; font-size:10px; }
.xsh-ecosystem-section .xsh-visual-bar > em { padding:5px 8px; display:inline-flex; align-items:center; gap:5px; border:1px solid rgba(74,210,166,.14); border-radius:999px; color:#a6ead3; background:rgba(36,181,137,.09); font-size:8px; font-style:normal; font-weight:800; }
.xsh-ecosystem-section .xsh-visual-bar > em i { width:5px; height:5px; border-radius:50%; background:#3ad39e; box-shadow:0 0 0 3px rgba(58,211,158,.11); }
.xsh-ecosystem-section .xsh-visual-task-card { position:relative; z-index:1; padding:13px 14px; border:1px solid rgba(163,196,239,.17); border-radius:12px; background:linear-gradient(135deg,rgba(255,255,255,.095),rgba(255,255,255,.045)); }
.xsh-ecosystem-section .xsh-visual-task-head { display:flex; justify-content:space-between; gap:8px; color:#94afd0; font-size:9px; }
.xsh-ecosystem-section .xsh-visual-task-head small { color:#8eabd0; font-size:8px; }
.xsh-ecosystem-section .xsh-visual-task-head span { padding:4px 6px; border-radius:6px; color:#a8ead4; background:rgba(38,194,146,.1); font-size:7px; font-weight:800; }
.xsh-ecosystem-section .xsh-visual-task-card > strong { display:block; margin-top:5px; color:#fff; font-size:11px; line-height:1.45; }
.xsh-ecosystem-section .xsh-visual-progress { height:5px; margin:12px 0 7px; overflow:hidden; border-radius:999px; background:rgba(202,221,247,.12); }
.xsh-ecosystem-section .xsh-visual-progress span { display:block; width:68%; height:100%; border-radius:inherit; background:linear-gradient(90deg,#4aa4ff,#8373ff); box-shadow:0 0 12px rgba(97,131,255,.35); }
.xsh-ecosystem-section .xsh-visual-progress-meta { display:flex; align-items:center; justify-content:space-between; gap:10px; color:#8fa7c8; font-size:7px; }
.xsh-ecosystem-section .xsh-visual-progress-meta b { color:#b7c9e1; font-size:7px; }
.xsh-ecosystem-section .xsh-visual-flow { position:relative; z-index:1; margin-top:10px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; }
.xsh-ecosystem-section .xsh-visual-node { min-width:0; padding:9px 7px; display:flex; align-items:center; gap:7px; border:1px solid rgba(151,184,227,.11); border-radius:9px; background:rgba(255,255,255,.045); }
.xsh-ecosystem-section .xsh-visual-node > i { width:20px; height:20px; flex:0 0 auto; display:grid; place-items:center; border-radius:6px; color:#89a3c7; background:rgba(255,255,255,.07); font-size:7px; font-style:normal; font-weight:900; }
.xsh-ecosystem-section .xsh-visual-node span { min-width:0; }
.xsh-ecosystem-section .xsh-visual-node b,.xsh-ecosystem-section .xsh-visual-node small { display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.xsh-ecosystem-section .xsh-visual-node b { color:#dce9fa; font-size:8px; }
.xsh-ecosystem-section .xsh-visual-node small { margin-top:1px; color:#7f98ba; font-size:6px; }
.xsh-ecosystem-section .xsh-visual-node.xsh-done > i { color:#fff; background:#16a77b; }
.xsh-ecosystem-section .xsh-visual-node.xsh-active { border-color:rgba(80,143,239,.3); background:rgba(43,100,185,.2); }
.xsh-ecosystem-section .xsh-visual-node.xsh-active > i { color:#fff; background:#2e74ea; box-shadow:0 4px 10px rgba(35,95,203,.25); }
.xsh-ecosystem-section .xsh-visual-node.xsh-done small,.xsh-ecosystem-section .xsh-visual-node.xsh-active small { color:#71d9b7; }
.xsh-ecosystem-section .xsh-visual-tools { position:relative; z-index:1; margin-top:10px; padding-top:10px; display:flex; align-items:center; gap:5px; border-top:1px solid rgba(163,194,235,.1); }
.xsh-ecosystem-section .xsh-visual-tools > span { padding:4px 6px; border-radius:6px; color:#b9cce6; background:rgba(255,255,255,.055); font-size:7px; }
.xsh-ecosystem-section .xsh-visual-tools > small { margin-left:auto; display:inline-flex; align-items:center; gap:5px; color:#91b2d8; font-size:7px; }
.xsh-ecosystem-section .xsh-visual-tools > small i { width:5px; height:5px; border-radius:50%; background:#36d19b; }
.xsh-feature-pills { margin-top: 15px; display: flex; flex-wrap: wrap; gap: 7px; }
.xsh-feature-pills span { padding: 5px 9px; border: 1px solid rgba(191, 216, 251, .15); border-radius: 7px; color: #dbe9fc; background: rgba(255, 255, 255, .07); font-size: 9px; }
.xsh-feature-stats { max-width: 390px; margin-top: 18px; padding-top: 15px; display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid rgba(183, 209, 244, .14); }
.xsh-feature-stats span { border-right: 1px solid rgba(183, 209, 244, .12); }
.xsh-feature-stats span:last-child { border-right: 0; padding-left: 12px; }
.xsh-feature-stats span:nth-child(2) { padding-left: 12px; }
.xsh-feature-stats strong, .xsh-feature-stats small { display: block; }
.xsh-feature-stats strong { color: #fff; font-size: 15px; }
.xsh-feature-stats small { margin-top: 1px; color: #91a9c9; font-size: 8px; }
@media (max-width:900px) {
    .xsh-ecosystem-section .xsh-section-head-split { align-items:start; flex-direction:column; }
    .xsh-ecosystem-section .xsh-ecosystem-grid { grid-template-columns:repeat(2,1fr); }
    .xsh-ecosystem-section .xsh-featured-card { grid-column:span 2; grid-template-columns:minmax(0,1fr) minmax(300px,.8fr); gap:28px; padding:28px; }
}

@media (max-width:640px) {
    .xsh-ecosystem-section { padding:54px 0 18px; }
    .xsh-ecosystem-section .xsh-section-head { margin-bottom:24px; }
    .xsh-ecosystem-section .xsh-section-head h2 { font-size:28px; letter-spacing:-.7px; }
    .xsh-ecosystem-section .xsh-section-head p { margin-top:9px; font-size:12px; }
    .xsh-ecosystem-section .xsh-ecosystem-grid { grid-template-columns:1fr; gap:12px; }
    .xsh-ecosystem-section .xsh-skill-card,.xsh-ecosystem-section .xsh-service-eco-card,.xsh-ecosystem-section .xsh-academy-card,.xsh-ecosystem-section .xsh-api-card { display:none; }
    .xsh-ecosystem-section .xsh-ecosystem-card { min-height:320px; padding:20px; }
    .xsh-ecosystem-section .xsh-featured-card { min-height:555px; grid-column:auto; grid-template-columns:1fr; gap:22px; padding:22px; }
    .xsh-ecosystem-section .xsh-ecosystem-card h3 { margin-top:12px; font-size:19px; }
    .xsh-ecosystem-section .xsh-featured-card h3 { font-size:24px; }
    .xsh-ecosystem-section .xsh-ecosystem-card p { font-size:11px; }
    .xsh-ecosystem-section .xsh-ecosystem-card > b,.xsh-ecosystem-section .xsh-eco-copy > b { right:20px; bottom:18px; left:20px; }
    .xsh-ecosystem-section .xsh-feature-pills { gap:5px; margin-top:12px; }
    .xsh-ecosystem-section .xsh-feature-pills span { padding:4px 7px; font-size:8px; }
    .xsh-ecosystem-section .xsh-xsh-feature-stats { max-width:none; margin-top:13px; padding-top:12px; }
    .xsh-ecosystem-section .xsh-studio-visual { width:100%; margin:0 0 28px; transform:none; }
    .xsh-ecosystem-section .xsh-eco-mini-panel { margin-top:13px; }
}