/* ==========================================================
   历史版本演示站 · 落地页样式
   依赖 css/style.css（沿用 Win11 Fluent 风格与品牌蓝变量）
   ========================================================== */

/* ---------- 顶部存档提示条 ---------- */
.hibar{
  background:linear-gradient(90deg,#fff4e0 0%,#ffe9cc 100%);
  border-bottom:1px solid #f3d3a0;
  color:#8a5300; font-size:13.5px;
}
.hibar-in{
  display:flex; align-items:center; gap:10px;
  padding:9px 0; flex-wrap:wrap;
}
.hibar b{ font-weight:700; }
.hibar .dot{
  width:7px; height:7px; border-radius:50%; background:#e8a33d; flex:none;
}
.hibar a{ color:#8a5300; text-decoration:underline; font-weight:600; }

/* ---------- 历史页 Hero ---------- */
.hihero{ padding:56px 0 10px; }
.hihero-in{ display:flex; gap:40px; flex-wrap:wrap; align-items:flex-start; }
.hihero-txt{ flex:1 1 480px; min-width:290px; }
.hihero h1{ font-size:34px; line-height:1.3; font-weight:700; margin:16px 0 14px; }
.hihero h1 em{ font-style:normal; color:var(--brand-deep); }
.hihero .lead{ font-size:16px; color:var(--ink-2); }
.hihero-btns{ display:flex; gap:14px; margin-top:26px; flex-wrap:wrap; }

/* 版本信息卡 */
.infocard{
  flex:0 1 340px; min-width:280px;
  background:var(--card); backdrop-filter:blur(20px);
  border:1px solid rgba(255,255,255,.7); border-radius:var(--radius);
  padding:22px; box-shadow:var(--shadow);
}
.infocard h4{ font-size:15px; margin-bottom:14px; padding-bottom:10px; border-bottom:1px solid var(--line); }
.infocard dl{ display:grid; grid-template-columns:78px 1fr; gap:9px 12px; font-size:13.5px; }
.infocard dt{ color:var(--ink-3); }
.infocard dd{ color:var(--ink); }
.badge-old{
  display:inline-block; font-size:11.5px; padding:2px 9px; border-radius:6px;
  background:#fff0e0; color:#a35b00; font-weight:600;
}
.badge-stop{
  display:inline-block; font-size:11.5px; padding:2px 9px; border-radius:6px;
  background:#f1f1f3; color:#6b6b73; font-weight:600;
}

/* ---------- 时间线 ---------- */
.timeline{ margin-top:8px; position:relative; padding-left:26px; }
.timeline::before{
  content:""; position:absolute; left:7px; top:6px; bottom:6px; width:2px;
  background:linear-gradient(180deg,var(--brand) 0%, rgba(61,166,247,.18) 100%);
}
.tl-item{ position:relative; padding:0 0 26px 6px; }
.tl-item:last-child{ padding-bottom:0; }
.tl-item::before{
  content:""; position:absolute; left:-25px; top:6px; width:12px; height:12px; border-radius:50%;
  background:#fff; border:3px solid var(--brand); box-sizing:border-box;
}
.tl-item.now::before{ background:var(--brand); box-shadow:0 0 0 4px rgba(61,166,247,.2); }
.tl-year{ font-size:13px; font-weight:700; color:var(--brand-deep); letter-spacing:.5px; }
.tl-item h4{ font-size:16px; margin:4px 0 6px; }
.tl-item p{ font-size:14px; color:var(--ink-2); }

/* ---------- 右下角悬浮返回 ---------- */
.floatback{
  position:fixed; right:26px; bottom:26px; z-index:95; display:flex; flex-direction:column; gap:10px;
}
.fbtn{
  display:flex; align-items:center; gap:8px; padding:11px 16px; border-radius:999px;
  font-size:13.5px; font-weight:600; color:#fff; cursor:pointer; border:none;
  background:linear-gradient(135deg,var(--brand) 0%,var(--brand-deep) 100%);
  box-shadow:0 8px 22px rgba(61,166,247,.42);
  transition:transform .2s, box-shadow .2s;
}
.fbtn:hover{ transform:translateY(-3px); box-shadow:0 14px 30px rgba(61,166,247,.5); }
.fbtn.ghost{
  background:rgba(255,255,255,.9); color:var(--brand-deep);
  border:1px solid rgba(61,166,247,.4); box-shadow:var(--shadow-hover);
}

/* ---------- 历史页导航（简版） ---------- */
.nav-simple{ box-shadow:0 1px 0 var(--line); }
.nav-simple .nav-menu a{ font-size:14px; }

@media (max-width:768px){
  .hihero h1{ font-size:26px; }
  .infocard{ flex:1 1 100%; }
  .floatback{ right:14px; bottom:14px; }
  .fbtn{ padding:9px 13px; font-size:12.5px; }
  .cmp th, .cmp td{ padding:11px 12px; font-size:13px; }
}