/* 8FO 首页功能聚合区 —— 中英首页共用。
   只依赖 site.css 定义的 --font-latin / --navy-ink 等变量，且都带 fallback，
   所以 index.html 与 en/index.html 可以引同一份。 */
/* ==================================================================
   全站功能聚合区（首页即门户）
   三列「要做的事」→ 每列 4 个真实入口；窄屏依次降为两列、一列。
   入口全部指向线上已核验的页面，不放占位链接。
   ================================================================== */
/* ---- 结构兜底 ----
   .ai-section-head / .ai-eyebrow 原本只定义在中文首页的 home-ai.css 里，
   英文首页只有 site.css，所以这里补一份作用域限定在 .ai-hub 内的等价规则。
   字号按语言分开：中文走无衬线大标题，英文站标题体系是衬线，小一号才不抢戏。 */
.ai-hub .ai-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:clamp(24px,3vw,44px);margin-bottom:clamp(24px,2.8vw,36px)}
.ai-hub .ai-section-head>div{min-width:0}
.ai-hub .ai-eyebrow{display:block;margin:0 0 12px;color:#a07532;font:600 10px/1.2 var(--font-latin,inherit);letter-spacing:.16em}
.ai-hub .ai-section-head h2{margin:0;color:var(--navy-ink,#0f2b3c);font-size:clamp(30px,3.4vw,47px);font-weight:700;line-height:1.18;letter-spacing:-.035em;text-wrap:balance}
.ai-hub .ai-section-head>p{margin:0;max-width:440px;color:#6d7d84;font-size:13px;line-height:1.9}
body.is-en .ai-hub .ai-section-head h2{font-family:var(--font-serif,Georgia,serif);font-size:clamp(26px,2.8vw,36px);line-height:1.26;letter-spacing:-.008em}
body.is-en .ai-hub .ai-eyebrow{font-size:10.5px;letter-spacing:.18em}
@media(max-width:960px){
  .ai-hub .ai-section-head{flex-direction:column;align-items:flex-start;gap:13px}
  .ai-hub .ai-section-head>p br{display:none}
}

.ai-hub{padding:clamp(52px,5.4vw,76px) clamp(24px,4vw,64px) clamp(34px,3.6vw,48px);max-width:1440px;margin:0 auto}
.ai-hub-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.4vw,38px)}
.ai-hub-col{display:flex;flex-direction:column;min-width:0}
.ai-hub-colhead{display:flex;flex-direction:column;gap:7px;padding:0 4px 15px;border-bottom:1px solid #d7ddd8;margin-bottom:4px}
.ai-hub-colhead>span{color:#a07532;font:600 9.5px/1.2 var(--font-latin);letter-spacing:.16em}
.ai-hub-colhead h3{margin:0;color:#0f2b3c;font-size:17px;font-weight:680;letter-spacing:-.012em}
.ai-hub-colhead p{margin:0;color:#84969d;font-size:11.5px;line-height:1.55}
.ai-hub-item{display:flex;align-items:center;gap:13px;padding:14px 10px;border-bottom:1px solid #e5e9e5;border-radius:0;transition:background .18s,box-shadow .18s,transform .18s,border-color .18s}
.ai-hub-item:hover,.ai-hub-item:focus-visible{background:#fff;border-radius:11px;box-shadow:0 10px 26px rgba(15,43,60,.085);transform:translateX(2px);outline:none}
.ai-hub-ico{flex:none;width:38px;height:38px;display:grid;place-items:center;border:1px solid #dae1dc;border-radius:10px;background:#fbfcfb;color:#1a5570;transition:border-color .18s,background .18s,color .18s}
.ai-hub-item:hover .ai-hub-ico{border-color:#e0bc79;background:#fdf8ee;color:#a07532}
.ai-hub-txt{display:flex;flex-direction:column;gap:3px;min-width:0}
.ai-hub-txt b{color:#0f2b3c;font-size:13.5px;font-weight:650;line-height:1.35}
.ai-hub-txt em{color:#7b8d95;font-size:11.5px;font-style:normal;line-height:1.5;overflow-wrap:anywhere}
.ai-hub-go{margin-left:auto;flex:none;width:25px;height:25px;display:grid;place-items:center;border-radius:50%;padding:0;color:#7d939d;font-size:14px;line-height:1;transition:color .18s,background .18s,transform .18s}
.ai-hub-item:hover .ai-hub-go{background:#faf3e4;color:#a07532;transform:translate(1px,-1px)}
.ai-hub-strip{display:flex;align-items:center;flex-wrap:wrap;gap:9px 24px;margin-top:clamp(22px,2.6vw,34px);padding-top:18px;border-top:1px solid #dde2dd}
.ai-hub-strip>span{color:#96a4a9;font-size:11px;letter-spacing:.04em}
.ai-hub-strip a{position:relative;color:#3f5a67;font-size:12px;transition:color .18s}
.ai-hub-strip a::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:1px;background:#e0bc79;transform:scaleX(0);transform-origin:left;transition:transform .2s}
.ai-hub-strip a:hover{color:#a07532}
.ai-hub-strip a:hover::after{transform:scaleX(1)}

@media(max-width:1180px){
  .ai-hub-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 28px}
  .ai-hub-item{padding:13px 8px}
}
@media(max-width:620px){
  .ai-hub{padding:44px 18px 46px}
  .ai-hub-grid{grid-template-columns:1fr;gap:26px}
  .ai-hub-colhead{padding-bottom:13px}
  .ai-hub-colhead h3{font-size:16px}
  .ai-hub-item{padding:13px 6px;gap:11px}
  .ai-hub-ico{width:35px;height:35px;border-radius:9px}
  .ai-hub-txt b{font-size:13px}
  .ai-hub-txt em{font-size:11px}
  .ai-hub-strip{gap:9px 18px}
}
