/* 职星记官网 · 方案 A（简洁产品页）
   设计规范沿用 App：纯紫系 · 白卡 + 0.5px 极浅边框 · 浅底 #F7F6FB · 禁渐变 */

:root{
  --p:#534AB7;        /* 主紫 */
  --p2:#3C3489;       /* 深紫 */
  --brand:#26215C;    /* 一级文字 */
  --t2:#5F5E5A;       /* 二级文字 */
  --t3:#888780;       /* 三级文字 */
  --bg:#F7F6FB;       /* 浅底 */
  --card:#FFFFFF;
  --line:rgba(38,33,92,.06);
  --line2:rgba(38,33,92,.10);
  --radius:12px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--card);color:var(--brand);
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  font-size:15px;line-height:1.8;-webkit-font-smoothing:antialiased;
}
a{color:var(--p);text-decoration:none}
a:hover{text-decoration:underline}

/* ---------- 顶部导航 ---------- */
.nav{
  border-bottom:.5px solid var(--line);
  background:rgba(255,255,255,.92);
  backdrop-filter:saturate(180%) blur(12px);
  position:sticky;top:0;z-index:10;
}
.nav .in{
  max-width:960px;margin:0 auto;padding:0 20px;height:56px;
  display:flex;align-items:center;gap:14px;
}
.nav .lg{
  font-size:16px;font-weight:700;letter-spacing:.5px;color:var(--brand);
  display:flex;align-items:center;gap:8px;
}
.nav .mk{
  width:24px;height:24px;border-radius:7px;background:var(--p);color:#fff;
  font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;
}
.nav .sp{flex:1}
.nav .lk{font-size:13px;color:var(--t2)}
.nav .lk:hover{color:var(--p)}

/* ---------- 通用容器 ---------- */
.wrap{max-width:960px;margin:0 auto;padding:0 20px}
.narrow{max-width:760px}

/* ---------- 首页 hero ---------- */
.hero{padding:64px 0 44px;text-align:center}
.hero h1{
  margin:0;font-size:34px;line-height:1.3;font-weight:800;letter-spacing:.5px;
}
.hero .sub{
  margin:14px auto 0;max-width:560px;font-size:16px;color:var(--t2);line-height:1.8;
}
.hero .meta{margin-top:10px;font-size:13px;color:var(--t3)}

.btn{
  display:inline-block;background:var(--p);color:#fff;font-size:15px;font-weight:700;
  padding:14px 32px;border-radius:var(--radius);margin-top:26px;
  border:none;cursor:pointer;transition:background .15s;
}
.btn:hover{background:var(--p2);text-decoration:none;color:#fff}
.btn.ghost{
  background:#fff;color:var(--p);border:1px solid var(--line2);margin-left:10px;
}
.btn.ghost:hover{background:var(--bg);color:var(--p2)}
.hint{margin-top:14px;font-size:12.5px;color:var(--t3)}

/* ---------- 功能卡 ---------- */
.feats{padding:8px 0 56px}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.card{
  background:var(--card);border:.5px solid var(--line);border-radius:var(--radius);
  padding:22px 20px;
}
.card .ic{
  width:34px;height:34px;border-radius:10px;background:#EEEDFE;color:var(--p);
  display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;
  margin-bottom:12px;
}
.card h3{margin:0 0 6px;font-size:15px;font-weight:700}
.card p{margin:0;font-size:13px;color:var(--t2);line-height:1.7}

/* ---------- 法务链接区 ---------- */
.links{padding:0 0 56px}
.links .box{
  background:var(--bg);border:.5px solid var(--line);border-radius:var(--radius);
  padding:24px 26px;
}
.links .ttl{font-size:14px;font-weight:700;margin-bottom:14px}
.links .rows{display:flex;flex-wrap:wrap;gap:10px 28px}
.links a{font-size:14px;color:var(--t2)}
.links a:hover{color:var(--p)}

/* ---------- 页脚（含备案号，硬要求） ---------- */
footer{border-top:.5px solid var(--line);background:var(--bg)}
footer .in{
  max-width:960px;margin:0 auto;padding:26px 20px 34px;
  font-size:12.5px;color:var(--t3);line-height:2;
}
footer .row{display:flex;flex-wrap:wrap;gap:6px 18px;margin-bottom:8px}
footer a{color:var(--t3)}
footer a:hover{color:var(--p)}
footer .icp{font-size:12px;color:var(--t3)}
footer .icp a{color:var(--t3);text-decoration:underline}

/* ---------- 文档页（隐私政策等） ---------- */
.doc{padding:40px 0 60px}
.doc h1{font-size:26px;font-weight:800;margin:0 0 8px;line-height:1.4}
.doc .dates{
  font-size:13px;color:var(--t3);padding-bottom:20px;
  border-bottom:.5px solid var(--line);margin-bottom:26px;
}
.doc h2{
  font-size:17px;font-weight:700;margin:32px 0 12px;line-height:1.5;
}
.doc h3{font-size:15px;font-weight:700;margin:22px 0 8px;color:var(--brand)}
.doc p{margin:0 0 14px;font-size:14.5px;color:var(--t2);line-height:1.9}
.doc ul{margin:0 0 14px;padding-left:20px}
.doc li{font-size:14.5px;color:var(--t2);line-height:1.9;margin-bottom:6px}
.doc .back{margin-top:40px;padding-top:22px;border-top:.5px solid var(--line);font-size:13.5px}

/* ---------- 响应式 ---------- */
@media(max-width:760px){
  .hero{padding:44px 0 32px;text-align:left}
  .hero h1{font-size:26px}
  .hero .sub{font-size:15px;margin-left:0}
  .grid{grid-template-columns:1fr 1fr;gap:12px}
  .card{padding:18px 16px}
  .btn{display:block;width:100%;text-align:center;padding:15px;margin-top:22px}
  .btn.ghost{margin-left:0;margin-top:10px}
  .doc{padding:28px 0 48px}
  .doc h1{font-size:22px}
  .doc h2{font-size:16px}
  .doc p,.doc li{font-size:14px}
}
@media(max-width:420px){
  .grid{grid-template-columns:1fr}
}