/* ============================================================
   优师堂 · 师资库频道 · 讲师详情页专用样式
   主色：青绿 #0B988C（5 档明度）｜ 强调：珊瑚橙 #FF6B35（CTA / 关键数字）
   依赖 style.css（header/footer/hero/CTA 基础）
   ============================================================ */

:root {
  --accent: #0B988C;
  --accent-dark: #077A70;
  --accent-light: #4FD1C5;
  --accent-cta: #FF6B35;
  --accent-deep: #065E56;
}

/* ---------- 讲师 Hero 补充（title / stats） ---------- */
.detail-hero__title {
  font-size: 18px;
  color: var(--accent-light);
  font-weight: 500;
  margin-bottom: 20px;
}
.detail-hero__stats {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 26px;
}
.detail-hero__stat {
  padding: 16px 24px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 12px;
  min-width: 120px;
  text-align: center;
}
.detail-hero__stat-num {
  font-size: 26px;
  font-weight: 700;
  color: var(--cta-light);
  margin-bottom: 4px;
}
.detail-hero__stat-label {
  font-size: 13px;
  color: rgba(255,255,255,.65);
}

/* ---------- 详情页主体两栏布局 ---------- */
.detail-main {
  display: flex;
  gap: 32px;
  padding: 48px 0 64px;
  background: #F8FAFC;
}
.detail-main .container {
  display: flex;
  gap: 32px;
  align-items: flex-start;
}

