/* ============================================================================
   /kecheng/ 课程库 —— 增量样式（kc.css）  ·  v3「分段文字索引 / 网站地图」版
   基线：../shiziku/css/style.css（结构 + 组件），本文件只做「变量改写 + 新增」
   ⚠ 严禁 Google Fonts（会白板）；字体栈继承 ../shiziku/css/fonts.css
   ⚠ 新组件一律 kc- 前缀（已核 shiziku/css/style.css 中 .kc- 出现次数 = 0）
   ⚠ 变量覆盖必须放在 style.css 之后（同特异度靠顺序胜出，铁律 64）

   ---------------------------------------------------------------------------
   视觉设计口径（2026-09-23 第一百〇一轮）
   1. 色彩分区 = 页面「整体感」的主要来源（第一百〇十三轮起主色调对齐主站首页）：
      Hero 深青立锚 -> 区块 A 浅青带（核心业务 内训师）-> 区块 B 冷蓝灰带（次核心业务 师资供应）
      -> 双 CTA（青绿卡 + 蓝灰卡）收尾
   2. 分类区语言 = **多栏文字索引**（不再用卡片）：层级靠字号 / 字重，分组边界靠发丝线，
      行首 3px 短竖条作节奏装置（默认 12px 浅灰 -> hover 拉长 20px 转品牌红）。
   3. 章节节奏：12 个大类加「序号方块 01-12」+ 大类名 + 全景页链接，底部细线分隔；
      大类行**左对齐**（与索引左边缘对齐）；区块 H2 标题组仍**居中**。
   4. 文字对比度全部实算（铁律 71）：深红底上禁用 --brand-deep 作正文；
      灰阶只到 #6B7684（白底 4.61 ✔ AA）
   5. 居中口径（第一百轮）：区块标题组 / 双 CTA 卡 / 小类页头部 / 兄弟小类标题 均居中。
      ⚠ 索引行是**例外** —— 文字索引必须左对齐才好扫读（卡片形态已下线，不再有「卡片文字居中」）。
   6. 门数收敛（第一百〇一轮）：用户裁定「凡课程门数全去」
      -> 全站 159 页正文与 TDK 均不出现「N 门」；讲师数（位）保留。
   ⚠ 已下线：业务分层双卡（.kc-biz / .kc-bizcard，第九十九轮）、
      31 位讲师头像墙（.kc-wall*，第一百轮）、
      小类平铺卡片（.kc-tile / .kc-tiles*，第一百〇一轮）。
   ============================================================================ */

/* ---------- 1. 设计令牌（品牌红 + 两色分区 + 中性灰阶 + 阴影阶梯） ---------- */
:root {
  /* r113：主色调对齐主站首页 —— 青绿五色阶 + 珊瑚橙强调（与 shiziku/css/style.css 同值） */
  --brand-50: #E8F6F4;
  --brand-100: #B8E6E1;
  --brand-300: #5EEAD4;
  --brand: #0B988C;            /* 品牌青绿（亮）：大标题 / 色块 / 装饰 */
  --brand-strong: #077A70;     /* 功能深色：白字青底 / 浅底小字（白底 5.07 ✔） */
  --brand-strong-dark: #065E56;
  --brand-deep: #063F3B;       /* ⚠ 深青底上禁用此色作正文 */
  --cta: #FF6B35;              /* 珊瑚橙：与主站 CTA 同色 */
  --cta-dark: #E8541C;
  --cta-light: #FFB088;
  --gold: #FF6B35;             /* 强调橙（白底装饰） */
  --gold-light: #FFB088;
  --gold-on-red: #B8E6E1;      /* 语义已改：深青底专用浅青（变量名不动，消费点太多） */

  /* 次核心业务（蓝灰）与两色分区；页面底对齐主站 --bg #f6f8fa */
  --kc-supply: #4A5568;
  --kc-supply-strong: #2E4057;
  --kc-core-band: #E9F6F3;     /* 区块 A 通栏底色（浅青） */
  --kc-supply-band: #F0F4F9;   /* 区块 B 通栏底色（冷蓝灰） */
  --kc-canvas: #F6F8FA;        /* = 主站首页 --bg */
  --kc-core-bg: #E8F6F4;
  --kc-supply-bg: #F3F6FB;

  --kc-line: #E2EEEA;
  --kc-line-card: #E3ECE9;
  --kc-line-card-supply: #DFE6EF;

  --kc-ink: #1F2D3D;           /* = 主站首页 --ink */
  --kc-ink-2: #5F6B7A;         /* = 主站首页 --ink-2 */
  --kc-ink-3: #6B7684;         /* 三级/单位（白卡底 4.61 ✔）—— 主站 --ink-3 #8a94a3 不过 AA，保留本方 */

  --kc-radius: 14px;
  --kc-radius-sm: 12px;
  --kc-shadow-xs: 0 1px 2px rgba(16, 24, 40, .04);
  --kc-shadow-sm: 0 4px 12px rgba(16, 24, 40, .06);
  --kc-shadow-brand: 0 10px 24px rgba(11, 152, 140, .12);
  --kc-shadow-supply: 0 10px 24px rgba(46, 64, 87, .12);
}

