/* ============================================================
 * 远想海外 · 公共样式 v2 —— 「环球顾问」全新视觉体系（2026 重大改版）
 * ------------------------------------------------------------
 * 设计依据（留学 / 移民咨询行业属性）：
 *   ① 高信任门槛、低频高客单的决策 → 深海军蓝（权威、稳重、机构感）
 *   ② 客户多为家庭决策者与高净值人群 → 暖金点缀（品质、机遇、成功）
 *   ③ 跨境属性偏好温暖的人感而非冷冰冰的 SaaS 感 → 暖纸底 + 大留白 + 编辑式排版
 *   ④ 强监管需标注来源 → 来源链接、核实日期等「可信元素」在视觉上被放大
 * 保留全部 v1 选择器，确保 110 个静态页与既有 JS 渲染逻辑零改动兼容。
 * ============================================================ */
:root {
  /* —— 主色：机构权威 —— */
  --ink: #0d2436;
  --ink-2: #123a52;
  --ink-3: #1c4a66;

  /* —— 强调色：品质与机遇（"黄金签证"意象） —— */
  --gold: #b8893a;
  --gold-2: #d9b877;
  --gold-soft: #fbf3e4;
  --gold-line: #e6d3aa;

  /* —— 中性：暖纸体系（比冷灰更有温度、更显高级） —— */
  --paper: #f8f6f1;
  --card: #ffffff;
  --surface: #f4f1ea;
  --text: #1c2b36;
  --muted: #6b7a86;
  --border: #e9e3d8;

  /* —— 语义色 —— */
  --ok: #1e7a52;
  --ok-bg: #eaf5ef;
  --warn: #a86a12;
  --warn-bg: #fff8ec;
  --warn-line: #f0dca8;
  --danger: #b3261e;
  --danger-bg: #fdeceb;

  /* —— 兼容旧版引用别名（勿删！）——
   * 这些别名在 style.css 内部看似无人引用，但被以下「内联样式 / 生成页」真实消费：
   *   js/app.js:647,786（门槛显示）· pathways.html:25,29,33（统计数字）
   *   build-pages.js:391,467,485 → directory.html（目录页强调色）
   * 2026-09-21 已核验；删除会导致上述位置失去颜色。若要移除，需先迁移这些引用。 */
  --primary: var(--ink);
  --primary-dark: var(--ink-2);
  --accent: var(--gold);
  --bg: var(--paper);

  --radius: 14px;
  --radius-sm: 10px;
  --shadow-sm: 0 1px 2px rgba(13, 36, 54, .06), 0 1px 3px rgba(13, 36, 54, .04);
  --shadow-md: 0 6px 16px rgba(13, 36, 54, .08), 0 2px 6px rgba(13, 36, 54, .04);
  --shadow-lg: 0 18px 44px rgba(13, 36, 54, .16);
  --serif: "Songti SC", "STSong", "Noto Serif SC", Georgia, serif;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: -apple-system, "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
  background: var(--paper); color: var(--text); line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
a { color: var(--ink); text-decoration: none; }
a:hover { text-decoration: underline; }
.container { max-width: 1100px; margin: 0 auto; padding: 0 20px; }

/* ================= 顶部导航 ================= */
.site-header {
  background: rgba(255, 255, 255, .88);
  backdrop-filter: saturate(180%) blur(12px);
  -webkit-backdrop-filter: saturate(180%) blur(12px);
  border-bottom: 1px solid var(--border);
  position: sticky; top: 0; z-index: 50;
  box-shadow: 0 1px 0 rgba(184, 137, 58, .10);
}
.site-header .inner { display: flex; align-items: center; justify-content: space-between; min-height: 68px; gap: 16px; }

.logo {
  display: flex; align-items: center; gap: 10px;
  font-family: var(--serif);
  font-size: 21px; font-weight: 700; color: var(--ink);
  letter-spacing: .06em; text-decoration: none; white-space: nowrap;
}
/* 品牌徽标：远想海外 YK 标识（矢量资源，页头页脚共用）
   —— 页头（浅色底）用 assets/logo.svg 原色版；页脚（深蓝底）用 assets/logo-invert.svg 反白版 */
.brand-mark {
  flex: none; width: 34px; height: 34px; display: block;
}
/* 品牌文字块：主名 + 副标题纵向堆叠（页头页脚共用） */
.brand-txt { display: flex; flex-direction: column; line-height: 1.3; }
.logo small {
  font-family: -apple-system, "PingFang SC", sans-serif;
  font-size: 11.5px; color: var(--muted); font-weight: 400;
  letter-spacing: .1em; margin-top: 3px;
}
@media (max-width: 820px) {
  .logo small { display: none; }
  .logo .brand-mark { width: 30px; height: 30px; }
}

.nav { display: flex; gap: 2px; flex-wrap: wrap; align-items: center; }
.nav a {
  position: relative; padding: 8px 13px; border-radius: 8px;
  color: #3c4c5a; font-size: 14.5px; letter-spacing: .02em;
  transition: color .18s, background .18s;
}
.nav a:hover { color: var(--ink); background: rgba(184, 137, 58, .09); text-decoration: none; }
.nav a.active { color: var(--ink); font-weight: 600; }
.nav a.active::after {
  content: ""; position: absolute; left: 13px; right: 13px; bottom: 2px;
  height: 2px; border-radius: 2px; background: linear-gradient(90deg, var(--gold), var(--gold-2));
}
/* 导航右侧常驻咨询按钮 */
.nav .nav-cta {
  margin-left: 8px; padding: 8px 16px; border-radius: 999px;
  background: var(--ink); color: #fff; font-size: 14px; font-weight: 600;
}
.nav .nav-cta:hover { background: var(--ink-3); color: #fff; }
.nav .nav-cta.active::after { display: none; }
/* 停留在评估页时由该按钮承担「当前位置」提示；须压过 .nav a.active 的深色，否则深底深字不可读 */
.nav .nav-cta.active { color: #fff; }
/* 语言切换（中文 / EN）：置于咨询按钮右侧，描边弱化，不与深色 CTA 抢视觉；
   不参与 .nav a.active 的下划线（切换语言不代表当前栏目）。 */
.nav .nav-lang {
  margin-left: 4px; padding: 6px 11px; border-radius: 999px;
  border: 1px solid var(--border); color: #5a6a78; font-size: 13px; font-weight: 500;
  letter-spacing: .02em; white-space: nowrap;
}
.nav .nav-lang:hover { border-color: var(--gold); color: var(--gold); background: var(--gold-soft); text-decoration: none; }
.nav .nav-lang::after { display: none; }
/* ≤700px：原规则是把按钮整个 display:none，但导航里已删掉「免费评估」文字链，
   按钮成为唯一入口，必须保留；改为收紧留白让它换行排得下（不能隐藏）。 */
@media (max-width: 700px) {
  .site-header .inner { min-height: 58px; gap: 10px; flex-wrap: wrap; }
  .nav { gap: 0; }
  .nav a { padding: 7px 9px; font-size: 13.5px; }
  .nav .nav-cta { margin-left: 4px; padding: 7px 13px; font-size: 13.5px; }
  .nav .nav-lang { margin-left: 2px; padding: 6px 9px; font-size: 12.5px; }
}

/* ================= 按钮 ================= */
.btn {
  display: inline-block; padding: 13px 30px; border-radius: 10px; font-size: 16px;
  border: none; cursor: pointer; text-align: center; font-weight: 600;
  letter-spacing: .02em; transition: transform .15s, box-shadow .15s, background .15s;
}
.btn-primary { background: var(--ink); color: #fff; box-shadow: 0 4px 14px rgba(13, 36, 54, .22); }
.btn-primary:hover { background: var(--ink-3); text-decoration: none; transform: translateY(-1px); }
/* 金色主行动按钮：用于首屏等需要突出「机遇感」的位置 */
.btn-gold {
  background: linear-gradient(135deg, var(--gold-2), var(--gold));
  color: #2b1d05; box-shadow: 0 6px 18px rgba(184, 137, 58, .35);
}
.btn-gold:hover { text-decoration: none; transform: translateY(-1px); box-shadow: 0 8px 22px rgba(184, 137, 58, .45); }
.btn-ghost { background: #fff; color: var(--ink); border: 1px solid var(--border); }
.btn-ghost:hover { background: var(--surface); border-color: var(--gold-line); text-decoration: none; }
.btn:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.btn-sm { padding: 8px 16px; font-size: 14px; }

/* ================= 卡片与栅格 ================= */
.card {
  background: var(--card); border: 1px solid var(--border); border-radius: var(--radius);
  padding: 24px; box-shadow: var(--shadow-sm); transition: transform .18s, box-shadow .18s;
}
/* 卡片顶部金色细线：品质感的统一符号 */
.card::before {
  content: ""; display: block; width: 34px; height: 3px; border-radius: 3px;
  background: linear-gradient(90deg, var(--gold), var(--gold-2)); margin-bottom: 14px;
}
.card h3 { font-size: 17px; letter-spacing: .02em; }
.grid { display: grid; gap: 18px; }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 860px) { .grid-3 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 760px) { .grid-3, .grid-2 { grid-template-columns: 1fr; } }

/* ================= 区块与编辑式标题 ================= */
.section { padding: 52px 0; }
/* 金色眉标（eyebrow）：小字号 + 字距拉开，是高端编辑排版的核心特征 */
.eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12.5px; font-weight: 600; letter-spacing: .18em;
  color: var(--gold); text-transform: uppercase; margin-bottom: 10px;
}
.eyebrow::before { content: ""; width: 22px; height: 1px; background: var(--gold-line); }
/* 首页品牌主张（slogan）：主标题下方的金色标语，左右细线形成编辑式分隔 */
.hero-slogan {
  display: inline-flex; align-items: center; gap: 12px;
  margin: 0 0 18px; color: var(--gold);
  font-size: 16px; font-weight: 500; letter-spacing: .26em;
}
.hero-slogan::before, .hero-slogan::after {
  content: ""; width: 24px; height: 1px; background: var(--gold-line);
}
@media (max-width: 560px) {
  .hero-slogan { font-size: 14px; letter-spacing: .18em; gap: 9px; margin-bottom: 14px; }
  .hero-slogan::before, .hero-slogan::after { width: 16px; }
}
.section h2 { font-size: 26px; letter-spacing: .01em; margin-bottom: 8px; }
.section .sub { color: var(--muted); margin-bottom: 24px; font-size: 15px; }

/* ================= 免责声明 / 提示条 ================= */
.disclaimer {
  background: var(--gold-soft); color: var(--warn); font-size: 13px; line-height: 1.75;
  padding: 14px 18px; border-radius: var(--radius-sm);
  border: 1px solid var(--gold-line); border-left: 3px solid var(--gold);
  margin: 16px 0;
}
.disclaimer b { color: var(--ink); }

/* ================= 页脚 ================= */
.site-footer {
  border-top: 1px solid var(--border); background: var(--ink);
  color: rgba(255, 255, 255, .72); margin-top: 60px; padding: 42px 0 30px; font-size: 13px;
  background-image: linear-gradient(180deg, var(--ink-2), var(--ink));
}
.site-footer .inner { display: flex; flex-direction: column; gap: 12px; }
.site-footer a { color: rgba(255, 255, 255, .82); }
.site-footer a:hover { color: var(--gold-2); }
.site-footer .ft-brand {
  display: flex; align-items: center; gap: 10px;
  font-family: var(--serif); font-size: 19px; font-weight: 700;
  color: #fff; letter-spacing: .08em; margin-bottom: 4px;
}
.site-footer .ft-brand small {
  font-family: -apple-system, "PingFang SC", sans-serif;
  font-size: 11.5px; font-weight: 400; letter-spacing: .1em; color: rgba(255,255,255,.5);
}
.site-footer .ft-cols { display: flex; flex-wrap: wrap; gap: 36px; margin: 14px 0 18px; }
.site-footer .ft-col { min-width: 130px; }
.site-footer .ft-col b {
  display: block; color: #fff; font-size: 13px; letter-spacing: .1em;
  margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px solid rgba(255,255,255,.14);
}
.site-footer .ft-col a { display: block; margin-bottom: 7px; font-size: 13px; }
.site-footer .ft-legal { border-top: 1px solid rgba(255,255,255,.12); padding-top: 16px; line-height: 1.85; }
.site-footer .ft-links { margin-bottom: 6px; }
.site-footer .ft-links a { margin-right: 14px; }
.site-footer .ft-copy { color: rgba(255, 255, 255, .5); font-size: 12px; }

/* ================= 首页 Hero ================= */
.hero {
  position: relative; overflow: hidden;
  padding: 68px 0 60px;
  background:
    radial-gradient(900px 380px at 88% -12%, rgba(217, 184, 119, .22), transparent 62%),
    radial-gradient(760px 420px at 4% 108%, rgba(13, 36, 54, .07), transparent 60%),
    var(--paper);
}
/* 背景经纬弧线（纯 CSS，跨境/全球意象，不引入图片） */
.hero::before {
  content: ""; position: absolute; right: -140px; top: -120px;
  width: 460px; height: 460px; border-radius: 50%;
  border: 1px solid rgba(184, 137, 58, .18); pointer-events: none;
}
.hero::after {
  content: ""; position: absolute; right: -60px; top: -40px;
  width: 320px; height: 320px; border-radius: 50%;
  border: 1px solid rgba(184, 137, 58, .13); pointer-events: none;
}
.hero-grid {
  position: relative; z-index: 1;
  display: grid; grid-template-columns: 1.15fr .85fr; gap: 44px; align-items: center;
}
@media (max-width: 940px) { .hero-grid { grid-template-columns: 1fr; gap: 32px; } }
.hero h1 {
  font-size: 40px; line-height: 1.28; letter-spacing: .01em; margin-bottom: 16px; color: var(--ink);
}
.hero h1 em { font-style: normal; color: var(--gold); }
.hero p {
  color: var(--muted); font-size: 16.5px; line-height: 1.85; max-width: 560px; margin-bottom: 28px;
}
.hero-actions { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; }
.hero-trust {
  margin-top: 22px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 0;
  font-size: 13.5px; color: var(--muted);
}
.hero-trust > span { display: inline-flex; align-items: center; }
.hero-trust .chip {
  background: #fff; border: 1px solid var(--border); border-radius: 999px;
  padding: 5px 12px; font-size: 12.5px; color: #4a5b6b; box-shadow: var(--shadow-sm);
}

/* Hero 右侧「全球规划卡」 */
.hero-panel {
  background: linear-gradient(165deg, #123a52, #0d2436 62%);
  border: 1px solid rgba(217, 184, 119, .28); border-radius: 18px;
  padding: 24px; color: #fff; box-shadow: var(--shadow-lg); position: relative; overflow: hidden;
}
.hero-panel::after {
  content: ""; position: absolute; right: -50px; bottom: -60px;
  width: 200px; height: 200px; border-radius: 50%;
  border: 1px solid rgba(217, 184, 119, .22);
}
.hero-panel-hd {
  font-size: 12.5px; letter-spacing: .18em; color: var(--gold-2);
  text-transform: uppercase; margin-bottom: 4px;
}
.hero-panel h4 { font-size: 19px; font-weight: 600; margin-bottom: 18px; }
.hp-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 18px; }
.hp-stat { background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .12); border-radius: 12px; padding: 12px 14px; }
.hp-stat b { display: block; font-size: 24px; color: #fff; line-height: 1.25; font-weight: 700; }
.hp-stat span { font-size: 12px; color: rgba(255, 255, 255, .62); }
.hp-note { font-size: 12.5px; line-height: 1.8; color: rgba(255, 255, 255, .68); }
.hp-note b { color: var(--gold-2); font-weight: 600; }

/* ================= 三步流程卡 ================= */
.step-card { position: relative; }
/* 编号卡：以大号烫金数字作为唯一强调，避免与卡片顶部金线重复 */
.card.step-card::before { display: none; }
.step-num {
  font-family: var(--serif); font-size: 38px; font-weight: 700; line-height: 1;
  letter-spacing: .04em; margin-bottom: 10px; display: inline-block;
  background: linear-gradient(135deg, var(--gold-2), var(--gold));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}

/* ================= 评估表单 ================= */
.tabs { display: flex; gap: 10px; margin-bottom: 24px; }
.tabs button {
  flex: 1; padding: 15px; border-radius: var(--radius-sm); border: 1px solid var(--border);
  background: #fff; font-size: 16px; cursor: pointer; font-weight: 600; color: var(--muted);
  transition: all .18s;
}
.tabs button.active { border-color: var(--gold); color: var(--ink); background: var(--gold-soft); box-shadow: 0 2px 10px rgba(184,137,58,.16); }
.progress { height: 5px; background: var(--surface); border-radius: 3px; margin-bottom: 26px; overflow: hidden; }
.progress .bar { height: 100%; background: linear-gradient(90deg, var(--gold), var(--ink)); border-radius: 3px; transition: width .3s; }
/* 注：评估表单为「单步重渲染」模式（app.js buildForm 覆写 #step-body），
       v1 的 .form-step / .form-step.active 分步显隐规则已无对应 DOM，2026-09-21 清理。 */
.field { margin-bottom: 20px; }
.field label { display: block; font-weight: 600; margin-bottom: 8px; letter-spacing: .02em; }
.field .hint { font-weight: 400; color: var(--muted); font-size: 13px; }
.field input[type=text], .field input[type=tel], .field select {
  width: 100%; padding: 12px 14px; border: 1px solid var(--border); border-radius: var(--radius-sm);
  font-size: 15px; background: #fff; transition: border-color .18s, box-shadow .18s;
}
.field input[type=text]:focus, .field input[type=tel]:focus, .field select:focus {
  outline: none; border-color: var(--gold); box-shadow: 0 0 0 3px rgba(184, 137, 58, .14);
}
.field.invalid input, .field.invalid select { border-color: var(--danger); }
.field .err { color: var(--danger); font-size: 13px; display: none; }
.field.invalid .err { display: block; }
.choice-group { display: flex; flex-wrap: wrap; gap: 10px; }
.choice-group button {
  padding: 10px 18px; border-radius: 999px; border: 1px solid var(--border);
  background: #fff; cursor: pointer; font-size: 14px; color: #4a5b6b; transition: all .16s;
}
.choice-group button:hover { border-color: var(--gold-line); background: var(--gold-soft); }
.choice-group button.selected {
  border-color: var(--gold); background: linear-gradient(135deg, var(--gold-soft), #fff);
  color: var(--ink); font-weight: 600; box-shadow: 0 2px 8px rgba(184,137,58,.18);
}
.form-nav { display: flex; justify-content: space-between; margin-top: 28px; gap: 12px; }

/* ================= 结果 ================= */
.result-badge { display: inline-block; padding: 4px 13px; border-radius: 999px; font-size: 13px; font-weight: 600; }
.badge-match { background: var(--ok-bg); color: var(--ok); }
.badge-gap { background: var(--warn-bg); color: var(--warn); }
.badge-no { background: var(--danger-bg); color: var(--danger); }
.result-item {
  border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 18px;
  margin-bottom: 12px; background: #fff; box-shadow: var(--shadow-sm);
  transition: transform .16s, box-shadow .16s;
}
.result-item:hover { transform: translateY(-1px); box-shadow: var(--shadow-md); }
/* 语言门槛提示条 */
.notice {
  background: var(--warn-bg); border: 1px solid var(--warn-line); border-left: 4px solid var(--gold);
  color: #6b4a06; padding: 13px 15px; border-radius: var(--radius-sm);
  font-size: 14px; line-height: 1.75; margin-bottom: 12px;
}
.tag[title] { cursor: help; }
.result-item .head { display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; }
.lead-cta {
  margin-top: 22px; text-align: center; padding: 26px;
  background: linear-gradient(165deg, var(--gold-soft), #fff);
  border: 1px solid var(--gold-line); border-radius: var(--radius);
}

/* ================= 信息库 ================= */
.filter-bar { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 20px; }
.filter-bar select, .filter-bar input {
  padding: 10px 13px; border: 1px solid var(--border); border-radius: var(--radius-sm);
  font-size: 14px; background: #fff; color: var(--text);
  /* select 的固有宽度由最长选项决定（如「圣多美和普林西比」），窄屏会撑破视口导致整页横向滚动；
     min-width:0 让 flex 子项可收缩，max-width:100% 兜住上限。 */
  min-width: 0; max-width: 100%;
}
.filter-bar select:focus, .filter-bar input:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 3px rgba(184,137,58,.14); }
.uni-card h3 { font-size: 17px; margin-bottom: 4px; letter-spacing: .02em; }
.uni-card .meta { color: var(--muted); font-size: 13px; }
.tag {
  display: inline-block; background: var(--surface); border: 1px solid var(--border);
  border-radius: 7px; padding: 3px 9px; font-size: 12px; margin: 3px 5px 3px 0; color: #4a5b6b;
}
a.tag:hover { background: var(--gold-soft); border-color: var(--gold-line); color: var(--ink); text-decoration: none; }
.tag .n { color: #93a0ad; font-size: 11px; margin-left: 4px; }
.coverage-stat { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.coverage-stat div {
  flex: 1 1 120px; background: var(--gold-soft); border: 1px solid var(--gold-line);
  border-radius: var(--radius-sm); padding: 12px; text-align: center;
}
.coverage-stat b { display: block; font-size: 22px; color: var(--gold); line-height: 1.25; font-weight: 700; }
.coverage-stat span { font-size: 12px; color: var(--muted); }
.coverage-note { font-size: 12px; color: var(--muted); margin-top: 10px; line-height: 1.8; }
.detail-row { margin: 6px 0; font-size: 14px; }
.detail-row b { color: var(--muted); font-weight: 600; margin-right: 6px; }
/* 来源行：合规与可信度的视觉锚点，刻意做得清晰可辨 */
.source-line {
  border-top: 1px dashed var(--border); margin-top: 14px; padding-top: 11px;
  font-size: 12.5px; color: var(--muted); line-height: 1.8;
}
/* 信息源超链接：有官方链接时渲染为可点击，方便用户跳转核验真伪 */
.src-link { color: var(--ink); text-decoration: underline; text-underline-offset: 2px; font-weight: 600; text-decoration-color: var(--gold-line); }
.src-link:hover { color: var(--gold); }

/* ================= 静态页底部迷你留资表单 ================= */
.mini-lead { margin-top: 30px; }
.mini-lead-card {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px;
  padding: 22px 24px; border: 1px solid var(--gold-line); border-radius: var(--radius);
  background: linear-gradient(160deg, #fffdf8, var(--gold-soft));
  box-shadow: var(--shadow-sm);
}
.mini-lead-copy { flex: 1 1 280px; font-size: 14.5px; line-height: 1.7; color: #2c3a4b; }
.mini-lead-copy b { display: block; font-size: 17px; margin-bottom: 5px; color: var(--ink); letter-spacing: .02em; }
.mini-lead-copy span { color: var(--muted); }
.mini-lead-form { flex: 1 1 300px; display: flex; flex-direction: column; gap: 10px; }
.mini-lead-form .ml-row { display: flex; gap: 8px; }
.ml-sel {
  padding: 11px 12px; border: 1px solid var(--border); border-radius: var(--radius-sm);
  font-size: 14px; background: #fff; color: #2c3a4b; min-width: 96px;
}
.ml-input {
  flex: 1; padding: 11px 13px; border: 1px solid var(--border); border-radius: var(--radius-sm);
  font-size: 14px; min-width: 0;
}
.ml-input:focus, .ml-sel:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 3px rgba(184,137,58,.14); }
.ml-agree { font-size: 12.5px; color: var(--muted); display: flex; align-items: flex-start; gap: 6px; cursor: pointer; }
.ml-agree input { margin-top: 2px; accent-color: var(--gold); }
.ml-btn { width: 100%; }
.ml-err { color: var(--danger); font-size: 12.5px; }
.mini-lead-done {
  padding: 18px 20px; border: 1px solid #bfe3c6; border-radius: var(--radius);
  background: #f1faf3; color: var(--ok); font-size: 15px; font-weight: 600; line-height: 1.6;
}
@media (max-width: 560px) {
  .mini-lead-card { flex-direction: column; align-items: stretch; }
  .mini-lead-form .ml-row { flex-direction: column; }
  .ml-sel { width: 100%; }
}

/* ================= 护照 / 居留项目对比表 ================= */
.cmp-legend { font-size: 12px; color: var(--muted); margin: 4px 0 12px; }
.cmp-legend .cmp-res { margin: 0 2px 0 0; }
.cmp-scroll {
  overflow-x: auto; -webkit-overflow-scrolling: touch; margin-bottom: 6px;
  border-radius: var(--radius); box-shadow: var(--shadow-md); border: 1px solid var(--border);
}
.cmp-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 13px; min-width: 980px; table-layout: fixed; }
.cmp-table thead th {
  position: sticky; top: 0; background: linear-gradient(180deg, var(--ink-2), var(--ink)); color: #fff;
  padding: 12px 10px; border-bottom: 2px solid var(--gold);
  font-weight: 600; text-align: center; white-space: nowrap; z-index: 1; letter-spacing: .04em;
}
/* 数据行：**全部 9 列一律垂直居中**（2026-09-22 由 vertical-align:top 改为 middle）——
   行高由内容最多的「特点 / 作用」「关键提醒」列决定，短内容列居中后整行视觉才齐；
   水平方向保持原分工：短数据列（2/4/5/6/7）居中、长文本列（3/8/9）左对齐。 */
.cmp-table tbody td {
  padding: 10px 12px; border-bottom: 1px solid var(--border); border-right: 1px solid var(--border);
  vertical-align: middle; line-height: 1.55; text-align: left;
}
/* 「项目 / 国家」列：国家名与「居留类 / 特别项目」徽章整体水平 + 垂直居中（表头已居中，保持一致） */
.cmp-table tbody td:first-child {
  border-left: 1px solid var(--border); font-weight: 600; color: var(--ink);
  text-align: center; vertical-align: middle;
}
/* 徽章左外边距归零：与国家名同行时靠源码空格分隔，换行时也能正好居中（行首空格会被折叠） */
.cmp-table tbody td:first-child .cmp-res { margin-left: 0; }
.cmp-table tbody tr:nth-child(even) td { background: #fbfaf7; }
.cmp-table tbody tr:hover td { background: var(--gold-soft); }
.cmp-table .cmp-nowrap { text-align: center; }
.cmp-table .cmp-feat { line-height: 1.6; color: #26404f; }
.cmp-table .cmp-note { line-height: 1.9; color: var(--muted); padding-top: 12px; padding-bottom: 12px; }
.cmp-table .cmp-empty { text-align: center; color: #c8cfd6; }
.cmp-table .cmp-divider td {
  background: var(--surface); font-weight: 600; color: var(--muted);
  text-align: center; padding: 9px; letter-spacing: .08em;
}
.cmp-table .cmp-special td { background: var(--gold-soft) !important; }
.cmp-table .cmp-special td:first-child { border-left: 3px solid var(--gold); }
/* —— 列宽：严格保留 v1 数值，改动会重排整个表格 —— */
.cmp-table th:nth-child(1), .cmp-table td:nth-child(1) { width: 9%; }
.cmp-table th:nth-child(2), .cmp-table td:nth-child(2) { width: 9%; }
.cmp-table th:nth-child(3), .cmp-table td:nth-child(3) { width: 13%; }
.cmp-table th:nth-child(4), .cmp-table td:nth-child(4) { width: 10%; }
.cmp-table th:nth-child(5), .cmp-table td:nth-child(5) { width: 9%; }
.cmp-table th:nth-child(6), .cmp-table td:nth-child(6) { width: 8%; }
.cmp-table th:nth-child(7), .cmp-table td:nth-child(7) { width: 12%; }
.cmp-table th:nth-child(8), .cmp-table td:nth-child(8) { width: 17%; }
.cmp-table th:nth-child(9), .cmp-table td:nth-child(9) { width: 13%; }
.cmp-res { display: inline-block; margin-left: 5px; padding: 1px 7px; border-radius: 4px; font-size: 11px; font-weight: 600; vertical-align: middle; }
.cmp-res--res { background: var(--gold-soft); color: var(--gold); border: 1px solid var(--gold-line); }
.cmp-res--special { background: var(--gold); color: #fff; }

/* ================= 弹窗 ================= */
.modal-mask {
  position: fixed; inset: 0; background: rgba(13, 36, 54, .5);
  backdrop-filter: blur(2px); display: none; align-items: center; justify-content: center;
  z-index: 100; padding: 16px;
}
.modal-mask.show { display: flex; }
.modal {
  background: #fff; border-radius: 16px; max-width: 560px; width: 100%;
  max-height: 84vh; overflow: auto; padding: 28px; box-shadow: var(--shadow-lg);
}
.modal h3 { margin-bottom: 12px; font-size: 19px; letter-spacing: .02em; }
.modal .close-x { float: right; border: none; background: none; font-size: 20px; cursor: pointer; color: var(--muted); }
.modal .close-x:hover { color: var(--ink); }
.modal .agreement {
  font-size: 13px; background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius-sm); padding: 13px; max-height: 140px; overflow: auto; margin: 12px 0;
  line-height: 1.8;
}
.modal .agreement label { display: flex; gap: 8px; align-items: flex-start; font-size: 13px; }
.modal .agreement input { margin-top: 3px; accent-color: var(--gold); }
/* 授权未勾选时的页内警示（与 .field .err 同一视觉语言，替代原先的原生 alert）
   注意：提示必须放在 .agreement 之外 —— 该容器有 max-height:140px + overflow:auto，
   放在里面会被裁在滚动区底部，用户根本看不到。 */
.modal .agree-err { color: var(--danger); font-size: 12.5px; display: none; margin: -4px 0 10px; }
.modal .agree-err.show { display: block; }
.modal .agreement.invalid { border-color: var(--danger); }

.empty { text-align: center; color: var(--muted); padding: 48px 0; }
.page-title { padding: 42px 0 4px; }
.page-title h1 { font-size: 30px; letter-spacing: .01em; line-height: 1.4; }
.page-title .sub { color: var(--muted); margin-top: 6px; font-size: 15px; line-height: 1.8; }

/* ================= 评估报告（留资后交付） ================= */
.report-modal { max-width: 840px; padding: 0; border-radius: 16px; overflow: hidden; }
.report-actions {
  position: sticky; top: 0; display: flex; align-items: center; gap: 10px; padding: 14px 22px;
  border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, #fbf8f2, #fff); z-index: 2;
}
/* 标题用 flex:1 1 auto + min-width:0：既能占满剩余空间，又不会被右侧按钮挤到零宽
   （原来写在内联 style 里的 flex:1 是 basis 0，窄屏会把标题压成一列单字） */
.report-actions > span { font-weight: 600; letter-spacing: .02em; flex: 1 1 auto; min-width: 0; }
#rep-scroll { padding: 24px 26px 30px; }
.report-doc { font-size: 13px; line-height: 1.75; }
.rep-head { border-bottom: 2px solid var(--gold); padding-bottom: 12px; margin-bottom: 18px; }
.rep-head h2 { font-size: 22px; margin-bottom: 6px; letter-spacing: .02em; }
.rep-meta { color: var(--muted); font-size: 12px; }
.rep-h4 { font-size: 15px; margin: 22px 0 8px; padding-left: 9px; border-left: 3px solid var(--gold); letter-spacing: .02em; }
.rep-desc { color: var(--muted); font-size: 12.5px; margin-bottom: 8px; }
.rep-table { width: 100%; border-collapse: collapse; font-size: 12.5px; margin: 6px 0; }
.rep-table th, .rep-table td { border: 1px solid var(--border); padding: 8px 10px; text-align: left; vertical-align: top; }
.rep-table thead th { background: var(--surface); color: var(--ink); letter-spacing: .04em; }
.rep-table tbody th { background: #fcfbf8; color: var(--muted); font-weight: 600; white-space: nowrap; }
.rep-sub { color: var(--muted); font-size: 11.5px; margin-top: 2px; }
/* 报告表格的横向滚动容器：窄屏时保住列宽，避免 4–5 列表格被压成「一行一个字」 */
.rep-scroll-x { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.rep-scroll-x .rep-table { margin: 6px 0; }
.rep-list { padding-left: 20px; margin: 6px 0; }
.rep-list li { margin: 5px 0; }
.rep-path { border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 14px; margin-bottom: 10px; background: #fffdf8; }
.rep-path-title { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; gap: 10px; }
.rep-badge { font-size: 12px; padding: 3px 10px; border-radius: 20px; white-space: nowrap; font-weight: 600; }
.rep-match { background: var(--ok-bg); color: var(--ok); }
.rep-gap { background: var(--warn-bg); color: var(--warn); }
.rep-no { background: var(--danger-bg); color: var(--danger); }
.rep-footer { margin-top: 22px; border-top: 1px dashed var(--border); padding-top: 12px; font-size: 12px; color: var(--muted); line-height: 1.8; }
.rep-footer p { margin: 4px 0; }

/* 窄屏修正：报告弹窗标题原用内联 flex:1（basis 0），会被两个按钮挤成竖排单字；
   改为标题独占一行，按钮换行；4–5 列表格给最小宽度，靠容器横向滚动保住可读性。 */
@media (max-width: 640px) {
  .report-actions { flex-wrap: wrap; padding: 12px 16px; }
  .report-actions > span { flex: 1 1 100%; }
  #rep-scroll { padding: 18px 16px 24px; }
  .rep-scroll-x .rep-wide { min-width: 460px; }
}

/* 打印 / 导出 PDF：只输出报告正文 */
@media print {
  body > *:not(.report-mask) { display: none !important; }
  .report-mask { position: static; background: none; padding: 0; display: block; }
  .report-modal { max-width: none; max-height: none; border-radius: 0; box-shadow: none; }
  .no-print { display: none !important; }
  #rep-scroll { padding: 0; }
  /* 打印时取消横向滚动与最小宽度，避免 A4 幅面被裁切 */
  .rep-scroll-x { overflow: visible; }
  .rep-table { min-width: 0 !important; }
  .report-doc { font-size: 12px; }
  @page { margin: 14mm; }
}

/* ================= 进度暂存召回（P1-3） ================= */
.draft-tip {
  display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap;
  background: var(--gold-soft); border: 1px solid var(--gold-line); border-radius: var(--radius-sm);
  padding: 13px 17px; margin-bottom: 16px; font-size: 14px; color: #4a3a16;
}
.draft-tip-btns { display: flex; gap: 8px; flex-shrink: 0; }

/* ================= 结果页二级钩子（P1-4） ================= */
.hook-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; margin-top: 12px; }
.hook-card {
  border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 15px;
  background: #fffdf8; display: flex; flex-direction: column; gap: 6px;
}
.hook-card b { font-size: 14px; letter-spacing: .02em; }
.hook-card span { color: var(--muted); font-size: 12.5px; line-height: 1.65; }
.hook-card .btn { margin-top: auto; }
.hook-urgent { background: var(--danger-bg); border-color: #f0c8c5; }
.hook-urgent .urgent-tag { color: var(--danger); font-size: 12px; font-weight: 600; }

/* ================= 重点资讯（news.html） ================= */
.news-card { margin-bottom: 12px; }
.news-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.news-date { color: var(--muted); font-size: 12.5px; }
.news-new { background: var(--ok-bg); color: var(--ok); font-size: 12px; padding: 2px 9px; border-radius: 20px; font-weight: 600; }
.news-card h3 { font-size: 16.5px; line-height: 1.55; margin-bottom: 6px; letter-spacing: .02em; }
.news-sum { color: #3d4d5c; font-size: 14px; line-height: 1.8; }
.news-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 12px; }
.source-mini { color: var(--muted); font-size: 12.5px; }

/* ================= 全站常驻「微信咨询」浮窗 ================= */
.cw-wrap { position: fixed; right: 20px; bottom: 20px; z-index: 90; }
.cw-btn {
  display: inline-flex; align-items: center; gap: 7px; padding: 12px 18px; border: none; border-radius: 999px;
  background: linear-gradient(135deg, var(--gold-2), var(--gold)); color: #2b1d05;
  font-size: 15px; font-weight: 700; cursor: pointer;
  box-shadow: 0 8px 24px rgba(184, 137, 58, .4); transition: transform .2s, box-shadow .2s;
}
.cw-btn:hover { transform: translateY(-2px); box-shadow: 0 12px 30px rgba(184, 137, 58, .5); }
.cw-btn .cw-ico { font-size: 17px; }
.cw-btn.cw-btn-hidden { display: none; }
.cw-panel {
  position: absolute; right: 0; bottom: 60px; width: 322px; max-width: calc(100vw - 36px);
  background: #fff; border: 1px solid var(--border); border-radius: 16px; padding: 18px;
  box-shadow: var(--shadow-lg); display: none;
}
.cw-panel.open { display: block; }
.cw-close { position: absolute; top: 8px; right: 10px; border: none; background: none; font-size: 22px; line-height: 1; color: var(--muted); cursor: pointer; }
.cw-close:hover { color: var(--ink); }
.cw-panel-hd { margin-bottom: 12px; padding-right: 20px; }
.cw-panel-hd b { font-size: 15px; letter-spacing: .02em; }
.cw-panel-hd span { display: block; color: var(--muted); font-size: 12px; margin-top: 3px; }
.cw-note { font-size: 11.5px; color: var(--muted); margin: 8px 0 0; line-height: 1.7; }

/* 二维码卡片（浮窗用） */
.wx-qr-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.wx-qr {
  margin: 0; text-align: center; border: 1px solid var(--border); border-radius: var(--radius-sm);
  padding: 9px; background: #fffdf8;
}
.wx-qr img { width: 100%; max-width: 132px; height: auto; display: block; margin: 0 auto; border-radius: 6px; }
.wx-qr figcaption { font-size: 12.5px; font-weight: 600; margin-top: 6px; color: var(--text); line-height: 1.45; }
.wx-qr figcaption small { display: block; font-weight: 400; color: var(--muted); font-size: 11.5px; margin-top: 2px; }

@media (max-width: 900px) { .hero h1 { font-size: 32px; } .section h2 { font-size: 23px; } }
@media (max-width: 560px) {
  .container { padding: 0 16px; }
  .hero { padding: 44px 0 40px; }
  .hero h1 { font-size: 27px; }
  .hero p { font-size: 15px; }
  .hero-actions .btn { width: 100%; }
  .hp-stats { grid-template-columns: 1fr 1fr; }
  .page-title h1 { font-size: 23px; }
  .site-footer .ft-cols { gap: 24px; }
}
@media (max-width: 480px) {
  .cw-wrap { right: 12px; bottom: 12px; }
  .cw-panel { width: calc(100vw - 24px); right: 0; bottom: 56px; }
  .cw-btn .cw-txt { display: none; }
  .cw-btn { width: 52px; height: 52px; padding: 0; justify-content: center; border-radius: 50%; }
  .cw-btn .cw-ico { font-size: 22px; }
}
@media print {
  .cw-wrap { display: none !important; }
}
