/* ============================================================
   站点外壳 chrome.css —— 新品档案（/promo）共用的顶部导航 + 页脚 + 面包屑
   作用：让每个独立产品页都带上与主站一致的导航，可一键返回官网，
        并可在产品页间互相跳转。列表页与产品页均 <link> 本文件。
   路径说明：列表页(promo/index.html)用 assets/chrome.css；
            产品页(promo/xxx/index.html)用 ../assets/chrome.css
   ============================================================ */

/* 顶部站点导航 */
.site-header{position:sticky;top:0;z-index:100;
  background:rgba(8,18,40,.94);backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(120,170,230,.18)}
.site-header .bar{max-width:1180px;margin:0 auto;padding:0 24px;height:62px;
  display:flex;align-items:center;justify-content:space-between;gap:18px}
.site-brand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:.5px;
  color:#e8f1ff;white-space:nowrap;font-size:16px}
.site-brand:hover{color:#e8f1ff}
.site-brand .logo-dot{width:14px;height:14px;border-radius:50%;
  background:radial-gradient(circle,#22d3ee,#3b82f6);box-shadow:0 0 14px #22d3ee}
.site-brand .sub{font-size:11px;color:#9fb4d4;font-weight:600;letter-spacing:1px;
  margin-left:6px;border-left:1px solid rgba(120,170,230,.3);padding-left:8px}
.site-nav{display:flex;gap:20px;font-size:14.5px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.site-nav a{color:#9fb4d4;transition:.2s;white-space:nowrap}
.site-nav a:hover{color:#e8f1ff}
.site-nav a.active{color:#22d3ee;font-weight:700}

/* 面包屑（产品页用） */
.crumb{background:rgba(10,22,51,.55);border-bottom:1px solid rgba(120,170,230,.12);
  font-size:13px;color:#9fb4d4}
.crumb .wrap{max-width:1180px;margin:0 auto;padding:11px 24px}
.crumb a{color:#9fb4d4}.crumb a:hover{color:#22d3ee}
.crumb span{margin:0 8px;opacity:.55}
.crumb em{color:#e8f1ff;font-style:normal}

/* 站点页脚 */
.site-footer{background:#061027;border-top:1px solid rgba(120,170,230,.18);
  padding:30px 0;color:#9fb4d4;font-size:13.5px}
.site-footer .bar{max-width:1180px;margin:0 auto;padding:0 24px;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;align-items:center}
.site-footer a{color:#9fb4d4}.site-footer a:hover{color:#22d3ee}
.site-footer .links{display:flex;gap:18px;flex-wrap:wrap}

@media(max-width:760px){
  .site-header .bar{height:auto;padding-top:10px;padding-bottom:10px;flex-direction:column;align-items:flex-start}
  .site-nav{justify-content:flex-start;gap:14px}
}