/* ============================================================
   无人机培训系统 v2 — 航天政企风设计系统 (Aerospace Corporate)
   基准：中国航天科技集团官网风格
   白底 + 航天钢蓝 #1a5fa8 主色 + 规整版式 + 深灰页脚
   语义色保留红黄绿状态体系
   ============================================================ */

/* ============================================================
   无人机培训系统 v2 — 视觉系统 v2「航图 Aeronautical Drafting」
   ------------------------------------------------------------
   · 保留品牌钢蓝（既定品牌色，不改），把 Arco 默认色板换成自建调色
   · 核心手法：细线分隔（非投影）、小圆角（工业感）、等宽表格数字、
     单一强调色 + 一点黄铜色点缀（约 3%，用于规则线/小标签/激活指示）
   · 去掉装饰性渐变、粉彩图标底、彩虹按钮 —— 这三样是「AI 生成感」主要来源
   · 颜色用 hex 而非 oklch()：本系统要跑微信内置浏览器与老安卓，兼容优先
   ============================================================ */

:root {
  /* —— 品牌与强调 —— */
  --primary: #1b5e9e;
  --primary-aux: #3579bd;
  --primary-light: #eaf2fb;
  --primary-dark: #12497f;
  --accent: var(--primary);
  --accent-soft: #eaf2fb;
  --accent-line: #c3d9ef;
  --accent-ink: #12497f;
  --brass: #a8763a;          /* 次强调：航天黄铜，克制使用 */
  --brass-soft: #f7f0e4;

  /* —— 语义色（保留红黄绿状态体系，饱和度下调一档更耐看）—— */
  --success: #0f9d58;
  --success-light: #e9f7ef;
  --warning: #c9761a;
  --warning-light: #fdf3e6;
  --danger: #d92d20;
  --danger-light: #fdecea;
  --info: #1b5e9e;

  /* —— 中性阶（冷调石墨，比 Arco 灰更沉）—— */
  --ink: #1b2430;
  --ink-2: #4a5568;
  --ink-3: #5f6a78;         /* 2026-09-15 可读性：原 #5f6a78 在白底仅 3.06:1、浅灰底 2.77:1，低于 WCAG AA 的 4.5:1；改为 #5f6a78 后各类浅底最差 4.87:1（仍与正文色 #4a5568 保持层级差） */
  --ink-4: #b6bfcc;
  --gray: #5f6a78;
  --gray-light: #ccd3dc;
  --gray-bg: #f1f4f7;
  --text-primary: var(--ink);
  --text-secondary: var(--ink-2);
  --text-tertiary: var(--ink-3);
  --border: #e3e7ec;
  --border-color: #e3e7ec;
  --border-strong: #d3d9e0;

  /* —— 表面 —— */
  --card-bg: #ffffff;
  --surface: #ffffff;
  --surface-2: #fafbfc;
  --bg-body: #f6f7f9;
  --bg-deep: #eef1f5;
  --input-bg: #ffffff;

  --grad-brand: linear-gradient(180deg, var(--primary) 0%, var(--primary-dark) 100%);
  --grad-hero: linear-gradient(180deg, #17517f 0%, #12497f 100%);
  --grad-panel: none;

  /* —— 圆角：工业感小圆角（原全站 8–12px 是「AI 默认脸」）—— */
  --r-xs: 2px;
  --r-sm: 4px;
  --r-md: 6px;
  --r-lg: 10px;
  --r-pill: 999px;
  --radius: 6px;
  --radius-lg: 6px;

  /* —— 阴影：只留给浮层；卡片改用细线 —— */
  --shadow-1: 0 1px 2px rgba(20, 35, 60, 0.05);
  --shadow-2: 0 10px 30px -10px rgba(20, 35, 60, 0.18);
  --shadow: var(--shadow-1);
  --glow: var(--shadow-1);

  /* —— 字体 —— */
  --font: "PingFang SC", "HarmonyOS Sans SC", "Microsoft YaHei", "Source Han Sans SC",
          system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-num: ui-monospace, "SF Mono", "JetBrains Mono", Consolas, "Liberation Mono", Menlo, monospace;

  /* —— 动效 —— */
  --ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast: 120ms;
  --dur: 200ms;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html, body {
  font-family: var(--font);
  color: var(--text-primary);
  font-size: 14px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

/* 浅色正文底 */
body {
  background: var(--bg-body);
  min-height: 100vh;
}

::selection { background: rgba(26, 95, 168, 0.18); color: var(--text-primary); }

/* 浅色滚动条 */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #d0d5dd; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #b8c0cc; }

a { color: var(--primary); text-decoration: none; }
a:hover { color: var(--primary-dark); }

/* ---------- 通用按钮 ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 8px 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  font-size: 14px;
  cursor: pointer;
  transition: all 0.15s;
  white-space: nowrap;
  background: var(--card-bg);
  color: var(--text-secondary);
}
.btn:hover { color: var(--primary); border-color: var(--primary); }
.btn:disabled { opacity: 0.5; cursor: not-allowed; }

.btn-primary {
  background: var(--grad-brand);
  border-color: var(--primary);
  color: #fff;
  font-weight: 600;
}
.btn-primary:hover { opacity: 0.92; color: #fff; border-color: var(--primary); }
.btn-success { background: var(--success); border-color: var(--success); color: #fff; font-weight: 600; }
.btn-success:hover { opacity: 0.92; color: #fff; border-color: var(--success); }
.btn-warning { background: #9c5710; border-color: #9c5710; color: #fff; font-weight: 600; }   /* 可读性：白字在 --warning(#c9761a) 上仅 3.45:1 → 5.55:1 */
.btn-warning:hover { opacity: 0.92; color: #fff; border-color: var(--warning); }
.btn-danger { background: var(--danger); border-color: var(--danger); color: #fff; }
.btn-danger:hover { opacity: 0.92; color: #fff; border-color: var(--danger); }
.btn-outline {
  background: transparent; border-color: var(--border); color: var(--text-secondary);
}
.btn-outline:hover { border-color: var(--primary); color: var(--primary); }
.btn-sm { padding: 4px 10px; font-size: 13px; }
.btn-lg { padding: 12px 24px; font-size: 16px; }
.btn-block { width: 100%; }

/* ---------- 表单 ---------- */
.form-group { margin-bottom: 16px; }
.form-label { display: block; margin-bottom: 6px; font-size: 13px; color: var(--text-secondary); }
.form-label.required::before { content: "* "; color: var(--danger); }
.form-input, .form-select, .form-textarea {
  width: 100%;
  padding: 9px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  font-size: 14px;
  font-family: var(--font);
  color: var(--text-primary);
  background: var(--input-bg);
  transition: border-color 0.15s, box-shadow 0.15s;
}
.form-input::placeholder, .form-textarea::placeholder { color: var(--text-tertiary); }
.form-input:focus, .form-select:focus, .form-textarea:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(26, 95, 168, 0.12);
}
.form-select option { background: var(--card-bg); color: var(--text-primary); }
.form-textarea { min-height: 80px; resize: vertical; }
.form-error { color: var(--danger); font-size: 12px; margin-top: 4px; }

/* ---------- 卡片 ---------- */
.card {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 20px;
  margin-bottom: 16px;
}
.card-title { font-size: 15px; font-weight: 600; margin-bottom: 16px; }

/* ---------- 状态徽章（颜色块+文字） ---------- */
.badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 12px;
  line-height: 20px;
  font-weight: 500;
}
.badge::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.badge-success { color: #0b7a45; background: var(--success-light); }   /* 小字标签需 4.5:1（原 3.18）*/
.badge-warning { color: #9c5710; background: var(--warning-light); }   /* 原 3.14 → 5.06 */
.badge-danger { color: #c8231a; background: var(--danger-light); }     /* 原 4.22 → 4.95 */
.badge-gray { color: var(--text-secondary); background: var(--gray-bg); }
.badge-primary { color: var(--primary); background: var(--primary-light); }

/* ---------- 航线网格底纹（白色细线，用于蓝色横幅/品牌面板） ---------- */
.radar-bg {
  background-image:
    repeating-radial-gradient(circle at 88% 12%, rgba(255, 255, 255, 0.06) 0, rgba(255, 255, 255, 0.06) 1px, transparent 1px, transparent 64px),
    linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
  background-size: auto, 64px 64px, 64px 64px;
}

/* ---------- 表格 ---------- */
.table-wrap { overflow-x: auto; }
table.table { width: 100%; border-collapse: collapse; font-size: 13px; }
table.table th, table.table td {
  padding: 10px 12px;
  text-align: left;
  border-bottom: 1px solid var(--border);
}
table.table th { color: var(--text-secondary); font-weight: 600; background: var(--gray-bg); white-space: nowrap; }
table.table td.num { text-align: right; font-variant-numeric: tabular-nums; }
table.table th.num { text-align: right; }
table.table tr:hover td { background: rgba(26, 95, 168, 0.04); }

/* ---------- Toast ---------- */
#toast-container {
  position: fixed;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10000;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
}
.toast {
  padding: 10px 20px;
  border-radius: var(--radius);
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  box-shadow: 0 4px 16px rgba(20, 60, 120, 0.18);
  animation: toast-in 0.25s ease;
}
.toast-success { background: var(--success); }
.toast-error { background: var(--danger); font-weight: 500; }
.toast-warning { background: var(--warning); }
.toast-info { background: var(--primary, #1a5fa8); }
@keyframes toast-in {
  from { opacity: 0; transform: translateY(-10px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ---------- Modal ---------- */
.modal-mask {
  position: fixed;
  inset: 0;
  background: rgba(29, 33, 41, 0.45);
  backdrop-filter: blur(2px);
  z-index: 9000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  animation: fade-in 0.2s ease;
}
.modal {
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  max-width: 560px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 8px 32px rgba(20, 60, 120, 0.18);
  animation: modal-in 0.2s ease;
}
.modal-lg { max-width: 800px; }
.modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border);
}
.modal-header h3 { font-size: 16px; font-weight: 600; }
.modal-close { cursor: pointer; color: var(--gray); font-size: 20px; line-height: 1; border: none; background: none; }
.modal-body { padding: 20px; }
.modal-footer { padding: 16px 20px; border-top: 1px solid var(--border); display: flex; justify-content: flex-end; gap: 10px; }
@keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes modal-in { from { opacity: 0; transform: scale(0.96); } to { opacity: 1; transform: scale(1); } }

/* ---------- 分页 ---------- */
.pager { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 16px; }
.pager button {
  min-width: 32px; height: 32px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--card-bg);
  cursor: pointer;
  font-size: 13px;
  color: var(--text-secondary);
}
.pager button.active { background: var(--primary); color: #fff; border-color: var(--primary); font-weight: 600; }
.pager button:disabled { opacity: 0.4; cursor: not-allowed; }

/* ---------- 通用工具 ---------- */
.text-center { text-align: center; }
.text-right { text-align: right; }
.text-secondary { color: var(--text-secondary); }
.text-tertiary { color: var(--text-tertiary); }
.text-danger { color: var(--danger); }
.text-success { color: var(--success); }
.text-warning { color: var(--warning); }
.mt-8 { margin-top: 8px; }
.mt-16 { margin-top: 16px; }
.mt-24 { margin-top: 24px; }
.mb-16 { margin-bottom: 16px; }
.flex { display: flex; }
.flex-center { display: flex; align-items: center; }
.flex-between { display: flex; align-items: center; justify-content: space-between; }
.gap-8 { gap: 8px; }
.gap-12 { gap: 12px; }
.gap-16 { gap: 16px; }
.flex-wrap { flex-wrap: wrap; }
.hidden { display: none !important; }
.spin { display: inline-block; width: 16px; height: 16px; border: 2px solid var(--border); border-top-color: var(--primary); border-radius: 50%; animation: spin 0.8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

.empty {
  text-align: center;
  color: var(--text-tertiary);
  padding: 40px 20px;
  font-size: 13px;
}

/* ---------- 响应式 ---------- */
@media (max-width: 768px) {
  .modal { max-width: 100%; }
  .card { padding: 16px; }
  .btn { padding: 8px 12px; }
}

/* 证型多选 */
.cert-multi { display: flex; flex-wrap: wrap; gap: 8px; }
.cert-check {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 12px; border: 1px solid var(--border); border-radius: 6px;
  cursor: pointer; font-size: 13px; user-select: none; color: var(--text-secondary);
}
.cert-check:hover { border-color: var(--primary); }
.cert-check input { accent-color: var(--primary); }

/* 在线状态点 + 可点击行（全局） */
.online-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--success); margin-right: 6px; vertical-align: middle; }
.online-dot.offline { background: var(--gray-light); }
.click-row { cursor: pointer; transition: background 0.15s; }
.click-row:hover { background: rgba(26, 95, 168, 0.04); }



/* ---------- 用户头像 / 资料卡片 ---------- */
.u-avatar {
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%; color: #fff; flex-shrink: 0; user-select: none;
  vertical-align: middle; overflow: hidden;
  background: var(--grad-brand); font-weight: 600;
}
.u-avatar-click { cursor: pointer; transition: transform 0.12s; }
.u-avatar-click:hover { transform: scale(1.1); }

/* ---------- 课程日历 ---------- */
.cal-week { display: grid; grid-template-columns: repeat(7, 1fr); text-align: center; font-size: 11px; color: var(--text-tertiary); margin-bottom: 4px; }
.cal-body { display: grid; grid-template-columns: repeat(7, 1fr); gap: 3px; }
.cal-cell { position: relative; aspect-ratio: 1; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 13px; color: var(--text-primary); background: var(--gray-bg); min-height: 34px; }
.cal-cell.cal-empty { background: transparent; }
.cal-cell.cal-green { background: var(--success); color: #fff; font-weight: 700; }
.cal-cell.cal-blue { background: var(--primary-light); color: var(--primary); font-weight: 600; border: 1px solid rgba(26, 95, 168, 0.3); }
.cal-cell.cal-blue .cal-dot { position: absolute; bottom: 3px; width: 5px; height: 5px; border-radius: 50%; background: var(--primary); }
.cal-cell.has-exam { box-shadow: inset 0 0 0 2px rgba(245, 63, 63, 0.6); }
.cal-cell .cal-drone { position: absolute; top: 1px; right: 1px; font-size: 11px; line-height: 1; }
.cal-cell.cal-today { outline: 2px solid var(--warning); outline-offset: 1px; }
.cal-legend { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; font-size: 11px; color: var(--text-tertiary); align-items: center; }
.cal-legend .lg { display: inline-flex; align-items: center; gap: 4px; }
.lg-box { width: 12px; height: 12px; border-radius: 3px; display: inline-block; }
.cal-toolbar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.cal-title { font-weight: 600; font-size: 15px; }
.cal-nav { display: flex; gap: 6px; }
.cal-nav button { border: 1px solid var(--border); background: var(--card-bg); border-radius: 6px; width: 28px; height: 28px; cursor: pointer; color: var(--text-secondary); }
.cal-nav button:hover { background: var(--primary-light); }
.cal-cell.cal-soft-exam:not(.cal-blue):not(.cal-green) { background: rgba(245, 63, 63, 0.08); }
/* 打卡优先：cal-green 已上绿，仅追加柔红阴影表示该日也是考试区间段 */
.cal-cell.cal-green.cal-soft-exam { box-shadow: inset 0 0 0 2px rgba(245, 63, 63, 0.35); }

/* ---------- 答题组件（刷题/模拟考试/正式考试共用） ---------- */
.quiz-progress { height: 6px; background: var(--border); border-radius: 3px; overflow: hidden; }
.quiz-progress div { height: 100%; background: var(--grad-brand); }
.opt {
  display: block; width: 100%; text-align: left; padding: 12px 16px; margin-bottom: 10px;
  border: 1px solid var(--border); border-radius: 8px; background: var(--input-bg); cursor: pointer;
  font-size: 14px; color: var(--text-primary); transition: all 0.15s;
}
.opt:hover { border-color: var(--primary); }
.opt.selected { border-color: var(--primary); background: var(--primary-light); }
.opt.correct { border-color: var(--success); background: var(--success-light); }
.opt.wrong { border-color: var(--danger); background: var(--danger-light); }
.opt.disabled { pointer-events: none; }
.opt .opt-letter { display: inline-block; width: 22px; height: 22px; line-height: 22px; text-align: center; border-radius: 50%; background: var(--gray-bg); margin-right: 8px; font-size: 12px; color: var(--text-secondary); }
.fill-input { width: 100%; padding: 12px 16px; border: 1px solid var(--border); border-radius: 8px; font-size: 14px; background: var(--input-bg); color: var(--text-primary); }
.feedback { padding: 12px 16px; border-radius: 8px; margin-top: 12px; font-size: 14px; }
.feedback.correct { background: var(--success-light); color: var(--success); }
.feedback.wrong { background: var(--danger-light); color: var(--danger); }
.quiz-social { display: flex; gap: 8px; margin-top: 16px; padding-top: 12px; border-top: 1px dashed var(--border); }
.cmt-item { padding: 10px 12px; background: var(--gray-bg); border: 1px solid var(--border); border-radius: 8px; margin-bottom: 8px; font-size: 13px; }
.cmt-head { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; }
.cmt-name { font-weight: 600; font-size: 13px; }
.cmt-role { font-size: 10px; padding: 1px 5px; border-radius: 4px; background: var(--primary-light); color: var(--primary); }
.cmt-role.teacher { background: var(--warning-light); color: var(--warning); }
.cmt-del { margin-left: auto; font-size: 12px; color: var(--danger); background: none; border: none; cursor: pointer; padding: 0 2px; }
.cmt-time { font-size: 11px; color: var(--gray); margin-left: 4px; }
.cmt-input-row { display: flex; gap: 8px; margin-top: 8px; }
.cmt-input { flex: 1; padding: 9px 12px; border: 1px solid var(--border); border-radius: 8px; font-size: 13px; resize: none; background: var(--input-bg); color: var(--text-primary); }
.exam-countdown { font-size: 20px; font-weight: 600; color: var(--danger); font-variant-numeric: tabular-nums; }

/* 统一线性图标（雷达/无人机/航线风格） */
svg.u-ic { vertical-align: -3px; flex-shrink: 0; }

/* ---------- 全局微交互（仅 transform/opacity，禁布局属性动画） ---------- */
.btn:active { transform: translateY(1px); }
.btn:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--primary); outline-offset: 2px; border-radius: 4px;
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ============================================================
 * 门户页面（首页 + 业务落地页 + 走进公司 + 资质证书）
 * ============================================================ */

/* ---- 门户基础与首页 ---- */
.portal { background: #fff; min-height: 100vh; }
.portal-nav { position: sticky; top: 0; z-index: 100; background: #fff; border-bottom: 1px solid var(--border); box-shadow: 0 1px 6px rgba(20, 60, 120, 0.04); }
.portal-nav-inner { max-width: 1100px; margin: 0 auto; padding: 14px 20px; display: flex; align-items: center; gap: 24px; }
.portal-logo { font-size: 18px; font-weight: 700; color: var(--primary-dark); letter-spacing: 0.5px; text-decoration: none; display: flex; align-items: center; gap: 8px; }
.portal-menu { flex: 1; display: flex; gap: 28px; justify-content: flex-end; margin-right: 8px; }
.portal-menu a { color: var(--text-primary); font-size: 15px; padding: 4px 2px; border-bottom: 2px solid transparent; text-decoration: none; }
.portal-menu a:hover { color: var(--primary); border-bottom-color: var(--primary); }

.portal-hero { background: var(--grad-hero); color: #fff; border-bottom: 3px solid var(--primary-dark); }
.portal-hero-inner { max-width: 1100px; margin: 0 auto; padding: 60px 20px; display: flex; align-items: center; gap: 40px; }
.portal-hero-text { flex: 1; }
.portal-hero-text h1 { font-size: 34px; font-weight: 700; margin-bottom: 12px; letter-spacing: 1px; }
.portal-hero-text p { font-size: 16px; opacity: 0.9; margin-bottom: 24px; }
.portal-hero-stats { display: flex; gap: 32px; margin-bottom: 28px; flex-wrap: wrap; }
.hero-stat { display: flex; flex-direction: column; }
.hero-stat b { font-size: 28px; font-weight: 700; }
.hero-stat span { font-size: 13px; opacity: 0.85; }
.portal-hero-img { flex: 1; max-width: 420px; }
.hero-banner {
  position: relative; overflow: hidden;
  background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.25);
  border-radius: var(--radius-lg); height: 240px;
  display: flex; flex-direction: column; align-items: center; justify-content: flex-end;
  padding-bottom: 18px;
}
.hero-radar {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  background: repeating-radial-gradient(circle at 50% 50%, rgba(255,255,255,0.14) 0 1px, transparent 1px 42px);
}
.hero-radar-sweep {
  position: absolute; width: 230px; height: 230px; border-radius: 50%;
  background: conic-gradient(from 0deg, rgba(255,255,255,0.3), rgba(255,255,255,0) 80deg);
  animation: hero-radar-spin 4.5s linear infinite;
}
.hero-radar-core {
  position: relative; width: 52px; height: 52px; border-radius: 50%;
  background: rgba(255,255,255,0.15); border: 1px solid rgba(255,255,255,0.4);
  display: flex; align-items: center; justify-content: center; color: #fff;
}
@keyframes hero-radar-spin { to { transform: rotate(360deg); } }
.hero-banner-caption { position: relative; font-size: 13px; opacity: 0.9; letter-spacing: 1px; }

.hero-dot { width: 6px; height: 6px; border-radius: 3px; background: rgba(255,255,255,0.45); transition: all 0.3s; cursor: pointer; }
.hero-dot.active { width: 18px; background: #fff; }

.portal-section { padding: 48px 20px; }
.portal-section:nth-child(odd) { background: #f7f8fa; }
.portal-section-inner { max-width: 1100px; margin: 0 auto; }
.portal-section-title { font-size: 24px; font-weight: 700; margin-bottom: 28px; text-align: center; color: var(--text-primary); }
.portal-section-title::after { content: ''; display: block; width: 40px; height: 3px; background: var(--primary); margin: 10px auto 0; }
.portal-news-list { max-width: 860px; margin: 0 auto; }
.news-item { display: flex; align-items: center; gap: 12px; padding: 13px 8px; border-bottom: 1px dashed var(--border); cursor: pointer; transition: background 0.15s; }
.news-item:hover { background: var(--primary-light); }
.news-cat { padding: 1px 10px; background: #fff; color: var(--primary); border: 1px solid rgba(26, 95, 168, 0.4); border-radius: 3px; font-size: 12px; white-space: nowrap; }
.news-title { flex: 1; color: var(--text-primary); }
.news-title::before { content: ''; display: inline-block; width: 6px; height: 6px; background: var(--primary); margin-right: 10px; vertical-align: 2px; }
.news-item:hover .news-title { color: var(--primary); }
.news-date { color: var(--text-tertiary); font-size: 13px; white-space: nowrap; font-family: Consolas, monospace; }
.portal-course-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; }
.course-card { background: #fff; border: 1px solid var(--border); border-top: 3px solid var(--primary); border-radius: var(--radius-lg); padding: 24px; transition: all 0.15s; }
.course-card:hover { box-shadow: 0 6px 20px rgba(20, 60, 120, 0.12); transform: translateY(-2px); }
.course-card h3 { font-size: 18px; font-weight: 700; margin-bottom: 12px; color: var(--primary-dark); }
.course-intro { color: var(--text-secondary); margin-bottom: 16px; min-height: 48px; }
.course-meta { display: flex; flex-direction: column; gap: 6px; color: var(--text-tertiary); font-size: 13px; }

.portal-footer { background: #3a3f45; color: #b8bdc4; padding: 40px 20px 20px; }
.portal-footer-inner { max-width: 1100px; margin: 0 auto; display: flex; gap: 40px; flex-wrap: wrap; }
.footer-col { flex: 1; min-width: 200px; }
.footer-col h4 { color: #fff; font-size: 15px; margin-bottom: 12px; }
.footer-col p { font-size: 13px; line-height: 1.8; }
.portal-copyright { text-align: center; padding-top: 24px; border-top: 1px solid #4a4f55; margin-top: 24px; font-size: 12px; color: #9aa0a6; }
@media (max-width: 768px) {
  /* .portal-menu 曾在此写 display:none —— 门户 v1 的遗留规则，2026-09-18 已撤。
     它把手机端整条导航吃掉（8 个入口全点不到），详见文件末尾「门户导航栏 · 手机端」。 */
  .portal-hero-inner { flex-direction: column; padding: 40px 20px; }
  .portal-hero-text h1 { font-size: 26px; }
  .portal-hero-img { max-width: 100%; width: 100%; }
  .hero-banner { height: 160px; }
}

.portal-page { background: var(--body-bg); }

.portal-empty { padding: 120px 20px; text-align: center; color: var(--text-tertiary); font-size: 15px; }
.portal-empty a { color: var(--primary); text-decoration: underline; }

/* 顶部导航激活态 */
.portal-menu a { transition: color 0.15s, border-color 0.15s; }
.portal-menu a.active { color: var(--primary); border-bottom-color: var(--primary); }

/* 首页：业务板块 4 卡 */
.portal-biz-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 18px; }
.biz-card {
  background: var(--card-bg); border: 1px solid var(--border); border-radius: var(--radius-lg);
  padding: 24px 22px; transition: all 0.15s; color: var(--text-primary);
  display: flex; flex-direction: column; gap: 10px;
}
.biz-card:hover { box-shadow: var(--shadow); transform: translateY(-2px); border-color: var(--primary-light); }
.biz-card h3 { font-size: 17px; font-weight: 700; color: var(--text-primary); }
.biz-card p { font-size: 13px; color: var(--text-secondary); line-height: 1.7; flex: 1; }
.biz-icon { width: 52px; height: 52px; border-radius: var(--radius-md); display: flex; align-items: center; justify-content: center; }
.biz-cta { font-size: 13px; color: var(--primary); margin-top: auto; }

/* 首页 hero 双按钮 */
.portal-hero-cta { display: flex; gap: 12px; flex-wrap: wrap; }
.btn-ghost { background: rgba(255,255,255,0.16); border: 1px solid rgba(255,255,255,0.36); color: #fff; padding: 8px 22px; border-radius: var(--radius-md); font-size: 15px; font-weight: 600; cursor: pointer; text-decoration: none; display: inline-block; transition: all 0.15s; }
.btn-ghost:hover { background: rgba(255,255,255,0.26); }

/* 课程卡底部链接 */
.course-card-link { display: inline-block; margin-top: 14px; font-size: 13px; color: var(--primary); }

/* 业务详情页 hero（二级 hero 渐变小标题） */
.biz-hero { background: var(--grad-hero); color: #fff; }
.biz-hero-inner { max-width: 1100px; margin: 0 auto; padding: 48px 20px 56px; display: flex; align-items: center; gap: 28px; }
.biz-hero-icon { width: 76px; height: 76px; border-radius: 18px; background: rgba(255,255,255,0.16); border: 1px solid rgba(255,255,255,0.32); display: flex; align-items: center; justify-content: center; color: #fff; flex-shrink: 0; }
.biz-hero-text { flex: 1; }
.biz-hero-bread { font-size: 12px; opacity: 0.78; letter-spacing: 2px; margin-bottom: 8px; }
.biz-hero-text h1 { font-size: 30px; font-weight: 700; margin-bottom: 10px; letter-spacing: 1px; }
.biz-hero-tag { font-size: 15px; opacity: 0.92; margin-bottom: 18px; }
.biz-hero-cta { display: flex; gap: 12px; flex-wrap: wrap; }

.portal-section-gray { background: var(--gray-bg); }
.biz-intro { font-size: 15px; line-height: 2; color: var(--text-secondary); text-align: center; max-width: 760px; margin: 0 auto; }

/* 能力卡片（左右排：序号 + 标题 + 描述） */
.biz-cap-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.biz-cap { background: var(--card-bg); border: 1px solid var(--border); border-left: 3px solid var(--primary); border-radius: var(--radius-md); padding: 20px 22px; display: flex; gap: 16px; }
.biz-cap-num { font-size: 24px; font-weight: 700; color: var(--primary); font-family: Consolas, monospace; line-height: 1; min-width: 32px; }
.biz-cap-body h4 { font-size: 15px; font-weight: 700; color: var(--text-primary); margin-bottom: 6px; }
.biz-cap-body p { font-size: 13px; line-height: 1.7; color: var(--text-secondary); }

/* 技术指标表 */
.biz-spec-table { width: 100%; max-width: 800px; margin: 0 auto; border-collapse: collapse; background: var(--card-bg); border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-sm); }
.biz-spec-table tr { border-bottom: 1px solid var(--border); }
.biz-spec-table tr:last-child { border-bottom: 0; }
.biz-spec-table th, .biz-spec-table td { padding: 14px 20px; text-align: left; }
.biz-spec-table th { width: 180px; color: var(--text-secondary); font-weight: 600; background: var(--gray-bg); }
.biz-spec-table td { color: var(--text-primary); }

/* 服务流程步骤卡 */
.biz-step-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.biz-step { background: var(--card-bg); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 22px 20px; position: relative; }
.biz-step-num { width: 36px; height: 36px; border-radius: 50%; background: var(--grad-hero); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 16px; margin-bottom: 12px; }
.biz-step h4 { font-size: 15px; font-weight: 700; color: var(--text-primary); margin-bottom: 6px; }
.biz-step p { font-size: 13px; line-height: 1.7; color: var(--text-secondary); }

/* 适用对象 / 资质 两栏 */
.biz-applicable { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; max-width: 980px; margin: 0 auto; }
.biz-applicable-block { background: var(--card-bg); border: 1px solid var(--border); border-left: 3px solid var(--primary); border-radius: var(--radius-md); padding: 22px; }
.biz-applicable-block h4 { font-size: 15px; font-weight: 700; color: var(--primary-dark); margin-bottom: 8px; }
.biz-applicable-block p { font-size: 14px; line-height: 1.8; color: var(--text-secondary); }
@media (max-width: 768px) { .biz-applicable { grid-template-columns: 1fr; } }

/* 走进公司页：愿景/使命两栏 */
.about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; max-width: 980px; margin: 0 auto; }
.about-block { background: var(--card-bg); border: 1px solid var(--border); border-top: 3px solid var(--primary); border-radius: var(--radius-md); padding: 26px 24px; }
.about-block h4 { font-size: 14px; font-weight: 700; color: var(--primary); letter-spacing: 2px; margin-bottom: 8px; }
.about-block p { font-size: 15px; line-height: 1.9; color: var(--text-primary); }
@media (max-width: 768px) { .about-grid { grid-template-columns: 1fr; } }

/* 核心价值观 */
.about-value-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 16px; }
.about-value { background: var(--card-bg); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 22px 20px; text-align: center; }
.about-value-mark { width: 44px; height: 44px; border-radius: 12px; margin: 0 auto 10px; background: var(--grad-hero); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 22px; font-weight: 700; }
.about-value h4 { font-size: 16px; font-weight: 700; margin-bottom: 6px; }
.about-value p { font-size: 13px; color: var(--text-secondary); line-height: 1.7; }

/* 发展时间轴 */
.timeline { position: relative; max-width: 820px; margin: 0 auto; padding-left: 8px; }
.timeline-item { display: grid; grid-template-columns: 90px auto 1fr; gap: 16px; align-items: start; padding: 14px 0; }
.timeline-year { font-size: 18px; font-weight: 700; color: var(--primary); font-family: Consolas, monospace; padding-top: 2px; }
.timeline-line { width: 2px; background: var(--border); align-self: stretch; position: relative; }
.timeline-line::before { content: ''; position: absolute; left: -4px; top: 6px; width: 10px; height: 10px; border-radius: 50%; background: var(--primary); }
.timeline-event { font-size: 14px; line-height: 1.7; color: var(--text-secondary); padding-left: 6px; }

/* 团队卡片 */
.team-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 18px; }
.team-card { background: var(--card-bg); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 22px 20px; text-align: center; }
.team-avatar { width: 64px; height: 64px; border-radius: 50%; margin: 0 auto 12px; background: var(--grad-hero); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 26px; font-weight: 700; }
.team-card h4 { font-size: 16px; font-weight: 700; margin-bottom: 4px; }
.team-title { font-size: 12px; color: var(--primary); margin-bottom: 10px; letter-spacing: 1px; }
.team-card p { font-size: 13px; color: var(--text-secondary); line-height: 1.7; text-align: left; }

/* 服务覆盖 chips */
.about-cov { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-bottom: 36px; }
.about-cov-tag { padding: 8px 20px; background: var(--card-bg); border: 1px solid var(--border); border-radius: 999px; font-size: 14px; color: var(--primary); font-weight: 600; }
.about-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 16px; max-width: 880px; margin: 0 auto; }
.about-stats > div { background: var(--card-bg); border: 1px solid var(--border); border-bottom: 3px solid var(--primary); border-radius: var(--radius-md); padding: 22px; text-align: center; }
.about-stats b { display: block; font-size: 28px; font-weight: 700; color: var(--primary); font-family: Consolas, monospace; margin-bottom: 6px; }
.about-stats span { font-size: 13px; color: var(--text-tertiary); }

/* 资质证书网格 */
.cert-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 16px; }
.cert-card { background: var(--card-bg); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 22px; box-shadow: var(--shadow-sm); transition: box-shadow 0.15s; }
.cert-card:hover { box-shadow: var(--shadow); }
.cert-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.cert-icon { width: 40px; height: 40px; border-radius: 10px; background: var(--primary-light); color: var(--primary); display: flex; align-items: center; justify-content: center; }
.cert-level { padding: 3px 10px; background: var(--primary-light); color: var(--primary); border-radius: 999px; font-size: 11px; font-weight: 700; letter-spacing: 0.5px; }
.cert-card h4 { font-size: 15px; font-weight: 700; color: var(--text-primary); margin-bottom: 12px; line-height: 1.5; }
.cert-card .cert-meta { display: grid; grid-template-columns: 78px 1fr; gap: 6px 12px; font-size: 13px; }
.cert-card .cert-meta .cm { display: contents; }   /* 拆开标签与值，各占一个网格单元（等价原来的 dt/dd） */
.cert-card .cert-meta .cm b { color: var(--text-tertiary); font-weight: 400; }
.cert-card .cert-meta .cv { color: var(--text-secondary); word-break: break-all; }
.cert-card code { background: var(--gray-bg); padding: 1px 6px; border-radius: 3px; font-family: Consolas, monospace; font-size: 12px; color: var(--primary); }

/* 合作伙伴墙 */
.partner-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
.partner { background: var(--card-bg); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 18px 16px; text-align: center; transition: all 0.15s; }
.partner:hover { border-color: var(--primary); }
.partner-name { font-size: 16px; font-weight: 700; color: var(--text-primary); margin-bottom: 6px; }
.partner-tag { font-size: 12px; color: var(--text-tertiary); }

/* 移动端 */
@media (max-width: 768px) {
  .biz-hero-inner { flex-direction: column; padding: 32px 20px; align-items: flex-start; }
  .biz-hero-text h1 { font-size: 24px; }
  .biz-cap-grid, .biz-step-grid, .timeline-item { grid-template-columns: 1fr; }
  .timeline-item { gap: 6px; }
  .timeline-line { display: none; }
  .biz-hero-cta { flex-direction: column; align-items: stretch; }
}

/* ========== Tier 2-A: 资讯中心 + 客户案例 ========== */

/* 资讯列表 */
.article-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; padding-bottom: 16px; border-bottom: 1px solid var(--border); }
.article-tab { padding: 6px 14px; border-radius: 999px; font-size: 13px; color: var(--text-secondary); background: var(--card-bg); border: 1px solid var(--border); transition: all .2s; }
.article-tab:hover { color: var(--primary); border-color: var(--primary); }
.article-tab.active { background: var(--primary); color: #fff; border-color: var(--primary); }
.article-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 20px; }
.article-tag { padding: 3px 10px; border-radius: 4px; font-size: 12px; color: var(--text-tertiary); background: var(--body-bg); border: 1px solid var(--border); }
.article-tag:hover { color: var(--primary); border-color: var(--primary); }

.article-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 20px; }
.article-card { background: var(--card-bg); border-radius: var(--radius-lg); overflow: hidden; border: 1px solid var(--border); transition: all .25s; display: flex; flex-direction: column; }
.article-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: var(--primary); }
.article-cover { height: 140px; display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,.85); position: relative; }
.article-cover::after { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 30% 50%, rgba(255,255,255,.18), transparent); }
.article-body { padding: 16px 18px 18px; flex: 1; display: flex; flex-direction: column; }
.article-meta { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--text-tertiary); margin-bottom: 8px; flex-wrap: wrap; }
.article-cat { padding: 2px 8px; border-radius: 4px; background: rgba(26,95,168,.1); color: var(--primary); font-size: 11px; font-weight: 500; }
.article-pin { padding: 1px 6px; border-radius: 3px; background: #b35500; color: #fff; font-size: 10px; font-weight: 600; }
.article-title { font-size: 16px; font-weight: 600; line-height: 1.4; margin: 4px 0 8px; color: var(--text-primary); display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.article-summary { font-size: 13px; color: var(--text-secondary); line-height: 1.6; margin: 0 0 12px; display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; flex: 1; }
.article-card-tags { display: flex; flex-wrap: wrap; gap: 4px; font-size: 11px; color: var(--text-tertiary); }
.article-card-tags span { padding: 1px 6px; background: var(--body-bg); border-radius: 3px; }

/* 文章详情 */
.article-detail { background: var(--card-bg); }
.article-hero { padding: 60px 0 50px; color: #fff; position: relative; overflow: hidden; }
.article-hero::before { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.15), transparent 60%); pointer-events: none; }
.article-hero-inner { max-width: 760px; margin: 0 auto; padding: 0 24px; }
.article-hero-title { font-size: 32px; font-weight: 700; line-height: 1.35; margin: 14px 0 18px; color: #fff; }
.article-hero-meta { display: flex; flex-wrap: wrap; gap: 16px; font-size: 13px; color: rgba(255,255,255,.85); }
.article-hero-meta span { display: inline-flex; align-items: center; gap: 5px; }
.article-content-wrap { max-width: 760px; margin: 30px auto 60px; padding: 0 24px; }
.article-summary-box { padding: 18px 20px; background: var(--card-bg); border-left: 4px solid var(--primary); border-radius: var(--radius-md); margin-bottom: 28px; font-size: 15px; color: var(--text-secondary); line-height: 1.7; }
.article-body-text { font-size: 15px; line-height: 1.85; color: var(--text-primary); }
.article-body-text h2 { font-size: 22px; font-weight: 700; margin: 36px 0 16px; padding-left: 12px; border-left: 4px solid var(--primary); color: var(--text-primary); }
.article-body-text h3 { font-size: 17px; font-weight: 600; margin: 26px 0 12px; color: var(--text-primary); }
.article-body-text p { margin: 14px 0; }
.article-body-text ul, .article-body-text ol { padding-left: 24px; margin: 14px 0; }
.article-body-text li { margin: 6px 0; }
.article-body-text blockquote { margin: 20px 0; padding: 14px 20px; background: var(--card-bg); border-left: 4px solid #b35500; color: var(--text-secondary); border-radius: 0 var(--radius-md) var(--radius-md) 0; font-style: italic; }
.article-body-text code { background: var(--body-bg); padding: 2px 6px; border-radius: 3px; font-family: monospace; font-size: 13px; color: var(--primary); }
.article-table { width: 100%; border-collapse: collapse; margin: 20px 0; background: var(--card-bg); border-radius: var(--radius-md); overflow: hidden; border: 1px solid var(--border); }
.article-table th, .article-table td { padding: 10px 14px; text-align: left; border-bottom: 1px solid var(--border); font-size: 14px; }
.article-table th { background: rgba(26,95,168,.06); font-weight: 600; color: var(--text-primary); }
.article-table tr:last-child td { border-bottom: 0; }
/* 文章表格的横向滚动容器：窄屏下文章里写宽表也不会被压扁（与后台 .table-wrap 同一思路） */
.article-table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 20px 0; }
.article-table-scroll .article-table { margin: 0; }
@media (max-width: 768px) {
  /* min-width: max-content 让单元格保持自己的自然宽度（不换行挤压），由外层容器横滑；
     不要写固定 min-width —— 内容更宽时单元格会溢出表格边界，滑到底也看不到最后一列 */
  /* 仅 ≥5 列的宽表才固定为自然宽度；3~4 列的窄表保持收缩到容器（无需横滑） */
  .article-table-scroll.is-wide .article-table { min-width: max-content; }
}
.article-share { display: flex; gap: 12px; margin: 36px 0 40px; padding: 20px 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.article-related h3 { font-size: 20px; font-weight: 600; margin: 0 0 18px; color: var(--text-primary); }

/* 案例列表 */
.case-service-tab { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 24px; padding-bottom: 20px; border-bottom: 1px solid var(--border); }
.case-service-tab a { padding: 7px 18px; border-radius: var(--radius-md); font-size: 14px; color: var(--text-secondary); background: var(--card-bg); border: 1px solid var(--border); transition: all .2s; }
.case-service-tab a:hover { color: var(--primary); border-color: var(--primary); }
.case-service-tab a.active { background: var(--primary); color: #fff; border-color: var(--primary); }
.case-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 20px; }
.case-card { background: var(--card-bg); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 24px 26px; transition: all .25s; display: flex; flex-direction: column; gap: 12px; }
.case-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: var(--primary); }
.case-card-head { display: flex; align-items: center; justify-content: space-between; }
.case-service-tag { padding: 3px 10px; border-radius: 4px; font-size: 12px; font-weight: 500; color: #fff; }
.case-tag-training { background: #1a5fa8; }
.case-tag-hoisting { background: #b35500; }
.case-tag-inspection { background: #0a7d33; }
.case-tag-application { background: #6c5ce7; }
.case-industry { font-size: 12px; color: var(--text-tertiary); }
.case-card-title { font-size: 17px; font-weight: 600; color: var(--text-primary); margin: 0; line-height: 1.4; }
.case-card-meta { display: flex; flex-wrap: wrap; gap: 12px; font-size: 12px; color: var(--text-tertiary); }
.case-card-meta span { display: inline-flex; align-items: center; gap: 4px; }
.case-card-summary { font-size: 13px; color: var(--text-secondary); line-height: 1.6; margin: 0; flex: 1; }
.case-card-arrow { font-size: 13px; color: var(--primary); font-weight: 500; margin-top: auto; }

/* 案例详情 */
.case-detail { background: var(--card-bg); }
.case-hero { background: linear-gradient(135deg, #0f3e78 0%, #1a5fa8 50%, #2670c4 100%); color: #fff; padding: 50px 0 60px; position: relative; overflow: hidden; }
.case-hero::before { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 80% 20%, rgba(255,255,255,.18), transparent 60%); }
.case-hero-inner { max-width: 920px; margin: 0 auto; padding: 0 24px; position: relative; }
.case-hero h1 { font-size: 30px; font-weight: 700; margin: 14px 0 18px; line-height: 1.35; color: #fff; }
.case-hero-meta { display: flex; flex-wrap: wrap; gap: 18px; font-size: 13px; color: rgba(255,255,255,.9); margin-bottom: 20px; }
.case-hero-meta span { display: inline-flex; align-items: center; gap: 5px; }
.case-hero-summary { font-size: 15px; line-height: 1.7; color: rgba(255,255,255,.92); margin: 0; padding: 16px 18px; background: rgba(255,255,255,.08); border-left: 3px solid rgba(255,255,255,.5); border-radius: 0 var(--radius-md) var(--radius-md) 0; }

.case-results { background: var(--body-bg); padding: 30px 0; border-bottom: 1px solid var(--border); }
.case-results-grid { max-width: 920px; margin: 0 auto; padding: 0 24px; display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 16px; }
.case-result-card { background: var(--card-bg); padding: 22px 20px; border-radius: var(--radius-lg); text-align: center; border: 1px solid var(--border); }
.case-result-value { font-size: 28px; font-weight: 700; color: var(--primary); line-height: 1.2; }
.case-result-label { font-size: 12px; color: var(--text-tertiary); margin-top: 6px; }

.case-body { padding: 50px 0; }
.case-body-inner { max-width: 920px; margin: 0 auto; padding: 0 24px; }
.case-block { margin-bottom: 40px; padding: 24px 28px; background: var(--body-bg); border-radius: var(--radius-lg); border: 1px solid var(--border); }
.case-block-primary { border-left: 4px solid var(--primary); background: rgba(26,95,168,.04); }
.case-block-warn { border-left: 4px solid #b35500; background: rgba(255,125,0,.04); }
.case-block h3 { font-size: 19px; font-weight: 600; margin: 0 0 16px; display: flex; align-items: center; gap: 12px; color: var(--text-primary); }
.case-block-no { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background: var(--primary); color: #fff; font-size: 13px; font-weight: 700; }
.case-block-warn .case-block-no { background: #b35500; }
.case-block p { font-size: 14.5px; line-height: 1.85; color: var(--text-secondary); margin: 0; }
.case-block ul { padding-left: 20px; margin: 0; }
.case-block li { font-size: 14.5px; line-height: 1.85; color: var(--text-secondary); margin: 6px 0; }
.case-quote { margin: 40px auto; max-width: 720px; padding: 32px; background: linear-gradient(135deg, rgba(26,95,168,.06) 0%, rgba(38,112,196,.06) 100%); border-radius: var(--radius-lg); text-align: center; }
.case-quote-content { font-size: 17px; line-height: 1.7; color: var(--text-primary); font-style: italic; margin: 0 0 12px; }
.case-quote-author { font-size: 13px; color: var(--text-tertiary); margin: 0; }
.case-cta-bar { max-width: 920px; margin: 0 auto; padding: 24px; display: flex; gap: 12px; justify-content: center; }
.case-related { max-width: 920px; margin: 50px auto 0; padding: 0 24px 60px; }
.case-related h3 { font-size: 20px; font-weight: 600; margin: 0 0 18px; color: var(--text-primary); }

/* 业务页底部：相关案例 + 资讯 */
.biz-related-section { max-width: 1080px; margin: 50px auto 0; padding: 0 24px; }
.biz-related-section h3 { font-size: 22px; font-weight: 700; margin: 0 0 22px; color: var(--text-primary); }
.biz-related-section .article-grid { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.biz-related-section .case-grid { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }
/* 案例与资讯两块之间的留白（原为内联 height:30px，抽成类以便窄屏单独收紧） */
.biz-rel-gap { height: 30px; }

/* 响应式 */
@media (max-width: 768px) {
  .article-hero, .case-hero { padding: 36px 0 40px; }
  .article-hero-title, .case-hero h1 { font-size: 22px; }
  .article-grid, .case-grid { grid-template-columns: 1fr; }
  .case-results-grid { grid-template-columns: repeat(2, 1fr); }
  .case-results-grid .case-result-card { padding: 18px 12px; }
  .case-result-value { font-size: 22px; }
}

/* ========== Tier 2-C: 驾驶舱大屏（深色 TV 模式） ========== */
.cockpit {
  --ck-bg: #0a1428;
  --ck-bg-deep: #050b18;
  --ck-panel: rgba(20, 35, 70, 0.55);
  --ck-border: rgba(91, 156, 255, 0.22);
  --ck-glow: rgba(91, 156, 255, 0.45);
  --ck-text: #d9e7ff;
  --ck-text-dim: rgba(217, 231, 255, 0.6);
  --ck-num: #5b9cff;
  background: linear-gradient(135deg, var(--ck-bg-deep) 0%, var(--ck-bg) 60%, #0e2042 100%);
  color: var(--ck-text);
  min-height: 100vh;
  padding: 22px 24px 36px;
  position: relative;
  overflow-x: hidden;
}
.cockpit::before {
  content: ''; position: absolute; inset: 0;
  background-image: linear-gradient(rgba(91,156,255,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(91,156,255,.04) 1px, transparent 1px);
  background-size: 28px 28px;
  pointer-events: none;
  mask-image: radial-gradient(ellipse 80% 60% at 50% 30%, black 30%, transparent 80%);
}
.cockpit-header { display: flex; align-items: center; justify-content: space-between; padding-bottom: 18px; margin-bottom: 22px; border-bottom: 1px solid var(--ck-border); position: relative; }
.cockpit-title { display: flex; gap: 14px; align-items: center; }
.cockpit-title-icon {
  width: 48px; height: 48px; border-radius: 12px;
  background: linear-gradient(135deg, #1a5fa8 0%, #5b9cff 100%);
  display: flex; align-items: center; justify-content: center;
  color: #fff;
  box-shadow: 0 0 30px var(--ck-glow);
  animation: ck-pulse 3s infinite;
}
@keyframes ck-pulse { 0%,100% { box-shadow: 0 0 30px rgba(91,156,255,.45); } 50% { box-shadow: 0 0 50px rgba(91,156,255,.7); } }
.cockpit-header h1 { margin: 0; font-size: 22px; font-weight: 700; color: var(--ck-text); letter-spacing: .5px; }
.cockpit-subtitle { font-size: 12px; color: var(--ck-text-dim); margin-top: 3px; letter-spacing: .3px; }
.cockpit-meta { display: flex; align-items: center; gap: 16px; font-size: 13px; color: var(--ck-text-dim); }
.cockpit-clock { font-family: 'Courier New', monospace; font-size: 18px; font-weight: 700; color: #5b9cff; letter-spacing: 1.5px; text-shadow: 0 0 10px var(--ck-glow); }
.cockpit-refresh { padding: 3px 10px; background: rgba(91,156,255,.10); border: 1px solid var(--ck-border); border-radius: 4px; font-size: 12px; }
.cockpit-btn { padding: 7px 16px; background: linear-gradient(135deg, #1a5fa8 0%, #5b9cff 100%); border: 0; color: #fff; border-radius: 6px; cursor: pointer; font-size: 13px; font-weight: 500; text-decoration: none; display: inline-block; transition: all .2s; }
.cockpit-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 16px rgba(91,156,255,.35); }
.cockpit-btn-outline { background: transparent; border: 1px solid var(--ck-border); color: var(--ck-text); }

.cockpit-kpi-row { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; margin-bottom: 20px; position: relative; }
.cockpit-kpi {
  background: var(--ck-panel);
  backdrop-filter: blur(8px);
  border: 1px solid var(--ck-border);
  border-radius: 10px;
  padding: 18px 20px;
  position: relative;
  overflow: hidden;
  transition: all .3s;
}
.cockpit-kpi::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, transparent, #5b9cff, transparent);
  animation: ck-scan 4s linear infinite;
}
@keyframes ck-scan { 0% { transform: translateX(-100%); } 100% { transform: translateX(100%); } }
.cockpit-kpi:hover { border-color: rgba(91,156,255,.5); transform: translateY(-2px); }
.cockpit-kpi-label { font-size: 12px; color: var(--ck-text-dim); margin-bottom: 8px; }
.cockpit-kpi-num { font-size: 30px; font-weight: 700; color: var(--ck-num); line-height: 1.1; font-family: 'Courier New', monospace; text-shadow: 0 0 18px rgba(91,156,255,.5); }
.cockpit-kpi-sub { font-size: 11px; color: var(--ck-text-dim); margin-top: 6px; }

.cockpit-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  position: relative;
}
.cockpit-card {
  background: var(--ck-panel);
  backdrop-filter: blur(8px);
  border: 1px solid var(--ck-border);
  border-radius: 10px;
  padding: 16px 20px 18px;
  position: relative;
  overflow: hidden;
  display: flex; flex-direction: column;
}
.cockpit-card::before {
  content: ''; position: absolute; top: 0; left: 0; width: 30px; height: 2px;
  background: linear-gradient(90deg, #5b9cff, transparent);
}
.cockpit-card-title {
  display: flex; align-items: center; gap: 8px;
  font-size: 14px; font-weight: 600; color: var(--ck-text);
  margin: 0 0 14px;
  padding-bottom: 10px;
  border-bottom: 1px dashed var(--ck-border);
}
.cockpit-card-title i { display: inline-block; width: 3px; height: 14px; background: #5b9cff; border-radius: 2px; box-shadow: 0 0 8px var(--ck-glow); }
.cockpit-card-body { flex: 1; min-height: 200px; }
.cockpit-card-body svg { width: 100%; height: 100%; max-height: 220px; }
.cockpit-card-wide { grid-column: span 3; }

/* 漏斗 */
.cockpit-funnel-row { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.cockpit-funnel-label { width: 60px; font-size: 13px; color: var(--ck-text-dim); }
.cockpit-funnel-bar-bg { flex: 1; height: 26px; background: rgba(255,255,255,.03); border-radius: 13px; overflow: hidden; }
.cockpit-funnel-bar { height: 100%; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 700; font-size: 14px; font-family: 'Courier New', monospace; text-shadow: 0 1px 2px rgba(0,0,0,.4); border-radius: 13px; transition: width .8s ease; box-shadow: 0 0 12px rgba(255,255,255,.1) inset; }
.cockpit-funnel-conv { width: 50px; font-size: 12px; color: #5b9cff; text-align: right; font-weight: 600; }

/* 业务分布 */
.cockpit-biz-row { display: flex; align-items: center; gap: 12px; padding: 8px 0; border-bottom: 1px dashed rgba(91,156,255,.10); }
.cockpit-biz-row:last-child { border-bottom: 0; }
.cockpit-biz-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.cockpit-biz-name { width: 90px; font-size: 13px; color: var(--ck-text); }
.cockpit-biz-bar-bg { flex: 1; height: 8px; background: rgba(255,255,255,.05); border-radius: 4px; overflow: hidden; }
.cockpit-biz-bar { height: 100%; border-radius: 4px; transition: width .8s ease; box-shadow: 0 0 8px; }
.cockpit-biz-num { min-width: 70px; text-align: right; font-family: 'Courier New', monospace; font-size: 14px; font-weight: 700; color: var(--ck-text); }

/* 活动流 */
.cockpit-activity-feed { max-height: 280px; overflow-y: auto; }
.cockpit-activity-item { display: flex; gap: 12px; padding: 10px 0; border-bottom: 1px dashed rgba(91,156,255,.10); }
.cockpit-activity-icon { width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.cockpit-activity-body { flex: 1; }
.cockpit-activity-text { font-size: 13px; color: var(--ck-text); line-height: 1.5; }
.cockpit-activity-meta { font-size: 11px; color: var(--ck-text-dim); margin-top: 3px; }

/* 问题学员 */
.cockpit-alert-list { min-height: auto; }
.cockpit-alert-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }
.cockpit-alert-card { display: flex; align-items: center; gap: 12px; padding: 12px 14px; background: rgba(255, 75, 75, 0.06); border: 1px solid rgba(255, 75, 75, 0.22); border-radius: 8px; transition: all .2s; }
.cockpit-alert-card:hover { background: rgba(255, 75, 75, 0.10); transform: translateX(2px); }
.cockpit-alert-avatar { width: 36px; height: 36px; border-radius: 50%; background: linear-gradient(135deg, #1a5fa8, #5b9cff); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 14px; flex-shrink: 0; }
.cockpit-alert-body { flex: 1; min-width: 0; }
.cockpit-alert-name { font-size: 13px; font-weight: 600; color: var(--ck-text); }
.cockpit-alert-class { font-size: 11px; color: var(--ck-text-dim); margin-top: 1px; }
.cockpit-alert-tags { display: flex; gap: 4px; flex-wrap: wrap; margin-top: 4px; }
.cockpit-alert-tag { font-size: 10px; padding: 1px 6px; border-radius: 3px; font-weight: 500; }
.cockpit-alert-acc { font-size: 11px; color: var(--ck-text-dim); text-align: right; }
.cockpit-alert-acc b { color: #c9231a; font-family: monospace; }

/* 滚动条 */
.cockpit-activity-feed::-webkit-scrollbar { width: 6px; }
.cockpit-activity-feed::-webkit-scrollbar-track { background: rgba(91,156,255,.05); }
.cockpit-activity-feed::-webkit-scrollbar-thumb { background: rgba(91,156,255,.3); border-radius: 3px; }

/* 响应式 */
@media (max-width: 1280px) {
  .cockpit-kpi-row { grid-template-columns: repeat(3, 1fr); }
  .cockpit-grid { grid-template-columns: repeat(2, 1fr); }
  .cockpit-card-wide { grid-column: span 2; }
  .cockpit-kpi-num { font-size: 24px; }
}
@media (max-width: 768px) {
  .cockpit-kpi-row { grid-template-columns: repeat(2, 1fr); }
  .cockpit-grid { grid-template-columns: 1fr; }
  .cockpit-card-wide { grid-column: span 1; }
  .cockpit-header { flex-direction: column; align-items: stretch; gap: 12px; }
  .cockpit-meta { flex-wrap: wrap; gap: 8px; }
}

/* ============================================================
 * 修改入口增强（v2.1）— 浮动管理按钮 + 通知铃铛
 * ============================================================ */
.portal-staff-chrome {
  position: fixed; right: 24px; bottom: 24px; z-index: 800;
  display: flex; flex-direction: column; gap: 10px; align-items: flex-end;
}
.portal-staff-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 10px 16px; border-radius: 999px;
  background: var(--primary); color: #fff;
  border: none; box-shadow: 0 6px 20px rgba(22,93,255,.35);
  font-size: 14px; font-weight: 500; cursor: pointer;
  transition: transform .15s, box-shadow .15s;
  text-decoration: none;
}
.portal-staff-btn:hover { transform: translateY(-2px); box-shadow: 0 10px 28px rgba(22,93,255,.5); }
.portal-staff-notif { padding: 10px; min-width: 40px; justify-content: center; position: relative; }
.portal-staff-edit { padding: 10px 18px; }
.portal-badge {
  position: absolute; top: -4px; right: -4px;
  background: var(--danger); color: #fff;
  font-size: 11px; font-weight: 600; padding: 1px 6px;
  border-radius: 10px; min-width: 18px; text-align: center;
  box-shadow: 0 0 0 2px #fff;
  animation: portal-badge-pulse 1.6s ease-in-out infinite;
}
@keyframes portal-badge-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.15); }
}
.portal-student-bell {
  position: fixed; right: 24px; bottom: 24px; z-index: 800;
  display: inline-flex; align-items: center; justify-content: center;
  width: 48px; height: 48px; border-radius: 50%;
  background: var(--primary); color: #fff;
  border: none; box-shadow: 0 6px 20px rgba(22,93,255,.35);
  font-size: 18px; cursor: pointer; position: fixed;
  transition: transform .15s, box-shadow .15s;
}
.portal-student-bell:hover { transform: scale(1.08); }
.portal-student-bell .portal-badge { right: -2px; top: -2px; }

/* ============================================================
 * 题库分组（pageQuestionBanks / pageSettings / cert-type form 共享）
 * ============================================================ */
.cert-tag {
  padding: 2px 10px;
  border-radius: 10px;
  background: rgba(22,93,255,0.1);
  color: var(--primary);
  font-size: 11px;
  display: inline-flex;
  align-items: center;
  gap: 2px;
}
.cert-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 8px;
  background: var(--gray-bg);
  border-radius: 8px;
  border: 1px dashed var(--border);
}
.cert-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 12px;
  background: var(--card-bg);
  border: 1px solid var(--border);
  border-radius: 16px;
  cursor: pointer;
  font-size: 13px;
  transition: all .15s;
  user-select: none;
}
.cert-pill:hover {
  border-color: var(--primary);
  background: var(--primary-light);
}
.cert-pill input[type="checkbox"] {
  margin: 0;
  accent-color: var(--primary);
}

/* 教员工作台 · 常用功能简约卡片（白底+左侧色条，桌面 3 列 / 手机 2 列） */
.qa-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
@media (max-width: 640px) { .qa-grid { grid-template-columns: repeat(2, 1fr); } }
.qa-card {
  display: block; text-decoration: none;
  background: #fff; border: 1px solid var(--border);
  border-left: 3px solid var(--primary);
  border-radius: 8px; padding: 14px 16px;
  box-shadow: 0 1px 10px rgba(22,93,255,0.06);
  transition: box-shadow .15s ease, transform .15s ease;
}
.qa-card:hover { box-shadow: 0 4px 14px rgba(22,93,255,0.12); transform: translateY(-1px); }
.qa-card .qa-title { font-size: 15px; font-weight: 600; color: var(--text-primary); }
.qa-card .qa-desc { font-size: 12px; color: var(--text-tertiary); margin-top: 4px; }

/* ===== 全局 KPI 卡片行（我的工资 / 项目开支分析 / 工作台共用）===== */
.dash-row4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.dash-row4:has(.kpi-card:nth-child(3):last-child) { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 1024px) { .dash-row4, .dash-row4:has(.kpi-card:nth-child(3):last-child) { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .dash-row4, .dash-row4:has(.kpi-card:nth-child(3):last-child) { grid-template-columns: 1fr; } }
.kpi-card { background: var(--card-bg); border: 1px solid var(--border); border-radius: 12px; padding: 18px 20px; box-shadow: var(--shadow); position: relative; overflow: hidden; display: flex; align-items: center; gap: 12px; }
.kpi-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--grad-brand); opacity: 0.6; }
.kpi-card > div:last-child { min-width: 0; }
.kpi-icon { width: 44px; height: 44px; border-radius: 12px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.kpi-num { font-size: 26px; font-weight: 700; line-height: 1.1; color: var(--text-primary); }
.kpi-label { font-size: 12px; color: var(--text-secondary); margin-top: 4px; line-height: 1.5; }
/* ===== 聚合数字钻取：可点的 KPI 卡片 + 落点高亮（「报销提成」点进去看逐笔明细）===== */
.kpi-drill { cursor: pointer; transition: border-color .15s, box-shadow .15s, transform .1s; }
.kpi-drill:hover { border-color: var(--primary); box-shadow: 0 3px 14px rgba(0, 0, 0, .09); }
.kpi-drill:active { transform: translateY(1px); }
.rb-caret { font-size: 11px; color: var(--primary); margin-left: 3px; white-space: nowrap; }
.kpi-caret { font-size: 11px; color: var(--primary); margin-left: 3px; white-space: nowrap; }
.rb-flash { animation: rbFlash 1.7s ease-out; }
@keyframes rbFlash { 0%, 55% { box-shadow: 0 0 0 3px rgba(10, 125, 51, .32); } 100% { box-shadow: none; } }

/* ============================================================
   数值钻取面板（老板 2026-09-15：每个数字点一下都要能看到「为什么」）
   ------------------------------------------------------------
   就地展开，不开浮窗。面板固定三层：
     ① 构成公式 —— 这个数 = 哪几项相加（每项可点）
     ② 逐笔明细 —— 每笔的日期 / 事由 / 金额
     ③ 来源单据 —— 每笔来自哪张单（工单号 / 报销单号）
   ============================================================ */
/* 面板本体：与上方内容留出间距（原来是 0 → 紧贴上面的卡片，看着像连成一块） */
.drill-panel { margin: 10px 0 18px; border: 1px solid var(--border-strong); border-left: 3px solid var(--primary); border-radius: var(--r-md); background: var(--card-bg); overflow: hidden; box-shadow: 0 1px 3px rgba(20, 35, 60, .06); animation: drillIn .18s ease-out; }
@keyframes drillIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
/* ① 标题栏：最深的一层底（原与公式区只差一个色阶，三层看着是一整块） */
.drill-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 13px 16px; background: var(--bg-deep); border-bottom: 1px solid var(--border-strong); }
.drill-head b { font-size: 15px; }
.drill-head .drill-close { margin-left: auto; }
/* 标题栏右侧的控件组（财务面板的「收入/支出/全部/收起」）——挤向右端 */
.drill-head-ctl { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-left: auto; }
.drill-head svg { color: var(--ink-3); flex-shrink: 0; }
/* ② 公式区：淡蓝底，把「这个数怎么来的」独立成一个视觉块 */
.drill-formula { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 14px 16px; font-size: 14px; line-height: 2.1; background: var(--primary-light); border-bottom: 1px solid var(--border); }
.drill-formula .df-eq { color: var(--ink-3); font-weight: 600; }
.drill-formula .df-total { font-weight: 700; color: var(--primary); }
.drill-chip { display: inline-flex; align-items: baseline; gap: 6px; padding: 4px 11px; border-radius: var(--r-sm); background: var(--card-bg); border: 1px solid var(--accent-line); white-space: nowrap; }
.drill-chip.is-zero { opacity: .6; }
.drill-chip b { font-weight: 600; font-variant-numeric: tabular-nums; }
.drill-chip .df-src { font-size: 12px; color: var(--text-tertiary); }
/* ③ 明细区：白底；段与段之间拉一条实线分开（原只有 10px 间距，多段就读成一片） */
.drill-body { padding: 14px 16px 9px; }
.drill-body + .drill-body { border-top: 1px solid var(--border); padding-top: 15px; }
.drill-body table { margin-bottom: 12px; }
/* 段标题：左侧色条 = 「新的一块从这里开始」，比单纯加粗好认 */
.drill-sec { font-size: 13px; color: var(--text-secondary); margin: 0 0 10px; padding-left: 9px; border-left: 3px solid var(--accent-line); display: flex; align-items: center; gap: 8px; min-height: 18px; }
.drill-sec b { color: var(--ink); font-weight: 600; }
/* ④ 口径说明：独立底条，别和明细正文糊在一起 */
.drill-note { font-size: 12.5px; line-height: 1.75; color: var(--text-tertiary); padding: 11px 16px; background: var(--surface-2); border-top: 1px solid var(--border); }
.drill-note code { background: var(--gray-bg); padding: 1px 5px; border-radius: var(--r-xs); font-size: 12px; }
/* 面板内的表格是「密集阅读」场景：表头必须立得住（全站默认表头是透明 + 12px 浅灰，
   在别处靠留白够用，在这里会跟正文糊在一起 → 只对面板内加强，不动全站口径） */
.drill-panel table.table thead th,
#fin-drill-panel table.table thead th { background: var(--gray-bg); color: var(--ink-2); font-weight: 600; border-bottom: 1px solid var(--border-strong); }
.drill-panel table.table td.num,
#fin-drill-panel table.table td.num { font-variant-numeric: tabular-nums; }
/* 明细里指回原始单据的链接（「来源」列的落点） */
.src-link { color: var(--primary); text-decoration: none; border-bottom: 1px dotted var(--primary); cursor: pointer; font-size: 12px; white-space: nowrap; }
.src-link:hover { color: var(--primary-hover, var(--primary)); border-bottom-style: solid; }
/* 表格里的可点数字（列合计、单元格金额） */
.num-drill { cursor: pointer; border-bottom: 1px dotted currentColor; }
.num-drill:hover { border-bottom-style: solid; }
/* 行内数字走钻取时会被 Drill 自动加上 .kpi-drill，但卡片那套悬浮阴影套在 <b> 上很怪
   （会像个小方块飘起来）→ 行内的把阴影动画关掉，只留虚线下划线 */
.num-drill.kpi-drill, .num-drill.kpi-drill:hover, .num-drill.kpi-drill:active { box-shadow: none; transform: none; border-color: inherit; }
/* 学员姓名链接：名字一律可点进学员详情（证书管理/打卡/风险名单/审核中心/提成台账/实考…）
   点划线下划线提示可点，颜色跟随上下文，不抢正文 —— 硬黑字加下划线会显得像报错 */
.stu-link { color: inherit; text-decoration: none; border-bottom: 1px dotted currentColor; cursor: pointer; }
.stu-link:hover { color: var(--primary); border-bottom-style: solid; }
/* 卡片：点开状态 */
.kpi-card.kpi-open { border-color: var(--primary); box-shadow: 0 0 0 1px var(--primary) inset; }
/* SVG 里的可点数字（驾驶舱雷达图各班的进度百分比）——虚线让「能点」看得出来。
   热区是盖在数字下面的透明矩形（手机上指头比 11px 的字大），所以 hover 效果挂矩形上。 */
.radar-num { text-decoration: underline dotted; text-underline-offset: 2px; }
.radar-hit:hover { fill: rgba(91, 156, 255, .12); }
/* 图下方那个大字热区（手机不好点 11px 的数字，用它兜底） */
.radar-hint { text-align: center; padding: 6px 0 2px; font-size: 12px; }
.radar-hint .kpi-caret { font-size: 12px; }

/* ============================================================
   Hallmark · macrostructure: Workbench · tone: technical-utilitarian
   anchor hue: 钢蓝 210° · 次强调: 黄铜 65° · theme: custom (航图)
   Genre: modern-minimal · 视觉层 v2 —— 覆盖上面 v1 的「AI 默认脸」
   ============================================================ */

/* ---------- 1. 基础排版：等宽数字 + 中文标题不给负字距 ---------- */
html, body {
  font-family: var(--font);
  background: var(--bg-body);
  color: var(--ink);
  font-size: 14px;
  line-height: 1.65;
  letter-spacing: 0;
  overflow-x: clip;                     /* 移动端禁止横向滚动（clip 不破坏 sticky） */
}
h1, h2, h3, h4, .card-title, .cal-title {
  letter-spacing: 0.01em;               /* 中文标题微正字距更「疏朗」，负字距是拉丁字体技巧 */
  font-weight: 600;
  color: var(--ink);
  overflow-wrap: anywhere;
}
h1 { font-size: 30px; line-height: 1.3; }
h2 { font-size: 22px; line-height: 1.35; }
h3 { font-size: 17px; }
b, strong { font-weight: 600; }

/* 所有数字列统一等宽 + 表格数字对齐（图纸感的关键细节） */
.num, .kpi-num, .stat-box .num, .hist-score, td.num, .cal-cell,
.rc-sum-num, .biz-cap-num, .about-stats b, .cockpit-kpi-num {
  font-family: var(--font-num);
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}

/* 统一焦点环：瞬时出现、不参与动画（可访问性硬要求） */
:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
  border-radius: var(--r-sm);
}
::selection { background: var(--accent-line); color: var(--accent-ink); }

/* ---------- 2. 去「AI 味」：粉彩图标底 → 统一的图纸式图标框 ---------- */
/* 原实现是 6 种高饱和粉彩色块（彩虹感），且散落在 JS 内联样式里 —— 用 !important 收口 */
.kpi-icon, .biz-icon, .me-insights-icon, .home-core-icon, .stat-box .ico, .home-section-icon {
  background: var(--accent-soft) !important;
  color: var(--accent-ink) !important;
  border: 1px solid var(--accent-line) !important;
  border-radius: var(--r-sm) !important;
  box-shadow: none !important;
}
/* 快捷操作按钮：原为 6 色彩虹 → 统一为中性描边，悬停才上强调色 */
.quick-action-btn {
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  color: var(--ink-2) !important;
  border-radius: var(--r-sm) !important;
  font-weight: 500 !important;
  transition: border-color var(--dur-fast) var(--ease-out),
              color var(--dur-fast) var(--ease-out),
              background var(--dur-fast) var(--ease-out) !important;
}
.quick-action-btn:hover {
  transform: none !important;
  border-color: var(--primary) !important;
  color: var(--primary) !important;
  background: var(--accent-soft) !important;
}
/* KPI 卡顶部的装饰渐变条 → 去掉（纯装饰，是模板感来源） */
.kpi-card::before { display: none !important; }
.kpi-card {
  border-radius: var(--r-md);
  border: 1px solid var(--border);
  box-shadow: none;
  padding: 16px 18px;
  align-items: flex-start;
}
.kpi-num { font-size: 24px; font-weight: 600; letter-spacing: -0.01em; }
.kpi-label { color: var(--ink-3); }

/* ---------- 3. 按钮：高度/字重/圆角统一，八态齐备 ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  height: 34px; padding: 0 14px;
  border: 1px solid var(--border-strong);
  border-radius: var(--r-sm);
  background: var(--surface);
  color: var(--ink); font-size: 13px; font-weight: 500;
  font-family: inherit; line-height: 1; white-space: nowrap;
  cursor: pointer; text-decoration: none;
  transition: background var(--dur-fast) var(--ease-out),
              border-color var(--dur-fast) var(--ease-out),
              color var(--dur-fast) var(--ease-out),
              transform var(--dur-fast) var(--ease-out);
}
.btn:hover { border-color: var(--primary); color: var(--primary); background: var(--accent-soft); }
.btn:active { transform: translateY(1px); }
.btn:disabled, .btn[disabled] { opacity: 0.45; cursor: not-allowed; transform: none; }
.btn:disabled:hover { border-color: var(--border-strong); color: var(--ink); background: var(--surface); }

.btn-primary {
  background: var(--primary); border-color: var(--primary); color: #fff; font-weight: 500;
}
.btn-primary:hover { background: var(--primary-dark); border-color: var(--primary-dark); color: #fff; }
.btn-success, .btn-warning, .btn-danger { color: #fff; font-weight: 500; }
.btn-success { background: var(--success); border-color: var(--success); }
.btn-warning { background: var(--warning); border-color: var(--warning); }
.btn-danger  { background: var(--danger);  border-color: var(--danger); }
.btn-success:hover, .btn-warning:hover, .btn-danger:hover { filter: brightness(0.92); color: #fff; }
.btn-outline { background: transparent; border-color: var(--border-strong); color: var(--ink-2); }
.btn-outline:hover { background: var(--accent-soft); border-color: var(--primary); color: var(--primary); }
.btn-link { background: none; border-color: transparent; color: var(--primary); height: auto; padding: 0; }
.btn-link:hover { background: none; text-decoration: underline; }
.btn-sm { height: 28px; padding: 0 10px; font-size: 12.5px; }
.btn-lg { height: 42px; padding: 0 22px; font-size: 15px; }
.btn-block { width: 100%; }

/* ---------- 4. 卡片：细线取代投影，小圆角 ---------- */
.card {
  background: var(--surface);
  border: var(--rule);
  border-radius: var(--r-md);
  box-shadow: none;
  padding: 18px 20px;
  margin-bottom: 14px;
}
.card-title {
  font-size: 14.5px; font-weight: 600; color: var(--ink);
  margin-bottom: 14px; display: flex; align-items: center; gap: 7px;
}
.card-title svg { color: var(--ink-3); }

/* ---------- 5. 徽章：药丸只给标签，方角留给状态 ---------- */
.badge {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 1px 8px; border-radius: var(--r-sm);
  font-size: 12px; font-weight: 500; line-height: 1.7;
  border: 1px solid transparent;
}
.badge::before { width: 5px; height: 5px; border-radius: 50%; }   /* 圆点缩小，更克制 */
.badge-success { color: #0b7a45; background: var(--success-light); border-color: #c9e8d5; }
.badge-warning { color: #9c5710; background: var(--warning-light); border-color: #f0d9b5; }
.badge-danger  { color: #c8231a;  background: var(--danger-light);  border-color: #f5cdc9; }
.badge-primary { color: var(--accent-ink); background: var(--accent-soft); border-color: var(--accent-line); }
.badge-gray    { color: var(--ink-2); background: var(--gray-bg); border-color: var(--border); }

/* ---------- 6. 表格：图纸式细线，去斑马纹 ---------- */
.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
table.table { width: 100%; border-collapse: collapse; font-size: 13px; }
table.table th, table.table td {
  padding: 9px 12px;
  border-bottom: 1px solid var(--border);
  text-align: left; vertical-align: middle;
}
table.table thead th {
  background: transparent;                 /* 去掉灰底表头，改细线 */
  color: var(--ink-3); font-weight: 500; font-size: 12px;
  letter-spacing: 0.04em; white-space: nowrap;
  border-bottom: 1px solid var(--border-strong);
}
table.table tbody tr:last-child td { border-bottom: 0; }
table.table tr:hover td { background: var(--surface-2); }
table.table td.num, table.table th.num { text-align: right; }

/* ---------- 7. 表单：细边 + 克制的焦点环 ---------- */
.form-input, .form-select, .form-textarea, .fill-input {
  height: 34px; padding: 0 11px;
  border: 1px solid var(--border-strong);
  border-radius: var(--r-sm);
  background: var(--input-bg); color: var(--ink);
  font-family: inherit; font-size: 13.5px;
  transition: border-color var(--dur-fast) var(--ease-out),
              box-shadow var(--dur-fast) var(--ease-out);
}
.form-textarea { height: auto; min-height: 76px; padding: 9px 11px; line-height: 1.6; }
.form-input::placeholder, .form-textarea::placeholder { color: var(--ink-4); }
.form-input:focus, .form-select:focus, .form-textarea:focus, .fill-input:focus {
  outline: none; border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(27, 94, 158, 0.12);
}
.form-input[readonly], .form-input:disabled {
  background: var(--gray-bg); color: var(--ink-3); border-color: var(--border);
}
.form-label { font-size: 12.5px; color: var(--ink-2); font-weight: 500; margin-bottom: 5px; }
.form-label.required::before { content: "*"; color: var(--danger); margin-right: 3px; }
.form-group { margin-bottom: 14px; }

/* ---------- 8. 浮层：阴影只留在这里 ---------- */
.modal-mask { background: rgba(18, 30, 48, 0.42); }
.modal {
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-2);
  border: 1px solid var(--border);
  overflow: hidden;
  /* 弹窗超高时由 .modal-body 内部滚动，而不是把内容裁掉。
     背景：本层 .modal 的 overflow:hidden（用于圆角裁切）会覆盖基础层的
     overflow-y:auto，导致内容超出 max-height 后既看不全、手指也滑不动
     —— 手机端长表单（项目汇报/报销等）会卡在底部按钮与键盘遮挡上。 */
  display: flex;
  flex-direction: column;
}
.modal-header { padding: 16px 20px; border-bottom: var(--rule); flex: 0 0 auto; }
.modal-header h3 { font-size: 15px; font-weight: 600; }
.modal-body {
  padding: 20px;
  flex: 1 1 auto;
  min-height: 0;              /* flex 子项默认 min-height:auto，会导致不收缩、滚不起来 */
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}
.modal-footer { padding: 14px 20px; border-top: var(--rule); flex: 0 0 auto; }
.modal-close { color: var(--ink-3); font-size: 18px; border-radius: var(--r-sm); padding: 4px 8px; }
.modal-close:hover { background: var(--gray-bg); color: var(--ink); }
/* 弹窗容器自身可聚焦（Tab 循环的锚点、焦点移入的落点），但焦点环只画在内部控件上，
   否则整个弹窗会出现一圈蓝框，看起来像样式坏了。 */
.modal:focus, .modal:focus-visible,
.qa-modal:focus, .qa-modal:focus-visible { outline: none; }

.toast {
  border-radius: var(--r-md);
  box-shadow: var(--shadow-2);
  font-size: 13.5px; font-weight: 500;
  border-left: 3px solid rgba(255, 255, 255, 0.5);
}
.pager button { border-radius: var(--r-sm); height: 30px; min-width: 30px; border-color: var(--border-strong); }
.pager button.active { background: var(--primary); border-color: var(--primary); }
.empty { color: var(--ink-3); padding: 40px 20px; text-align: center; font-size: 13px; }

/* ---------- 9. 门户（官网）：去蓝渐变，改图纸式页头 ---------- */
.portal-nav { border-bottom: var(--rule); box-shadow: none; }
.portal-nav-inner { max-width: 1120px; padding: 12px 20px; gap: 20px; }

.portal-hero {
  background: var(--grad-hero);
  border-bottom: 0;
  position: relative;
}
.portal-hero::after {                    /* 黄铜色底边：唯一的"金属"点缀 */
  content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
  background: linear-gradient(90deg, var(--brass) 0%, rgba(168, 118, 58, 0.15) 45%, transparent 100%);
}
.portal-hero-inner { max-width: 1120px; padding: 56px 20px; gap: 48px; }
.portal-hero-text h1 { font-size: 34px; font-weight: 600; letter-spacing: 0.02em; margin-bottom: 14px; }
.portal-hero-text p { font-size: 15px; opacity: 0.82; line-height: 1.75; margin-bottom: 22px; }
.portal-hero-stats { gap: 0; margin-bottom: 26px; }
.hero-stat { padding-right: 28px; margin-right: 28px; border-right: 1px solid rgba(255, 255, 255, 0.18); }
.hero-stat:last-child { border-right: 0; padding-right: 0; margin-right: 0; }
.hero-stat b { font-family: var(--font-num); font-size: 26px; font-weight: 600; letter-spacing: -0.01em; }
.hero-stat span { font-size: 12.5px; opacity: 0.7; letter-spacing: 0.03em; }

.portal-hero-cta .btn { height: 40px; padding: 0 22px; font-size: 14px; }
.portal-hero-cta .btn-outline { border-color: rgba(255, 255, 255, 0.45); color: #fff; background: transparent; }
.portal-hero-cta .btn-outline:hover { background: rgba(255, 255, 255, 0.12); border-color: #fff; color: #fff; }

.portal-footer { background: #22292f; color: #9aa4b0; padding: 44px 20px 22px; }
.portal-footer a:hover { color: #fff; }

/* 业务卡：去粉彩底，改细线上边 + 黄铜短线 */
.biz-card {
  border: var(--rule); border-radius: var(--r-md);
  box-shadow: none; transition: border-color var(--dur) var(--ease-out),
                                transform var(--dur) var(--ease-out);
}
.biz-card:hover { border-color: var(--primary); transform: translateY(-2px); }
.biz-icon { width: 44px; height: 44px; }

/* ---------- 10. 管理后台外壳 ---------- */
.admin-sidebar, .sidebar {
  border-right: var(--rule);
  box-shadow: none;
}
.menu-item { border-radius: var(--r-sm); font-size: 13.5px; }
.menu-item.active {
  background: var(--accent-soft);
  color: var(--accent-ink);
  font-weight: 500;
  box-shadow: inset 2px 0 0 var(--primary);   /* 左侧 2px 指示条取代整块高亮 */
}
.admin-topbar { border-bottom: var(--rule); box-shadow: none; }
.ws-tab { border-radius: var(--r-sm) var(--r-sm) 0 0; font-size: 13px; }
.cockpit-kpi-num { text-shadow: none !important; }   /* 去掉发光 */

/* ---------- 11. 学员端（移动优先）---------- */
.student-header {
  background: var(--grad-hero);
  padding: 12px 16px;
}
.student-header-title {
  font-size: 16px; font-weight: 600; letter-spacing: 0.02em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  min-width: 0; flex: 0 1 auto;
}
.student-header-name { min-width: 0; }
.student-tabbar { border-top: var(--rule); box-shadow: 0 -1px 0 rgba(20, 35, 60, 0.03); }
.tab-item { font-size: 11px; }
.home-core-grid > a, .home-core-cell {
  border: var(--rule); border-radius: var(--r-md);
  box-shadow: none; transition: border-color var(--dur-fast) var(--ease-out);
}
.home-core-cell:active { border-color: var(--primary); background: var(--accent-soft); }
.opt { border-radius: var(--r-sm); }
.opt .opt-letter { background: var(--gray-bg); border-radius: var(--r-xs); font-family: var(--font-num); }

/* ---------- 12. 登录页 ---------- */
.login-card { border-radius: var(--r-lg); box-shadow: var(--shadow-2); }
.login-brand { background: var(--grad-hero); }
.login-features li { opacity: 0.86; }

/* ---------- 13. 动效：只用 transform / opacity，尊重系统偏好 ---------- */
@media (prefers-reduced-motion: no-preference) {
  .card, .kpi-card, .biz-card { transition: border-color var(--dur) var(--ease-out); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ---------- 14. 移动端硬性约束（320 / 375 / 414 / 768）---------- */
@media (max-width: 768px) {
  h1 { font-size: 24px; }
  h2 { font-size: 19px; }
  .card { padding: 14px 16px; border-radius: var(--r-md); }
  .portal-hero-inner { flex-direction: column; padding: 36px 18px; gap: 26px; }
  .portal-hero-text h1 { font-size: 26px; }
  .portal-hero-img { max-width: 100%; width: 100%; }
  .portal-hero-stats { flex-wrap: wrap; gap: 14px 0; }
  .hero-stat { padding-right: 18px; margin-right: 18px; }
  .hero-stat b { font-size: 21px; }
  .student-header-title { font-size: 15px; }
  .kpi-num { font-size: 21px; }
  .btn { height: 32px; padding: 0 12px; }
  .btn-lg { height: 40px; }
}
@media (max-width: 375px) {
  .student-header { padding: 10px 12px; }
  .student-header-title { font-size: 14px; }
  .hdr-home-btn, .hdr-logout-btn { padding: 5px 9px; font-size: 12px; }
}
/* 图片网格轨道一律 minmax(0,1fr)，防内容撑破（移动端横向滚动的主因） */
.home-core-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 340px) { .home-core-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* 可点文字不换行成两行 */
.btn, .tab-item, .menu-item, .quick-action-btn, .portal-nav a { white-space: nowrap; }

/* ---------- 15. 首屏雷达：把「空蓝框 + 小图标」做成仪器盘面 ----------
   原兜底只是一个蓝色矩形里放一个小无人机图标，视觉上像占位符。
   这里用纯 CSS 画一个雷达示波器（同心圈/十字准线/刻度/扫描线/光点），
   不使用任何图片或生成素材（设计层级：排版 → CSS 图形 → SVG → 素材）。 */
.hero-banner {
  position: relative;
  aspect-ratio: 4 / 3;
  border-radius: var(--r-md);
  overflow: hidden;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.16);
  box-shadow: none;
}
.hero-radar {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
}
/* 同心圈 + 十字准线 */
.hero-radar::before, .hero-radar::after {
  content: ''; position: absolute; border-radius: 50%;
}
.hero-radar::before {
  width: 76%; aspect-ratio: 1;
  border: 1px solid rgba(255, 255, 255, 0.18);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05);
}
.hero-radar::after {
  width: 46%; aspect-ratio: 1;
  border: 1px solid rgba(255, 255, 255, 0.14);
}
/* 扫描线 */
.hero-radar-sweep {
  position: absolute; inset: 12%;
  border-radius: 50%;
  background: conic-gradient(from 0deg,
              rgba(255, 255, 255, 0.22) 0deg,
              rgba(255, 255, 255, 0.06) 26deg,
              transparent 60deg,
              transparent 360deg);
  animation: radar-sweep 5.5s linear infinite;
}
@media (prefers-reduced-motion: reduce) { .hero-radar-sweep { animation: none; } }
@keyframes radar-sweep { to { transform: rotate(360deg); } }
/* 中心机标 */
.hero-radar-core {
  position: relative; z-index: 2;
  width: 54px; height: 54px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.34);
  color: #fff;
}
/* 十字准线（用两条 1px 线画在盘面上） */
.hero-banner > .hero-radar-props { position: absolute; inset: 0; pointer-events: none; }
.hero-banner::before {
  content: ''; position: absolute; left: 50%; top: 8%; bottom: 8%; width: 1px;
  background: rgba(255, 255, 255, 0.1); transform: translateX(-0.5px);
}
.hero-banner::after {
  content: ''; position: absolute; top: 50%; left: 8%; right: 8%; height: 1px;
  background: rgba(255, 255, 255, 0.1); transform: translateY(-0.5px);
}
.hero-banner-caption {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 3;
  padding: 10px 14px;
  font-size: 12.5px; letter-spacing: 0.03em; color: rgba(255, 255, 255, 0.82);
  background: linear-gradient(180deg, rgba(18, 73, 127, 0) 0%, rgba(18, 73, 127, 0.72) 100%);
  text-align: left;
}
.hero-dot { background: rgba(255, 255, 255, 0.35); }
.hero-dot.active { background: var(--brass); }

/* 门户分组小标题：去掉「居中 + 小蓝下划线」这个模板套路，改左对齐 + 黄铜短线 */
.portal-section-title, .section-title {
  text-align: left;
  padding-left: 12px;
  border-left: 3px solid var(--brass);
}
.portal-section-title::after { display: none; }            /* 去掉「居中 + 40px 小下划线」套路 */
.portal-section-title { font-size: 21px; font-weight: 600; margin-bottom: 22px; }
.portal-section-inner { max-width: 1120px; }

/* ---------- 16. 学员端顶栏：修「用户名被挤成两行」----------
   原布局里操作区（返回/头像/姓名/退出）都能收缩，窄屏下姓名会被拆成两行。
   规则：操作区整体不收缩，姓名不折行；品牌名可让位（截断）。 */
.student-header { gap: 10px; }
.student-header-name { flex: 0 0 auto; white-space: nowrap; }
.student-header-name > span,
.student-header-name > b { white-space: nowrap; }
.hdr-home-btn, .hdr-logout-btn { flex: 0 0 auto; }
@media (max-width: 430px) {
  .student-header { padding: 10px 12px; gap: 8px; }
  .student-header-title { font-size: 14px; }
  .hdr-home-btn, .hdr-logout-btn { padding: 5px 8px; font-size: 12px; gap: 3px; }
  .student-header-name { gap: 7px !important; }
}
/* 「联系教员」里的 emoji 头像与其余线性图标风格冲突 → 统一为线性图标底 */
.home-core-cell .home-core-avatar {
  background: var(--accent-soft) !important;
  border: 1px solid var(--accent-line);
  border-radius: var(--r-sm);
  width: 34px; height: 34px;
  display: flex; align-items: center; justify-content: center;
}
.home-core-cell .home-core-avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: inherit; display: block; }

/* ============================================================
   门户 v3「航图 Aeronautical Chart」
   —— 面向无人机 / 低空经济题材的定制视觉（不是给模板换颜色）
   ------------------------------------------------------------
   老板反馈：官网"看着都是颜色调整""还不如之前的页面"。
   根因有两条，都是上一轮改造引入的：
     ① 用 !important 把业务卡的四种彩色图标底统一成了单色灰蓝 → 整页"没有颜色"
     ② hero 从横斜向亮蓝渐变改成竖向暗渐变 → 变闷
   本轮的思路是给门户建立题材专属语言，而不是继续调色：
     · 色：四个业务板块各有辨识色（同明度 / 低饱和，如航图标绘色）
     · 形：航图网格、方位刻度环、航路点 WP 编号、等宽仪表读数
     · 版式：编号 + 英文小字 + 中文 + 延伸线 的「技术手册」式题头
   ============================================================ */

:root {
  /* 业务辨识色：四色同明度低饱和，互为"标绘色"，可区分但不刺眼 */
  --biz-training:    #1b5e9e;  --biz-training-tint:    #e7eff8;
  --biz-hoisting:    #9a6a2e;  --biz-hoisting-tint:    #f6eee1;
  --biz-inspection:  #2c7a72;  --biz-inspection-tint:  #e5f1ef;
  --biz-application: #9d4239;  --biz-application-tint: #f6e9e6;
  --brass-lit: #d6a860;
  --grad-portal-hero: linear-gradient(135deg, #0d3563 0%, #17538f 52%, #2472b8 100%);
}

/* ---------- 首屏 ---------- */
.portal-hero { background: var(--grad-portal-hero); border-bottom: 0; }
.portal-hero::before {                    /* 叠一层更细的工程网格 */
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);
  background-size: 32px 32px;
}
.portal-hero-inner { position: relative; z-index: 2; }

/* 资质标签 */
.hero-eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--font-num);
  font-size: 12px; letter-spacing: .05em; color: rgba(255, 255, 255, .8);
  border: 1px solid rgba(255, 255, 255, .24); border-radius: 2px;
  padding: 4px 10px; margin-bottom: 18px;
}
.hero-eyebrow i { width: 5px; height: 5px; border-radius: 50%; background: var(--brass-lit); display: block; }

/* 数据条：仪表读数（等宽大数字 + 归属 + 底部刻度短横） */
.portal-hero-stats { gap: 0; align-items: flex-end; margin-bottom: 28px; }
.hero-stat {
  position: relative; padding: 0 26px 12px 0; margin: 0 26px 0 0;
  border-right: 1px solid rgba(255, 255, 255, .18);
}
.hero-stat:last-child { border-right: 0; padding-right: 0; margin-right: 0; }
.hero-stat::after {
  content: ''; position: absolute; left: 0; bottom: 0; width: 30px; height: 2px;
  background: var(--brass-lit); opacity: .9;
}
.hero-stat b {
  display: block; font-family: var(--font-num); color: #fff;
  font-size: 30px; font-weight: 600; letter-spacing: -.01em; line-height: 1.1;
}
.hero-stat span { display: block; margin-top: 3px; font-size: 12px; letter-spacing: .08em; color: rgba(255, 255, 255, .68); }

/* 航图视窗 */
.hero-banner {
  border: 1px solid rgba(255, 255, 255, .26);
  border-radius: 2px;
  background: rgba(9, 32, 58, .35);
  box-shadow: 0 18px 46px rgba(4, 20, 40, .32);
}
.hero-chart { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.hero-radar-core {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 58px; height: 58px; border-radius: 50%;
  background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .4);
  color: #fff; display: flex; align-items: center; justify-content: center;
}
.hero-banner-caption {
  font-family: var(--font-num); font-size: 11.5px; letter-spacing: .04em;
  padding: 16px 14px 10px;
  background: linear-gradient(180deg, rgba(9, 32, 58, 0) 0%, rgba(9, 32, 58, .86) 100%);
}
/* v2 给 .hero-banner 画的十字准线，在航图里是多余的 */
.hero-banner::before, .hero-banner::after { display: none; }

/* ---------- 栏目题头：编号 + 英文 + 中文 + 延伸线 ---------- */
.portal-section-title {
  display: flex; align-items: center; gap: 10px;
  text-align: left; padding-left: 0; border-left: 0; margin-bottom: 24px;
}
.portal-section-title::after { display: none; }
.sec-idx { font-family: var(--font-num); font-size: 12px; letter-spacing: .1em; color: var(--brass); }
.sec-en { font-family: var(--font-num); font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--ink-4); }
.sec-cn { font-size: 21px; font-weight: 600; color: var(--ink); letter-spacing: .01em; }
.sec-rule { flex: 1; height: 1px; background: var(--border); }

/* ---------- 业务卡：航图卡片 ---------- */
.portal-biz-grid { gap: 16px; }
.biz-card {
  position: relative; display: block; overflow: hidden;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: 2px; padding: 20px 20px 18px; box-shadow: none;
  transition: border-color .22s ease, transform .22s ease;
}
.biz-card::before {                       /* 顶部辨识色刻度线（悬停铺开） */
  content: ''; position: absolute; left: 0; top: 0; height: 2px; width: 100%;
  background: var(--tone); transform: scaleX(0); transform-origin: left;
  transition: transform .32s cubic-bezier(.4, 0, .2, 1);
}
.biz-card:hover { transform: translateY(-2px); border-color: var(--tone); }
.biz-card:hover::before { transform: scaleX(1); }
.biz-num {
  position: absolute; right: 16px; top: 13px;
  font-family: var(--font-num); font-size: 11px; letter-spacing: .1em; color: var(--ink-4);
}
.biz-icon {
  width: 42px; height: 42px; border-radius: 2px; margin-bottom: 14px;
  display: flex; align-items: center; justify-content: center;
  background: var(--tone-tint) !important;
  color: var(--tone) !important;
  border: 0 !important;
}
.biz-card h3 { font-size: 16px; font-weight: 600; margin-bottom: 8px; color: var(--ink); }
.biz-card h3::after {                     /* 标题下的短色线 */
  content: ''; display: block; width: 24px; height: 2px;
  background: var(--tone); margin-top: 9px; opacity: .85;
}
.biz-card p { font-size: 13px; line-height: 1.7; color: var(--ink-2); margin-bottom: 14px; }
.biz-cta { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; font-weight: 500; color: var(--tone); }
.biz-cta i { font-style: normal; transition: transform .22s ease; }
.biz-card:hover .biz-cta i { transform: translateX(3px); }

.biz-card[data-tone="training"]    { --tone: var(--biz-training);    --tone-tint: var(--biz-training-tint); }
.biz-card[data-tone="hoisting"]    { --tone: var(--biz-hoisting);    --tone-tint: var(--biz-hoisting-tint); }
.biz-card[data-tone="inspection"]  { --tone: var(--biz-inspection);  --tone-tint: var(--biz-inspection-tint); }
.biz-card[data-tone="application"] { --tone: var(--biz-application); --tone-tint: var(--biz-application-tint); }

/* ---------- 新闻 / 课程 ---------- */
.news-date, .course-meta span { font-family: var(--font-num); }
.news-date { color: var(--ink-3); letter-spacing: .02em; }
.news-cat { font-family: var(--font-num); letter-spacing: .06em; }
.course-card { border: 1px solid var(--border); border-radius: 2px; box-shadow: none; }
.course-card:hover { border-color: var(--primary); }

/* ---------- 页脚 ---------- */
.portal-footer { background: #1b2430; }
.portal-footer h4 { font-size: 13px; letter-spacing: .04em; color: #fff; }
.portal-footer h4::after { content: ''; display: block; width: 20px; height: 2px; background: var(--brass); margin-top: 8px; }

/* ---------- 移动端 ---------- */
@media (max-width: 768px) {
  .hero-stat { padding-right: 16px; margin-right: 16px; }
  .hero-stat b { font-size: 22px; }
  .sec-cn { font-size: 18px; }
  .sec-rule { display: none; }
  .portal-biz-grid { gap: 12px; }
  .hero-eyebrow { font-size: 11px; padding: 3px 8px; }
}

/* ---------- 门户 v3 修订：网格与色板 ---------- */
/* 业务卡：4 列定宽 + 最后一行居中。
   原 auto-fit 在「5 个业务板块」时会排成 4+1 且靠左，右边留一大块空 —— 板块数量由后台决定，
   改成定宽+居中后，3/4/5/6 个都能排整齐。 */
.portal-biz-grid { display: flex; flex-wrap: wrap; gap: 16px; justify-content: center; }
.portal-biz-grid .biz-card { flex: 0 0 calc((100% - 48px) / 4); }
/* 课程卡：min 提高到 420px，线上 2 门课时各占一半、排满一行（原 3 列时右侧空一格） */
.portal-course-grid { grid-template-columns: repeat(auto-fit, minmax(420px, 1fr)); }

/* 第 5 / 6 个业务板块的辨识色：避免与第 1 个撞色（线上第 5 个是「证书续期」） */
:root {
  --biz-renewal: #4a5b8c; --biz-renewal-tint: #e9ecf5;
  --biz-support: #6b6f7a; --biz-support-tint: #eeeff1;
}
.biz-card[data-tone="renewal"] { --tone: var(--biz-renewal); --tone-tint: var(--biz-renewal-tint); }
.biz-card[data-tone="support"] { --tone: var(--biz-support); --tone-tint: var(--biz-support-tint); }

@media (max-width: 1024px) {
  .portal-biz-grid .biz-card { flex: 0 0 calc((100% - 32px) / 3); }
}
@media (max-width: 768px) {
  .portal-biz-grid .biz-card { flex: 0 0 calc((100% - 16px) / 2); }
  .portal-course-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .portal-biz-grid .biz-card { flex: 0 0 100%; }
}

/* 手机端首屏数据条：改为 2 列网格。
   原来用 flex 换行，第 3 项会掉到第二行但右侧仍带分隔竖线（因为它不是 :last-child），看着像"断了一半"。 */
@media (max-width: 560px) {
  .portal-hero-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 0; }
  .hero-stat { border-right: 0; padding: 0 0 10px; margin: 0; }
  .hero-stat:nth-child(odd) { border-right: 1px solid rgba(255, 255, 255, .18); padding-right: 14px; }
  .hero-stat:nth-child(even) { padding-left: 14px; }
}

/* ============================================================
   门户 v4「Chart Edition」—— 把官网做成一份低空航图出版物
   ------------------------------------------------------------
   设计概念：aeronautical chart / 工程出版物
     · 纸张：航图纸的暖米色（取代上一版的冷灰 #f6f7f9）
     · 墨：航图深蓝 #0E2C4A；唯一信号色 = 航路洋红 #A8324A
     · 版式：图廓（chart frame）→ 图例题头 → 信息格栅 → 图廓信息栏
     · 数字：等宽，作为版面上的「仪表读数」
   与上一版（冷灰 + 钢蓝 + 黄铜 + 圆角卡片）是两套语言，不沿用其逻辑。
   全部规则限定在 .portal 作用域内，不影响后台与学员端。
   ============================================================ */

.portal {
  --paper: #F4F1EA;        /* 航图纸张米色：正文底 */
  --paper-2: #EBE6DC;      /* 次级分区底 */
  --paper-3: #E2DACB;
  --rule: #D9D1C3;         /* 暖灰细线 */
  --rule-2: #C3B8A4;
  --ink: #12212E;
  --ink-2: #465866;
  --ink-3: #5f6a78;
  --navy: #0E2C4A;         /* 航图深蓝 */
  --navy-2: #1B4B78;
  --navy-3: #2A6491;
  --magenta: #A8324A;      /* 航路洋红（唯一信号色） */
  --amber: #9A6B2F;        /* 地形棕 */
  --teal: #2F6F6B;         /* 空域青 */
  background: var(--paper);
  color: var(--ink);
}
.portal .portal-section { background: transparent; padding: 84px 0; }
.portal .portal-section-gray { background: var(--paper-2); }
.portal .portal-section-inner { max-width: 1120px; }

/* ---------- 导航：纸面上的细线栏 ---------- */
.portal .portal-nav { background: rgba(244, 241, 234, .94); border-bottom: 1px solid var(--rule); box-shadow: none; }
.portal .portal-nav-inner { max-width: 1120px; }
.portal .portal-nav a { color: var(--ink-2); }
.portal .portal-nav a:hover, .portal .portal-nav a.active { color: var(--navy); }
.portal .portal-logo { color: var(--navy); font-weight: 700; letter-spacing: .01em; }

/* ---------- 首屏：图廓 + 航线 ---------- */
.portal .portal-hero {
  background: linear-gradient(166deg, #0A1E33 0%, #0E2C4A 46%, #16405F 100%);
  color: #fff; position: relative; overflow: hidden; border-bottom: 0;
}
.portal .portal-hero::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
  background-size: 28px 28px;
}
.portal .portal-hero::after {          /* 底部洋红航线色 */
  content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
  background: linear-gradient(90deg, var(--magenta) 0%, rgba(168, 50, 74, .18) 44%, transparent 100%);
}
.portal .portal-hero-inner { position: relative; z-index: 2; max-width: 1120px; padding: 62px 20px 54px; gap: 44px; }
.portal .portal-hero-text h1 {
  font-size: 44px; line-height: 1.2; font-weight: 700; letter-spacing: .012em;
  color: #fff; margin-bottom: 16px;
}
.portal .portal-hero-text p { font-size: 15px; line-height: 1.85; color: rgba(255, 255, 255, .78); max-width: 540px; margin-bottom: 30px; }

/* 图廓（chart frame）——像真实航图的标题栏 */
.chart-frame {
  display: inline-flex; flex-wrap: wrap; align-items: stretch;
  border: 1px solid rgba(255, 255, 255, .26); border-radius: 2px;
  font-family: var(--font-num); font-size: 11px; letter-spacing: .07em;
  color: rgba(255, 255, 255, .84); margin-bottom: 26px;
}
.chart-frame > span { padding: 5px 13px; border-right: 1px solid rgba(255, 255, 255, .18); white-space: nowrap; }
.chart-frame > span:last-child { border-right: 0; }
.chart-frame .cf-k { background: rgba(255, 255, 255, .08); color: rgba(255, 255, 255, .55); }
.chart-frame b { color: #fff; font-weight: 600; }

/* 数据条：仪表读数 */
.portal .portal-hero-stats { display: flex; gap: 0; align-items: flex-end; margin-bottom: 32px; }
.portal .hero-stat {
  position: relative; padding: 0 30px 12px 0; margin: 0 30px 0 0;
  border-right: 1px solid rgba(255, 255, 255, .15);
}
.portal .hero-stat:last-child { border-right: 0; margin-right: 0; padding-right: 0; }
.portal .hero-stat::after { content: ''; position: absolute; left: 0; bottom: 0; width: 26px; height: 2px; background: var(--magenta); }
.portal .hero-stat b {
  display: block; font-family: var(--font-num); font-size: 31px; font-weight: 600;
  letter-spacing: -.02em; line-height: 1.05; color: #fff;
}
.portal .hero-stat span { display: block; margin-top: 5px; font-size: 11.5px; letter-spacing: .1em; color: rgba(255, 255, 255, .6); }

/* 首屏按钮：反白主按钮 */
.portal .portal-hero-cta .btn-lg { height: 44px; padding: 0 26px; font-size: 14.5px; border-radius: 2px; }
.portal .portal-hero-cta .btn-primary { background: #fff; border-color: #fff; color: var(--navy); font-weight: 600; }
.portal .portal-hero-cta .btn-primary:hover { background: rgba(255, 255, 255, .88); border-color: rgba(255, 255, 255, .88); color: var(--navy); }
.portal .portal-hero-cta .btn-ghost { border: 1px solid rgba(255, 255, 255, .4); color: #fff; background: transparent; }
.portal .portal-hero-cta .btn-ghost:hover { border-color: #fff; background: rgba(255, 255, 255, .1); color: #fff; }

/* 航图视窗 */
.portal .hero-banner { border: 1px solid rgba(255, 255, 255, .3); border-radius: 2px; background: rgba(6, 22, 38, .5); }
.portal .hero-banner-caption {
  font-family: var(--font-num); font-size: 11px; letter-spacing: .06em; padding: 16px 14px 10px;
  background: linear-gradient(180deg, rgba(6, 22, 38, 0) 0%, rgba(6, 22, 38, .9) 100%);
}
.portal .hero-radar-core { background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .42); }

/* 图廓信息栏（首屏底部） */
.chart-legend { position: relative; z-index: 2; border-top: 1px solid rgba(255, 255, 255, .15); background: rgba(6, 22, 38, .4); }
.chart-legend-inner {
  max-width: 1120px; margin: 0 auto; padding: 11px 20px;
  display: flex; flex-wrap: wrap; gap: 4px 26px;
  font-family: var(--font-num); font-size: 11px; letter-spacing: .07em; color: rgba(255, 255, 255, .58);
}
.chart-legend-inner b { color: rgba(255, 255, 255, .92); font-weight: 600; }

/* ---------- 栏目题头：图例样式 ---------- */
.portal .portal-section-title {
  display: flex; align-items: baseline; gap: 12px;
  border: 0; padding: 0; text-align: left; margin-bottom: 30px;
}
.portal .portal-section-title::after { display: none; }
.portal .sec-idx { font-family: var(--font-num); font-size: 12px; letter-spacing: .12em; color: var(--magenta); }
.portal .sec-en { font-family: var(--font-num); font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--ink-3); }
.portal .sec-cn { font-size: 23px; font-weight: 700; color: var(--ink); letter-spacing: .01em; }
.portal .sec-rule { flex: 1; height: 1px; background: var(--rule); }

/* ---------- 业务板块：信息格栅（出版物式表格化） ---------- */
.portal .portal-biz-grid { display: flex; flex-wrap: wrap; gap: 0; justify-content: flex-start; border-top: 1px solid var(--rule); }
.portal .biz-card {
  position: relative; flex: 0 0 25%; max-width: 25%; display: block;
  background: transparent; border: 0; border-bottom: 1px solid var(--rule); border-right: 1px solid var(--rule);
  border-radius: 0; padding: 26px 22px 24px; box-shadow: none;
  transition: background .22s ease;
}
.portal .biz-card:nth-child(4n+1) { border-left: 1px solid var(--rule); }
.portal .biz-card:hover { background: rgba(255, 255, 255, .62); transform: none; border-color: var(--rule); }
.portal .biz-card::before { display: none; }              /* 去掉上一版的悬停刻度条 */
.portal .biz-num {
  position: static; display: block; margin-bottom: 16px;
  font-family: var(--font-num); font-size: 11px; letter-spacing: .14em; color: var(--ink-3);
}
.portal .biz-num::after { content: ''; display: inline-block; width: 16px; height: 1px; background: var(--tone, var(--rule-2)); vertical-align: middle; margin-left: 8px; }
.portal .biz-icon {
  width: 40px; height: 40px; border-radius: 2px; margin-bottom: 16px;
  display: flex; align-items: center; justify-content: center;
  background: transparent !important; color: var(--tone) !important;
  border: 1px solid var(--tone) !important;
}
.portal .biz-card h3 { font-size: 16.5px; font-weight: 700; margin-bottom: 9px; color: var(--ink); letter-spacing: .01em; }
.portal .biz-card h3::after { display: none; }
.portal .biz-card p { font-size: 12.5px; line-height: 1.75; color: var(--ink-2); margin-bottom: 16px; min-height: 44px; }
.portal .biz-cta { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; color: var(--tone); letter-spacing: .02em; }
.portal .biz-cta i { font-style: normal; transition: transform .2s ease; }
.portal .biz-card:hover .biz-cta i { transform: translateX(3px); }
.portal .biz-card[data-tone="training"] { --tone: var(--navy-2); }
.portal .biz-card[data-tone="hoisting"] { --tone: var(--magenta); }
.portal .biz-card[data-tone="inspection"] { --tone: var(--amber); }
.portal .biz-card[data-tone="application"] { --tone: var(--teal); }
.portal .biz-card[data-tone="renewal"] { --tone: #5B6B8C; }
.portal .biz-card[data-tone="support"] { --tone: #7A7C74; }

/* ---------- 新闻：出版物式列表 ---------- */
.portal .portal-news-list { border-top: 1px solid var(--rule); }
.portal .news-item {
  display: flex; align-items: baseline; gap: 16px; padding: 13px 4px;
  border-bottom: 1px solid var(--rule); background: transparent;
}
.portal .news-item:hover { background: rgba(255, 255, 255, .55); }
.portal .news-date { font-family: var(--font-num); font-size: 12px; color: var(--ink-3); letter-spacing: .04em; flex: 0 0 86px; order: -1; }
.portal .news-cat { font-family: var(--font-num); font-size: 11px; letter-spacing: .08em; color: var(--magenta); flex: 0 0 74px; }
.portal .news-title { font-size: 14px; color: var(--ink); flex: 1; }

/* ---------- 课程：图版卡 ---------- */
.portal .portal-course-grid { gap: 20px; }
.portal .course-card {
  background: #fff; border: 1px solid var(--rule); border-top: 2px solid var(--navy);
  border-radius: 2px; box-shadow: none; padding: 24px 22px;
}
.portal .course-card h3 { font-size: 17px; font-weight: 700; color: var(--navy); margin-bottom: 10px; }
.portal .course-card:hover { border-color: var(--rule-2); border-top-color: var(--magenta); box-shadow: none; transform: none; }
.portal .course-meta span { font-family: var(--font-num); font-size: 12.5px; }

/* ---------- 页脚：图廓信息栏 ---------- */
.portal .portal-footer { background: #0B2137; color: #9FB0BF; padding: 46px 20px 22px; }
.portal .portal-footer-inner { max-width: 1120px; }
.portal .portal-footer h4 { color: #fff; font-size: 12.5px; letter-spacing: .06em; }
.portal .portal-footer h4::after { content: ''; display: block; width: 18px; height: 2px; background: var(--magenta); margin-top: 9px; }
.portal .portal-footer p { font-size: 13px; line-height: 1.9; }
.portal .portal-copyright { border-top: 1px solid rgba(255, 255, 255, .12); font-family: var(--font-num); font-size: 11px; letter-spacing: .06em; color: #7E8F9E; }

/* ---------- 移动端 ---------- */
@media (max-width: 1024px) {
  .portal .biz-card { flex: 0 0 33.333%; max-width: 33.333%; }
  .portal .biz-card:nth-child(4n+1) { border-left: 0; }
  .portal .biz-card:nth-child(3n+1) { border-left: 1px solid var(--rule); }
}
@media (max-width: 768px) {
  .portal .portal-hero-inner { padding: 40px 18px 34px; gap: 26px; }
  .portal .portal-hero-text h1 { font-size: 28px; }
  .portal .portal-hero-text p { font-size: 14px; }
  .portal .portal-section { padding: 52px 0; }
  .portal .biz-card { flex: 0 0 50%; max-width: 50%; padding: 20px 16px 18px; }
  .portal .biz-card:nth-child(3n+1) { border-left: 0; }
  .portal .biz-card:nth-child(odd) { border-left: 1px solid var(--rule); }
  .portal .hero-stat { padding-right: 18px; margin-right: 18px; }
  .portal .hero-stat b { font-size: 23px; }
  .portal .sec-cn { font-size: 19px; }
  .portal .sec-rule { display: none; }
  .portal .news-item { flex-wrap: wrap; gap: 6px 12px; }
  .portal .news-date { flex: 0 0 auto; }
  .chart-frame { font-size: 10px; }
  .chart-frame > span { padding: 4px 9px; }
}
@media (max-width: 560px) {
  .portal .biz-card { flex: 0 0 100%; max-width: 100%; border-left: 1px solid var(--rule) !important; }
}

/* 门户容器撑满视口，避免底部露出后台的冷灰底色 */
.portal { min-height: 100vh; }

/* ---------- 门户 v4 精修 ---------- */
/* 业务格栅封底：末行只有 1 格时，补一条底边让整块格栅收口 */
.portal .portal-biz-grid { border-bottom: 1px solid var(--rule); }
/* 首屏加大气势 */
.portal .portal-hero-inner { padding: 72px 20px 60px; }
.portal .portal-hero-text h1 { font-size: 48px; line-height: 1.16; letter-spacing: .01em; }
.portal .portal-hero-text p { font-size: 15.5px; max-width: 560px; }
.portal .portal-hero-img { max-width: 468px; }
.portal .hero-banner { aspect-ratio: auto; height: 306px; }
@media (max-width: 768px) {
  .portal .portal-hero-text h1 { font-size: 29px; }
  .portal .portal-hero-img { max-width: 100%; }
  .portal .hero-banner { height: 200px; }
}
/* 门户导航按钮统一到航图深蓝 */
.portal .portal-nav .btn-primary { background: var(--navy); border-color: var(--navy); color: #fff; }
.portal .portal-nav .btn-primary:hover { background: var(--navy-2); border-color: var(--navy-2); color: #fff; }
/* 图廓不换行（字段精简后应可一行容纳；窄屏允许换行避免溢出） */
.portal .chart-frame { max-width: 100%; }
@media (min-width: 769px) { .portal .chart-frame { flex-wrap: nowrap; } }

/* ---------- 门户 v4：业务板块等子页面页头，统一到航图语言 ---------- */
.portal .biz-hero {
  background: linear-gradient(166deg, #0A1E33 0%, #0E2C4A 46%, #16405F 100%);
  color: #fff; position: relative; overflow: hidden;
}
.portal .biz-hero::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
  background-size: 28px 28px;
}
.portal .biz-hero::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
  background: linear-gradient(90deg, var(--magenta) 0%, rgba(168, 50, 74, .18) 44%, transparent 100%);
}
.portal .biz-hero-inner { position: relative; z-index: 2; max-width: 1120px; padding: 52px 20px 48px; }
.portal .biz-hero-icon {
  border-radius: 2px; background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .3);
  width: 66px; height: 66px;
}
.portal .biz-hero-bread { font-family: var(--font-num); font-size: 11px; letter-spacing: .12em; opacity: .62; }
.portal .biz-hero-text h1 { font-size: 34px; font-weight: 700; letter-spacing: .012em; }
.portal .biz-hero-tag { font-size: 15px; opacity: .82; line-height: 1.8; }
.portal .biz-hero-cta .btn { border-radius: 2px; }
@media (max-width: 768px) {
  .portal .biz-hero-text h1 { font-size: 25px; }
  .portal .biz-hero-inner { padding: 36px 18px 32px; }
}

/* 修复：v4 给 .portal 设的深色文字会波及深色页头（h1 等由 v2 全局规则直接着色，不能被继承覆盖）
   → 深色页头内的文字必须显式给白色 */
.portal .biz-hero-text h1 { color: #fff; }
.portal .biz-hero-bread { color: rgba(255, 255, 255, .62); }
.portal .biz-hero-tag { color: rgba(255, 255, 255, .84); }
.portal .biz-hero-icon { color: #fff; }
.portal .portal-hero-panel, .portal .portal-hero-panel h1, .portal .portal-hero-panel h2 { color: #fff; }
/* 业务介绍正文：长段落左对齐（居中只适合短标语，段落居中不专业） */
.portal .biz-intro { text-align: left; margin: 0; max-width: 760px; line-height: 1.9; font-size: 14.5px; }
/* 门户内的分段正文统一左对齐 */
.portal .portal-section-inner > p, .portal .portal-section-inner > div > p.biz-intro { text-align: left; }

/* ---------- 快速修改浮球：可拖动（手机端原本固定右下角、会压住内容） ---------- */
.float-quick-edit { touch-action: none; -webkit-user-select: none; user-select: none; }
.float-quick-edit.dragging { transition: none !important; transform: none !important; cursor: grabbing; }
@media (max-width: 768px) {
  .float-quick-edit { width: 46px; height: 46px; right: 14px; bottom: 14px; }
  .float-quick-edit-popover { right: 12px; bottom: 70px; width: min(300px, calc(100vw - 24px)); }
}

/* ============================================================
   财务模块移动端排版修复（老板反馈：手机上数据乱、有内容超出屏幕）
   ------------------------------------------------------------
   390px 实测根因（都是「容器装不下、又没给横向滚动」）：
     ① 财务流水表(9 列) / 报销审核表(8 列) 没套 .table-wrap
        → 334px 容器塞 586px 内容：「来源 / 操作」列整块消失，
          「支出 / 教员 / 底薪」被浏览器压成逐字竖排
     ② .card-title 是不换行的 flex，标题与筛选控件挤在一行
        → 「财务流水」四个字被压成竖排
     ③ 明细面板用内联 grid「1fr 2fr」：CSS 里 1fr = minmax(auto,1fr)，
        不会收缩到内容宽度以下 → 撑破卡片（已改为 .fin-drill-grid 类）
   ============================================================ */

/* ---------- 财务页「明细分析」面板：与通用钻取面板（.drill-panel）同一套视觉语言 ----------
   它外层是 .card（.card 定义在本文更后面，会把 .drill-panel 的 border / 圆角覆盖掉），
   所以这里用 id 选择器写，优先级高于 .card，不依赖代码先后顺序。 */
#fin-drill-panel {
  margin: 10px 0 18px;
  padding: 0;                                    /* 抵消 .card 的 18px 20px，让标题栏铺满整条 */
  border: 1px solid var(--border-strong);
  border-left: 3px solid var(--primary);
  border-radius: var(--r-md);
  box-shadow: 0 1px 3px rgba(20, 35, 60, .06);
  overflow: hidden;
}
#fin-drill-panel > #fin-drill-body { padding: 14px 16px 6px; }
/* 面板顶部那行「范围 ｜ 共 N 笔 ｜ 怎么返回」 */
.drill-meta { font-size: 12.5px; line-height: 1.7; color: var(--text-tertiary); margin-bottom: 12px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
/* 明细滚动区：限高 + 圆角边框，长表不再把面板拉成一条 */
.drill-scroll { max-height: 52vh; overflow: auto; border: 1px solid var(--border); border-radius: var(--r-sm); }
/* 滚动时表头吸顶。⚠ border-collapse 下 sticky th 的 border 不渲染，要用 inset 阴影画线 */
.drill-scroll table.table thead th { position: sticky; top: 0; z-index: 1; box-shadow: inset 0 -1px 0 var(--border-strong); }

/* ① 表格：在容器内横向滚动；给表格一个最小宽度，避免被压缩成逐字竖排 */
@media (max-width: 768px) {
  .table-wrap > table.table { min-width: 620px; }

  /* ② 卡片标题行：允许换行，标题与筛选/操作控件分行，不再互相挤压 */
  .card-title { flex-wrap: wrap; row-gap: 8px; }
  .card-title > span { margin-left: 0 !important; flex-wrap: wrap; }
}

/* ③ 明细分析面板：窄屏改单列 */
.fin-drill-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
  gap: 16px;
  align-items: start;
}
@media (max-width: 900px) {
  .fin-drill-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
}

/* ---------- 财务模块移动端：控件排布与表格可读性 ---------- */
/* 标签类不折行（「支出」被压成「支/出」逐字竖排是手机端最刺眼的乱象） */
.badge { white-space: nowrap; }

@media (max-width: 768px) {
  /* 卡片标题右侧的控件组：原为 flex 换行，4 个控件会排成 3+1 的零散两行；
     改 2 列网格后成 2×2，左对齐、等宽、间距一致 */
  .fin-ctl {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px 8px;
    width: 100%;
    margin-left: 0 !important;
  }
  .fin-ctl > * { width: 100% !important; min-width: 0; }

  /* 钻取面板标题栏的控件组（财务面板 4 个切换键）与通用面板的「收起」按钮：
     原来财务面板标题用的是 .card-title，能吃到上面那条规则；改成 .drill-head 后
     会丢这层保护 → 这里补等价规则，否则窄屏下按钮被挤出屏幕 */
  .drill-head-ctl {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px 8px;
    width: 100%;
    margin-left: 0 !important;
  }
  .drill-head-ctl > * { width: 100% !important; min-width: 0; }
  .drill-head .drill-close { margin-left: 0; }
  .drill-head { row-gap: 8px; }
  .drill-formula { padding: 12px 14px; }
  .drill-body { padding: 13px 14px 8px; }
  .drill-note { padding: 10px 14px; }
  #fin-drill-panel > #fin-drill-body { padding: 13px 14px 6px; }
  /* 窄屏把这块让给数据：这句提示在手机上会独占一行，且本来也按不到「后退」以外的操作 */
  .drill-meta-hint { display: none; }
  /* 明细滚动表的单元格不折行（「吊运费」被压成「吊运/费」是手机端最常见的乱象）；
     与财务模块既有的 .fin-tbl 同一口径：表格已给足最小宽度，溢出交给横向滚动 */
  .drill-scroll table.table th, .drill-scroll table.table td { white-space: nowrap; }

  /* 财务表格：单元格不折行（原被压缩成逐字竖排），改由容器横向滚动承载；
     表格另给最小宽度，保证列宽按内容分配而不是被硬挤 */
  .fin-tbl th, .fin-tbl td { white-space: nowrap; }
  /* 表格宽度按内容自适应（width:max-content），不要给固定 min-width：
     固定宽度下 nowrap 的单元格会溢出表格边界，滚动条覆盖不到那么多，
     结果「滑到底仍看不到最后一列」 */
  /* 表格宽度必须由内容决定（width:auto）：项目样式表给 table.table 设了 width:100%，
     在窄容器里会与 nowrap 的单元格冲突 —— 表格只有 334px 宽、单元格却要 888px，
     于是内容溢出表格边界、滚动条也覆盖不到。width:auto + min-width:100% 让窄屏按内容撑开、
     宽屏仍铺满容器。 */
  /* 表格至少要跟内容一样宽（min-width:max-content），保留 width:100% 让宽屏铺满。
     不能只写 min-width:固定值：窄屏下 nowrap 的单元格会溢出表格边界、滚动条覆盖不到 */
  .fin-tbl > table.table { min-width: max-content; }
}

/* ============================================================
   门户 v4 修订（2026-09-14，老板反馈「新闻公告在手机上跳出屏幕外」）
   ------------------------------------------------------------
   实测根因（390px）：
     ① `.portal .portal-section { padding: 84px 0 }` —— v4 改这条时把 v1 的**左右 20px
        内边距写成了 0**，导致门户所有区块（业务格栅 / 新闻 / 课程 / 子页内容）
        在窄屏下**完全贴边**：新闻列表 left=0、right=390，日期从 4px 起、
        标题右缘顶到 386。观感就是「内容溢出屏幕」。
     ② 手机端新闻条目里「日期(71px) + 分类(74px) + 两道 gap(24px)」占掉 169px，
        390px 屏下标题只剩 213px → 31 字标题被挤成 3 行。
   ============================================================ */

/* ① 恢复左右内边距（垂直方向保持 v4 的 84px 节奏） */
.portal .portal-section { padding: 84px 20px; }

/* ② 手机端新闻条目：日期/分类占一行，标题独占整行（不再被挤成多行） */
@media (max-width: 768px) {
  .portal .news-item { padding: 12px 2px; }
  .portal .news-title {
    flex: 1 1 100%;          /* basis 100% → 强制换行到第二行，拿到整行宽度 */
    font-size: 13.5px;
    line-height: 1.68;
  }
  .portal .news-date { font-size: 11.5px; }
  .portal .news-cat { font-size: 10.5px; }
  /* 门户各区块的左右留白同步（原为 52px 0） */
  .portal .portal-section { padding: 52px 18px; }
}

/* ③ 门户导航栏：≤1500px 时登录按钮会被挤出屏幕
      （实测 1440px：内容需 1287px，容器实有 1080px → 登录按钮 right=1443 > 视口 1432，
        右侧被切掉；1366 笔记本更明显。原因是导航项多 + `white-space: nowrap`
        → flex 子项无法收缩，整行只能往右溢出） */
.portal .portal-menu { min-width: 0; overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none; }
.portal .portal-menu::-webkit-scrollbar { display: none; }   /* 菜单可滚动但不显示滚动条 */
.portal .portal-logo { flex: 0 0 auto; }
.portal .portal-nav .btn { flex: 0 0 auto; }

@media (max-width: 1500px) {
  .portal .portal-nav-inner { gap: 14px; }
  .portal .portal-menu { gap: 18px; margin-right: 4px; }
  .portal .portal-menu a { font-size: 14px; }
}
@media (max-width: 1220px) {
  .portal .portal-menu { gap: 14px; }
  .portal .portal-menu a { font-size: 13.5px; }
}

/* ============================================================
   门户 v4 修订（2026-09-14 之二，老板反馈「手机版门户首页排版不行、一个内容太长」）
   ------------------------------------------------------------
   实测（390×844）：整页 4678px = **5.5 屏**，最大的问题在「业务板块」——
   5 张卡**一张一行、卡内大片留白**（每张 354×248，内容只占约 150px），
   仅这一块就 1404px = **1.66 屏**。
   改为手机端的「航图索引行」：图标 + 标题 + 单行简介 + 编号/箭头，
   每行约 76px，5 行 ≈ 400px（省约 1 屏）。同时保留四色辨识（左侧色条 + 图标色），
   不牺牲 v4 的设计语言。
   ============================================================ */

@media (max-width: 640px) {
  /* 业务板块：块级列表（取代一卡一行的大卡） */
  .portal .portal-biz-grid { display: block; border-top: 0; border-bottom: 0; }

  .portal .biz-card {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) auto;
    grid-template-rows: auto auto;
    column-gap: 13px; row-gap: 2px;
    align-items: center;
    padding: 14px 15px 14px 13px;
    border: 1px solid var(--rule) !important;
    border-bottom: 0 !important;
    border-left: 2px solid var(--tone) !important;   /* 保留板块辨识色 */
  }
  .portal .biz-card:last-child { border-bottom: 1px solid var(--rule) !important; }
  .portal .biz-card:active { background: rgba(255, 255, 255, .6); }

  /* 图标：左侧，跨两行 */
  .portal .biz-icon { grid-area: 1 / 1 / 3 / 2; width: 40px; height: 40px; margin: 0; }
  /* 标题 / 简介：中间列 */
  .portal .biz-card h3 { grid-area: 1 / 2 / 2 / 3; margin: 0; font-size: 15px; line-height: 1.35; }
  .portal .biz-card p {
    grid-area: 2 / 2 / 3 / 3; margin: 0; min-height: 0;
    font-size: 12px; line-height: 1.55;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  }
  /* 编号（右上）/ 箭头（右下）：右列 */
  .portal .biz-num {
    grid-area: 1 / 3 / 2 / 4; position: static; margin: 0;
    font-size: 10.5px; text-align: right; align-self: center;
  }
  .portal .biz-num::after { display: none; }
  .portal .biz-cta {
    grid-area: 2 / 3 / 3 / 4; justify-self: end; align-self: center;
    font-size: 0;                                    /* 手机上只保留箭头，文字省略 */
  }
  .portal .biz-cta i { font-size: 14px; }

  /* 整体竖向节奏收紧：区块上下留白 52 → 40px */
  .portal .portal-section { padding: 40px 18px; }
  .portal .portal-section-title { margin-bottom: 22px; }
}

/* ============================================================
   门户 v4 修订（2026-09-14 之三，老板反馈「整个门户还有很多地方可以排版，关于我们太长、没什么排版」）
   ------------------------------------------------------------
   先按 390px 逐页量了高度（单位=屏），问题成体系：
     业务板块 7.5 屏 ｜ 资质证书 6.8 屏 ｜ 关于我们 6.3 屏 ｜ 资讯中心 4.8 屏 ｜ 首页 4.4 屏 ｜ 客户案例 4.0 屏
   根因是同一类：**所有卡片网格都用 `repeat(auto-fit, minmax(200~320px, 1fr))`，
   在 354px 的可用宽度里一律塌成单列**，加上卡片内边距是桌面值（20~26px），
   于是「4 张价值观卡 = 796px」「4 张团队卡 = 915px」「4 个数字 = 541px」「12 张资质卡 = 3532px」。
   本层统一处理：窄屏明确列数 + 卡片紧凑化 + 给长列表以结构（索引行/时间轴），
   全部限定 `.portal` 作用域、仅 ≤640px 生效，桌面与平板不受影响。
   ============================================================ */

/* 关于我们：简介段（原为内联样式的纯文字块，无版式；抽成类后窄屏才可调） */
.about-story {
  margin-top: 30px; padding: 20px 22px;
  background: var(--card-bg); border: 1px solid var(--border);
  border-left: 3px solid var(--primary); border-radius: var(--radius-md);
  font-size: 15px; line-height: 1.95; color: var(--text-secondary); text-indent: 2em;
}

@media (max-width: 640px) {
  /* ---------- 关于我们 ---------- */
  .portal .about-story { margin-top: 18px; padding: 15px 16px; font-size: 13.5px; line-height: 1.9; }

  .portal .about-grid { gap: 10px; }
  .portal .about-block { padding: 15px 16px 17px; border-top-width: 2px; }
  .portal .about-block h4 { font-size: 12.5px; letter-spacing: 1px; margin-bottom: 5px; }
  .portal .about-block p { font-size: 13.5px; line-height: 1.85; }

  /* 核心价值观：4 张 → 2×2（原单列 796px） */
  .portal .about-value-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .portal .about-value { padding: 15px 11px; }
  .portal .about-value-mark { width: 34px; height: 34px; border-radius: 9px; font-size: 17px; margin-bottom: 8px; }
  .portal .about-value h4 { font-size: 13.5px; margin-bottom: 5px; }
  .portal .about-value p { font-size: 11.5px; line-height: 1.6; }

  /* 发展历程：加左侧时间轴（原本只是一串没有结构的列表，且行距浪费） */
  .portal .timeline { padding-left: 16px; margin-left: 3px; border-left: 1px solid var(--rule-2); }
  .portal .timeline-item { padding: 8px 0; position: relative; }
  .portal .timeline-item::before {
    content: ''; position: absolute; left: -21px; top: 14px;
    width: 7px; height: 7px; border-radius: 50%;
    background: var(--magenta); box-shadow: 0 0 0 3px var(--paper);
  }
  .portal .timeline-year { font-size: 12.5px; letter-spacing: .06em; padding-top: 0; }
  .portal .timeline-event { font-size: 13px; line-height: 1.72; padding-left: 0; margin-top: 2px; }

  /* 核心团队：4 张 → 2×2（原单列 915px） */
  .portal .team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .portal .team-card { padding: 15px 11px; }
  .portal .team-avatar { width: 44px; height: 44px; font-size: 18px; margin-bottom: 9px; }
  .portal .team-card h4 { font-size: 14px; margin-bottom: 3px; }
  .portal .team-title { font-size: 11.5px; margin-bottom: 7px; }
  .portal .team-card p { font-size: 11.5px; line-height: 1.65; }

  /* 服务覆盖：标签 + 数据 2×2（原 4 个数字单列 541px） */
  .portal .about-cov { gap: 8px; margin-bottom: 20px; }
  .portal .about-cov-tag { padding: 6px 13px; font-size: 12.5px; }
  .portal .about-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .portal .about-stats > div { padding: 13px 8px; border-bottom-width: 2px; }
  .portal .about-stats b { font-size: 21px; margin-bottom: 3px; }
  .portal .about-stats span { font-size: 11.5px; }

  /* ---------- 资质证书（12 张卡原占 4.19 屏）----------
     卡片改为「图标 | 名称 | 等级」一行 + 下面紧凑字段表 */
  .portal .cert-grid { gap: 10px; }
  .portal .cert-card {
    padding: 13px 15px; display: grid;
    grid-template-columns: 30px minmax(0, 1fr) auto;
    column-gap: 10px; row-gap: 9px; align-items: center;
  }
  .portal .cert-head { display: contents; }          /* 让图标/等级直接参与卡片网格 */
  .portal .cert-icon { grid-area: 1 / 1 / 2 / 2; width: 30px; height: 30px; border-radius: 7px; }
  .portal .cert-card h4 { grid-area: 1 / 2 / 2 / 3; margin: 0; font-size: 13.5px; line-height: 1.45; }
  .portal .cert-level { grid-area: 1 / 3 / 2 / 4; font-size: 10px; padding: 2px 8px; white-space: nowrap; }
  /* 字段：由「5 行 × 标签|值」改为「标签内联的流动文本」——
     标签缩到 10px 后，每行可容纳约 2 个字段，5 个字段由 6 行降到 3~4 行 */
  .portal .cert-card .cert-meta {
    grid-area: 2 / 1 / 3 / 4;
    display: block; font-size: 11.5px; line-height: 1.5; color: var(--ink-2);
  }
  .portal .cert-card .cert-meta .cm { display: inline; margin-right: 12px; white-space: nowrap; }
  /* 「覆盖范围」值最长（可达 30+ 字），独占整行时允许折行，否则会溢出卡片 */
  .portal .cert-card .cert-meta .cm:last-child { white-space: normal; }
  .portal .cert-card .cert-meta .cm b { font-size: 10px; letter-spacing: .02em; margin-right: 3px; }
  .portal .cert-card code { font-size: 11px; padding: 0 5px; }

  /* 合作伙伴：8 家原单列 806px → 2 列 */
  .portal .partner-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .portal .partner { padding: 12px 10px; }
  .portal .partner-name { font-size: 13.5px; margin-bottom: 3px; }
  .portal .partner-tag { font-size: 11px; }

  /* ---------- 业务板块页 ---------- */
  /* 服务流程：圆形序号 + 标题/说明 改横向行（原 6 步 939px） */
  .portal .biz-step-grid { gap: 8px; }
  .portal .biz-step {
    display: grid; grid-template-columns: 30px minmax(0, 1fr);
    column-gap: 11px; row-gap: 1px; align-items: center; padding: 12px 14px;
  }
  .portal .biz-step-num { grid-area: 1 / 1 / 3 / 2; width: 28px; height: 28px; font-size: 13px; margin: 0; }
  .portal .biz-step h4 { grid-area: 1 / 2 / 2 / 3; margin: 0; font-size: 14px; }
  .portal .biz-step p { grid-area: 2 / 2 / 3 / 3; margin: 0; font-size: 12px; line-height: 1.6; }

  /* 核心能力：整体收紧 */
  .portal .biz-cap-grid { gap: 8px; }
  .portal .biz-cap { padding: 13px 14px; gap: 12px; border-left-width: 2px; }
  .portal .biz-cap-num { font-size: 19px; min-width: 26px; }
  .portal .biz-cap-body h4 { font-size: 14px; margin-bottom: 4px; }
  .portal .biz-cap-body p { font-size: 12px; line-height: 1.62; }

  /* 技术指标表：标签列收窄、行高压缩（桌面 180px 的标签列在窄屏过宽） */
  .portal .biz-spec-table th, .portal .biz-spec-table td { padding: 10px 13px; font-size: 12.5px; }
  .portal .biz-spec-table th { width: 96px; }

  /* ---------- 资讯中心 / 客户案例 ---------- */
  .portal .article-grid { gap: 12px; }
  .portal .article-cover { height: 118px; }
  .portal .article-body { padding: 13px 14px 15px; }
  .portal .article-title { font-size: 15px; }
  .portal .article-summary { font-size: 12.5px; -webkit-line-clamp: 2; line-clamp: 2; }
  .portal .case-card { padding: 16px 16px; gap: 9px; }
  .portal .case-card-title { font-size: 15px; }
  .portal .case-card-summary { font-size: 12.5px; }
}

/* ---------- 门户 v4：文章封面/页头统一为「航图图版」 ----------
   原实现是 `linear-gradient(135deg, 后台色 0%, #1a5fa8 100%)`，而后台色取自
   Arco 默认色板（#0a7d33 绿 / #b35500 橙 / #c9231a 红 / #2670c4 蓝）——
   一屏 8 篇文章会出现 5 种高饱和渐变，是门户上最后一处明显的「模板味」。
   现改为：统一的航图墨蓝底 + 细网格 + 底部 3px 强调边（用后台设定的颜色），
   既与 v4 语言一致，也保留「后台设的颜色有意义」这层含义。
   颜色经 covOf() 校验后以 --cov 变量传入（不再拼进内联 background 字符串）。 */
.portal .article-cover {
  height: 140px; position: relative; overflow: hidden; color: #fff;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(166deg, #0A1E33 0%, #0E2C4A 46%, #16405F 100%);
  border-bottom: 3px solid var(--cov, #A8324A);
}
.portal .article-cover::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(255, 255, 255, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .055) 1px, transparent 1px);
  background-size: 24px 24px;
}
.portal .article-cover::after { display: none; }        /* 去掉原径向高光 */
.portal .article-cover > svg { position: relative; z-index: 1; opacity: .92; }

.portal .article-hero {
  background: linear-gradient(166deg, #0A1E33 0%, #0E2C4A 46%, #16405F 100%);
  border-bottom: 3px solid var(--cov, #A8324A);
}
.portal .article-hero::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
  background-size: 28px 28px;
}
.portal .article-hero-title, .portal .article-hero-meta { position: relative; z-index: 1; }
.portal .article-hero .article-cat { border: 1px solid rgba(255, 255, 255, .32); backdrop-filter: none; }

/* 窄屏封面高度（必须放在上面基础规则之后，否则同优先级下被 140px 覆盖） */
@media (max-width: 640px) {
  .portal .article-cover { height: 118px; }
}

/* ---------- 门户 v4：资讯/案例/证书查询等页的栏目标题统一 ----------
   这 5 个页面此前不在 `.portal` 作用域内，标题一直是 v1 的样式
   （居中 24px + 40px 小下划线），与其余页面的「图例题头」不一致。 */
.portal .portal-section-head { margin-bottom: 26px; }
.portal .portal-section-head h2 {
  font-size: 22px; font-weight: 700; color: var(--ink);
  letter-spacing: .01em; margin: 0 0 8px;
  padding-left: 12px; border-left: 3px solid var(--brass);
}
.portal .portal-section-head > p { font-size: 13.5px; color: var(--ink-3); margin: 0; }
@media (max-width: 640px) {
  .portal .portal-section-head { margin-bottom: 18px; }
  .portal .portal-section-head h2 { font-size: 19px; margin-bottom: 5px; }
  .portal .portal-section-head > p { font-size: 12.5px; }
}

/* ============================================================
   关于我们 · 手机端重编排（2026-09-14 之四）
   ------------------------------------------------------------
   老板反馈：「手机网页版也得调整，关于我们也太长了，要发挥获奖级能力」。
   上一轮只做了「紧凑化」，这轮**改结构**：
     · 篇首（hero）从 276px 收到约 180px：图标 66→44、标题 24→22、去掉多余留白
     · 愿景/使命：由两张卡片改为「标签 + 正文」的词条式排布（省掉卡片内边距与边框）
     · 公司简介：与愿景/使命同一节内连贯排版，行高与字号成体系
     · 核心价值观：4 格改为紧凑 2×2，字符标（安/专/共/创）缩为 28px
     · 发展历程：7 段**全部保留可见**，由「年份一行 + 事件一行」改为「等宽年份 + 事件」
       两列一行（左轨 + 洋红节点），高度 689 → 约 300px
     · 核心团队：2×2 收紧
     · 服务覆盖：标签行收紧；4 个数字由「4 张卡」改为**一条数据带**
       （一格一列、细线分隔、无卡片底），更接近出版物里的数字栏
     · 各节上下留白 40 → 28px
   目标：整页由 6.3 屏 → 3 屏以内，且不靠隐藏内容
   ============================================================ */
@media (max-width: 640px) {
  /* ---------- 篇首 ---------- */
  .portal .biz-hero-inner { padding: 22px 18px 20px; gap: 12px; }
  .portal .biz-hero-icon { width: 44px; height: 44px; border-radius: 2px; }
  .portal .biz-hero-icon svg { width: 22px; height: 22px; }
  .portal .biz-hero-bread { font-size: 10.5px; letter-spacing: .1em; }
  .portal .biz-hero-text h1 { font-size: 22px; line-height: 1.3; margin: 3px 0 0; }
  .portal .biz-hero-tag { font-size: 12px; line-height: 1.5; margin-top: 4px; }

  /* ---------- 竖向节奏 ---------- */
  .portal .portal-section { padding: 28px 18px; }

  /* ---------- 愿景 / 使命：卡片 → 词条 ---------- */
  .portal .about-grid { gap: 0; max-width: none; }
  .portal .about-block {
    background: transparent; border: 0; border-radius: 0;
    border-top: 1px solid var(--rule);
    padding: 13px 0 14px;
  }
  .portal .about-block:first-child { border-top: 0; padding-top: 0; }
  .portal .about-block h4 {
    font-size: 11px; font-weight: 500; letter-spacing: .16em;
    color: var(--magenta); margin-bottom: 6px;
  }
  .portal .about-block p { font-size: 14px; line-height: 1.72; color: var(--ink); }

  .portal .about-story {
    margin-top: 14px; padding: 13px 0 0 14px;
    background: transparent; border: 0; border-left: 2px solid var(--brass);
    border-radius: 0; font-size: 13.5px; line-height: 1.85; color: var(--ink-2);
  }

  /* ---------- 核心价值观：2×2 紧凑格 ---------- */
  .portal .about-value-grid { gap: 8px; }
  .portal .about-value {
    background: var(--surface); border: 1px solid var(--rule); border-radius: 2px;
    padding: 13px 11px; text-align: left;
  }
  .portal .about-value-mark {
    width: 26px; height: 26px; border-radius: 2px; font-size: 14px;
    margin: 0 0 8px; background: transparent; color: var(--magenta);
    border: 1px solid var(--rule-2);
  }
  .portal .about-value h4 { font-size: 13.5px; margin-bottom: 4px; }
  .portal .about-value p { font-size: 11.5px; line-height: 1.55; color: var(--ink-3); }

  /* ---------- 发展历程：全部可见的紧凑年表 ---------- */
  .portal .timeline {
    display: block; padding: 0 0 0 14px; margin: 0;
    border-left: 1px solid var(--rule-2); max-width: none;
  }
  .portal .timeline-item {
    display: grid; grid-template-columns: 42px minmax(0, 1fr);
    column-gap: 10px; align-items: baseline;
    padding: 7px 0; position: relative;
  }
  .portal .timeline-item::before {
    content: ''; position: absolute; left: -18px; top: 14px;
    width: 6px; height: 6px; border-radius: 50%;
    background: var(--magenta); box-shadow: 0 0 0 3px var(--paper);
  }
  .portal .timeline-year {
    font-size: 12px; font-weight: 500; letter-spacing: .02em;
    color: var(--ink-3); padding-top: 0;
  }
  .portal .timeline-event { font-size: 12.5px; line-height: 1.6; color: var(--ink-2); margin: 0; }

  /* ---------- 核心团队 ---------- */
  .portal .team-grid { gap: 8px; }
  .portal .team-card {
    padding: 13px 11px; border: 1px solid var(--rule); border-radius: 2px;
  }
  .portal .team-avatar {
    width: 38px; height: 38px; font-size: 15px; margin-bottom: 7px;
    background: transparent; color: var(--navy); border: 1px solid var(--rule-2);
  }
  .portal .team-card h4 { font-size: 13.5px; margin-bottom: 2px; }
  .portal .team-title { font-size: 10.5px; letter-spacing: .06em; color: var(--magenta); margin-bottom: 6px; }
  .portal .team-card p { font-size: 11px; line-height: 1.6; color: var(--ink-3); }

  /* ---------- 服务覆盖：一条数据带 ---------- */
  .portal .about-cov { gap: 6px; margin-bottom: 16px; justify-content: flex-start; }
  .portal .about-cov-tag {
    padding: 4px 10px; font-size: 11.5px; border-radius: 2px;
    background: transparent; border: 1px solid var(--rule-2); color: var(--ink-2);
  }
  .portal .about-stats {
    grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; max-width: none;
    border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule);
  }
  .portal .about-stats > div {
    background: transparent; border: 0; border-right: 1px solid var(--rule);
    border-radius: 0; padding: 11px 5px; text-align: left;
  }
  .portal .about-stats > div:last-child { border-right: 0; }
  .portal .about-stats b { font-size: 15px; margin-bottom: 2px; color: var(--navy); }
  .portal .about-stats span { font-size: 9.5px; line-height: 1.3; color: var(--ink-3); }
}

/* ============================================================
   门户页脚 · 手机端重排（2026-09-14）
   ------------------------------------------------------------
   实测：手机端页脚高 **801px ≈ 0.95 屏**，是整页最大的单块浪费，而且**每个门户页面都带它**。
   根因：`.footer-col { min-width: 200px }` 在 350px 可用宽度里 → **四栏各自塌成一行**，
   且每列内的链接是 `<p>` 逐条一行（业务板块 6 条 = 6 行）。
   重排为：品牌行（整宽）→ 两列流动链接 → 联系信息（整宽）→ 版权行。
   ============================================================ */
@media (max-width: 640px) {
  .portal .portal-footer { padding: 26px 18px 16px; }
  .portal .portal-footer-inner {
    display: grid; grid-template-columns: 1fr 1fr;
    gap: 16px 18px; max-width: none;
  }
  .portal .footer-col { min-width: 0; }
  /* 用 order 重排：品牌 → 业务/快速（两列）→ 联系 → 版权 */
  .portal .footer-col:nth-child(1) { grid-column: 1 / -1; order: 1; }
  .portal .footer-col:nth-child(3) { order: 2; }
  .portal .footer-col:nth-child(4) { order: 3; }
  .portal .footer-col:nth-child(2) { grid-column: 1 / -1; order: 4; }

  .portal .footer-col h4 { font-size: 11px; letter-spacing: .12em; margin-bottom: 7px; }
  .portal .footer-col h4::after { width: 14px; margin-top: 5px; }
  .portal .footer-col { display: flex; flex-wrap: wrap; align-content: flex-start; gap: 3px 14px; }
  .portal .footer-col h4 { flex: 0 0 100%; }
  .portal .footer-col p { font-size: 11.5px; line-height: 1.7; margin: 0; flex: 0 0 auto; }
  /* 品牌列与联系列整宽，逐条成行 */
  .portal .footer-col:nth-child(1) p,
  .portal .footer-col:nth-child(2) p { flex: 0 0 100%; }
  .portal .portal-copyright {
    margin-top: 18px; padding-top: 12px; font-size: 10px; line-height: 1.6;
    letter-spacing: .02em; text-align: left;
  }

  /* 顺带再收一点的竖向节奏 */
  .portal .portal-section { padding: 26px 18px; }
  .portal .timeline-item { padding: 6px 0; }
  .portal .timeline-event { font-size: 12px; line-height: 1.55; }
  .portal .about-stats > div { padding: 10px 5px; }
  .portal .team-card { padding: 12px 10px; }
  .portal .about-value { padding: 12px 10px; }
}

/* ============================================================
   门户 v4 修订（2026-09-14 之五）· 业务板块页手机端重编排
   ------------------------------------------------------------
   实测（393×812）：整页 4640px = **5.71 屏**，是门户里最长的一页。逐段量（px / 屏）：
     hero 284(0.35) ｜ 业务介绍 185(0.23) ｜ 核心能力 502(0.62) ｜ 技术指标 372(0.46)
     ｜ 服务流程 543(0.67) ｜ 适用对象 381(0.47) ｜ 其他板块 383(0.47)
     ｜ 相关案例+资讯 1462(1.80) ｜ 页脚 422(0.52)
   两条根因：
     ① 卡片网格与表格在 354px 可用宽度里**一律塌成单列** —— 4 张能力卡 376px、
        6 步流程 399px、6 行指标表 270px 全部逐条纵向堆叠；
     ② 案例 2 张 + 资讯 3 张纵向排（单条 220~284px）独占 1.8 屏，是整页最贵的一块留白。
   本轮按移动优先重排，全部限定 ≤640px + `.portal-biz-page` 作用域（桌面/平板不受影响、
   也不波及上一轮已调好的「关于我们」等页面）：
     · 篇首：CTA 由竖排两枚大按钮改并排，图标 44→38
     · 核心能力：4 卡单列 → 2×2 格（序号移到标题上方）
     · 技术指标：表格 → 2 列「标签/数值」小卡（响应式表格的标准做法）
     · 服务流程：6 步单列 → 横向步骤条（scroll-snap；流程本身有时序，横滑符合语义）
     · 适用对象/资质：两块单列 → 2 列
     · 其他业务板块：索引行 → 2×2 格
     · 相关案例/资讯：纵向堆叠 → 横向轨道（右侧露出下一张边缘，天然提示可滑）
   原则：不折叠、不隐藏任何内容，只换版式。
   ============================================================ */
@media (max-width: 640px) {
  .portal-biz-page .portal-section { padding: 22px 18px; }
  .portal-biz-page .portal-section-title { margin-bottom: 16px; }

  /* ---------- ① 篇首 ---------- */
  .portal-biz-page .biz-hero-inner { padding: 20px 18px 18px; gap: 10px; }
  .portal-biz-page .biz-hero-icon { width: 38px; height: 38px; }
  .portal-biz-page .biz-hero-icon svg { width: 19px; height: 19px; }
  .portal-biz-page .biz-hero-text h1 { font-size: 21px; }
  .portal-biz-page .biz-hero-tag { font-size: 11.5px; line-height: 1.5; }
  /* CTA：竖排两枚大按钮 → 并排（原占 104px，现 42px） */
  .portal-biz-page .biz-hero-cta { flex-direction: row; align-items: stretch; gap: 8px; margin-top: 12px; }
  .portal-biz-page .biz-hero-cta .btn { flex: 1 1 0; min-width: 0; padding: 10px 10px; font-size: 13px; }

  /* ---------- ② 业务介绍 ---------- */
  .portal-biz-page .biz-intro { font-size: 13.5px; line-height: 1.8; }

  /* ---------- ③ 核心能力：4 卡 → 2×2 ---------- */
  .portal-biz-page .biz-cap-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .portal-biz-page .biz-cap { display: block; padding: 12px 12px 13px; gap: 0; border-left-width: 2px; }
  .portal-biz-page .biz-cap-num { font-size: 15px; min-width: 0; margin-bottom: 5px; letter-spacing: .04em; }
  .portal-biz-page .biz-cap-body h4 { font-size: 13px; line-height: 1.4; margin-bottom: 4px; }
  .portal-biz-page .biz-cap-body p { font-size: 11.5px; line-height: 1.6; }

  /* ---------- ④ 技术指标：表格 → 2 列小卡 ---------- */
  .portal-biz-page .biz-spec-table {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px; max-width: none; background: transparent; box-shadow: none;
    border-collapse: separate; border-radius: 0; overflow: visible;
  }
  .portal-biz-page .biz-spec-table tbody { display: contents; }
  .portal-biz-page .biz-spec-table tr {
    display: flex; flex-direction: column; min-width: 0;
    border: 1px solid var(--rule) !important; background: var(--surface);
    padding: 10px 12px 11px;
  }
  .portal-biz-page .biz-spec-table th,
  .portal-biz-page .biz-spec-table td {
    display: block; width: auto; padding: 0; background: transparent; text-align: left;
  }
  .portal-biz-page .biz-spec-table th {
    font-family: var(--font-num); font-size: 10px; font-weight: 500;
    letter-spacing: .08em; color: var(--ink-3); margin-bottom: 4px;
  }
  .portal-biz-page .biz-spec-table td { font-size: 12.5px; line-height: 1.45; color: var(--ink); }

  /* ---------- ⑤ 服务流程：6 步单列 → 横向步骤条 ---------- */
  .portal-biz-page .biz-step-grid {
    display: flex; flex-wrap: nowrap; gap: 8px;
    overflow-x: auto; scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
    margin: 0 -18px; padding: 2px 18px 6px;
  }
  .portal-biz-page .biz-step-grid::-webkit-scrollbar { display: none; }
  .portal-biz-page .biz-step {
    flex: 0 0 62vw; max-width: 62vw; scroll-snap-align: start;
    display: grid; grid-template-columns: 26px minmax(0, 1fr);
    column-gap: 9px; row-gap: 1px; align-items: center; padding: 11px 12px;
  }
  .portal-biz-page .biz-step-num { grid-area: 1 / 1 / 3 / 2; width: 24px; height: 24px; font-size: 12px; margin: 0; }
  .portal-biz-page .biz-step h4 { grid-area: 1 / 2 / 2 / 3; margin: 0; font-size: 13px; }
  .portal-biz-page .biz-step p { grid-area: 2 / 2 / 3 / 3; margin: 0; font-size: 11.5px; line-height: 1.55; }

  /* ---------- ⑥ 适用对象 / 资质：2 列 ---------- */
  .portal-biz-page .biz-applicable { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; max-width: none; }
  .portal-biz-page .biz-applicable-block { padding: 12px 12px 13px; border-left-width: 2px; }
  .portal-biz-page .biz-applicable-block h4 { font-size: 12px; letter-spacing: .04em; margin-bottom: 5px; }
  .portal-biz-page .biz-applicable-block p { font-size: 11.5px; line-height: 1.62; }

  /* ---------- ⑦ 其他业务板块：2×2 ---------- */
  .portal-biz-page .portal-biz-grid {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px;
  }
  .portal-biz-page .biz-card {
    display: grid; grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto auto auto; column-gap: 10px; row-gap: 2px; align-items: start;
    padding: 11px 12px 12px;
    border: 1px solid var(--rule) !important; border-left: 2px solid var(--tone) !important;
    background: var(--surface);
  }
  .portal-biz-page .biz-card:last-child { border-bottom: 1px solid var(--rule) !important; }
  .portal-biz-page .biz-icon { grid-area: 1 / 1 / 2 / 2; width: 32px; height: 32px; margin: 0 0 4px; }
  .portal-biz-page .biz-card h3 { grid-area: 2 / 1 / 3 / 3; margin: 0; font-size: 13.5px; line-height: 1.35; }
  .portal-biz-page .biz-card p {
    grid-area: 3 / 1 / 4 / 3; margin: 0; min-height: 0;
    font-size: 11.5px; line-height: 1.5;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  }
  .portal-biz-page .biz-num { grid-area: 1 / 2 / 2 / 3; position: static; margin: 0; font-size: 9.5px; text-align: right; align-self: start; }
  .portal-biz-page .biz-num::after { display: none; }
  .portal-biz-page .biz-cta { display: none; }   /* 2 列格内省略箭头，整卡可点 */

  /* ---------- ⑧ 相关案例 / 资讯：横向轨道 ---------- */
  .portal-biz-page .biz-related-section { margin: 0; padding: 22px 0 24px; max-width: none; }
  .portal-biz-page .biz-related-section h3 { font-size: 15px; margin: 0 0 10px; padding: 0 18px; }
  .portal-biz-page .biz-related-section .case-grid,
  .portal-biz-page .biz-related-section .article-grid {
    display: flex; flex-wrap: nowrap; gap: 10px;
    overflow-x: auto; scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
    padding: 2px 18px 8px;
  }
  .portal-biz-page .biz-related-section .case-grid::-webkit-scrollbar,
  .portal-biz-page .biz-related-section .article-grid::-webkit-scrollbar { display: none; }
  .portal-biz-page .biz-related-section .case-card,
  .portal-biz-page .biz-related-section .article-card {
    flex: 0 0 74vw; max-width: 74vw; scroll-snap-align: start;
  }
  .portal-biz-page .biz-related-section .case-card { padding: 14px 14px; gap: 7px; }
  .portal-biz-page .biz-related-section .case-card-title {
    font-size: 14.5px; line-height: 1.35;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  }
  /* 摘要限 2 行：轨道内卡片等高，摘要不限行会让整轨高度由最长的一篇决定 */
  .portal-biz-page .biz-related-section .case-card-summary {
    font-size: 12px; line-height: 1.55; flex: 0 0 auto;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  }
  .portal-biz-page .biz-related-section .article-cover { height: 92px; }
  .portal-biz-page .biz-related-section .article-body { padding: 12px 13px 14px; }
  .portal-biz-page .biz-related-section .article-title { font-size: 14px; line-height: 1.38; }
  .portal-biz-page .biz-related-section .article-summary { font-size: 12px; line-height: 1.55; }
  .portal-biz-page .biz-rel-gap { height: 14px; }

  /* ---------- ⑨ 结合部留白（页脚见下一节，全门户统一） ---------- */
}

/* ============================================================
   门户页脚 · 手机端再收紧（全门户生效）
   ------------------------------------------------------------
   页脚是**每个门户页面都带**的一块，上一轮已由 801px 压到约 420px。
   本轮把行距/字号再收一档（不改结构、不改内容），各页再省 40~50px：
     padding 26→22 ／ 栏间距 16→13 ／ 链接字号 11.5→11 ／ 版权行上间距 18→14
   ============================================================ */
@media (max-width: 640px) {
  .portal .portal-footer { padding: 22px 18px 14px; }
  .portal .portal-footer-inner { gap: 13px 16px; }
  .portal .footer-col h4 { font-size: 10.5px; margin-bottom: 5px; }
  .portal .footer-col p { font-size: 11px; line-height: 1.62; }
  .portal .portal-copyright { margin-top: 14px; padding-top: 10px; }
}

/* ============================================================
   门户 v4 修订（2026-09-14 之六）· 资质证书页手机端重编排
   ------------------------------------------------------------
   实测（393×812）：整页 3443px = **4.24 屏**（门户里最长）。逐段：
     资质一览 **2409px（2.97 屏）** ｜ 合作伙伴 404 ｜ 页脚 381 ｜ hero 192
   12 张资质卡每张 194px，构成为「图标/名称/等级 一行 + 5 个字段各占一行」——
   字段表是最大浪费：`dt|dd` 两列固定占位，5 个字段就是 6 行（覆盖范围还会折行）。
   改为**标签内联的流动文本**（.cert-meta 由 grid 改 block、.cm 由 contents 改 inline）
   后，标签缩到 10px，一行可容纳约 2 个字段 → 6 行降到 4 行，单卡 194→132px。
   （HTML 侧只是把 <dl><dt><dd> 换成等价的 span 结构，桌面端观感不变：
     `.cm { display: contents }` + 78px/1fr 网格，与原 dl 逐像素等价）
   本轮另收：篇首、合作伙伴卡、页脚沿用全门户那一套。
   全部限定 ≤640px + `.portal-cert-page` 作用域。
   ============================================================ */
@media (max-width: 640px) {
  /* ---------- 篇首 ---------- */
  .portal-cert-page .biz-hero-inner { padding: 18px 18px 16px; gap: 9px; }
  .portal-cert-page .biz-hero-icon { width: 34px; height: 34px; }
  .portal-cert-page .biz-hero-icon svg { width: 17px; height: 17px; }
  .portal-cert-page .biz-hero-text h1 { font-size: 20px; }
  .portal-cert-page .biz-hero-tag { font-size: 11.5px; }

  /* ---------- 资质卡：再收一档 ---------- */
  .portal-cert-page .cert-grid { gap: 8px; }
  .portal-cert-page .cert-card { padding: 11px 13px; column-gap: 9px; row-gap: 7px; }
  .portal-cert-page .cert-icon { width: 28px; height: 28px; border-radius: 6px; }
  .portal-cert-page .cert-card h4 { font-size: 13px; line-height: 1.38; }
  .portal-cert-page .cert-level { font-size: 9.5px; padding: 2px 7px; }
  .portal-cert-page .cert-card .cert-meta { font-size: 11px; line-height: 1.45; }
  .portal-cert-page .cert-card .cert-meta .cm { margin-right: 10px; }
  .portal-cert-page .cert-card .cert-meta .cm b { font-size: 9.5px; }
  /* 「覆盖范围」值最长、允许折行，但**标签本身不能被拆**——
     320px 极窄屏实测会断成「覆盖范 / 围」跨行，很刺眼 */
  .portal-cert-page .cert-card .cert-meta .cm:last-child b { white-space: nowrap; }

  /* ---------- 合作伙伴：8 家压到 4 行紧凑卡 ---------- */
  .portal-cert-page .partner-grid { gap: 7px; }
  .portal-cert-page .partner { padding: 10px 8px; }
  .portal-cert-page .partner-name { font-size: 12.5px; margin-bottom: 3px; line-height: 1.35; }
  .portal-cert-page .partner-tag { font-size: 10px; line-height: 1.4; }
}

/* ============================================================
   门户 v4 修订（2026-09-14 之七）· 资讯中心手机端重编排
   ------------------------------------------------------------
   实测（393×812）：整页 3284px = **4.04 屏**（本轮之前是门户里最长的一页）。逐段：
     资讯区 2846px ｜ 页脚 381 ｜ 顶栏 57
   资讯区里两块浪费：
     ① **筛选区**：分类 tab 7 个排成 3 行（135px）+ 标签云 12 个排成 3 行（130px）
        —— 手机上要滑过 6 行筛选才看到第一篇文章；
     ② 8 张资讯卡纵向堆叠，每张 283~304px（封面 118 + 正文），合计 2411px。
   改法（全部 ≤640px + `.portal-articles-page` 作用域）：
     · 分类 tab、标签云 → 单行横向轨道（3+3 行 → 1+1 行）
     · 资讯卡 → 「左图右文」横排版式（封面 92px 宽在左，正文在右）
       —— 这类列表的封面只是「航图图版」底纹 + 一个图标，占满整宽本就浪费
   注意：`.article-grid` 在业务板块页（相关资讯）与文章详情页（相关文章）也出现，
   所以本轮全部限定页级作用域，不碰另外两处。
   ============================================================ */
@media (max-width: 640px) {
  /* ---------- 筛选区：单行横向轨道 ---------- */
  .portal-articles-page .article-tabs {
    flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none;
    margin: 0 -18px 12px; padding: 2px 18px 12px; gap: 7px;
  }
  .portal-articles-page .article-tabs::-webkit-scrollbar { display: none; }
  .portal-articles-page .article-tab { flex: 0 0 auto; font-size: 12.5px; padding: 5px 12px; }

  .portal-articles-page .article-tags {
    flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none;
    margin: 0 -18px 14px; padding: 0 18px 2px; gap: 6px;
  }
  .portal-articles-page .article-tags::-webkit-scrollbar { display: none; }
  .portal-articles-page .article-tags > * { flex: 0 0 auto; }
  .portal-articles-page .article-tag { font-size: 11px; padding: 3px 9px; }

  /* ---------- 资讯卡：左图右文 ---------- */
  .portal-articles-page .article-grid { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .portal-articles-page .article-card {
    display: grid; grid-template-columns: 92px minmax(0, 1fr); align-items: stretch;
  }
  .portal-articles-page .article-cover {
    height: auto; min-height: 92px;
    border-bottom: 0; border-right: 3px solid var(--cov, #A8324A);
  }
  .portal-articles-page .article-cover::before { background-size: 16px 16px; }
  .portal-articles-page .article-cover > svg { width: 28px; height: 28px; }
  .portal-articles-page .article-body { padding: 9px 12px 10px; }
  .portal-articles-page .article-meta { font-size: 10.5px; gap: 6px; margin-bottom: 4px; }
  .portal-articles-page .article-cat { font-size: 10px; padding: 1px 6px; }
  .portal-articles-page .article-pin { font-size: 9px; }
  .portal-articles-page .article-title { font-size: 13.5px; line-height: 1.4; margin: 0 0 4px; }
  .portal-articles-page .article-summary { font-size: 11.5px; line-height: 1.5; margin-bottom: 0; }
  .portal-articles-page .article-card-tags { font-size: 10px; margin-top: 5px; }
  .portal-articles-page .article-card-tags span { padding: 1px 5px; }
}

/* ============================================================
   门户 v4 修订（2026-09-14 之八）· 首页手机端重编排
   ------------------------------------------------------------
   实测（393×812）：整页 3175px = **3.91 屏**，逐段：
     首屏 hero **830px（1.02 屏，最大单块）** ｜ 新闻公告 775 ｜ 证型课程 646
     ｜ 业务板块 486 ｜ 页脚 381 ｜ 顶栏 57
   三块浪费：
     ① hero 里的「航图视窗」用 `aspect-ratio: 4/3` —— 357px 宽下就是 268px 高，
        加上图廓信息栏，纯视觉占据首屏近一半；CTA 两枚按钮也是竖向堆叠
     ② 新闻公告 8 条，每条 77px，条目内边距仍是桌面值
     ③ 证型课程 2 张大卡，每张约 250px（内边距 44 + 简介不限行）
   改法（≤640px + 新增页级类 .portal-home-page）：
     · 视窗 4/3 → 16/9（268→200px）；图号条与图廓信息栏 → 单行横向轨道
     · 四个数据由「靠 border-right 分隔、换行后错位」→ 2×2 等宽数据格
     · CTA 两枚按钮并排
     · 新闻条目、课程卡各收一档（课程简介限 2 行）
   ============================================================ */
@media (max-width: 640px) {
  /* ---------- 首屏 ---------- */
  .portal-home-page .portal-hero-inner { padding: 26px 18px 22px; gap: 16px; }
  .portal-home-page .portal-hero-text h1 { font-size: 23px; line-height: 1.32; margin-bottom: 8px; }
  .portal-home-page .portal-hero-text p { font-size: 13px; line-height: 1.65; margin-bottom: 13px; }

  /* 图号条（CHART 01 / 局方编号 / 修订）：窄屏原会折成 2 行 → 单行横滑 */
  .portal-home-page .chart-frame {
    display: flex; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none;
    margin: 0 -18px 11px; padding: 0 18px; border-left: 0; border-right: 0;
  }
  .portal-home-page .chart-frame::-webkit-scrollbar { display: none; }
  .portal-home-page .chart-frame > span { flex: 0 0 auto; font-size: 10px; padding: 4px 10px; }

  /* 四个关键数据：2×2 数据格（原靠 border-right 分隔，换行后分隔线错位） */
  .portal-home-page .portal-hero-stats {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0; margin-bottom: 14px;
    border-top: 1px solid rgba(255, 255, 255, .18);
  }
  .portal-home-page .hero-stat {
    padding: 8px 0 7px; margin: 0;
    border-right: 0; border-bottom: 1px solid rgba(255, 255, 255, .18);
  }
  .portal-home-page .hero-stat:nth-child(odd) { border-right: 1px solid rgba(255, 255, 255, .18); padding-right: 10px; }
  .portal-home-page .hero-stat:nth-child(even) { padding-left: 12px; }
  .portal-home-page .hero-stat b { font-size: 19px; }
  .portal-home-page .hero-stat span { font-size: 10.5px; letter-spacing: 0; }

  /* 航图视窗：4/3 → 16/9 */
  .portal-home-page .hero-banner { aspect-ratio: 16 / 9; }

  /* CTA 并排 */
  .portal-home-page .portal-hero-cta { gap: 8px; }
  .portal-home-page .portal-hero-cta .btn { flex: 1 1 0; height: 38px; font-size: 13px; padding: 0 10px; }

  /* 图廓信息栏：5 项折 2 行 → 单行横滑 */
  .portal-home-page .chart-legend-inner {
    flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none;
    gap: 0 18px; padding: 8px 18px; font-size: 10px;
  }
  .portal-home-page .chart-legend-inner::-webkit-scrollbar { display: none; }
  .portal-home-page .chart-legend-inner > span { flex: 0 0 auto; }

  /* ---------- 新闻公告 ---------- */
  .portal-home-page .news-item { padding: 9px 2px; }
  .portal-home-page .news-title { font-size: 13px; line-height: 1.58; }
  .portal-home-page .news-date { font-size: 11px; }
  .portal-home-page .news-cat { font-size: 10px; }

  /* ---------- 证型课程 ---------- */
  .portal-home-page .portal-course-grid { gap: 8px; }
  .portal-home-page .course-card { padding: 13px 14px 14px; }
  .portal-home-page .course-card h3 { font-size: 14.5px; margin-bottom: 6px; }
  .portal-home-page .course-intro {
    font-size: 12px; line-height: 1.55; margin: 0 0 9px; min-height: 0;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  }
  /* 三项元信息原为 flex-column（竖排 3 行）→ 改横排流动，330px 宽下一行放得下 */
  .portal-home-page .course-meta {
    flex-direction: row; flex-wrap: wrap; gap: 3px 12px;
    font-size: 11.5px;
  }
  .portal-home-page .course-meta span { font-size: 11.5px; }
  .portal-home-page .course-card-link { font-size: 12px; margin-top: 8px; }

  /* ---------- 业务板块：索引行再收 ---------- */
  .portal-home-page .biz-card { padding: 12px 13px 12px 11px; }
  .portal-home-page .biz-card h3 { font-size: 14.5px; }
}

/* ============================================================
   门户 v4 修订（2026-09-14 之九）· 客户案例手机端重编排
   ------------------------------------------------------------
   实测（393×812）：整页 2670px = 3.29 屏。案例区 2231px，
   其中 **8 张案例卡各 230px 纵向堆叠 = 1840px（2.27 屏）**，是唯一的大头。
   案例卡没有配图，是纯文字卡（标签 / 标题 / 客户·周期·规模 / 摘要 / 箭头），
   铺满整宽时每行只放得下一两个字段，纵向白白拉长。
   改法（≤640px + 新增页级类 .portal-cases-page）：
     · 分类 tab → 单行横向轨道
     · 案例卡 → **2 列网格**（每列约 174px），字号与内边距同步收紧、摘要限 3 行
   —— 权衡说明：2 列会让单卡变密，但案例列表本就是「浏览概览 → 点进详情」，
   详情页有完整正文；换来的是 8 张卡由 4 屏半高的堆叠变成 4 行 2 列。
   ============================================================ */
@media (max-width: 640px) {
  /* 分类 tab：单行横滑（5 个 tab 原本折 2 行） */
  .portal-cases-page .case-service-tab {
    flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none;
    margin: 0 -18px 14px; padding: 2px 18px 12px; gap: 7px;
  }
  .portal-cases-page .case-service-tab::-webkit-scrollbar { display: none; }
  .portal-cases-page .case-service-tab a { flex: 0 0 auto; font-size: 12.5px; padding: 5px 12px; }

  /* 案例卡：2 列 */
  .portal-cases-page .case-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px;
  }
  .portal-cases-page .case-card { padding: 11px 11px 12px; gap: 5px; }
  .portal-cases-page .case-card-head { justify-content: flex-start; gap: 6px; flex-wrap: wrap; }
  .portal-cases-page .case-service-tag { font-size: 10px; padding: 2px 7px; }
  .portal-cases-page .case-industry { font-size: 10px; }
  .portal-cases-page .case-card-title { font-size: 13px; line-height: 1.38; }
  .portal-cases-page .case-card-meta { gap: 2px 9px; font-size: 10.5px; line-height: 1.4; }
  .portal-cases-page .case-card-meta span { gap: 3px; }
  .portal-cases-page .case-card-meta svg { width: 10px; height: 10px; }
  .portal-cases-page .case-card-summary {
    font-size: 11px; line-height: 1.48; flex: 0 0 auto;
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
  }
  .portal-cases-page .case-card-arrow { font-size: 10.5px; }
}

/* ============================================================
   门户 v4 修订（2026-09-14 之十）· 业务板块页二次收紧
   ------------------------------------------------------------
   该页首轮已由 5.71 屏压到 3.54 屏，本轮只剩「逐项微收」（结构已无浪费）：
   hero / 各卡片内边距与字号各降一档，服务流程卡宽 62vw→58vw。
   合计再省约 0.11 屏。**这一轮之后边际收益已明显递减**，除非改内容量或引入折叠，
   否则该页不会再有量级变化。
   ============================================================ */
@media (max-width: 640px) {
  .portal-biz-page .biz-hero-inner { padding: 18px 18px 16px; gap: 9px; }
  .portal-biz-page .biz-hero-icon { width: 34px; height: 34px; }
  .portal-biz-page .biz-intro { line-height: 1.72; }
  .portal-biz-page .biz-cap { padding: 11px 11px 12px; }
  .portal-biz-page .biz-cap-body p { line-height: 1.55; }
  .portal-biz-page .biz-spec-table tr { padding: 9px 11px 10px; }
  .portal-biz-page .portal-biz-grid { gap: 7px; }
  .portal-biz-page .biz-card { padding: 10px 11px 11px; }
  .portal-biz-page .biz-icon { width: 28px; height: 28px; }
  .portal-biz-page .biz-applicable-block { padding: 11px 11px 12px; }
  .portal-biz-page .biz-step { flex: 0 0 58vw; max-width: 58vw; padding: 10px 11px; }
}

/* ============================================================
   门户页脚 · 手机端第三轮收紧（全门户生效）
   ------------------------------------------------------------
   页脚每页都带，7 个门户页面共同受益。
   上一轮把链接列改为「标签 + 横向流动的链接」，本轮：
     · 联系信息三条（地址/电话/邮箱）也改为横向流动（原本各占一行）
     · 各列字号 11→10.5、栏间距 13→11、上下留白 22/14→20/12
   ============================================================ */
@media (max-width: 640px) {
  .portal .portal-footer { padding: 20px 18px 12px; }
  .portal .portal-footer-inner { gap: 11px 16px; }
  .portal .footer-col h4 { font-size: 10px; margin-bottom: 4px; }
  .portal .footer-col p { font-size: 10.5px; line-height: 1.55; }
  /* 联系信息（第 2 列）也横向流动：3 条并排而非 3 行 */
  .portal .footer-col:nth-child(2) { flex-wrap: wrap; gap: 2px 14px; }
  .portal .footer-col:nth-child(2) p { flex: 0 0 auto; }
  .portal .footer-col:nth-child(2) p:first-of-type { flex: 0 0 100%; }
  .portal .portal-copyright { margin-top: 12px; padding-top: 9px; font-size: 9.5px; }
}

/* ============================================================
   门户 v4 修订（2026-09-14 之十一）· 641~768px「断点凹陷」修复
   ------------------------------------------------------------
   实测发现一个此前没注意到的中间宽度问题：
     650 / 768px 下整页比 393px 手机**还长一倍**
     （业务板块页 5467px vs 手机 2741px；首页 3647 vs 2484）
   根因：≤768 的一组「移动优先」规则把这些网格**一律强制成单列**，
   可 641~768px 的可用宽度明明足够放两列：
     · .biz-cap-grid      → 4 张能力卡 1 列 4 行
     · .biz-step-grid     → 6 步服务流程 1 列 6 行（1101px，独占 1.22 屏）
     · .biz-applicable    → 适用对象/资质 1 列
     · .about-grid        → 愿景/使命 1 列
   本块把 641~768 区间恢复为 2 列，并略收该区间的区块上下留白（52 → 40px）；
   业务板块索引行由 2 列改 3 列（5 张卡：3+2 两行，而非 2+2+1 三行）。
   —— 这个宽度对应 iPad 竖屏、分屏窗口、小笔记本，是真实存在的使用场景。
   注意：本块只覆盖上面这几个明确的网格，`.timeline-item` 等不动（避免误伤）。
   ============================================================ */
@media (min-width: 641px) and (max-width: 768px) {
  .biz-cap-grid, .biz-step-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .biz-applicable, .about-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .portal .portal-section { padding: 40px 18px; }
  .portal .biz-card { flex: 0 0 33.333%; max-width: 33.333%; padding: 18px 16px 16px; }
  /* 边框：行首有左边框（当作整个格栅的外框）——3 列时行首是 1、4 张。
     先清掉 2 列用的 odd 规则，再给 3n+1；顺序不能颠倒。 */
  .portal .biz-card:nth-child(odd) { border-left: 0; }
  .portal .biz-card:nth-child(3n+1) { border-left: 1px solid var(--rule); }

  /* ---- 以下四类网格在此区间「列数不足」，是本区间变长的第二大成因 ----
     ① auto-fill 的 minmax 下限偏大：`.case-grid{minmax(360px,1fr)}` 在 732px 可用宽里
        连两列都排不下 → 8 张案例卡排成 8 行；`.article-grid`、课程网格同理。
     ② `repeat(3, 1fr)` 却只有 4 个子项 → 排成 3+1 两行，第二行只落一个，既浪费又难看。
        4 项在这类宽度下改成 4 列正好一行。 */
  .portal .case-grid,
  .portal .article-grid,
  .portal .portal-course-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .portal .about-value-grid,
  .portal .team-grid,
  .portal .about-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .portal .article-cover { height: 96px; }

  /* ── 本区间的「中等紧凑」档 ──
     641~768 落到的是桌面卡片样式（内边距 20~26px、封面 140px），
     但可用宽度只有 641~768 —— 结果整页比 393 手机还长（矩阵实测 4211 vs 2741px）。
     这里把卡片内边距/封面按比例收到「中等值」，观感仍比手机档舒展，但不再虚高。 */
  .portal .biz-cap { padding: 12px 13px; }
  .portal .biz-cap-num { font-size: 20px; min-width: 26px; }
  .portal .biz-cap-body p { font-size: 12.5px; line-height: 1.65; }
  .portal .biz-step { padding: 12px 13px; }
  .portal .biz-step-num { width: 30px; height: 30px; font-size: 14px; margin-bottom: 9px; }
  .portal .biz-spec-table th, .portal .biz-spec-table td { padding: 9px 14px; }
  .portal .biz-spec-table th { width: 130px; }
  .portal .case-card { padding: 15px 16px; gap: 9px; }
  .portal .article-body { padding: 12px 14px 14px; }
  .portal .cert-card { padding: 14px 15px; }
  .portal .partner { padding: 13px 11px; }
  .portal .about-value { padding: 15px 12px; }
  .portal .team-card { padding: 15px 12px; }
  .portal .portal-footer { padding: 30px 20px 16px; }
  .portal .footer-col p { font-size: 12px; line-height: 1.7; }

  /* 12 张资质卡在 2 列下要排 6 行；3 列（每列约 236px）降到 4 行 */
  .portal .cert-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  /* 3 列后字段列变窄，证书编号会被「word-break:break-all」从中间折断
     （如 "ZGC-2015-08-0015" 断成 "...-00 / 15"）→ 收窄标签列 + 编号字号降一档 */
  .portal .cert-card .cert-meta { grid-template-columns: 62px minmax(0, 1fr); gap: 5px 10px; }
  .portal .cert-card code { font-size: 11px; }
  /* 8 家合作伙伴由 3+3+2 三行 → 4 列两行 */
  .portal .partner-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  /* 业务板块页「相关资讯」只有 3 篇，2 列会排成 2+1 → 3 列正好一行 */
  .portal .biz-related-section .article-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  /* 服务流程是 5~6 步：2 列会排成 2+2+1 / 3 行，4 列会排成 4+2。
     3 列对 6 步是 3+3、对 5 步是 3+2 —— 两种情况都不留残行。 */
  .portal .biz-step-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }

  /* 发展历程：桌面是「年份一行 + 事件一行」（7 段占约 700px），
     把 ≤640 已用的「等宽年份 + 事件」两列年表扩展到这个区间（约 280px） */
  .portal .timeline {
    display: block; padding: 0 0 0 16px; margin: 0;
    border-left: 1px solid var(--rule-2); max-width: none;
  }
  .portal .timeline-item {
    display: grid; grid-template-columns: 56px minmax(0, 1fr);
    column-gap: 12px; align-items: baseline; padding: 8px 0; position: relative;
  }
  .portal .timeline-item::before {
    content: ''; position: absolute; left: -20px; top: 15px;
    width: 7px; height: 7px; border-radius: 50%;
    background: var(--magenta); box-shadow: 0 0 0 3px var(--paper);
  }
  .portal .timeline-year { font-size: 13px; font-weight: 500; color: var(--ink-3); padding-top: 0; }
  .portal .timeline-event { font-size: 13px; line-height: 1.65; color: var(--ink-2); margin: 0; }
}

/* ============================================================
   门户 v4 修订（2026-09-14 之十二）· 769~1024px（iPad 横屏 / 小笔记本）
   ------------------------------------------------------------
   同一次体检发现的第二个区间问题：
     · `.portal-section` 上下留白仍是桌面的 84px —— 6~7 个区块就是 1000px 纯留白
     · 几处网格列数与子项数对不上，排出「多出来的那一个」：
       `.about-value-grid` 5 列放 4 项 → 4+1；`.biz-cap-grid` 3 列放 4 项 → 3+1
     · `.cert-grid` 用 `minmax(320px,1fr)`：1024 下可用 984px，3 列需要 992px，
       **差 8px** 只能排 2 列 → 12 张资质卡排 6 行
   ============================================================ */
@media (min-width: 769px) and (max-width: 1024px) {
  .portal .portal-section { padding: 56px 20px; }
  .portal .about-value-grid, .portal .biz-cap-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .portal .cert-grid, .portal .article-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  /* 服务流程 5~6 步：4 列会排成 4+2 / 4+1 —— 3 列对 6 步是 3+3、对 5 步是 3+2，都不留残行 */
  .portal .biz-step-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  /* 案例 8 张：2 列要 4 行，3 列降到 3 行（3+3+2） */
  .portal .case-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* ============================================================
   后台 · 长表格「区域内滚动 + 表头吸附」（2026-09-14）
   ------------------------------------------------------------
   体检实测两处「表格把整页撑长」：
     · 财务收支页：1024px 下 9064px = 11.2 屏（流水表 79 笔全量平铺，占 85%）
     · 题库详情页：393px 下 6284px = 7.7 屏（题目预览 50 条 × 116px，
       且**没有滚动容器** —— 表格被压到 289px 宽，题干列折成 5~6 行/条）
   处理方式：长表格交给滚动容器承载 + 表头吸附。
   **不动任何取数与计算逻辑**（财务模块尤其敏感，只改呈现）：
   数据一条不少，仍可整表滚动查看、Ctrl+F 仍能命中。
   ============================================================ */
.fin-tbl,
.table-scroll-y {
  max-height: 68vh;
  overflow: auto;
}
.fin-tbl thead th,
.table-scroll-y thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--card-bg, #fff);
  box-shadow: inset 0 -1px 0 var(--border);
}

/* 证书管理表的列宽（8 列）：套上 .table-wrap 后仍需给最小宽度，
   否则 width:100% 会让 8 列在 319px 容器里被压成一团（窄屏改横向滚动承载） */
.table-wrap > .certs-table { min-width: 640px; }

/* ============================================================
   手机端弹窗尺寸与滚动（2026-09-14 修）
   ------------------------------------------------------------
   现象：后台长表单弹窗（项目汇报填报、报销等）在手机上
   「手指滑不动、底部按钮点不到、输入框被键盘遮住就填不完」。
   根因：.modal 的 max-height:90vh + overflow:hidden 把超出内容直接裁掉，
   而弹窗本身不可滚动；再叠加页面 user-scalable=no（不可缩放），等于无路可走。
   处置：① 遮罩留白收小、顶部对齐（避免被垂直居中顶出可视区）
        ② 高度改用动态视口单位 dvh，键盘弹出时弹窗跟着变矮、内部可滚
   ============================================================ */
@media (max-width: 768px) {
  .modal-mask { padding: 10px; align-items: flex-start; }
  .modal { max-height: calc(100vh - 20px); max-height: calc(100dvh - 20px); }
  .modal-body { padding: 14px 16px; }
  .modal-header, .modal-footer { padding-left: 16px; padding-right: 16px; }
  .modal-footer { gap: 8px; }
  .modal-footer .btn { flex: 1 1 0; justify-content: center; }
  /* 弹窗内的横向表格/长行：允许内部横滑，不要撑破弹窗宽度 */
  .modal-body { overflow-x: hidden; }
  .modal-body .table-wrap, .modal-body .table-scroll-y { overflow-x: auto; }
}

/* ============================================================
   项目汇报 · 支出明细行（2026-09-14 手机端排版）
   ------------------------------------------------------------
   原来控件宽度写死在标签上（名目 110 / 金额 100 / 人员 110px），
   393px 手机上弹窗内容区只有约 339px，一行放不下 →
   折成「名目+金额」「人员+✕」两行且对不齐，看着很乱。
   这里把尺寸与排布收到 CSS：桌面沿用原尺寸，≤768px 改两行网格
   （名目 | 金额 | ✕ ／ 人员下拉占满），每个控件都有清晰的落位。
   注：内联 style 无法被媒体查询覆盖，所以必须先把内联宽度清掉。
   ============================================================ */
.lift-exp-row { display: flex; gap: 6px; align-items: center; margin-bottom: 6px; flex-wrap: wrap; }
.lift-exp-row [data-exp-item] { width: 110px; }
.lift-exp-row [data-exp-amount] { width: 100px; }
.lift-exp-row [data-exp-person] { width: 110px; }

@media (max-width: 768px) {
  .lift-exp-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
    grid-template-areas:
      "item amount del"
      "person person mkacc";
    gap: 6px;
    align-items: center;
    padding: 8px 8px 6px;
    background: #f7f9fc;
    border: 1px solid var(--border);
    border-radius: 8px;
    margin-bottom: 8px;
  }
  .lift-exp-row [data-exp-item] { grid-area: item; width: auto; }
  .lift-exp-row [data-exp-amount] { grid-area: amount; width: auto; }
  .lift-exp-row [data-exp-del] { grid-area: del; }
  .lift-exp-row [data-exp-person] { grid-area: person; width: auto; }
  .lift-exp-row [data-exp-mkacc] { grid-area: mkacc; width: auto; }
  /* 名目/金额两个输入框在网格里要能继续收缩，否则会撑破格子 */
  .lift-exp-row .form-input, .lift-exp-row .form-select { min-width: 0; }
}

/* ============================================================
   弹窗内「一行多控件」表单行（2026-09-14 手机端）
   ------------------------------------------------------------
   两处高频弹窗里的输入行原来把排布写在标签上（内联 flex / 固定 width），
   393px 下输入框被压到 110~155px，占位文字都显示不全：
     · 项目汇报 → 成员名单：姓名 + 底薪 + 加入名单
     · 财务 → 管理大项：名称 + 识别别名 + 添加
   这里把排布收到 CSS，手机端给每个输入框明确的落位。
   ============================================================ */
.lw-addrow { display: flex; gap: 8px; margin-bottom: 8px; }
.lw-addrow #lw-name { flex: 1; min-width: 0; }
.lw-addrow #lw-base { width: 120px; flex: 0 0 auto; }

.book-addrow { display: flex; gap: 8px; flex-wrap: wrap; }
.book-addrow #fb-new-name, .book-addrow #fb-new-alias { flex: 1; min-width: 140px; }

@media (max-width: 768px) {
  /* 成员名单：姓名 | 底薪 各占一半，按钮独占一行整宽 */
  .lw-addrow { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
  .lw-addrow #lw-name, .lw-addrow #lw-base { width: auto; min-width: 0; }
  .lw-addrow #lw-add { grid-column: 1 / -1; width: 100%; justify-content: center; }
  /* 管理大项：名称、别名各占一行（别名往往较长，窄列看不全） */
  .book-addrow { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .book-addrow #fb-new-name, .book-addrow #fb-new-alias { width: auto; min-width: 0; }
  .book-addrow #fb-new-go { width: 100%; justify-content: center; }
}

/* ============================================================
   学员端 · 答题卡手机端列数（2026-09-14）
   ------------------------------------------------------------
   实测 393px：答题卡 8 列，每格只有 37×32px —— 低于手指可靠点击的
   44px 下限，考试中靠它跳题很容易点错题号。
   改 6 列后每格约 51×40px，100 题仍在一屏内可滚。
   注意：答题卡样式写在弹窗 HTML 的 <style> 标签里（运行时插入 body，
   晚于本文件），同优先级下它会赢 —— 所以这里用 `.modal .ansgrid`
   提高特异性来覆盖，不能用 .ansgrid。
   ============================================================ */
@media (max-width: 768px) {
  .modal .ansgrid { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 7px; }
  .modal .ans-cell { height: 44px; font-size: 13.5px; }
}

/* ============================================================
   学习日历 · 翻月按钮手机端可点区域（2026-09-14）
   ------------------------------------------------------------
   触摸目标体检发现：`.cal-nav button` 写死 28×28px，手机上偏小
   （学员用它在日历上翻月看学习/打卡记录）。≤768px 放大到 44×44——
   与答题卡的触摸下限一致；桌面保持 28px 不变（鼠标场景无需放大）。
   ============================================================ */
@media (max-width: 768px) {
  .cal-nav { gap: 8px; }
  .cal-nav button { width: 44px; height: 44px; font-size: 18px; line-height: 1; }
}

/* ============================================================
   分页按钮 · 手机端可点区域（2026-09-14）
   ------------------------------------------------------------
   触摸目标体检：`.pager button` 是 30×30，低于手指可靠点击的 44px；
   学员列表/题目管理等列表页靠它翻页。≤768px 放大到 40×40（桌面保持 30）。
   ============================================================ */
@media (max-width: 768px) {
  .pager { gap: 8px; }
  .pager button { height: 40px; min-width: 40px; font-size: 14px; }
}

/* ============================================================
   门户导航栏 · 手机端（2026-09-18）
   ------------------------------------------------------------
   病根：本文件上方 532 行曾有一条门户 v1 老规则，
        在 max-width:768px 里把 .portal-menu 写成 display:none
         （故意不把那条规则原样抄在这里 —— 否则以后 grep 这条规则会命中注释，
           分不清是真规则还是历史说明）。
   门户 v3 给 .portal-menu 补的是 `overflow-x:auto` —— 只覆写 overflow-x，
   覆写不了 display。实测 390×844 / 360×640 / 768×1024 三个视口：
   .portal-menu 全是 display:none，8 个导航链接宽高为 0、一个都点不到
   （offsetParent 为 null），页眉只剩「logo + 登录」。全项目也没有汉堡菜单。
   而手机是学员看官网的主要场景 —— 唯一能进子页的路只剩页脚，要滑 5 屏才到。

   改法：撤掉那条 display:none，让导航在窄屏落成第二行、横向滚动。
   为什么不用汉堡菜单：不必加 JS、不引入开合状态（开合控件踩过坑），
   且 8 个入口全部常驻可见 —— 符合「入口三件事：存在／常驻／可达」。
   为什么必须换行：logo(264px) + 登录(51px) 已占满 390px 屏，
   .portal-menu 只剩 21px 宽，光靠横向滚动也看不见东西。
   ============================================================ */
@media (max-width: 768px) {
  /* row-gap 管两行之间；gap:10px 管 logo 与登录按钮之间 */
  .portal .portal-nav-inner { flex-wrap: wrap; gap: 10px; row-gap: 4px; padding: 10px 16px; }
  /* flex-basis:100% → 整行占满，强制换到第二行 */
  .portal .portal-menu {
    order: 3; flex: 1 0 100%;
    justify-content: flex-start;   /* 桌面是 flex-end；横向滚动必须从左边起滚 */
    margin-right: 0; padding-bottom: 2px;
    -webkit-overflow-scrolling: touch;
  }
  .portal .portal-menu a { font-size: 14px; }
}