/* ---------- 2. 页面底（白 → 暖灰画布，白卡才有「浮起」的对比） ---------- */
.kc-page { background: var(--kc-canvas); }

/* ---------- 3. Hero —— 深红品牌块（页面唯一的强锚点） ----------
   ⚠ 用户裁定：Hero 放弃搜索功能，「页面目的是 SEO」⇒ 搜索框 / 分页 / JS 过滤全部下线，
   本页自此零自有 JS、零 fetch。单列居中，天然规避「绝对定位 + 负 margin」的盒高陷阱（铁律 70）。 */
.kc-hero {
  position: relative;
  overflow: hidden;
  color: #fff;
  background:
    radial-gradient(1100px 400px at 84% -12%, rgba(255, 255, 255, .14), transparent 62%),
    radial-gradient(720px 340px at 6% 124%, rgba(255, 107, 53, .16), transparent 64%),
    linear-gradient(135deg, #067068 0%, #05584F 48%, #063F3B 100%);  /* ⚠ 最浅停靠 #067068：88% 白小字 5.01 ✔（#077A70 只有 4.42 ✗，实测压深一档）勿改浅 */
  padding: 52px 0 44px;
}
/* 极淡斜纹肌理：让大面积平涂「有质地」，不靠图片 */
.kc-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(115deg,
    rgba(255, 255, 255, .055) 0 1px, transparent 1px 10px);
  pointer-events: none;
}
/* 下沿金色装订线：Hero 与正文的分界 */
.kc-hero::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 3px;
  background: linear-gradient(90deg,
    rgba(184, 230, 225, 0), var(--gold-light) 22%, var(--gold-on-red) 50%,
    var(--gold-light) 78%, rgba(184, 230, 225, 0));
  opacity: .85;
}
.kc-hero__inner {
  position: relative;
  z-index: 1;
  display: block;
  max-width: 940px;
  margin: 0 auto;
  text-align: center;
}
.kc-hero__left { display: block; }
.kc-hero__tag {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  letter-spacing: .4px;
  color: rgba(255, 255, 255, .94);
  background: rgba(255, 255, 255, .13);
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 999px;
  padding: 6px 16px;
}
.kc-hero__tag::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--gold-on-red);
  box-shadow: 0 0 0 3px rgba(184, 230, 225, .30);
}

/* ---------- 4. Hero 标题 + 总账三条 ----------
   ⚠ 3 字标题（「课程库」）—— 靠字距与下方金色短线撑分量，不靠堆字号。
   ⚠ 总账：13 类 / 569 位 / 3845 门 = 交付 Excel 口径（去重算，禁 A+B 相加）。 */
.kc-hero__title {
  font-size: 58px;
  line-height: 1.14;
  font-weight: 800;
  color: #fff;
  letter-spacing: 8px;
  text-indent: 8px;                 /* 抵消末字字距，视觉居中 */
  margin: 20px 0 0;
  text-shadow: 0 2px 14px rgba(0, 0, 0, .20);
}
.kc-hero__title::after {
  content: "";
  display: block;
  width: 64px;
  height: 3px;
  margin: 20px auto 0;
  border-radius: 2px;
  background: linear-gradient(90deg, rgba(184, 230, 225, .15), var(--gold-on-red), rgba(184, 230, 225, .15));
}
/* ⚠ flex 子项居中：容器必须给 justify-content（只给 text-align 对 flex 无效） */
.kc-hero__stats { display: flex; justify-content: center; margin-top: 30px; }
.kc-stat {
  padding: 0 36px;
  border-left: 1px solid rgba(255, 255, 255, .20);
}
.kc-stat:first-child { border-left: 0; padding-left: 0; }
.kc-stat:last-child { padding-right: 0; }
.kc-stat__num {
  font-size: 34px;
  font-weight: 800;
  color: #fff;
  line-height: 1;
  letter-spacing: .5px;
  font-variant-numeric: tabular-nums;
}
.kc-stat__num i { font-style: normal; font-size: 14px; font-weight: 600; margin-left: 3px; color: rgba(255, 255, 255, .92); }  /* r113：浅青单位在深青上只有 3.73 ✗ ⇒ 改 92% 白（4.75 ✔） */
.kc-stat__label { font-size: 13px; color: rgba(255, 255, 255, .88); margin-top: 10px; letter-spacing: .5px; }

/* ---------- 5. ★ Hero 价值主张（第一百〇十一轮 r111 口径） ----------
   搜索框 / 类别锚点 / 双任务路径卡均已删除（用户逐轮裁定）；Hero 收敛为：
   背书标签 + H1 + 一句价值主张（采购者视角）+ 三条总账（含 96%+ 满意度）。
   ⚠ .kc-find / .kc-anchors / .kc-anchor / .kc-path 全族已退役（勿复活）。 */
.kc-hero__intro {
  margin: 18px auto 0;
  max-width: 640px;
  font-size: 16px;
  line-height: 1.8;
  color: rgba(255, 255, 255, .92);
}
/* ⚠ 双任务路径卡 .kc-path 全族已于第一百〇十一轮删除（用户指令「这个去掉」），勿复活。
   Hero 收敛为：背书标签 + H1 + 价值主张 + 三条总账。 */


