/* ============================================================
   home.css — 枢汇安全课堂 首页页面级样式 v2
   Hero 左右 grid 两列 · cmp 内嵌 hero 深色版 · 新增 path / n-grid / vip-band
   所有类名 hp- 前缀挂接 .hp-page，作用域隔离
   ============================================================ */

/* ===== 1 设计变量与基础 ===== */
.hp-page{
  --navy-900:#0a1628; --navy-800:#12213a; --navy-700:#1b2c47;
  --gold:#c9a227; --gold-2:#d4a853; --goldbg:#fbf3df;
  --fc:#c9a227; --fc2:#d4a853; --zac:#c9a227;
  --blue:#2563eb; --text:#2a3544; --muted:#64748b; --line:#e2e8f0; --bg:#f8fafc;
  font-family:"Noto Sans SC","Microsoft YaHei",sans-serif; background:var(--bg); color:var(--text); scroll-behavior:smooth;
}
.hp-page *,.hp-page *::before,.hp-page *::after{margin:0; padding:0; box-sizing:border-box;}
.hp-page .hp-wrap{max-width:1180px; margin:0 auto; padding:0 20px;}
.hp-page .hp-sec{padding:48px 0 0;}
.hp-page .hp-sec-h{display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:18px; gap:16px;}
.hp-page .hp-sec-h .hp-en{font-size:11px; letter-spacing:3px; color:var(--gold); font-weight:700; margin-bottom:5px;}
.hp-page .hp-sec-h .hp-rt{font-family:"Noto Serif SC","Songti SC",serif; font-size:22px; font-weight:700; color:var(--text);}
.hp-page .hp-sec-h .hp-rt em{font-style:normal; color:var(--gold);}
.hp-page .hp-sec-h .hp-more{font-size:13px; color:var(--muted); text-decoration:none; padding-bottom:4px; border-bottom:1px solid transparent; white-space:nowrap;}
.hp-page .hp-sec-h .hp-more:hover{color:var(--gold); border-color:var(--gold);}
.hp-page .hp-empty-tip{color:#7f93ab; font-size:12px; line-height:1.8; text-align:center; padding:34px 20px;}

/* ===== 2 Hero · 深藏青底 + grid 两列 ===== */
.hp-page .hp-hero{background:
  radial-gradient(ellipse 55% 50% at 88% 8%, rgba(212,168,83,.16), transparent 62%),
  radial-gradient(ellipse 40% 45% at 2% 100%, rgba(37,99,235,.14), transparent 60%),
  var(--navy-900); color:#fff; position:relative; overflow:hidden; border-bottom:1px solid rgba(212,168,83,.3);}
.hp-page .hp-hero .hp-gridline{display:none;}
.hp-page .hp-hero-in{position:relative; display:grid; grid-template-columns:1fr; gap:34px; padding:62px 20px 58px;}
.hp-page .hp-h-left{min-width:0;}
.hp-page .hp-hero-tag{display:inline-flex; align-items:center; gap:8px; background:rgba(212,168,83,.12); border:1px solid rgba(212,168,83,.4); color:var(--gold-2); font-size:12px; font-weight:700; padding:6px 14px; border-radius:999px; letter-spacing:1px;}
.hp-page .hp-hero h1{font-family:"Noto Serif SC","Songti SC",serif; font-size:42px; line-height:1.28; font-weight:900; margin:20px 0 14px; color:#fff;}
.hp-page .hp-hero h1 em{font-style:normal; color:var(--gold-2);}
.hp-page .hp-hero h1 em:first-of-type{position:relative; white-space:nowrap;}
.hp-page .hp-hero h1 em:first-of-type::after{content:""; position:absolute; left:0; right:0; bottom:2px; height:7px; background:linear-gradient(90deg, rgba(212,168,83,.42), transparent); border-radius:3px; z-index:-1;}
.hp-page .hp-hero .hp-lead{font-size:15px; color:#c3d0e2; line-height:1.9; margin:0;}
.hp-page .hp-hero .hp-lead b{color:var(--gold-2); font-weight:700;}
.hp-page .hp-h-stats{display:flex; gap:0; margin:28px 0 0; border-top:1px solid rgba(255,255,255,.12); padding-top:20px; flex-wrap:wrap;}
.hp-page .hp-hs{flex:1; min-width:104px; padding-left:18px; border-left:1px solid rgba(255,255,255,.1);}
.hp-page .hp-hs:first-child{padding-left:0; border-left:none;}
.hp-page .hp-hs b{display:block; font-family:"Noto Serif SC",serif; font-size:26px; color:#fff; font-weight:900; line-height:1.2;}
.hp-page .hp-hs b i{font-style:normal; color:var(--gold-2);}
.hp-page .hp-hs span{font-size:12px; color:#8fa3bd; display:block; margin-top:2px;}
.hp-page .hp-h-btns{display:flex; align-items:center; gap:12px; margin-top:28px; flex-wrap:wrap;}
.hp-page .hp-btn-gold{display:inline-flex; align-items:center; gap:8px; background:linear-gradient(135deg,var(--gold-2),var(--gold)); color:#241a02; font-weight:700; font-size:14.5px; padding:12px 24px; border-radius:10px; border:none; cursor:pointer; text-decoration:none; box-shadow:0 8px 22px rgba(201,162,39,.28); transition:transform .12s, filter .12s;}
.hp-page .hp-btn-gold:hover{transform:translateY(-1px); filter:brightness(1.06);}
.hp-page .hp-btn-line{display:inline-flex; align-items:center; gap:8px; background:transparent; color:#fff; font-weight:600; font-size:14.5px; padding:12px 24px; border-radius:10px; border:1px solid rgba(255,255,255,.35); cursor:pointer; text-decoration:none;}
.hp-page .hp-btn-line:hover{background:rgba(255,255,255,.08);}
.hp-page .hp-h-note{display:flex; align-items:center; gap:7px; font-size:12.5px; color:#8fa3bd; margin-left:10px;}
.hp-page .hp-h-note::before{content:""; width:14px; height:14px; border-radius:50%; background:radial-gradient(circle at 35% 35%, #3fdb7d, #1ba357 70%); box-shadow:0 0 8px rgba(31,178,94,.45);}

/* ===== 3 对比台 · 内嵌 Hero 深色版 ===== */
.hp-page .hp-cmp{background:linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.03)), rgba(255,255,255,.045); border:1px solid rgba(212,168,83,.32); border-radius:18px; padding:16px; min-width:0; box-shadow:0 22px 50px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.06); display:flex; flex-direction:column; gap:10px;}

/* cmp-head：标题 + 已选徽章 + 分类 chips */
.hp-page .hp-cmp-head{display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
.hp-page .hp-ch-t{display:inline-flex; align-items:center; gap:5px; font-size:13px; color:#c6d3e4; font-weight:700; margin-right:4px;}
.hp-page .hp-ch-t svg{color:var(--gold-2);}
.hp-page .hp-ch-badge{display:inline-flex; align-items:center; gap:4px; background:rgba(212,168,83,.14); border:1px solid rgba(212,168,83,.4); color:var(--gold-2); font-size:11px; font-weight:700; padding:3px 10px; border-radius:999px;}
.hp-page .hp-ch-badge b{color:#fff; font-size:12.5px;}
.hp-page .hp-cats{display:flex; gap:6px; flex-wrap:wrap; margin-left:auto;}
.hp-page .hp-cat{padding:5px 12px; border-radius:999px; border:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.04); color:#c6d3e4; font-size:12px; cursor:pointer; transition:all .12s; white-space:nowrap; display:inline-flex; align-items:center; gap:2px;}
.hp-page .hp-cat.hp-on{background:linear-gradient(135deg,var(--gold-2),var(--gold)); color:#241a02; font-weight:700; border-color:transparent;}
.hp-page .hp-cat:hover:not(.hp-on){border-color:var(--gold-2); color:var(--gold-2);}
.hp-page .hp-cat .hp-cn{font-weight:700; margin-left:3px;}

/* pick-bar：已选胶囊 + 添加按钮 */
.hp-page .hp-pick-bar{display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:10px 12px; background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.12); border-radius:11px; position:relative;}
.hp-page .hp-pick-bar .hp-pl{font-size:12px; color:#8fa3bd; flex:none;}
.hp-page .hp-pick-bar .hp-pl b{color:var(--gold-2);}
.hp-page .hp-picked{display:flex; gap:7px; flex-wrap:wrap; flex:1; min-width:0;}
.hp-page .hp-pchip{display:inline-flex; align-items:center; gap:6px; background:linear-gradient(135deg, rgba(212,168,83,.22), rgba(212,168,83,.1)); border:1px solid rgba(212,168,83,.5); color:#fff; font-size:12.5px; font-weight:600; padding:5px 11px; border-radius:999px;}
.hp-page .hp-pchip .hp-x{color:#9fb3cc; cursor:pointer; font-size:13px; line-height:1; padding:0 2px; transition:color .1s;}
.hp-page .hp-pchip .hp-x:hover{color:#fff;}
.hp-page .hp-add-btn{flex:none; display:inline-flex; align-items:center; gap:5px; background:rgba(37,99,235,.16); border:1px solid rgba(59,130,246,.4); color:#bcd3ff; font-size:12.5px; padding:5px 13px; border-radius:999px; cursor:pointer;}
.hp-page .hp-add-btn:hover{background:rgba(37,99,235,.3);}
.hp-page .hp-add-pop{position:absolute; top:calc(100% + 6px); left:12px; right:12px; background:#0f1e36; border:1px solid rgba(212,168,83,.4); border-radius:12px; padding:10px; z-index:40; box-shadow:0 16px 40px rgba(0,0,0,.5); display:none;}
.hp-page .hp-add-pop.hp-open{display:block;}
.hp-page .hp-add-pop input{width:100%; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.18); border-radius:8px; color:#fff; font-size:13px; padding:8px 11px; outline:none; margin-bottom:8px;}
.hp-page .hp-add-pop input::placeholder{color:#7f93ab;}
.hp-page .hp-add-list{max-height:240px; overflow-y:auto; scrollbar-width:thin; scrollbar-color:rgba(212,168,83,.4) transparent;}
.hp-page .hp-ai{display:flex; align-items:center; gap:8px; padding:6px 9px; border-radius:7px; font-size:12.5px; color:#c6d3e4; cursor:pointer; transition:background .1s;}
.hp-page .hp-ai:hover{background:rgba(255,255,255,.07);}
.hp-page .hp-ai.hp-on{color:var(--gold-2);}
.hp-page .hp-ai .hp-st{flex:none; width:15px; height:15px; border-radius:4px; border:1px solid rgba(255,255,255,.35); display:flex; align-items:center; justify-content:center; font-size:9px; color:#241a02;}
.hp-page .hp-ai.hp-on .hp-st{background:linear-gradient(135deg,var(--gold-2),var(--gold)); border-color:transparent;}
.hp-page .hp-ai .hp-nm{flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.hp-page .hp-ai .hp-cty{flex:none; font-size:10px; color:#7f93ab; border:1px solid rgba(255,255,255,.16); border-radius:5px; padding:0 5px;}

/* cmp 表格 */
.hp-page .hp-cmp-table-wrap{border:1px solid rgba(212,168,83,.32); border-radius:13px; overflow:hidden; background:rgba(255,255,255,.03);}
.hp-page .hp-ct-row{display:grid; grid-template-columns:170px repeat(var(--cols,3),1fr); align-items:stretch; border-bottom:1px solid rgba(255,255,255,.08); transition:background .12s;}
.hp-page .hp-ct-row:last-child{border-bottom:none;}
.hp-page .hp-ct-row:nth-child(even):not(.hp-ct-head){background:rgba(255,255,255,.028);}
.hp-page .hp-ct-row:hover{background:rgba(212,168,83,.07);}
.hp-page .hp-ct-row.hp-ct-head{border-bottom:1px solid rgba(212,168,83,.4); background:linear-gradient(135deg, rgba(212,168,83,.16), rgba(212,168,83,.07));}
.hp-page .hp-ct-c{padding:11px 12px; font-size:12.5px; line-height:1.7; min-width:0; overflow-wrap:anywhere; word-break:break-word;}
.hp-page .hp-ct-c.hp-dim{font-weight:700; color:#fff; border-right:1px solid rgba(255,255,255,.08); display:flex; align-items:center; gap:8px; font-size:13px; position:relative;}
.hp-page .hp-ct-c.hp-dim::before{content:""; position:absolute; left:0; top:50%; transform:translateY(-50%); width:3px; height:16px; border-radius:0 2px 2px 0; background:linear-gradient(180deg, var(--gold-2), var(--gold)); opacity:.9;}
.hp-page .hp-ct-c.hp-dim svg{flex:none; color:var(--gold-2);}
.hp-page .hp-ct-c.hp-soft{color:#e6edf7; word-break:break-word;}
.hp-page .hp-ct-head .hp-ct-c.hp-soft{color:#fff; font-weight:700; font-size:14px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:7px; min-height:74px; position:relative;}
.hp-page .hp-ct-head .hp-ct-c.hp-soft::before{content:""; position:absolute; top:0; left:14px; right:14px; height:2px; border-radius:0 0 2px 2px; background:linear-gradient(90deg, rgba(212,168,83,.55), transparent);}
.hp-page .hp-ct-head .hp-ct-c.hp-soft .hp-dt{display:block; font-size:11px; color:#8fa3bd; font-weight:400;}
.hp-page .hp-ct-head .hp-ct-c.hp-soft .hp-dt a{display:inline-block; font-size:11px; color:#241a02; background:linear-gradient(135deg,var(--gold-2),var(--gold)); border-radius:999px; padding:2px 11px; text-decoration:none; font-weight:700; box-shadow:0 1px 4px rgba(0,0,0,.25);}

/* 徽章 */
.hp-page .hp-dim-row{display:block;}
.hp-page .hp-badge{display:inline-flex; align-items:center; font-size:10.5px; font-weight:700; padding:2px 8px; border-radius:999px; white-space:nowrap; margin:1px 2px 1px 0; box-shadow:0 1px 3px rgba(0,0,0,.18); vertical-align:middle;}
.hp-page .hp-badge.hp-y{background:linear-gradient(135deg,var(--gold-2),var(--gold)); color:#241a02;}
.hp-page .hp-badge.hp-b{background:rgba(37,99,235,.2); color:#bcd3ff; border:1px solid rgba(59,130,246,.4);}
.hp-page .hp-badge.hp-g{background:rgba(59,83,117,.55); color:#cfe0f2; border:1px solid rgba(255,255,255,.15);}
.hp-page .hp-badge.hp-n{background:transparent; color:#8fa3bd; border:1px dashed rgba(255,255,255,.25); box-shadow:none;}
.hp-page .hp-pld{font-size:11.5px; color:#8fa3bd; font-style:normal;}
.hp-page .hp-pld .hp-pld-link{color:#241a02; background:linear-gradient(135deg,var(--gold-2),var(--gold)); border-radius:999px; padding:2px 10px; text-decoration:none; font-weight:700; box-shadow:0 1px 4px rgba(0,0,0,.1); transition:filter .13s;}
.hp-page .hp-pld .hp-pld-link:hover{filter:brightness(1.08);}

/* cmp-foot */
.hp-page .hp-cmp-foot{display:flex; align-items:center; gap:10px; margin-top:11px; flex-wrap:wrap;}
.hp-page .hp-cmp-foot .hp-cf-note{font-size:11.5px; color:#8fa3bd; line-height:1.7; flex:1; min-width:200px;}
.hp-page .hp-cmp-foot .hp-cf-note b{color:var(--gold-2); font-weight:600;}
.hp-page .hp-cmp-foot .hp-cf-all{flex:none; font-size:12.5px; color:var(--gold-2); text-decoration:none; border:1px solid rgba(212,168,83,.4); padding:7px 16px; border-radius:999px; transition:background .12s; white-space:nowrap;}
.hp-page .hp-cmp-foot .hp-cf-all:hover{background:rgba(212,168,83,.12);}

/* ===== 4 Ticker（独立在 Hero 底部） ===== */
.hp-page .hp-ticker{position:relative; border-top:1px solid rgba(212,168,83,.28); background:rgba(8,20,40,.72); overflow:hidden; padding:8px 0;}
.hp-page .hp-tick-in{display:flex; gap:0; white-space:nowrap; width:max-content; animation:hp-tick 42s linear infinite;}
.hp-page .hp-ticker:hover .hp-tick-in{animation-play-state:paused;}
@keyframes hp-tick{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}
.hp-page .hp-tk{display:inline-flex; align-items:center; gap:9px; padding:0 22px; border-right:1px solid rgba(255,255,255,.07);}
.hp-page .hp-tk-sym{font-size:12.5px; font-weight:700; color:#fff;}
.hp-page .hp-tk-p{font-size:12px; color:#c6d3e4;}
.hp-page .hp-tk-chg{font-size:11.5px; font-weight:700; padding:1px 7px; border-radius:6px;}
.hp-page .hp-tk.hp-up .hp-tk-chg{color:#35d07f; background:rgba(22,163,74,.16);}
.hp-page .hp-tk.hp-dn .hp-tk-chg{color:#ff6b6b; background:rgba(200,30,46,.18);}
.hp-page .hp-tk-k{display:inline-flex; gap:2px; align-items:flex-end; height:14px;}
.hp-page .hp-tk-k i{width:3px; border-radius:1px;}
.hp-page .hp-tk.hp-up .hp-tk-k i{background:#35d07f;}
.hp-page .hp-tk.hp-dn .hp-tk-k i{background:#ff6b6b;}
.hp-page .hp-ticker-note{position:absolute; right:0; top:0; bottom:0; display:flex; align-items:center; padding:0 14px; font-size:10.5px; color:#8fa3bd; background:linear-gradient(90deg,transparent,#0a1628 55%); letter-spacing:.05em;}
@media (prefers-reduced-motion:reduce){.hp-page .hp-tick-in{animation:none;}}

/* ===== 5 平台核心功能 feats ===== */
.hp-page .hp-feats{display:grid; grid-template-columns:repeat(4,1fr); gap:14px;}
.hp-page .hp-feat{position:relative; display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); border-radius:15px; padding:20px 18px 15px; transition:box-shadow .15s, transform .15s, border-color .15s; overflow:hidden; text-decoration:none;}
.hp-page .hp-feat:hover{box-shadow:0 14px 32px rgba(10,22,40,.11); transform:translateY(-3px); border-color:var(--gold);}
.hp-page .hp-feat::before{content:""; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg,var(--fc,#c9a227),var(--fc2,#d4a853));}
.hp-page .hp-feat .hp-f-ic{width:44px; height:44px; border-radius:12px; display:flex; align-items:center; justify-content:center; margin-bottom:13px; background:color-mix(in srgb,var(--fc,#c9a227) 9%,#fff); border:1px solid color-mix(in srgb,var(--fc,#c9a227) 28%,transparent);}
.hp-page .hp-feat .hp-f-ic svg{color:var(--fc,#c9a227);}
.hp-page .hp-feat b{display:block; font-family:"Noto Serif SC","Songti SC",serif; font-size:15.5px; color:var(--text); font-weight:700;}
.hp-page .hp-feat .hp-f-sub{display:inline-block; font-size:10.5px; font-weight:700; color:var(--fc,#c9a227); background:color-mix(in srgb,var(--fc,#c9a227) 8%,#fff); border:1px solid color-mix(in srgb,var(--fc,#c9a227) 25%,transparent); padding:1px 9px; border-radius:999px; margin-top:7px; align-self:flex-start;}
.hp-page .hp-feat p{font-size:12px; color:var(--muted); line-height:1.75; margin-top:10px; flex:1;}
.hp-page .hp-feat .hp-f-go{display:flex; align-items:center; gap:5px; margin-top:12px; padding-top:11px; border-top:1px dashed var(--line); color:var(--fc,#c9a227); font-size:12.5px; font-weight:600;}

/* ===== 6 按市场 cats6 ===== */
.hp-page .hp-cats6{display:grid; grid-template-columns:repeat(6,1fr); gap:12px; margin-top:14px;}
.hp-page .hp-cat6{background:#fff; border:1px solid var(--line); border-radius:13px; padding:15px 14px; text-decoration:none; display:flex; flex-direction:column; gap:4px; transition:box-shadow .15s, border-color .15s, transform .15s; color:inherit;}
.hp-page .hp-cat6:hover{box-shadow:0 10px 28px rgba(10,22,40,.09); border-color:var(--gold); transform:translateY(-2px);}
.hp-page .hp-cat6 .hp-c6-t{display:flex; align-items:center; gap:7px; font-size:13.5px; color:var(--text); font-weight:700;}
.hp-page .hp-cat6 .hp-c6-t svg{color:var(--gold); flex:none;}
.hp-page .hp-cat6 span{font-size:11.5px; color:var(--muted);}
.hp-page .hp-cat6 .hp-c6-go{margin-left:auto; color:var(--gold); font-size:11.5px; font-weight:600;}

/* ===== 7 软件更新动态 upd ===== */
.hp-page .hp-sec-sub{font-size:12.5px; color:var(--muted); line-height:1.8; margin:-6px 0 14px; max-width:720px;}
.hp-page .hp-upd-filter{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:16px;}
.hp-page .hp-uf-btn{padding:7px 16px; border-radius:999px; border:1px solid var(--line); background:#fff; color:var(--muted); font-size:12.5px; cursor:pointer; font-family:inherit; transition:all .12s;}
.hp-page .hp-uf-btn:hover{border-color:var(--gold); color:var(--gold);}
.hp-page .hp-uf-btn.hp-on{background:linear-gradient(135deg,var(--gold-2),var(--gold)); color:#241a02; font-weight:700; border-color:transparent;}
.hp-page .hp-upd-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:14px;}
.hp-page .hp-upd-card{background:#fff; border:1px solid var(--line); border-radius:14px; padding:18px; display:flex; flex-direction:column; gap:9px; transition:box-shadow .15s, border-color .15s, transform .15s;}
.hp-page .hp-upd-card:hover{box-shadow:0 12px 30px rgba(10,22,40,.09); border-color:var(--gold); transform:translateY(-2px);}
.hp-page .hp-upd-top{display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
.hp-page .hp-upd-badge{display:inline-flex; align-items:center; gap:5px; font-size:10.5px; font-weight:700; color:#8a6d1f; background:var(--goldbg); border:1px solid rgba(201,162,39,.35); padding:3px 10px; border-radius:999px;}
.hp-page .hp-upd-date{margin-left:auto; font-size:11px; color:#94a3b8;}
.hp-page .hp-upd-title{font-family:"Noto Serif SC","Songti SC",serif; font-size:16.5px; color:var(--text); font-weight:700; line-height:1.45; text-decoration:none;}
.hp-page .hp-upd-title:hover{color:var(--gold);}
.hp-page .hp-upd-cat{display:inline-flex; align-self:flex-start; font-size:11px; color:var(--muted); border:1px solid var(--line); background:#f8fafc; padding:2px 10px; border-radius:6px;}
.hp-page .hp-upd-sum{font-size:12px; color:var(--muted); line-height:1.75; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; min-height:63px;}
.hp-page .hp-upd-meta{display:flex; gap:7px; flex-wrap:wrap;}
.hp-page .hp-um-chip{font-size:11px; font-weight:600; padding:3px 10px; border-radius:999px;}
.hp-page .hp-um-chip.hp-free{color:#15803d; background:rgba(22,163,74,.1); border:1px solid rgba(22,163,74,.3);}
.hp-page .hp-um-chip.hp-paid{color:#9a3412; background:rgba(234,88,12,.08); border:1px solid rgba(234,88,12,.3);}
.hp-page .hp-upd-acts{display:flex; gap:10px; margin-top:auto; padding-top:12px; border-top:1px dashed var(--line);}
.hp-page .hp-upd-link{font-size:12.5px; color:var(--gold); text-decoration:none; font-weight:600;}
.hp-page .hp-upd-link:hover{text-decoration:underline;}
.hp-page .hp-upd-link.hp-more{color:var(--muted); font-weight:400; margin-left:auto;}
.hp-page .hp-upd-link.hp-more:hover{color:var(--gold);}

/* ===== 11 内容中心 cc-tabs + zt-band ===== */
.hp-page .hp-cc-tabs{display:flex; gap:8px; margin-bottom:16px; flex-wrap:wrap;}
.hp-page .hp-cc-tab{padding:9px 20px; border-radius:999px; border:1px solid var(--line); background:#fff; color:var(--muted); font-size:13.5px; cursor:pointer; font-family:inherit; transition:all .12s; font-weight:600;}
.hp-page .hp-cc-tab:hover{border-color:var(--gold); color:var(--gold);}
.hp-page .hp-cc-tab.hp-on{background:linear-gradient(135deg,var(--gold-2),var(--gold)); color:#241a02; font-weight:700; border-color:transparent;}
.hp-page .hp-cc-panel{display:none;}
.hp-page .hp-cc-panel.hp-on{display:grid;}
.hp-page .hp-zt-band{grid-template-columns:repeat(3,1fr); gap:14px;}
.hp-page .hp-zt-card{background:#fff; border:1px solid var(--line); border-radius:13px; padding:16px 18px; text-decoration:none; display:flex; flex-direction:column; gap:8px; transition:box-shadow .15s, border-color .15s, transform .15s; position:relative; color:inherit;}
.hp-page .hp-zt-card:hover{box-shadow:0 12px 30px rgba(10,22,40,.1); transform:translateY(-2px); border-color:var(--zac,#c9a227);}
.hp-page .hp-zt-card::before{content:""; position:absolute; top:0; left:16px; right:16px; height:3px; border-radius:0 0 3px 3px; background:var(--zac,#c9a227); opacity:.85;}
.hp-page .hp-zt-card .hp-zt-t{display:flex; align-items:center; gap:6px; font-size:10.5px; font-weight:700; color:var(--zac,#c9a227); letter-spacing:.5px;}
.hp-page .hp-zt-card .hp-zt-t .hp-zm{display:inline-flex; align-items:center; gap:4px; font-size:10.5px; color:#94a3b8; letter-spacing:0; margin-left:auto; font-weight:400;}
.hp-page .hp-zt-card .hp-zt-t .hp-zm svg{color:#94a3b8;}
.hp-page .hp-zt-card b{font-size:14px; color:var(--text); font-weight:700; line-height:1.6; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:45px;}
.hp-page .hp-zt-card .hp-zt-go{font-size:12.5px; color:var(--zac,#c9a227); font-weight:600; margin-top:auto; padding-top:9px; border-top:1px dashed var(--line);}
.hp-page .hp-fraud-alert{margin-top:16px; background:linear-gradient(120deg,#fef2f2,#fff7ed); border:1px solid rgba(220,38,38,.3); border-radius:13px; padding:15px 20px; display:flex; align-items:center; gap:12px; flex-wrap:wrap; font-size:13px; color:#7f1d1d; line-height:1.8;}
.hp-page .hp-fraud-alert svg{flex:none; color:#dc2626;}
.hp-page .hp-fraud-alert .hp-fa-btn{margin-left:auto; background:#dc2626; color:#fff; font-weight:700; font-size:12.5px; padding:9px 20px; border-radius:9px; text-decoration:none;}
.hp-page .hp-fraud-alert .hp-fa-btn:hover{background:#b91c1c;}

/* ===== 12 免费 vs 白金会员 plans ===== */
.hp-page .hp-plans{position:relative; margin-top:6px; background:linear-gradient(180deg,var(--navy-900),#101f38); border:1px solid rgba(212,168,83,.35); border-radius:18px; overflow:hidden; box-shadow:0 18px 44px rgba(10,22,40,.22);}
.hp-page .hp-plans .hp-strip{height:5px; background:repeating-linear-gradient(-45deg, rgba(212,168,83,.55) 0 16px, rgba(212,168,83,.18) 16px 32px);}
.hp-page .hp-plans-in{padding:30px 30px 26px;}
.hp-page .hp-pl-head{display:flex; align-items:center; gap:14px; margin-bottom:22px; flex-wrap:wrap;}
.hp-page .hp-pl-t{font-family:"Noto Serif SC","Songti SC",serif; font-size:23px; font-weight:900; color:#fff;}
.hp-page .hp-pl-t em{font-style:normal; color:var(--gold-2);}
.hp-page .hp-pl-sub{font-size:13px; color:#9db0ca; margin-top:4px;}
.hp-page .hp-pl-badges{margin-left:auto; display:flex; gap:8px; flex-wrap:wrap;}
.hp-page .hp-plb{font-size:11px; font-weight:700; color:#e9d9ac; border:1px solid rgba(212,168,83,.4); background:rgba(212,168,83,.09); padding:4px 12px; border-radius:999px;}
.hp-page .hp-pl-table{display:grid; grid-template-columns:1fr 1fr 1.3fr; border:1px solid rgba(212,168,83,.25); border-radius:13px; overflow:hidden;}
.hp-page .hp-pt-row{display:contents;}
.hp-page .hp-pt-h,.hp-page .hp-pt-c{padding:12px 18px; font-size:13.5px; border-bottom:1px solid rgba(255,255,255,.07); display:flex; align-items:center; gap:9px; min-height:50px;}
.hp-page .hp-pt-h{justify-content:center; font-weight:800;}
.hp-page .hp-pt-h.hp-a{background:rgba(255,255,255,.04); color:#e8eef6; border-bottom:1px solid rgba(212,168,83,.35);}
.hp-page .hp-pt-h.hp-b{background:linear-gradient(135deg, rgba(212,168,83,.3), rgba(201,162,39,.15)); color:var(--gold-2); border-bottom:1px solid rgba(212,168,83,.5);}
.hp-page .hp-pt-c.hp-a{color:#c6d3e4; background:rgba(10,22,40,.25);}
.hp-page .hp-pt-c.hp-b{color:#fff; background:rgba(212,168,83,.07);}
.hp-page .hp-pt-c.hp-b b{color:var(--gold-2);}
.hp-page .hp-pt-c.hp-dim{color:#dbe5f1; font-weight:700; position:relative;}
.hp-page .hp-pt-c.hp-dim::before{content:""; width:4px; height:15px; border-radius:2px; background:var(--gold-2); flex:none;}
.hp-page .hp-pt-row:last-child .hp-pt-c{border-bottom:none;}
.hp-page .hp-ok,.hp-page .hp-no{display:inline-flex; width:18px; height:18px; border-radius:50%; align-items:center; justify-content:center; flex:none;}
.hp-page .hp-ok{background:rgba(22,163,74,.16); color:#4ade80;}
.hp-page .hp-no{background:rgba(200,30,46,.16); color:#ff6b6b;}
.hp-page .hp-pl-foot{display:flex; align-items:center; gap:16px; margin-top:22px; flex-wrap:wrap;}
.hp-page .hp-pf-note{font-size:12px; color:#8fa3bd; line-height:1.8; flex:1; min-width:220px;}
.hp-page .hp-pf-note b{color:var(--gold-2);}
.hp-page .hp-pl-cta{margin-left:auto; display:inline-flex; align-items:center; gap:8px; background:linear-gradient(135deg,var(--gold-2),var(--gold)); color:#241a02; font-weight:800; font-size:14.5px; padding:13px 30px; border-radius:10px; text-decoration:none; box-shadow:0 8px 22px rgba(0,0,0,.3);}
.hp-page .hp-pl-cta:hover{filter:brightness(1.08);}

/* ===== 13 Toast（深色金边） ===== */
.hp-toast{position:fixed; top:24px; left:50%; transform:translateX(-50%); background:var(--navy-900); color:#fff; border:1px solid var(--gold-2); border-radius:10px; padding:10px 22px; font-size:13px; font-weight:600; box-shadow:0 8px 24px rgba(0,0,0,.35), 0 0 0 3px rgba(212,168,83,.15); z-index:9999; animation:hp-toast-in .2s ease-out;}
@keyframes hp-toast-in{from{opacity:0; transform:translate(-50%,-8px);}to{opacity:1; transform:translate(-50%,0);}}

/* ===== 14 响应式 ===== */
@media (max-width:1020px){
  .hp-page .hp-hero-in{grid-template-columns:1fr; gap:30px; padding:44px 20px 46px;}
  .hp-page .hp-h-stats{gap:14px;}
  .hp-page .hp-cats6{grid-template-columns:repeat(3,1fr);}
  .hp-page .hp-upd-grid,.hp-page .hp-zt-band{grid-template-columns:repeat(2,1fr);}
  .hp-page .hp-feats{grid-template-columns:repeat(2,1fr);}
  .hp-page .hp-pl-badges{margin-left:0;}
}
@media (max-width:680px){
  .hp-page .hp-hero h1{font-size:29px;}
  .hp-page .hp-cats6{grid-template-columns:repeat(2,1fr);}
  .hp-page .hp-upd-grid,.hp-page .hp-zt-band{grid-template-columns:1fr;}
  .hp-page .hp-feats{grid-template-columns:1fr;}
  .hp-page .hp-ticker-note{display:none;}
  .hp-page .hp-pl-table{grid-template-columns:1fr;}
  .hp-page .hp-pt-h.hp-c,.hp-page .hp-pt-h.hp-a,.hp-page .hp-pt-h.hp-b{display:none;}
  .hp-page .hp-pt-c.hp-dim{background:rgba(10,22,40,.5); border-bottom:1px solid rgba(255,255,255,.1);}
  .hp-page .hp-pl-cta{width:100%; justify-content:center; margin-left:0;}
  .hp-page .hp-fraud-alert .hp-fa-btn{margin-left:0;}
  .hp-page .hp-ct-row{grid-template-columns:1fr;}
  .hp-page .hp-ct-c.hp-dim{grid-column:1/-1; border-right:none; border-bottom:1px dashed rgba(255,255,255,.1);}
  .hp-page .hp-ct-head{display:none;}
}