/* 关于页发展时间线模块：时间线节点和内容面板保持同一交互结构。 */
#npi-about .story-section{padding:var(--wk-space-4) var(--wk-space-2xl);background:var(--gray-bg)}
#npi-about .story-wrap{max-width:var(--wk-content-max);margin:0 auto}
#npi-about .story-head{max-width:720px;margin:0 auto var(--wk-space-4xl);text-align:center}
#npi-about .story-head h2{font-size:var(--wk-text-h2);font-weight:700;color:var(--dark) !important;letter-spacing:-.5px;margin-bottom:var(--wk-space-lg)}
#npi-about .story-head p{font-size:var(--wk-text-h3);color:var(--text-secondary) !important;line-height:var(--wk-leading)}
#npi-about .story-timeline{position:relative;display:grid;grid-template-columns:repeat(7,1fr);gap:var(--wk-space-sm);margin-bottom:var(--wk-space-4xl)}
#npi-about .story-timeline::before{content:"";position:absolute;top:8px;left:7.15%;right:7.15%;height:2px;background:var(--border)}
#npi-about .story-node{display:flex;flex-direction:column;align-items:center;gap:var(--wk-space-sm);background:none;border:0;padding:0;cursor:pointer;font-family:inherit;position:relative;z-index:1}
#npi-about .story-dot{width:16px;height:16px;border-radius:var(--wk-radius-circle);background:var(--wk-surface);border:2px solid var(--wk-border-mid);transition:all .25s;flex:none}
#npi-about .story-node:hover .story-dot{border-color:var(--primary)}
#npi-about .story-node.is-active .story-dot{background:var(--primary);border-color:var(--primary);box-shadow:0 0 0 5px var(--primary-light)}
#npi-about .story-node-year{font-size:var(--wk-text-lg);font-weight:700;color:var(--text-secondary) !important;line-height:1;transition:color .25s}
#npi-about .story-node:hover .story-node-year{color:var(--primary-text) !important}
#npi-about .story-node.is-active .story-node-year{color:var(--primary-text) !important}
#npi-about .story-node-phase{font-size:var(--wk-text-sm);color:var(--text-secondary) !important;line-height:1.3}
#npi-about .story-node.is-active .story-node-phase{color:var(--dark) !important;font-weight:600}
#npi-about .story-stage{transition:opacity .22s ease}
#npi-about .story-stage.is-fading{opacity:0}
#npi-about .story-panel{display:none;grid-template-columns:1fr 1fr;gap:var(--wk-space-4xl);align-items:stretch}
#npi-about .story-panel.is-active{display:grid}
#npi-about .story-media{border-radius:var(--radius);overflow:hidden;border:1px solid var(--border);background:var(--wk-surface);position:relative;min-height:440px;box-shadow:var(--card-shadow)}
#npi-about .story-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
#npi-about .story-media-ph{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--wk-space-md);background:linear-gradient(135deg,var(--wk-brand-light) 0%,var(--wk-gray-bg) 100%)}
#npi-about .story-media-ph .ph-icon{width:48px;height:48px;border-radius:var(--wk-radius-circle);background:var(--wk-surface);border:2px solid var(--border);display:flex;align-items:center;justify-content:center}
#npi-about .story-media-ph .ph-icon svg{color:var(--text-light) !important}
#npi-about .story-media-ph .ph-text{font-size:var(--wk-text-md);color:var(--text-light) !important;letter-spacing:.5px}
#npi-about .story-card{padding:var(--wk-space-sm) 0;display:flex;flex-direction:column}
#npi-about .story-card .story-kicker{display:inline-block;color:var(--primary-text) !important;font-weight:700;margin-bottom:var(--wk-space-lg);font-size:var(--wk-text-md);letter-spacing:1px;font-family:var(--wk-font-sans)}
#npi-about .story-card h3{font-size:var(--wk-text-h3);font-weight:700;color:var(--dark) !important;margin-bottom:var(--wk-space-sm);letter-spacing:-.5px;line-height:1.35}
#npi-about .story-card .story-subtitle{font-size:var(--wk-text-body);color:var(--text-secondary) !important;margin-bottom:var(--wk-space-1);font-weight:500;line-height:var(--wk-leading)}
#npi-about .story-points{margin:0 0 var(--wk-space-1);padding:0;list-style:none;display:flex;flex-direction:column;gap:var(--wk-space-sm)}
#npi-about .story-points li{font-size:var(--wk-text-body);color:var(--text-secondary) !important;line-height:var(--wk-leading)}
#npi-about .story-points li b{color:var(--dark) !important;font-weight:600}
#npi-about .story-group{margin-bottom:var(--wk-space-lg)}
#npi-about .story-group:last-child{margin-bottom:var(--wk-space-2xl)}
#npi-about .story-group .story-points{margin:0}
#npi-about .story-group-label{display:flex;align-items:center;gap:var(--wk-space-sm);font-size:var(--wk-text-xs);font-weight:700;color:var(--primary-text) !important;letter-spacing:3px;font-family:var(--wk-font-sans);margin-bottom:var(--wk-space-sm)}
#npi-about .story-group-label::after{content:"";flex:1;height:1px;background:var(--border)}
#npi-about .story-keys{font-size:var(--wk-text-sm);font-weight:600;color:var(--primary-text) !important;letter-spacing:.3px}
#npi-about .story-card .story-highlight{color:var(--primary-text) !important;font-weight:600}
#npi-about .story-meta{font-size:var(--wk-text-sm);color:var(--text-secondary) !important;border-top:1px solid var(--border);padding-top:var(--wk-space-lg);letter-spacing:.3px;margin-top:auto}

@media (max-width:960px){
  #npi-about .story-panel{grid-template-columns:1fr;gap:var(--wk-space-3xl)}
  #npi-about .story-media{min-height:240px}
  #npi-about .story-card{padding:0}
  #npi-about .story-timeline{gap:var(--wk-space-xs);margin-bottom:var(--wk-space-2)}
  #npi-about .story-node-year{font-size:var(--wk-text-h3)}
  #npi-about .story-node-phase{font-size:var(--wk-text-xs)}
}

@media (max-width:520px){
  #npi-about .story-timeline{gap:var(--wk-space-xs)}
  #npi-about .story-node-year{font-size:var(--wk-text-sm)}
  #npi-about .story-node-phase{display:none}
  #npi-about .story-node{gap:var(--wk-space-sm)}
  #npi-about .story-dot{width:12px;height:12px}
  #npi-about .story-timeline::before{top:6px}
}
