/* ========== 登山版：复用常规版基础，仅覆盖主题与首屏/台阶 ========== */
@import url('style.css');

:root {
  --bg: #F3F7FA;
  --card: #FFFFFF;
  --line: #D8E7F2;
  --txt: #12314B;
  --muted: #5E7689;
  --primary: #0284C6;
  --purple: #0D9488;
  --deep: #075985;
  --grad: linear-gradient(135deg, #0284C6 0%, #14B8A6 100%);
  --shadow: 0 6px 24px rgba(7, 57, 110, .08);
}
body {
  background: var(--bg);
  background-image:
    radial-gradient(1000px 480px at 12% -6%, rgba(2, 132, 199, .10), transparent 60%),
    radial-gradient(900px 460px at 88% -4%, rgba(20, 184, 166, .09), transparent 60%);
}

/* ========== 登山首屏（动车视频 + 蓝绿叠色） ========== */
.c-hero {
  position: relative; height: 505px; overflow: hidden; background: #0B3B8C;
}
.c-hero .hero-video { opacity: .95; }
.c-mts { position: absolute; inset: 0; width: 100%; height: 100%; }
.c-hero::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background:
    linear-gradient(180deg, rgba(6, 42, 90, .5) 0%, rgba(6, 42, 90, 0) 40%),
    linear-gradient(0deg, var(--bg) 0%, rgba(243, 247, 250, .7) 10%, rgba(243, 247, 250, 0) 30%),
    linear-gradient(160deg, rgba(2, 132, 199, .52) 0%, rgba(13, 148, 136, .42) 60%, rgba(2, 132, 199, .2) 100%);
}
.c-slogan { color: rgba(255, 255, 255, .88); font-size: 15px; letter-spacing: 4px; font-weight: 500; }

/* ========== 山峦式切换（L1山脚 → L5登顶 · 连绵山峰） ========== */
.steps-wrap { position: relative; z-index: 3; margin: -84px 160px 0; }
.mtn { position: relative; height: 170px; filter: drop-shadow(0 10px 26px rgba(7, 57, 110, .14)); }
.mtn-sil { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.glow { opacity: 0; transition: opacity .35s; }
.glow.on { opacity: 1; }
.mtn-step { position: absolute; top: 0; bottom: 0; width: 20%; border: 0; background: none; cursor: pointer; font-family: inherit; }
.mtn-dot {
  position: absolute; left: 50%; top: calc(var(--py) * 1px - 7px); transform: translateX(-50%);
  width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 3px solid var(--primary);
  box-shadow: 0 2px 8px rgba(2, 132, 199, .35); transition: all .25s;
}
.mtn-label {
  position: absolute; left: 50%; transform: translateX(-50%); top: calc(var(--py) * 1px + 14px);
  white-space: nowrap; padding: 5px 14px; border-radius: 999px;
  font-size: 14px; color: #5E7689; font-weight: 600; letter-spacing: 1px; transition: all .25s;
}
.mtn-label b { font-style: italic; font-weight: 800; margin-right: 6px; }
.mtn-step:hover .mtn-label { color: var(--deep); }
.mtn-step.on .mtn-label {
  background: var(--grad); color: #fff; font-weight: 700;
  box-shadow: 0 8px 18px rgba(2, 132, 199, .35);
}
.mtn-step.on .mtn-dot {
  width: 16px; height: 16px; top: calc(var(--py) * 1px - 9px);
  background: var(--primary); border-color: #fff;
  box-shadow: 0 0 0 6px rgba(2, 132, 199, .2), 0 4px 10px rgba(2, 132, 199, .45);
}
.mtn-flag { position: absolute; left: 50%; top: calc(var(--py) * 1px - 30px); width: 2px; height: 20px; background: #F59E0B; }
.mtn-flag::after {
  content: ''; position: absolute; left: 2px; top: 0;
  border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 11px solid #F59E0B;
}

/* ========== 清除常规版紫色/薰衣草色残留 ========== */
.ov-card, .dim, .matrix-head #search { border-color: var(--line); }
.ov-panel { background: #FAFCFE; border-color: #E3EDF5; }
.dist-cell, .kpi { border-color: #E3EDF5; }
.dist-bar { background: #E3EDF5; }
.g-head { background: #F7FAFC; border-color: #E3EDF5; }
.g-head:hover { background: #EFF6FB; border-color: #A9D3EE; }
.item:hover { background: #EFF6FB; }
.chip:hover { color: var(--primary); border-color: #A9D3EE; }
.kpi.hl { box-shadow: 0 12px 26px rgba(2, 132, 199, .28); }
.tooltip { border-color: #BFDCF0; }
.tooltip .tt-cell { border-color: #E3EDF5; background: #F7FAFC; }
.tooltip .tt-cell.now { border-color: var(--primary); background: #E8F4FC; box-shadow: 0 0 10px rgba(2, 132, 199, .25); }
.dock button:hover { color: var(--primary); border-color: #A9D3EE; }
.dock button.on { box-shadow: 0 4px 12px rgba(2, 132, 199, .4); }