/* ---------- 粘性目录 ---------- */
.toc {
  position: sticky;
  top: 96px;
  flex: 0 0 220px;
  background: #fff;
  border-radius: 12px;
  border: 1px solid #E5E7EB;
  padding: 20px 16px;
  box-shadow: 0 4px 16px rgba(0,0,0,.04);
  max-height: calc(100vh - 120px);
  overflow-y: auto;
}
.toc__title {
  font-size: 13px;
  font-weight: 700;
  color: #1A2B3C;
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid #E5E7EB;
  letter-spacing: .5px;
}
.toc__list { display: flex; flex-direction: column; gap: 6px; }
.toc__item {
  display: block;
  padding: 10px 14px;
  border-radius: 8px;
  font-size: 14px;
  color: #6B7280;
  transition: all .2s;
  border-left: 3px solid transparent;
}
.toc__item:hover { background: #F8FAFC; color: var(--accent-dark); }
.toc__item.active {
  background: rgba(11,152,140,.08);
  color: var(--accent-dark);
  border-left-color: var(--accent);
  font-weight: 600;
}

/* ---------- 详情内容区 ---------- */
.detail-content { flex: 1; min-width: 0; }
.detail-section {
  background: #fff;
  border-radius: 16px;
  border: 1px solid #E5E7EB;
  padding: 28px 32px;
  margin-bottom: 24px;
  box-shadow: 0 2px 12px rgba(0,0,0,.03);
}
.detail-section__title {
  font-size: 22px;
  font-weight: 700;
  color: #1A2B3C;
  margin-bottom: 20px;
  padding-bottom: 14px;
  border-bottom: 2px solid #E5E7EB;
  display: flex;
  align-items: center;
  gap: 10px;
}
.detail-section__title::before {
  content: '';
  display: inline-block;
  width: 6px;
  height: 22px;
  background: linear-gradient(180deg, var(--accent-light) 0%, var(--accent) 100%);
  border-radius: 3px;
}

/* ---------- 个人简介 ---------- */
.detail-intro p {
  font-size: 15px;
  line-height: 1.75;
  color: #3F4161;
  margin-bottom: 14px;
}
.detail-intro p:last-child { margin-bottom: 0; }
.detail-intro strong { color: var(--accent-dark); font-weight: 600; }

/* ---------- 简介区子标题 ---------- */
.intro-subtitle {
  font-size: 16px;
  font-weight: 700;
  color: #1A2B3C;
  margin: 26px 0 14px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.intro-subtitle::before {
  content: '';
  width: 4px;
  height: 16px;
  background: linear-gradient(180deg, var(--accent-light) 0%, var(--accent) 100%);
  border-radius: 2px;
}

/* ---------- 擅长领域 ---------- */
.skill-tags { display: flex; gap: 10px; flex-wrap: wrap; }
.skill-tag {
  padding: 8px 16px;
  background: rgba(11,152,140,.08);
  color: var(--accent-dark);
  border-radius: 999px;
  font-size: 14px;
  font-weight: 500;
  border: 1px solid rgba(11,152,140,.18);
}

/* ---------- 曾任职位 ---------- */
.experience-timeline { display: flex; flex-direction: column; gap: 16px; position: relative; }
.experience-timeline::before {
  content: '';
  position: absolute;
  left: 15px; top: 8px; bottom: 8px;
  width: 2px; background: #E5E7EB;
}
.experience-item { position: relative; padding-left: 38px; }
.experience-item::before {
  content: '';
  position: absolute;
  left: 8px; top: 6px;
  width: 16px; height: 16px;
  border-radius: 50%;
  background: #fff; border: 3px solid var(--accent);
}
.experience-item__company { font-size: 16px; font-weight: 700; color: #1A2B3C; margin-bottom: 4px; }
.experience-item__position { font-size: 14px; color: var(--accent-dark); font-weight: 500; margin-bottom: 6px; }
.experience-item__desc { font-size: 14px; color: #6B7280; line-height: 1.75; }

/* ---------- 实战经验 ---------- */
.experience-cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.experience-card {
  padding: 20px;
  background: #F8FAFC;
  border-radius: 12px;
  border: 1px solid #E5E7EB;
}
.experience-card__header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.experience-card__company { font-size: 15px; font-weight: 700; color: #1A2B3C; }
.experience-card__period { font-size: 13px; color: #6B7280; }
.experience-card__desc { font-size: 14px; color: #3F4161; line-height: 1.7; }

/* ---------- 核心优势 ---------- */
.advantage-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.advantage-card {
  background: linear-gradient(135deg, #E8F6F4 0%, #FFFFFF 100%);
  border: 1px solid rgba(11,152,140,.22);
  border-radius: 12px;
  padding: 20px;
}
.advantage-card__title { font-size: 15px; font-weight: 700; color: var(--accent-dark); margin-bottom: 8px; }
.advantage-card__desc { font-size: 14px; color: #3F4161; line-height: 1.75; }

/* ---------- 资质认证徽章 ---------- */
.credential-badges { display: flex; flex-wrap: wrap; gap: 10px; }
/* 讲师资质板块（2026-09-13 结构调整）：证书图片组与上方文字资质拉开间距 */
.credential-badges + .photo-grid { margin-top: 26px; }
.credential-badge {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 14px;
  background: #FFF7E8; color: #B45309;
  border: 1px solid #F5D78E;
  border-radius: 8px;
  font-size: 13px; font-weight: 600;
}
.credential-badge::before { content: '◆'; font-size: 11px; color: #D4A843; }

/* ---------- 主讲课程 ---------- */
.course-series { margin-bottom: 24px; }
.course-series:last-child { margin-bottom: 0; }
.course-series__title {
  font-size: 15px; font-weight: 700;
  color: var(--accent-dark);
  margin-bottom: 12px;
  padding-left: 12px;
  border-left: 3px solid var(--accent);
}
.course-list { display: flex; flex-direction: column; gap: 10px; }
.course-item {
  display: flex; align-items: center; gap: 12px;
  padding: 14px 16px;
  background: #F8FAFC;
  border-radius: 10px;
  border: 1px solid #E5E7EB;
  font-size: 14px; color: #3F4161;
}
.course-item__num {
  flex: 0 0 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, var(--accent-dark) 0%, var(--accent-deep) 100%);
  color: #ffffff;
  border-radius: 8px; font-size: 13px; font-weight: 700;
}
.course-item__text { flex: 1; line-height: 1.6; }
.course-item__hours { margin-left: auto; font-size: 13px; color: #6B7280; white-space: nowrap; }
.course-item--link { cursor: pointer; transition: all .2s; }
.course-item--link:hover { background: #fff; border-color: var(--accent); box-shadow: 0 2px 10px rgba(11,152,140,.12); }
.course-item--link:hover .course-item__arrow { transform: translateX(3px); }
.course-item__arrow { margin-left: auto; flex: 0 0 auto; font-size: 13px; font-weight: 600; color: var(--accent-dark); white-space: nowrap; transition: transform .2s; }
/* sec4 收口句：大纲里没有、只在讲师简介清单里出现的课名（2026-09-14） */
.course-extra { margin-top: 16px; font-size: 14px; line-height: 1.9; color: #6B7280; }

/* ---------- 服务客户 ---------- */
.client-industry { margin-bottom: 20px; }
.client-industry:last-child { margin-bottom: 0; }
.client-industry__title { font-size: 15px; font-weight: 700; color: #1A2B3C; margin-bottom: 10px; }
.client-list { display: flex; gap: 8px; flex-wrap: wrap; }
.client-tag { padding: 6px 12px; background: #F8FAFC; border: 1px solid #E5E7EB; border-radius: 6px; font-size: 13px; color: #3F4161; }

/* ---------- 典型案例 ---------- */
.case-table { width: 100%; border-collapse: collapse; font-size: 14px; table-layout: fixed; }
/* 列宽按「列含义」定（语义类 col-no/company/project/count），不按 nth-child 位置定：
   否则 3 列表（企业/项目/期数，无序号）会把「企业」误当窄列、「期数」误当宽列，
   长企业名折成十几行、表格又细又长（殷国辉）。 */
.case-table th.col-no, .case-table td.col-no { width: 7%; }
.case-table th.col-company, .case-table td.col-company { width: 33%; }
.case-table th.col-project, .case-table td.col-project { width: 50%; }
.case-table th.col-count, .case-table td.col-count { width: 10%; }
.case-table th, .case-table td {
  padding: 14px 16px; text-align: left;
  border-bottom: 1px solid #E5E7EB;
  vertical-align: top; word-break: break-word;
}
.case-table th { background: #F8FAFC; font-weight: 700; color: #1A2B3C; }
.case-table td { color: #3F4161; }
.case-table td.col-count { text-align: center; color: #6B7280; }
.case-table td.col-company[rowspan] { vertical-align: middle; }
.case-table tr:hover td { background: #FAFBFC; }

/* 通用表（case-table--plain）：列名/顺序完全照抄源文件（「部分咨询项目案例」的
   序号/企业/咨询项目/过程与成果 等）。没有语义类名，故按**首列窄、末列宽**给宽度：
   首列通常是序号（窄到刚好放 1-2 位数字），末列通常是长文本（过程与成果）。 */
.case-table--plain th:first-child, .case-table--plain td:first-child { width: 8%; text-align: center; }
.case-table--plain th:last-child, .case-table--plain td:last-child { width: 46%; }
.case-table--plain th:nth-child(2), .case-table--plain td:nth-child(2) { width: 22%; }
/* 只有两列时不套用上面的比例（否则第 2 列 = 末列又会吃 46%，两列会挤） */
.case-table--plain th:first-child:last-child { width: 100%; text-align: left; }
.case-table--plain th:first-child:nth-last-child(2) { width: 30%; }
.case-table--plain td:first-child:nth-last-child(2) { width: 30%; }

/* ---------- 典型案例 · 卡片结构 ---------- */
.case-cards { display: flex; flex-direction: column; gap: 14px; }
.case-card {
  background: #fff; border: 1px solid #E5E7EB; border-radius: 12px;
  padding: 16px 18px; transition: border-color .2s;
}
.case-card:hover { border-color: rgba(11,152,140,.35); }
.case-card__head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.case-card__num {
  flex: 0 0 auto; width: 26px; height: 26px; border-radius: 6px;
  background: rgba(11,152,140,.1); color: #077A70;
  font-weight: 700; font-size: 13px;
  display: inline-flex; align-items: center; justify-content: center;
}
.case-card__company { font-size: 15px; font-weight: 700; color: #1A2B3C; }
.case-card__course { font-size: 15px; color: #0B988C; }
.case-card__count { margin-left: auto; font-size: 13px; color: #077A70; font-weight: 600; }
.case-card__body { font-size: 15px; color: #5A6472; line-height: 1.75; margin: 10px 0 0; }

/* ---------- 典型案例 · 分板块结构 ---------- */
.case-blocks { display: flex; flex-direction: column; gap: 24px; }
/* 实战经验概述过渡（2026-09-13 用户规则：正文大标题改「部分实战经验」，概述段作过渡） */
.case-section-lead { margin: 4px 0 20px; }
.case-section-lead p { font-size: 15px; color: #5A6472; line-height: 1.75; margin: 0; }
.case-section-lead p + p { margin-top: 10px; }
.case-section-lead .case-project { margin-top: 10px; }
.case-block__head { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 12px; }
.case-block__bar { flex: 0 0 auto; width: 4px; height: 18px; background: #0B988C; border-radius: 2px; margin-top: 2px; }
.case-block__title { font-size: 16px; font-weight: 700; color: #1A2B3C; line-height: 1.45; }
.case-block__sub { font-size: 13px; color: #6B7280; margin-top: 4px; line-height: 1.5; }
.case-block__body { padding-left: 14px; }
/* 编号徽标（一个案例一个块） */
.case-block__no {
  flex: 0 0 auto; min-width: 28px; height: 20px; padding: 0 7px; margin-top: 1px;
  border-radius: 5px; background: #E6F4F2; color: #077A70;
  font-size: 12px; font-weight: 700; line-height: 20px; text-align: center; letter-spacing: .5px;
}
/* 板块标题条（非容器名标题，如"对内-精通企业安全管理"） */
.case-block--lead .case-block__title { font-size: 18px; }
/* 概述模块 */
.case-block--overview { background: #F6FAFA; border: 1px solid #E1EFED; border-radius: 12px; padding: 16px 18px; }
.case-block--overview .case-block__body { padding-left: 0; }
.case-block--overview .case-project { background: #fff; border-color: #E8F1F0; }
.case-block--overview .case-project:last-child { margin-bottom: 0; }
/* 独立案例块 */
.case-block--case { background: #fff; border: 1px solid #E5E7EB; border-radius: 12px; padding: 16px 18px; transition: border-color .2s; }
.case-block--case:hover { border-color: rgba(11,152,140,.35); }
.case-block--case .case-block__body { padding-left: 0; }
.case-block--case .case-result:last-child, .case-block--case .case-block__para:last-child,
.case-block--case .case-project__desc:last-child, .case-block--case .case-result-item:last-child { margin-bottom: 0; }
/* 表格块 */
.case-block--table .case-block__body { padding-left: 0; }
.case-table__wrap { overflow-x: auto; }
/* 列表项（→ 开头） */
.case-list-item { font-size: 15px; color: #5A6472; line-height: 1.75; margin: 0 0 4px; padding-left: 16px; position: relative; }
.case-list-item::before {
  content: ''; position: absolute; left: 3px; top: 11px;
  width: 5px; height: 5px; border-radius: 50%; background: #0B988C;
}
.case-project {
  background: #fff; border: 1px solid #E5E7EB; border-radius: 12px;
  padding: 14px 16px; margin-bottom: 12px; transition: border-color .2s;
}
.case-project:hover { border-color: rgba(11,152,140,.35); }
.case-project:last-child { margin-bottom: 0; }
.case-project__title { font-size: 15px; font-weight: 700; color: #1A2B3C; margin-bottom: 6px; line-height: 1.5; }
.case-project__desc { font-size: 15px; color: #5A6472; line-height: 1.75; margin: 0 0 8px; }
.case-result {
  background: #E8F6F4; border-radius: 8px; padding: 12px 14px;
  font-size: 15px; line-height: 1.75; color: #2A4D48; margin-bottom: 12px;
}
.case-result__label { color: #077A70; font-weight: 700; margin-right: 8px; }
/* 「过程动作」步骤条：与绿色「成果/对应结果」条成对出现，用中性灰区分（2026-09-13 李泽远） */
.case-result--step { background: #F4F6F8; color: #3F4161; }
.case-result--step .case-result__label { color: #1A2B3C; }
.case-result:last-child { margin-bottom: 0; }
.case-result-item { font-size: 15px; color: #5A6472; line-height: 1.75; margin: 0 0 6px; }
.case-block__para { font-size: 15px; color: #5A6472; line-height: 1.75; margin: 0 0 8px; }
.case-subblock { margin: 16px 0 10px; }
.case-subblock__title { font-size: 16px; font-weight: 700; color: #1A2B3C; line-height: 1.4; }
.case-subblock__sub { font-size: 13px; color: #6B7280; margin-top: 4px; line-height: 1.5; }
.empty-hint { font-size: 14px; color: #999; text-align: center; padding: 24px 0; }

/* ---------- 授课风格 ---------- */
/* 项数自适应（2026-09-13，规则矩阵见 _build_teachers.py 的 style_grid()）：
   1 项 → 1 列整行｜2 项 → 2 列一行｜3 项 → 3 列一行｜4 项 → 2 列 2×2
   5 项 → 3 列（3+2，余数行居中）｜6 项 → 3 列满行｜≥7 项 → 3 列 + 余数行居中
   列数一律用 flex-basis 表达，不用 grid-template-columns（后者做不到余数行居中）。 */
.teaching-style { display: flex; flex-wrap: wrap; gap: 16px; justify-content: center; }
.teaching-style__item {
  flex: 0 1 calc((100% - 32px) / 3); min-width: 0;
  background: #F8FAFC; border: 1px solid #E5E7EB; border-radius: 12px; padding: 20px;
}
.teaching-style__name { font-size: 15px; font-weight: 700; color: var(--accent-dark); margin-bottom: 8px; }
.teaching-style__desc { font-size: 14px; color: #3F4161; line-height: 1.75; }

/* 2 项：两列平铺（各占 1/2，一行铺满） */
.teaching-style--double .teaching-style__item { flex-basis: calc((100% - 16px) / 2); }

/* 4 项：两列 2×2（第一行 2 个、第二行 2 个）。若沿用三等分会 3+1，
   第 2 行只 1 张卡、右侧空 2/3 —— 用户明确要求 4 项排成 2×2。 */
.teaching-style--quad .teaching-style__item { flex-basis: calc((100% - 16px) / 2); }

/* 1 项：整行平铺，卡内上下结构（名称在上 / 描述在下），描述占满卡片宽度 */
.teaching-style--single .teaching-style__item { flex-basis: 100%; padding: 22px 24px; }

/* 窄屏响应式见文末 @media (max-width: 1024px) / 640px（沿用项目统一断点） */

/* ---------- 客户评价 ---------- */
.testimonial-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.testimonial-card { padding: 22px; background: #F8FAFC; border-radius: 12px; border: 1px solid #E5E7EB; }
.testimonial-card__stars { color: #F59E0B; font-size: 14px; letter-spacing: 1px; margin-bottom: 10px; }
.testimonial-card__quote {
  font-size: 14px; color: #3F4161; line-height: 1.75;
  margin-bottom: 16px; position: relative; padding-left: 20px;
}
.testimonial-card__quote::before {
  content: '"'; position: absolute; left: 0; top: -8px;
  font-size: 32px; color: var(--accent);
  font-family: Georgia, serif; line-height: 1;
}
.testimonial-card__author { display: flex; align-items: center; gap: 12px; }
.testimonial-card__avatar {
  width: 40px; height: 40px; border-radius: 50%;
  background: linear-gradient(135deg, var(--accent-dark) 0%, var(--accent-deep) 100%);
  color: #ffffff; display: flex; align-items: center; justify-content: center;
  font-size: 15px; font-weight: 600;
}
.testimonial-card__name { font-size: 14px; font-weight: 700; color: #1A2B3C; }
.testimonial-card__title { font-size: 13px; color: #6B7280; }

/* ---------- 客户评价截图（源 docx 里的手机界面截图，2026-09-14 新增） ----------
   与文字卡可共存（`.testimonial-grid` 之后）。截图是竖版手机比例（≈9:16），
   故列数比照片墙更密：桌面 5 列 / 1024px 4 列 / 640px 3 列。
   固定高度 + `object-position: top` —— 截图顶部是微信头部与对话起始，信息量最大；
   点击图片在新标签打开原图（纯 <a>，无需 JS）。 */
.testimonial-shots { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; }
.testimonial-grid + .testimonial-shots { margin-top: 20px; }
.testimonial-shot {
  margin: 0; background: #fff; border: 1px solid #E5E7EB;
  border-radius: 10px; overflow: hidden; transition: all .25s;
}
.testimonial-shot:hover { transform: translateY(-3px); box-shadow: 0 8px 20px rgba(11,152,140,.14); border-color: rgba(11,152,140,.3); }
.testimonial-shot a { display: block; }
.testimonial-shot img {
  display: block; width: 100%; height: 250px;
  object-fit: cover; object-position: top center; background: #F1F5F9;
}
.testimonial-shot__cap {
  padding: 8px 10px; font-size: 12px; color: #6B7280;
  text-align: center; line-height: 1.45; border-top: 1px solid #F1F5F9;
}

/* ---------- 授课照片墙 ---------- */
.photo-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.photo-card { background: #fff; border: 1px solid #E5E7EB; border-radius: 12px; overflow: hidden; transition: all .25s; }
.photo-card:hover { transform: translateY(-4px); box-shadow: 0 8px 24px rgba(11,152,140,.12); border-color: rgba(11,152,140,.3); }
.photo-card__img { width: 100%; height: 180px; overflow: hidden; background: #F1F5F9; }
.photo-card__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.photo-card__caption { padding: 12px 14px; text-align: center; }
.photo-card__company { font-size: 14px; font-weight: 700; color: #1A2B3C; line-height: 1.4; }
.photo-card__course { font-size: 13px; color: #6B7280; margin-top: 4px; line-height: 1.5; }

/* ---------- 资质证书墙 ---------- */
.cert-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.cert-grid img { width: 100%; height: 200px; object-fit: contain; background: #F8FAFC; border-radius: 10px; border: 1px solid #E5E7EB; padding: 10px; }

/* 证书卡专用画框（生成器输出 class="photo-card__img cert-frame"）
   统一 4:3 —— 横版证书近满幅，竖版证书居中留白，两种朝向视觉一致。
   原实现给容器写死 height:200px，竖版证书只能缩到约 140px 宽，与同排横版证书严重失衡。 */
.photo-card__img.cert-frame { height: auto; aspect-ratio: 4 / 3; }
.photo-card__img.cert-frame img { object-fit: contain; padding: 10px; }

/* ---------- CTA ---------- */
.detail-cta {
  background: linear-gradient(135deg, #0A7F75 0%, #063F3B 100%);
  padding: 64px 0; position: relative; overflow: hidden;
}
.detail-cta::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse at 50% 0%, rgba(11,152,140,.2) 0%, transparent 60%); }
.detail-cta .container { position: relative; z-index: 1; text-align: center; }
.detail-cta__title { font-size: 28px; font-weight: 700; color: #fff; margin-bottom: 12px; }
.detail-cta__desc { font-size: 16px; color: rgba(255,255,255,.8); margin-bottom: 28px; }
.detail-cta__actions { display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; }

/* ---------- 相关讲师 ---------- */
.related-teachers { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.related-teacher {
  display: flex; flex-direction: column; align-items: center;
  padding: 24px; background: #fff; border-radius: 12px;
  border: 1px solid #E5E7EB; transition: all .25s;
}
.related-teacher:hover { transform: translateY(-4px); box-shadow: 0 8px 24px rgba(11,152,140,.12); border-color: rgba(11,152,140,.3); }
.related-teacher__avatar { width: 90px; height: 90px; border-radius: 50%; overflow: hidden; margin-bottom: 14px; background: #F8FAFC; }
.related-teacher__avatar img { width: 100%; height: 100%; object-fit: cover; }
.related-teacher__name { font-size: 16px; font-weight: 700; color: #1A2B3C; margin-bottom: 6px; }
.related-teacher__title { font-size: 13px; color: #6B7280; }

/* ---------- 文字高亮 ---------- */
.hl { color: var(--accent-dark); font-weight: 700; }
.hl-gold { color: #D4A843; font-weight: 700; }

/* ---------- 响应式 ---------- */
@media (max-width: 1024px) {
  .detail-main .container { flex-direction: column; }
  .toc { position: relative; top: 0; flex: 0 0 auto; width: 100%; max-height: none; }
  .toc__list { flex-direction: row; flex-wrap: wrap; }
  .experience-cards, .testimonial-grid, .related-teachers, .photo-grid, .cert-grid, .advantage-grid { grid-template-columns: 1fr 1fr; }
  .testimonial-shots { grid-template-columns: repeat(4, 1fr); }
  /* 授课风格已改 flex 布局（2026-09-13），grid-template-columns 对其失效，列数改用 flex-basis 控制。
     1024px 起 ≥3 项统一降为 2 列；--quad / --double 本就是 2 列，无需覆盖。 */
  .teaching-style__item { flex-basis: calc((100% - 16px) / 2); }
}
@media (max-width: 640px) {
  .photo-grid, .cert-grid, .advantage-grid { grid-template-columns: 1fr; }
  .testimonial-shots { grid-template-columns: repeat(3, 1fr); gap: 10px; }
  .testimonial-shot img { height: 180px; }
  /* 需与修饰类同级特异性，否则 --single/--double/--quad（0,2,0）会压过 .teaching-style__item（0,1,0） */
  .teaching-style__item,
  .teaching-style--double .teaching-style__item,
  .teaching-style--quad .teaching-style__item,
  .teaching-style--single .teaching-style__item { flex-basis: 100%; }
}

/* ---------- 响应式：讲师页正文层级（2026-09-13 补） ---------- */
@media (max-width: 768px) {
  .detail-section__title { font-size: 20px; }
  .detail-hero__stat-num { font-size: 22px; }
  .intro-subtitle { font-size: 15px; }
  .case-block__title,
  .case-subblock__title { font-size: 15px; }
  .case-block--lead .case-block__title { font-size: 16px; }
}

@media (max-width: 480px) {
  .detail-section__title { font-size: 18px; }
  .detail-hero__stat-num { font-size: 20px; }
}

/* ---------- 授课风格 / 服务客户 分块补充（2026-09-13） ---------- */
.teaching-style__item--plain { border-left: 3px solid var(--brand); }

/* 证书卡下方标签：原先写死在 HTML 内联（style="font-size:12px"），改为 class 以便统一调整。
   2026-09-13：证书名超一行时精简为一行（省略号截断，完整名在 title 悬停提示） */
.cert-card__label { font-size: 12px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.client-industry--head { margin-top: 26px; }
.client-industry--head:first-child { margin-top: 0; }
.client-industry--head .client-industry__title {
  font-size: 16px;
  color: var(--brand-strong);
  padding-left: 10px;
  border-left: 3px solid var(--brand);
}