/* assets/css/sections/story.css — 关于页专用：时间线、价值观、团队、技术壁垒。
   时间线是全站第二处使用数字的地方（第一处是上手流程），因为它的内容确实是序列。 */

/* ============ 公司简介：左文右数 ============ */
.story-grid{ display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:56px; align-items:start; }
.story-facts{ border-top:1px solid var(--line-dark); }
.story-facts li{ display:flex; gap:16px; padding:14px 0; border-bottom:1px solid var(--line); font-size:14.5px; }
.story-facts .k{ flex:none; width:6.5em; color:var(--muted); }
.story-facts .v{ color:var(--ink); font-weight:500; }

/* ============ 时间线 ============ */
.timeline{ position:relative; margin-top:8px; }
.timeline::before{
  content:""; position:absolute; left:0; top:6px; bottom:6px; width:1px; background:var(--line-dark);
}
.tl-item{ position:relative; padding:0 0 34px 32px; }
.tl-item:last-child{ padding-bottom:0; }
.tl-item::before{
  content:""; position:absolute; left:-4px; top:6px; width:9px; height:9px;
  background:var(--surface); border:2px solid var(--line-dark);
}
.tl-item--now::before{ background:var(--cinnabar); border-color:var(--cinnabar); }
.tl-year{ font-family:var(--serif); font-weight:700; font-size:17px; color:var(--cinnabar); }
.tl-item h3{ margin-top:6px; font-size:19px; font-weight:700; }
.tl-item p{ margin-top:10px; font-size:15px; color:var(--muted); max-width:44em; }

/* ============ 团队卡 ============ */
.team-grid{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); }
.team{ padding:26px 24px; background:var(--surface); }
.team-role{ font-size:12.5px; color:var(--cinnabar); }
.team h3{ margin-top:8px; font-size:17.5px; font-weight:700; }
.team p{ margin-top:12px; font-size:14px; color:var(--muted); }

/* ============ 技术壁垒 / 生态合作：两组并列标签 ============ */
.stack-grid{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:40px; }
.stack-col h3{ padding-bottom:12px; border-bottom:2px solid var(--ink); font-size:17.5px; font-weight:700; }
.stack-col ul{ margin-top:18px; }
.stack-col li{ position:relative; padding-left:18px; margin-top:12px; font-size:14.5px; color:var(--muted); }
.stack-col li::before{ content:""; position:absolute; left:0; top:9px; width:6px; height:6px; background:var(--cinnabar); }
.stack-col li b{ display:block; color:var(--ink); font-weight:500; font-size:15px; }

@media (max-width:1020px){
  .story-grid{ grid-template-columns:1fr; gap:36px; }
  .team-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .stack-grid{ grid-template-columns:1fr; gap:32px; }
}
@media (max-width:680px){
  .team-grid{ grid-template-columns:1fr; }
}