/* ---------- 6. 徽章 ---------- */
.kc-badge {
  display: inline-flex;
  align-items: center;
  height: 26px;
  padding: 0 13px;
  border-radius: 999px;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: .6px;
  white-space: nowrap;
}
.kc-badge--core { background: var(--brand-strong); color: #fff; }  /* r113：白字青底须 brand-strong（5.07 ✔）；--brand 底只有 3.57 ✗ */                       /* 6.48 ✔ */
.kc-badge--supply { background: #fff; color: var(--kc-supply-strong); box-shadow: inset 0 0 0 1px #C3CCDA; }

/* ---------- 7. 区块通用 + 区块头（两条业务线各自成带） ---------- */
.kc-block { padding: 46px 0 16px; }
.kc-block--core { background: var(--kc-core-band); }
.kc-block--supply { background: var(--kc-supply-band); }
/* 2026-09-23 第一百轮：标题组整体居中（用户裁定「页面各部分的 Title 文字和卡片文字居中」）
   ⚠ 由 flex 行改为 block + text-align，徽章/标题/描述作为整体居中；
   ⚠ 原 `.kc-block__aside{margin-left:auto}` 的右对齐链接 ⇒ 改为**居中另起一行**；
   ⚠ 同步删掉 ≤992 档的 `display:none` —— 移动优先索引抓的就是移动版，
     隐藏内链等于把链接从索引里抹掉（与「本页目的是 SEO」冲突）。 */
.kc-block__head {
  display: block;
  text-align: center;
  margin-bottom: 26px;
  padding-bottom: 20px;
  border-bottom: 1px solid rgba(0, 0, 0, .07);
}
.kc-block__headmain { min-width: 0; text-align: center; }
.kc-block__title {
  font-size: 34px;
  font-weight: 800;
  letter-spacing: 1.5px;
  color: var(--brand);
  margin: 10px 0 8px;
  line-height: 1.2;
}
.kc-block--supply .kc-block__title { font-size: 27px; color: #22303F; }
/* 居中后限宽：中文单行过长拖慢阅读（760px ≈ 一行 50 字） */
.kc-block__meta { font-size: 14px; color: var(--kc-ink-2); margin: 0 auto; max-width: 760px; line-height: 1.75; }
/* ⚠ .kc-block__aside 已下线（第一百〇十五轮，用户指令删两个区块旁链，勿复活） */

/* ---------- 8. ★★ 小类文字索引（本页骨架：13 大类 x 158 小类） ----------
   2026-09-23 第一百〇一轮（用户裁定）：**放弃「小类平铺卡片」形态** —— 150 张同规格描边卡
   让 13 个分段互相等价（每一格都在喊同等音量），层级反而消失。
   2026-09-23 第一百〇二轮（用户裁定「方向对了，但设计感还需加强；类别文字较长，不像分类」）
   ⇒ 保留「多栏文字索引」骨架，补三件**让它读起来是分类**的装置：
   · **行首两位序号列**（01 / 02 …，`counter` 生成、每个大类各自从 01 起）——
     等宽对齐的编号列是「目录 / 分类」最强的视觉信号；CSS 生成 ⇒ **不进入文本层**
   · 行首 3px 短竖条改由 `background-image` 绘制（把 `::before` 让位给序号），hover 12 → 22px
   · 行 **hover 整行底纹**（暖红带 rgba(192,0,0,.05) / 冷蓝带 rgba(46,64,87,.055)）
     ⇒ 每一行成为「一个可点单元」，而不是一段连续文字
   · 小类名尾部「培训」二字降级为二级文字 `.kc-subidx__t`（150 行里高频重复 ⇒ 形成一条
     纵向灰后缀节奏），把长名称的「句子感」削掉
   层级仍靠字号/字重；分组边界：区块 B 交**分组白卡**（第 11 节），区块 A 交留白。
   ⚠ 158 个链接的**数量与指向完全不变**（8 + 150），只换呈现方式。
   ⚠ 卡片族 .kc-tile / .kc-tiles / .kc-tile__count / .kc-tile__note 已下线（勿复活）。 */
.kc-subidx {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0 22px;
  text-align: left;                 /* 索引行必须左对齐才好扫读（区块标题仍居中） */
  counter-reset: kcsub;             /* 每个大类（一个 .kc-subidx）各自从 01 重新计数 */
}
/* ⚠ 第一百〇三轮：区块 A 改能力链路径图（见 §9）⇒ .kc-subidx--core / __n / __note 随索引退役 */
/* 行高 12 + 21.75 + 12 = 45.75px ⇒ 满足触屏最小点按目标（≥44px） */
.kc-subidx__a {
  counter-increment: kcsub;
  position: relative;
  display: block;
  padding: 12px 12px 12px 42px;     /* 左 42px = 序号列留位（序号 left 22 + 宽 16 + 间隔 4） */
  border-radius: 9px;
  font-size: 14.5px;
  line-height: 1.5;
  color: var(--kc-ink);
  text-decoration: none;
  background-image: linear-gradient(#D9D2CE, #D9D2CE);
  background-repeat: no-repeat;
  background-size: 3px 12px;
  background-position: 8px 50%;
  transition: color .14s, background-color .16s, background-size .16s;
}
/* 序号列：两位等宽数字，与首行文字同基线
   ⚠ 只能用 ink-2 —— 它同时坐在白卡（区块 B）与暖红带（区块 A）上，
     ink-3(#6B7684) 在暖红带 #FCF3F1 上只有 4.23 ✗（铁律 71 / 74） */
.kc-subidx__a::before {
  content: counter(kcsub, decimal-leading-zero);
  position: absolute;
  left: 22px;
  top: 12px;
  width: 16px;
  height: 22px;
  line-height: 22px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .4px;
  color: var(--kc-ink-2);
  font-variant-numeric: tabular-nums;
  transition: color .14s;
}
/* 尾部「培训」降级：只在区块 B（分组白卡）使用 ⇒ 白卡底 ink-3 = 4.61 ✔ AA
   ⚠ <em> 默认斜体 ⇒ 必须 font-style: normal */
.kc-subidx__t { font-style: normal; margin-left: 3px; font-size: 12px; color: var(--kc-ink-3); letter-spacing: 0; }
/* ---- hover（第一百〇三轮起只剩供应区一套：区块 A 已改能力链） ---- */
.kc-block--supply .kc-subidx__a:hover {
  color: var(--kc-supply-strong);
  background-color: rgba(46, 64, 87, .055);
  background-size: 3px 22px;
  background-image: linear-gradient(var(--kc-supply-strong), var(--kc-supply-strong));
}
.kc-block--supply .kc-subidx__a:hover::before { color: var(--kc-supply-strong); }

/* ---------- 9. ★ 区块 A：品牌精品课（第一百〇九轮 r109，用户指令） ----------
   形态对齐主站首页「优师堂内训师精品课程」（附件一）：模块胶囊行 + 6 张品牌项目卡
   + 「查看更多的课程」按钮。与首页的工程差异（有意）：
   ① 胶囊 = 8 个小类页直链（本页是分类目录，不做 JS 切 Tab 课程面板，避免与 158 子页内容重复）；
   ② 激活胶囊沿用本页品牌红（首页是主站品牌绿），页面色彩分区不被破坏。
   ⚠ 已退役：第一百〇三轮的 .kc-chain 能力链路径图（勿复活）。 */
.kc-brand__tabs {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 9px;
  margin: 2px 0 22px;
}
.kc-brand__tab {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 6px 18px;
  border-radius: 999px;
  font-size: 14.5px;
  font-weight: 600;
  color: var(--kc-ink);
  background: #fff;
  border: 1px solid #D3E8E4;
  text-decoration: none;
  transition: background .16s, color .16s, border-color .16s, transform .16s;
}
.kc-brand__tab:hover { border-color: var(--brand-strong); color: var(--brand-strong); transform: translateY(-1px); }
/* 激活胶囊（品牌精品课）：实心品牌红（白字 6.48 ✔） */
.kc-brand__tab--on { background: var(--brand-strong); border-color: var(--brand-strong); color: #fff; font-weight: 700; }
.kc-brand__tab--on:hover { color: #fff; }

.kc-brand__cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.kc-pcard {
  display: block;
  background: #fff;
  border: 1px solid #DCEBE7;
  border-radius: 14px;
  overflow: hidden;
  text-decoration: none;
  box-shadow: 0 2px 12px rgba(6, 63, 59, .06);
  transition: transform .18s, box-shadow .18s, border-color .18s;
}
.kc-pcard:hover { transform: translateY(-3px); border-color: var(--brand-300); box-shadow: 0 14px 30px rgba(11, 152, 140, .14); }
.kc-pcard__ph { display: block; aspect-ratio: 800 / 374; background: #EDF6F3; overflow: hidden; }
.kc-pcard__ph img { display: block; width: 100%; height: 100%; object-fit: cover; }
.kc-pcard__tx { display: block; padding: 13px 14px 15px; text-align: center; }
.kc-pcard__tx b { display: block; font-size: 16.5px; font-weight: 800; color: #22303F; letter-spacing: .3px; }
.kc-pcard__sub { display: block; margin-top: 4px; font-size: 12.5px; color: var(--kc-ink-2); }
.kc-pcard:hover .kc-pcard__tx b { color: var(--brand-strong); }

.kc-brand__more { margin: 24px 0 0; text-align: center; }
.kc-brand__cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 44px;
  padding: 8px 28px;
  border-radius: 999px;
  border: 1.5px solid var(--brand-strong);
  color: var(--brand-strong);
  font-size: 14.5px;
  font-weight: 700;
  letter-spacing: .5px;
  text-decoration: none;
  background: #fff;
  transition: background .16s, color .16s;
}
.kc-brand__cta:hover { background: var(--brand-strong); color: #fff; }

/* CURRICULUM kicker（区块头眉题，与主站首页同语言） */
.kc-block__kicker { display: block; margin-top: 12px; font-size: 12px; font-weight: 700; letter-spacing: 3px; color: var(--brand-strong); }

/* r109：隔断带删除后两条色带直接相接 —— 发丝分界缝 + 两端补齐留白 */
.kc-block--core { padding-bottom: 44px; }
.kc-block--supply { padding-top: 44px; border-top: 1px solid #DCE9E5; }

/* ---------- 10.（已下线）通栏隔断带 / 过渡章节 ← 第一百〇九轮用户裁定「没有意义」整块删除 ----------
   业务分层叙事仍由三处承担：区块 A/B 头部徽章（核心业务 / 次核心业务）
   + 暖红/冷蓝两条色带的发丝分界缝（见 §9 末尾）+ 双 CTA。
   ⚠ .kc-divider 全族（__inner/__cap/__big/__sub/__spine/__row/__rule/__link/__text）勿复活。
   留此占位以保持小节编号（11 大类分段 / 12 小类页 …）不变。 */

/* ---------- 11. 师资供应：12 大类分段（**每个大类一张分组白卡** + 段内文字索引） ----------
   2026-09-23 第一百〇二轮（用户裁定 V2）：大类由「发丝线分隔的平铺段」升级为**分组白卡**
   —— 白卡浮在冷蓝带上，13 个分组一眼可数；大类行仍左对齐，与卡内索引左边缘对齐。
   ⚠ 这是「13 张**分组**卡」，不是被下线的「150 张**小类**卡」：容器只表达层级，不逐格描边。 */
.kc-majors { display: grid; gap: 16px; }
.kc-major {
  padding: 18px 24px 12px;
  background: #fff;
  border: 1px solid #E1E8F1;
  border-radius: 16px;
  box-shadow: 0 2px 14px rgba(34, 48, 63, .055);
  scroll-margin-top: 84px;            /* r107：给 sticky 定位条留位（锚点跳转不被遮） */
}
.kc-major:first-child { padding-top: 18px; }   /* 覆盖旧「首段去顶线 / 减顶距」 */
.kc-major__head {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;   /* 大类行**左对齐**，与下方索引左边缘对齐 */
  flex-wrap: wrap;
  gap: 13px;
  margin-bottom: 6px;
  text-align: left;
}
/* 章节图标（r107）：线性 SVG（stroke=currentColor）坐在浅蓝方盒里 —— 12 个大类的视觉锚点。
   描边语言与 ppxm 卫星图标一致：只描边不填充、圆角线帽。 */
.kc-major__icon {
  flex: 0 0 auto;
  width: 46px;
  height: 46px;
  border-radius: 13px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--kc-supply-strong);
  background: #EAF0F8;
  box-shadow: inset 0 0 0 1px #D8E1EE;
}
.kc-major__icon svg { width: 24px; height: 24px; }
.kc-major__headtext { min-width: 0; }
/* 章节标签「大类 / 01」：小号加宽字距，编号章节的「眼」（ink-2 白卡 5.28 ✔） */
.kc-major__no {
  display: block;
  margin-bottom: 2px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2.5px;
  color: var(--kc-ink-2);
  font-variant-numeric: tabular-nums;
}
.kc-major__title { margin: 0; font-size: 21px; font-weight: 700; color: #22303F; letter-spacing: .3px; }
/* 「N 个小类」标签 = 小类**数量**（不是课程门数，与第一百〇一轮「门数全去」不冲突）。
   r107 起嵌进标题行内（跟随标题，不再占 flex 槽位）。 */
.kc-major__n {
  display: inline-block;
  margin-left: 10px;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .2px;
  vertical-align: 3px;
  color: var(--kc-supply-strong);
  background: #E9EEF6;
  font-variant-numeric: tabular-nums;
}
/* 幽灵大序号（r107）：62px 浅灰数字压在卡片右上，章节感的来源；纯装饰 aria-hidden */
.kc-major__ghost {
  position: absolute;
  right: 12px;
  top: -10px;
  font-size: 62px;
  font-weight: 800;
  line-height: 1;
  color: rgba(46, 64, 87, .07);
  pointer-events: none;
  font-variant-numeric: tabular-nums;
}
/* 第一百〇一轮：大类行左对齐 ⇒ 全景页链接靠 `margin-left:auto` 推到行右端 */
.kc-major__pg { margin-left: auto; font-size: 13px; color: var(--kc-supply-strong); text-decoration: none; position: relative; z-index: 1; }
.kc-major__pg:hover { text-decoration: underline; }

/* ---- 定位条（r107：sticky + scrollspy）：12 大类滚动定位，当前大类高亮。
   无 JS 时它就是一排普通锚点（渐进增强，功能不丢）。 ---- */
.kc-rail {
  position: sticky;
  top: 0;
  z-index: 30;
  margin-bottom: 18px;
  background: rgba(240, 244, 249, .92);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  border-bottom: 1px solid #DCE3EE;
}
.kc-rail__inner {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  scrollbar-width: none;
  padding-top: 10px;
  padding-bottom: 10px;
}
.kc-rail__inner::-webkit-scrollbar { display: none; }
.kc-rail__a {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  font-weight: 600;
  color: var(--kc-supply-strong);
  background: #fff;
  border: 1px solid #D8E1EE;
  border-radius: 999px;
  padding: 6px 13px;
  text-decoration: none;
  transition: background .16s, color .16s, border-color .16s, transform .16s;
}
.kc-rail__a i {
  font-style: normal;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .4px;
  color: var(--kc-ink-3);             /* 白底 4.61 ✔ */
  font-variant-numeric: tabular-nums;
}
.kc-rail__a:hover { border-color: var(--kc-supply-strong); transform: translateY(-1px); }
.kc-rail__a.is-active { background: var(--kc-supply-strong); border-color: var(--kc-supply-strong); color: #fff; }
.kc-rail__a.is-active i { color: rgba(255, 255, 255, .78); }

/* ---------- 12. 小类页（/kecheng/<拼音首字母>.html × 158） ---------- */
.kc-subhead {
  position: relative;
  background: linear-gradient(180deg, #E6F4F1 0%, #FFFFFF 88%);
  border-top: 3px solid var(--brand);
  padding: 32px 0 26px;
  text-align: center;        /* 第一百轮：子页头部与首页同口径居中 */
}
.kc-subhead::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, #D8EEE9, rgba(216, 238, 233, .15));
}
.kc-subhead__title {
  font-size: 36px;
  font-weight: 800;
  color: var(--brand);
  line-height: 1.25;
  letter-spacing: 1px;
  margin: 14px 0 10px;
}
.kc-subhead__meta { font-size: 14.5px; color: var(--kc-ink-2); margin: 0 0 10px; }
.kc-subhead__meta b { color: var(--brand-strong); font-weight: 800; font-size: 17px; }
.kc-subhead__kw { font-size: 13px; color: var(--kc-ink-2); line-height: 1.85; margin: 0 0 14px; }
.kc-subhead__back { font-size: 13px; margin: 0; }
.kc-subhead__back a { color: var(--brand-strong); text-decoration: none; }
.kc-subhead__back a:hover { text-decoration: underline; }

/* 课程清单 —— 小类页正文 = 该小类**全部**课程，逐条给出课程页链接。
   ⚠ 窄屏**不许隐藏内容列**（行业标签 / 讲师名）：移动优先索引抓的就是移动版（见 §响应式）。 */
.kc-courses { list-style: none; margin: 0; padding: 0; background: #fff; border: 1px solid var(--kc-line-card); border-radius: var(--kc-radius-sm); overflow: hidden; }
.kc-course {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px 18px;
  border-bottom: 1px solid #EDF3F1;
}
.kc-course:last-child { border-bottom: 0; }
.kc-course:nth-child(odd) { background: #F6FBFA; }
.kc-course:hover { background: #E8F6F4; }
.kc-course__idx {
  flex: 0 0 38px;
  font-size: 12.5px;
  color: var(--kc-ink-2);
  font-variant-numeric: tabular-nums;
}
.kc-course__name {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 15px;
  color: var(--kc-ink);
  text-decoration: none;
  line-height: 1.5;
}
.kc-course__name:hover { color: var(--brand-strong); text-decoration: underline; }
.kc-course__ind {
  flex: 0 0 auto;
  font-size: 12px;
  color: var(--kc-ink-2);
  background: #F1F4F8;
  border: 1px solid #E5EAF2;
  border-radius: 5px;
  padding: 2px 8px;
}
.kc-course__teacher {
  flex: 0 0 96px;
  text-align: right;
  font-size: 13px;
  color: var(--kc-ink-2);
}
/* 同大类兄弟小类（小类之间的横向互链，把内链织成网）
   第一百〇三轮（r107）：从页底上移到页头（长列表页不再滚到底才能横跳），
   形态 = 标签 + 横向可滑胶囊行；页底 .kc-sibs 区块同步下线（不重复呈现）。 */
.kc-sibrow {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  max-width: 980px;
  margin: 16px auto 0;
}
.kc-sibrow__label { flex: 0 0 auto; font-size: 12px; letter-spacing: .5px; color: var(--kc-ink-2); }
.kc-sibrow__list {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  scrollbar-width: none;
  padding-bottom: 2px;
  -webkit-overflow-scrolling: touch;
}
.kc-sibrow__list::-webkit-scrollbar { display: none; }
.kc-sib {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13.5px;
  color: var(--kc-ink-2);
  background: #fff;
  border: 1px solid #E4E9F1;
  border-radius: 999px;
  padding: 6px 13px;
  text-decoration: none;
  transition: background .16s, color .16s, border-color .16s, transform .16s;
}
/* ⚠ 第一百〇一轮：兄弟小类胶囊上的「N 门」已删（凡门数全去）⇒ .kc-sib i 规则随之下线 */
.kc-sib:hover { background: var(--kc-supply); border-color: var(--kc-supply); color: #fff; transform: translateY(-1px); }
/* 面包屑当前项（不可点） */
/* r114：共享表 .crumb span(#D0D0D0, 1.54 ✗) 特异度 (0,1,1) 压过了 .crumb-cur (0,1,0)
   ⇒ 提升到 (0,2,0)；面包屑分隔符顺带提到 ink-3（纯装饰但仍可读） */
.kc-page .crumb .crumb-cur { color: var(--kc-ink-2); }
.kc-page .crumb-inner > span { color: var(--kc-ink-3); }

/* ---------- 13. 双 CTA（红卡 + 蓝卡收尾，与两条业务线呼应） ---------- */
.kc-cta { padding: 56px 0 62px; }
.kc-cta__inner { display: grid; grid-template-columns: 3fr 2fr; gap: 20px; }
.kc-cta__box { position: relative; overflow: hidden; border-radius: var(--kc-radius); padding: 30px 32px 28px; text-align: center; }   /* 第一百轮：卡片文字居中 */
.kc-cta__box--core {
  background: linear-gradient(135deg, #077A70 0%, #063F3B 100%);  /* r113：白字小字须 ≥4.5 ⇒ 最浅停靠 #077A70 */
  color: #fff;
  box-shadow: 0 16px 36px rgba(6, 63, 59, .24);
}
.kc-cta__box--core::after {
  content: "";
  position: absolute;
  right: -70px;
  top: -70px;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, .16), transparent 68%);
}
.kc-cta__box--supply { background: #fff; border: 1px solid #DCE3EE; box-shadow: var(--kc-shadow-sm); }
.kc-cta__box h2 { font-size: 23px; font-weight: 800; margin: 0 0 10px; letter-spacing: .5px; }
.kc-cta__box--core h2 { color: #fff; }
.kc-cta__box--supply h2 { color: var(--kc-supply-strong); font-size: 20px; }
.kc-cta__box p { font-size: 13.5px; line-height: 1.75; margin: 0 0 20px; }
.kc-cta__box--core p { color: rgba(255, 255, 255, .92); }
.kc-cta__box--supply p { color: var(--kc-ink-2); }
.kc-cta__btn {
  position: relative;
  z-index: 1;
  display: inline-block;
  height: 44px;
  line-height: 44px;
  padding: 0 28px;
  border-radius: 999px;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  transition: all .18s;
}
.kc-cta__box--core .kc-cta__btn { background: #fff; color: var(--brand-strong); }
.kc-cta__box--core .kc-cta__btn:hover { background: #E8F6F4; transform: translateY(-1px); }
.kc-cta__box--supply .kc-cta__btn { color: var(--kc-supply-strong); box-shadow: inset 0 0 0 1px #B9C4D6; }
.kc-cta__box--supply .kc-cta__btn:hover { background: var(--kc-supply-band); }

/* ============================================================================
   14. 响应式：1200 / 992 / 768 / 640 / 480
   ⚠ 各档必须「逐项回收装饰」，不是只改 flex-direction；≤992 收卡片、≤640 收列数
   ============================================================================ */
@media (max-width: 1200px) {
  .kc-hero__title { font-size: 50px; letter-spacing: 6px; text-indent: 6px; }
  /* 第一百〇二轮：索引默认 3 栏 / --core 4 栏（1180px 容器下 3 栏 = 373px，18 字长名不折行） */
  .kc-block__title { font-size: 31px; }
}

@media (max-width: 992px) {
  .kc-hero { padding: 40px 0 34px; }
  .kc-hero__title { font-size: 42px; letter-spacing: 4px; text-indent: 4px; }
  .kc-hero__stats { margin-top: 26px; }
  .kc-stat { padding: 0 22px; }
  .kc-stat__num { font-size: 29px; }

  /* 第一百〇二轮：≤992 索引收 2 栏 —— 列宽 469px，最长 18 字的小类名也不折行；
     ⚠ 收列数 ≠ 隐藏链接：158 条链接一条不少 */
  .kc-subidx { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  /* r109：品牌卡收 2 栏 */
  .kc-brand__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kc-major__ghost { font-size: 46px; top: -6px; }

  /* 区块头 / 讲师墙 */
  .kc-block { padding: 38px 0 14px; }
  .kc-block__head { margin-bottom: 22px; padding-bottom: 16px; }
  .kc-block__title { font-size: 28px; }
  .kc-block--supply .kc-block__title { font-size: 23px; }
  /* 第一百轮：区块旁链**不再隐藏** —— 标题组居中后它已居中另起一行，不与标题抢宽度；
     而移动优先索引抓移动版，隐藏内链 = 把链接从索引里抹掉。 */

  /* 双 CTA → 单列 */
  .kc-cta { padding: 40px 0 44px; }
  .kc-cta__inner { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .kc-cta__box { border-radius: 10px; padding: 24px 22px; }

  /* 小类页 */
  .kc-subhead { padding: 26px 0 22px; }
  .kc-subhead__title { font-size: 29px; }
  .kc-major__icon { width: 38px; height: 38px; border-radius: 11px; }
  .kc-major__icon svg { width: 21px; height: 21px; }
  .kc-major__title { font-size: 19px; }
}

@media (max-width: 768px) {
  .kc-page .container { padding-left: 20px; padding-right: 20px; }
  .kc-hero { padding: 32px 0 28px; }
  .kc-hero__title { font-size: 34px; letter-spacing: 3px; text-indent: 3px; }
  .kc-hero__stats { flex-wrap: wrap; gap: 16px 0; margin-top: 20px; }
  .kc-stat { padding: 0 18px; }
  .kc-stat__num { font-size: 26px; }
  .kc-stat__label { font-size: 12.5px; margin-top: 8px; }
  /* 第一百〇二轮：2 栏已由 ≤992 档接管，本档只收字号与列间距 */
  .kc-subidx { gap: 0 20px; }
  .kc-subidx__a { font-size: 14px; }
  .kc-block { padding-top: 32px; }
  .kc-block__title { font-size: 25px; }
  .kc-major { padding: 16px 18px 8px; scroll-margin-top: 66px; }
  .kc-major__head { gap: 9px; margin-bottom: 8px; }
  .kc-major__title { font-size: 18px; }
  .kc-major__ghost { display: none; }        /* r107：窄档全景页链接占整行，幽灵序号让位 */
  .kc-major__pg { margin-left: 0; flex: 0 0 100%; }
  /* r107：兄弟小类行窄屏改上下两段（标签居中 + 胶囊行横滑） */
  .kc-sibrow { flex-direction: column; align-items: stretch; gap: 8px; }
  .kc-sibrow__label { text-align: center; }
  /* ⚠ 课程行窄屏改「课名占首行 + 行业/讲师次行」，**绝不隐藏内容列** */
  .kc-course { flex-wrap: wrap; gap: 6px 8px; padding: 11px 14px; }
  .kc-course__idx { display: none; }          /* 序号纯装饰，让位给内容 */
  .kc-course__name { flex: 1 1 100%; font-size: 14.5px; }
  .kc-course__ind { flex: 0 0 auto; }
  .kc-course__teacher { flex: 0 0 auto; margin-left: auto; }
}

@media (max-width: 640px) {
  .kc-hero { padding: 26px 0 24px; }
  .kc-hero__title { font-size: 29px; letter-spacing: 2px; text-indent: 2px; }
  .kc-hero__title::after { margin-top: 14px; }
  .kc-stat { padding: 0 13px; }
  .kc-stat__num { font-size: 23px; }
  .kc-subidx { gap: 0 18px; }
  /* 第一百〇二轮：左内边距 42 -> 38（序号列同步左移 22 -> 18） */
  .kc-subidx__a { font-size: 13.5px; padding: 12px 6px 12px 38px; }
  /* r109：品牌卡收单栏 */
  .kc-brand__cards { grid-template-columns: minmax(0, 1fr); }
  .kc-hero__intro { font-size: 15px; }

  .kc-subidx__a::before { left: 18px; }
  .kc-course__teacher { font-size: 12.5px; }
  .kc-subhead__title { font-size: 25px; }
  .kc-cta__box h2 { font-size: 20px; }
  .kc-cta__box--supply h2 { font-size: 18px; }
}

@media (max-width: 480px) {
  .kc-hero__title { font-size: 26px; }
  .kc-stat__num { font-size: 21px; }
  .kc-subidx { grid-template-columns: minmax(0, 1fr); }
  /* 第一百〇二轮：单栏后序号列同步内收 42 -> 36（序号 left 22 -> 16） */
  .kc-subidx__a { padding: 12px 4px 12px 36px; }
  .kc-subidx__a::before { left: 16px; }
  .kc-sibrow__list { gap: 7px; }
}

/* ============================================================================
   15. 站点页头窄屏补丁 —— 作用域限定 .kc-page，只影响 kc 页面
   背景：shiziku/css/style.css（4700+ 页共用）**没有任何 .header/.nav 的响应式规则**，
        .nav-item > a 固定 padding:28px 16px + white-space:nowrap、.dropdown min-width:360px
        ⇒ 实测 shiziku 各页 ≤768px 即横向溢出（基线 scrollWidth 807 > 768）。
   处置：按「只加不改」——不动共享 style.css，只在本文件内加作用域补丁。
        （铁律：改共用样式前必须枚举所有消费点；此处消费点 4700+，故另立作用域）
   ============================================================================ */
@media (max-width: 768px) {
  .kc-page .header { height: auto; }
  .kc-page .header-inner {
    height: auto;
    flex-wrap: wrap;
    row-gap: 6px;
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .kc-page .logo img { height: 36px; }
  .kc-page .header .btn { height: 34px; line-height: 34px; padding: 0 14px; font-size: 13px; }
  /* 导航：换到第二行，做成可横向滑动的单行条（触屏 hover 不可用 ⇒ 收起全部下拉） */
  .kc-page .nav {
    order: 3;
    width: 100%;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: 2px;
  }
  .kc-page .nav::-webkit-scrollbar { display: none; }
  .kc-page .nav-item { height: auto; flex: 0 0 auto; }
  .kc-page .nav-item > a { padding: 6px 13px 6px 0; font-size: 14px; }
  .kc-page .nav-item.has-dropdown > a::after { display: none; }
  .kc-page .nav .dropdown { display: none !important; }
}

@media (max-width: 480px) {
  .kc-page .nav-item > a { font-size: 13.5px; padding-right: 11px; }
  .kc-page .header .btn { height: 32px; line-height: 32px; font-size: 12.5px; padding: 0 12px; }
}