/**
 * OPC 社区首页专属样式覆盖（front-page.php 独占，仅 is_front_page() 时加载）。
 *
 * 【隔离约定】依据 opc-functions.php 顶部 CSS 隔离说明：本文件是首页模块分片，
 * 只在这里写首页的新增样式与对基座（components.css）的覆盖，严禁改动
 * tokens.css / components.css / 其它 opc-*.css。所有覆盖用 `.page-frame ...`
 * 或独立新类选择器，确保等于或高于基座优先级、且不外溢到其它页面。
 *
 * 依赖：opc-prototype-components（见 enqueue 处 dep 声明）。
 * 覆盖点：
 *   #6a 首页两栏窄容器内 rich-meta 异常换行修复
 *   #6b 创意种子模块差异化（左侧强调色条 / 种子意象点缀）
 *   #6c OPC创业赋能生态 eco-* 卡片差异化（含精选大卡 .eco-feature-card）
 *   #6d 有求必应的互助交流 两栏话题行观感
 *   #6e 最新入驻的OPC 网址导航式三列网格（.opc-home-navgrid）
 *   #6f 可复制的启动SOP 模块打磨（标题图标 / 成本周期分隔观感）
 */

/* ================================================================== *
 * #6a 成功案例 rich-meta 换行修复
 * 首页两栏容器较窄，基座 .rich-meta 固定 76px 会把 who/pill/revenue 挤到换行。
 * 这里放宽最小宽度、禁止内部换行、保持右对齐竖排整齐。
 * ================================================================== */
.page-frame .rich-row .rich-meta {
  width: auto;
  min-width: 84px;
  max-width: 120px;
  align-items: flex-end;
  text-align: right;
  white-space: nowrap;
}
.page-frame .rich-row .rich-meta .who,
.page-frame .rich-row .rich-meta .revenue,
.page-frame .rich-row .rich-meta .rich-batch {
  white-space: nowrap;
  max-width: 120px;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ================================================================== *
 * #6b 创意种子模块差异化（保留两栏，但与"成功案例"拉开区隔度）
 * 手法：种子/生长意象的青绿强调色，卡片间留白 + 悬浮上浮点亮，
 * 去掉左侧强调色条（用户反馈过于突出，改为更克制的留白+悬浮层级）。
 * 克制处理：只借用 idea-home-section 作用域，不改 idea-card 结构。
 * ================================================================== */
.page-frame .idea-home-section {
  --idea-accent: #17a06e; /* 种子/生长意象青绿，仅本模块作用域内生效 */
}
/* 2026-07-16：创意种子改用 .rich-row 行式（idea-row.php），与成功案例同版式。
   rich-row 靠 border-bottom 分隔，故列内不再要 gap；hover 只把标题染青绿，
   与案例的品牌蓝 hover 区隔。原针对纵向 .idea-card 的上浮/边框 hover 已不适用。 */
.page-frame .idea-home-section .col-stack {
  gap: 0;
}
.page-frame .idea-row-wrap .rich-row:hover .rich-name {
  color: var(--idea-accent);
}
.page-frame .idea-row-wrap .rich-row:hover .rich-thumb {
  box-shadow: none;
}
/* 2026-07-16e：创意种子容器复刻成功案例浅蓝圆角面板（idea-row-wrap 单独上底色/圆角/内边距，
   与案例 .case-two-col 观感一致但作用域独立，不影响归档页纵向 idea-card）。 */
.page-frame .idea-home-section .idea-row-wrap {
  border-radius: 20px;
  overflow: hidden;
  background: var(--surface);
  padding: 20px 28px;
}
/* 面板内两栏 col-stack 基座含 padding:0 35px，配合面板 28px 内边距会过挤，收窄一档。 */
.page-frame .idea-home-section .idea-row-wrap .col-stack {
  padding: 0 24px;
}
.page-frame .idea-home-section .idea-row-wrap .col-stack:first-child { padding-left: 0; }
.page-frame .idea-home-section .idea-row-wrap .col-stack:last-child { padding-right: 0; }
/* 浅蓝底吞掉基座 --line 中缝与行分隔，改黑色淡描边；hover 用 --surface 同色失效，改浅蓝。
   注：创意种子已于 2026-07-18 改用 .news-row 结构（idea-row-home.php），下面 .rich-row
   规则仅为兼容残留，实际 hover 走 .case-news-two-col .news-row:hover。 */
.page-frame .idea-home-section .idea-row-wrap::after { background: rgba(0, 0, 0, .07); }
.page-frame .idea-home-section .idea-row-wrap .rich-row { border-bottom-color: rgba(0, 0, 0, .06); }
.page-frame .idea-home-section .idea-row-wrap .rich-row:hover { background: var(--accent-soft); }
/* idea-row 右侧 meta：竖排 适合人群 + 成熟度徽章，宽度放宽以容纳中文 */
.page-frame .idea-row-wrap .rich-row .idea-row-meta {
  width: auto;
  min-width: 92px;
  max-width: 128px;
  gap: 8px;
}
.page-frame .idea-row-wrap .rich-row .idea-row-meta .idea-audience {
  text-align: right;
  -webkit-line-clamp: 2;
}
.page-frame .idea-row-wrap .rich-row .idea-row-meta .idea-mom-pill {
  align-self: flex-end;
  font-size: 11px;
  padding: 2px 9px;
}

/* ================================================================== *
 * #6c OPC创业赋能生态 eco-* 差异化
 * 与"启动SOP"同为 home-grid，用品牌蓝强调、卡片顶部细条，做出区隔。
 * ================================================================== */
.page-frame .eco-home-section {
  --eco-accent: #ff6000; /* 品牌蓝（=全站 --accent），与其余模块统一 */
}
.page-frame .eco-grid .eco-card {
  position: relative;
  overflow: hidden;
  background-image: linear-gradient(14deg, #fff 78%, rgba(77,107,254,.08) 100%);
}
.page-frame .eco-grid .eco-card::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--eco-accent), rgba(77,107,254,.2));
}
.page-frame .eco-grid .eco-card:hover .home-card-title {
  color: var(--eco-accent);
}
.page-frame .eco-grid .eco-card .home-card-tag {
  color: var(--eco-accent);
  font-weight: 600;
}
.page-frame .eco-feature-card:hover {
  box-shadow: 0 16px 30px -18px rgba(77, 107, 254, .35);
}
.page-frame .eco-feature-card .feature-flag {
  color: var(--eco-accent);
}
.page-frame .eco-feature-card .feature-foot {
  color: var(--eco-accent);
}
/* 左栏简介限制在合理行高内，赛道标签与 CTA 之间留出呼吸感 */
.page-frame .eco-feature-card .feature-desc {
  margin-bottom: 16px;
}
.page-frame .eco-feature-card .feature-badges {
  margin-bottom: 18px;
}
/* 精选标签内的"已核实"小徽标 */
.page-frame .eco-feature-card .eco-verified-flag {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  margin-left: 6px;
  padding: 1px 8px;
  border-radius: 999px;
  background: rgba(77, 107, 254, .12);
  color: var(--eco-accent);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0;
  vertical-align: middle;
}
.page-frame .eco-feature-card .eco-verified-flag::before {
  content: "✓";
  font-size: 10px;
}

/* 右栏：机构档案面板（原右栏只有常空的加入方式，现填充结构化事实） */
.page-frame .eco-feature-card .feature-side {
  flex: 1.05;
  justify-content: flex-start;
  gap: 0;
  background: linear-gradient(150deg, #eef1ff 0%, #f5f7ff 100%);
}
.page-frame .eco-feature-card .feature-side::before {
  border-color: rgba(77, 107, 254, .22);
  box-shadow: 0 0 0 14px rgba(77, 107, 254, .05), 0 0 0 30px rgba(77, 107, 254, .035);
}
.page-frame .eco-feature-card .feature-side::after {
  background: radial-gradient(circle, rgba(77, 107, 254, .14), transparent 70%);
}
.page-frame .eco-feature-card .feature-side-head {
  color: var(--eco-accent);
}
/* 事实定义列表：每行 label 左 / value 右，细分隔线拉出条理感 */
.page-frame .eco-feature-card .eco-facts {
  position: relative;
  z-index: 1;
  margin: 0 0 4px;
  display: flex;
  flex-direction: column;
}
.page-frame .eco-feature-card .eco-fact {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid rgba(77, 107, 254, .12);
}
.page-frame .eco-feature-card .eco-fact:first-child {
  padding-top: 0;
}
.page-frame .eco-feature-card .eco-fact dt {
  flex: 0 0 auto;
  font-size: 12px;
  color: var(--muted);
  white-space: nowrap;
}
.page-frame .eco-feature-card .eco-fact dd {
  margin: 0;
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  text-align: right;
  line-height: 1.4;
}
/* 加入方式：档案面板底部的强调行动块 */
.page-frame .eco-feature-card .eco-join {
  position: relative;
  z-index: 1;
  margin-top: 14px;
  padding: 12px 14px;
  border-radius: 12px;
  background: rgba(255, 255, 255, .66);
  border: 1px solid rgba(77, 107, 254, .18);
}
.page-frame .eco-feature-card .eco-join-label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--eco-accent);
  margin-bottom: 4px;
}
.page-frame .eco-feature-card .eco-join-text {
  display: block;
  font-size: 13px;
  color: var(--text);
  line-height: 1.6;
}

/* ================================================================== *
 * #6f 可复制的启动SOP 首页模块打磨
 * "难度"维度已在M2整体删除，_opc_sop_cost 历史文案里残留的"中/低"前缀
 * 改由 opc_strip_difficulty_prefix() 在展示层剥离（不回写文章数据）。
 * 这里只做视觉细节打磨：三格网格的成本/周期分隔改用圆点替代裸露的
 * " · "文本，弱化次要信息的视觉权重（标题图标已移交"十倍提效的AI工具"）。
 * ================================================================== */
/* 2026-07-16e：按需求移除"AI工具"标题前 🛠 图标（idea 的 🌱 一并移除，见上）。 */
.page-frame .sop-home-section .home-grid .home-card-meta {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
}
.page-frame .sop-home-section .home-grid .home-card-meta-dot {
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: var(--muted-2);
  flex-shrink: 0;
}

/* ================================================================== *
 * #6d 有求必应的互助交流 两栏话题行
 * 复用基座 .thread-row 观感；两栏中缝用 .two-col-wrap 既有分隔线。
 * thread-row 基座带 margin:0 -14px，两栏 col-stack 已含左右 padding，
 * 无需额外覆盖，仅微调标题裁剪，避免长标题撑破窄列。
 * ================================================================== */
.page-frame .forum-two-col .thread-title {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.page-frame .forum-two-col .thread-meta {
  flex-wrap: wrap;
}

/* ================================================================== *
 * #6e 最新入驻的OPC —— 网址导航式三列整表格网格（refer/06.png 观感）
 * 整体为一个带外边框的表格容器，每个OPC占一个格子，格子间用内部分隔线
 * 相连（非独立圆角卡片）。分隔线做法：容器画外框，格子只画 top/left，
 * 首行去 top、首列去 left，避免与外框重叠出现双线。
 * ================================================================== */
.page-frame .opc-home-navgrid {
  display: grid;
  /* 自适应网格：根据容器宽度自动决定列数，避免固定3列导致3+1布局失衡 */
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 0;
  border-radius: var(--radius-card);
  overflow: hidden;
  background: var(--surface);  /* 浅灰底（对齐首页 OPC资讯 --surface） */
}
.page-frame .opc-nav-card {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px;
  border-top: 1px solid rgba(0, 0, 0, .06);
  border-left: 1px solid rgba(0, 0, 0, .06);
  text-decoration: none;
  color: inherit;
  transition: background-color .18s ease;
}
.page-frame .opc-nav-card:nth-child(-n+3) {
  border-top: none;
}
.page-frame .opc-nav-card:nth-child(3n+1) {
  border-left: none;
}
/* hover 改浅蓝（不再翻白）：复用 --accent-soft，与 opc-ai-tool.css 中
   AI工具归档页同名选择器的 hover 取值一致，两处观感对齐。
   影响「最新入驻的OPC」「OPC创业赋能机构」「十倍提效的AI工具」三个共用
   .opc-nav-card 的模块。 */
.page-frame .opc-nav-card:hover {
  background: var(--accent-soft);
}
.page-frame .opc-nav-card:hover .opc-nav-name {
  color: var(--accent);
}
.page-frame .opc-nav-icon {
  width: 40px;
  height: 40px;
  margin-top: 2px;
  border-radius: 10px;
  flex-shrink: 0;
  object-fit: cover;
  background: var(--surface);
}
/* 2026-07-16f：图片占位统一为「灰字 + 白底 + 无线框」低调样式（底色由浅灰改白）。 */
.page-frame .opc-nav-icon--ph {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  color: var(--muted);
  font-size: 16px;
  font-weight: 700;
  font-family: var(--font-display);
}
.page-frame .opc-nav-text {
  min-width: 0;
  flex: 1;
}
.page-frame .opc-nav-head {
  display: flex;
  align-items: baseline;
  gap: 8px;
  min-width: 0;
}
.page-frame .opc-nav-name {
  min-width: 0;
  flex: 0 1 auto;
  font-size: 14px;
  font-weight: 700;
  color: var(--text);
  line-height: 1.35;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color .18s ease;
}
.page-frame .opc-nav-city {
  flex-shrink: 0;
  padding-left: 8px;
  border-left: 1px solid var(--line);
  font-size: 11.5px;
  color: var(--muted-2);
  line-height: 1;
}
.page-frame .opc-nav-desc {
  margin-top: 4px;
  font-size: 12px;
  color: var(--muted);
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.page-frame .opc-nav-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}
.page-frame .opc-nav-tags .pill.opc-nav-tag {
  padding: 2px 9px;
  font-size: 11px;
  line-height: 1.6;
  background: var(--surface);
  color: var(--muted);
  border: 1px solid var(--line);
}
/* 2026-07-31：footer 区（机构类型+城市 / AI工具类别+形态）统一走 .opc-nav-tags
   的标签排布与 .pill.opc-nav-tag 样式，此处只留换行与间距，样式不再重复定义。
   margin-top 与 .opc-nav-tags 同为 8px，两类同时挂载不产生跳变。 */
.page-frame .opc-nav-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
}

/* 响应式：窄屏降列，保持网址导航密度可读。降列后表格分隔线规则需按新列数重算 */
@media (max-width: 860px) {
  .page-frame .opc-home-navgrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .page-frame .opc-nav-card {
    border-top: 1px solid var(--line);
    border-left: 1px solid var(--line);
  }
  .page-frame .opc-nav-card:nth-child(-n+2) {
    border-top: none;
  }
  .page-frame .opc-nav-card:nth-child(2n+1) {
    border-left: none;
  }
}
@media (max-width: 560px) {
  .page-frame .opc-home-navgrid {
    grid-template-columns: 1fr;
  }
  .page-frame .opc-nav-card {
    border-left: none;
    border-top: 1px solid var(--line);
  }
  .page-frame .opc-nav-card:first-child {
    border-top: none;
  }
}

/* ================================================================== *
 * #6f 首页主行动按钮纯科技蓝（不使用 .btn-solid/.btn-cta-light 默认蓝紫渐变）
 * 与 components.css #444 起投稿按钮纯蓝覆盖手法一致，仅作用于首页 .cta-plain。
 * ================================================================== */
.cta-plain.btn-solid,
.cta-plain.btn-cta-light {
  background: var(--accent) !important;
  box-shadow: 0 4px 14px rgba(var(--accent-rgb), .28);
}
.cta-plain.btn-solid:hover,
.cta-plain.btn-cta-light:hover {
  background: #3a57ef !important;
}

/* ================================================================== *
 * #6g 2026-07-16 首页密度优化：成功案例删简介后收紧，创意种子行式同档收紧。
 * 基座 .rich-row 为 height:136px / padding:22px 14px / thumb 96×72，
 * 删掉 .rich-desc 后行高冗余，这里在首页两栏作用域内压缩到更紧凑的节奏，
 * 不改 components.css 基座（归档页 rich-row 维持原观感）。
 * ================================================================== */
.page-frame .case-two-col .rich-row,
.page-frame .idea-row-wrap .rich-row {
  height: auto;
  min-height: 0;
  padding: 12px 14px;
  gap: 12px;
}
.page-frame .case-two-col .rich-thumb {
  width: 84px;
  height: 54px;
}
.page-frame .case-two-col .rich-body,
.page-frame .idea-row-wrap .rich-body {
  gap: 5px;
  justify-content: center;
}

/* ================================================================== *
 * #6h 方案C：资讯板块降密增质。每栏首条 .news-lead 头条大卡（整宽 16:9 顶图
 * + 大标题），其余 .news-row 保持行式但 padding 略放宽、分隔虚线调更淡。
 * ================================================================== */
.page-frame .news-two-col { padding-bottom:0px; }
 .page-frame .news-two-col .news-row {
  padding: 16px 14px;
  border-bottom-color: rgba(0, 0, 0, .06);
  background: var(--surface);  /* 浅蓝底（品牌色 5% 淡染） */
  border-radius: 20px;                   /* 灰底面板圆角 */
}
 .page-frame .news-two-col .case-news-row { background: none; }
/* 「最新&最热的OPC资讯」行 hover 改浅蓝：资讯行默认底已是 --surface，
   基座 components.css:219 的 hover 同为 --surface 等于无变化，故在此覆盖。
   :not(.case-news-row) 排除案例/SOP/创意（它们走上面 case-news-two-col 规则）。 */
 .page-frame .news-two-col .news-row:not(.case-news-row):hover {
  background: var(--accent-soft);
}
/* 2026-07-30：资讯行分类 .pill 加圆角线框，与首页其他模块的标签观感统一
   （基座 components.css:67 的 .pill 只有灰底无描边，在灰底行内不可辨）。
   :not(.case-news-row) 限定资讯行，不影响案例/SOP/创意（它们用 .opc-nav-tag）。 */
 .page-frame .news-two-col .news-row:not(.case-news-row) .news-meta .pill {
  padding: 2px 9px;
  border: 1px solid rgba(0, 0, 0, .1);
  background: var(--surface);
  color: var(--muted);
  font-size: 11px;
  line-height: 1.6;
}
/* 2026-07-16f：资讯栏「最新资讯 / 最热资讯」列标题弱化 —— 去基座蓝色下划线、
   不加粗、改灰色，退成轻量分栏标签而非强调标题。 */
.page-frame .news-two-col .col-title {
  border-bottom: none;
  padding-bottom: 0;
  font-weight: 400;
  color: var(--muted);
}
/* ================================================================== *
 * 2026-07-30 首页行式卡片（成功案例 / 启动SOP / 创意种子）统一版式：
 *   第一行 标题 → 第二行 .news-intro（一句话简介 / 适用人群 / 适合用户，两行截断）
 *   → 第三行 .news-meta.opc-nav-tags（赛道 + 细分领域，圆角线框标签）
 * 标签样式与「最新入驻的OPC」的 .pill.opc-nav-tag 对齐，三处观感一致。
 * ================================================================== */
.page-frame .news-row .news-intro {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.5;
  margin: 4px 0 6px 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* meta 行复用 .opc-nav-tags 的换行标签排布，但去掉其 8px 上边距
   （行式卡片已由 .news-intro 的 margin-bottom 承担间距），并与 intro 左对齐。 */
.page-frame .news-row .news-meta.opc-nav-tags {
  margin-top: 0;
  padding-left: 0;
}
/* ------------------------------------------------------------------ *
 * 2026-07-31 成功案例 stats 区：城市由 meta 移入此处，与营收纵向成组。
 * 基座 .news-stats 为横向 flex + align-self:flex-end，这里改纵向右对齐，
 * 让「营收数值 / 营收标签 / 城市」形成一条右侧信息轴。
 * ------------------------------------------------------------------ */
.page-frame .news-row .news-stats.case-stats {
  flex-direction: column;
  align-items: flex-end;
  align-self: center;
  gap: 6px;
}
.page-frame .news-row .news-stats.case-stats .stat {
  align-items: flex-end;
}
/* 城市：弱化为次级信息（比营收小一档、更淡），图钉图标降低不透明度，
   避免与营收数值争夺视觉焦点。nowrap 防止长市名折行破坏右侧轴对齐。 */
.page-frame .news-row .news-stats.case-stats .case-stat-city {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 11px;
  line-height: 1.4;
  color: var(--muted-2);
  white-space: nowrap;
}
.page-frame .news-row .news-stats.case-stats .case-city-pin {
  flex-shrink: 0;
  opacity: .55;
  transform: translateY(-.5px); /* 图钉视觉重心偏下，微调抬起与文字基线居中 */
}
/* hover 时城市随卡片一同点亮，与标题变蓝的反馈保持一致节奏。 */
.page-frame .news-row:hover .news-stats.case-stats .case-stat-city {
  color: var(--muted);
}
/* 标签样式：与 .page-frame .opc-nav-tags .pill.opc-nav-tag 保持一致的灰底圆角线框。
   注：三个模块的面板底同为 --surface(#f7f8fa)，与标签底同色，而基座 --line(#edeef1)
   比底色更浅会使线框不可见，故描边单独加深一档（rgba 黑 10%），保持灰底不变。 */
.page-frame .news-row .news-meta .pill.opc-nav-tag {
  padding: 2px 9px;
  font-size: 11px;
  line-height: 1.6;
  background: var(--surface);
  color: var(--muted);
  border: 1px solid rgba(0, 0, 0, .1);
}
/* 2026-07-16b：成功案例质感再设计 —— 纯浅灰扁平通铺底（去基座圆角方框+渐变），
   整段像一块低调的"上岸榜单"面板，与资讯栏行式一致但用灰底与其它白底区块拉开层次。
   作用域限定 .page-frame，不影响 components.css 基座与归档页 .opc-arc。 */
.page-frame .two-col-wrap.case-two-col {
  border-radius: 20px;                   /* 灰底面板圆角 */
  border: none;
  overflow: hidden;                      /* 圆角需裁切内容 */
  background: var(--surface);            /* 浅灰底（对齐首页 OPC资讯 --surface） */
  padding: 20px 28px;                   /* 底内留呼吸，两栏不贴边 */
}
/* 灰底上分隔线（基座 --line #ececed 会被灰底吞掉）改用更清晰的描边色。 */
.page-frame .two-col-wrap.case-two-col::after { background: rgba(0, 0, 0, .07); }
/* 灰底下 news-row 的 hover 高亮（基座用 --surface 会与底色同色而失效）改为浅蓝，
   与 .opc-nav-card 的 hover 取值统一（均为 --accent-soft）。
   命中「成功上岸的OPC案例」「可复制的启动SOP」「具备潜力的创意种子」三个模块。 */
.page-frame .case-news-two-col .news-row { border-bottom-color: rgba(0, 0, 0, .06); }
.page-frame .case-news-two-col .news-row:hover { background: var(--accent-soft); }
/* 2026-07-16f：案例/SOP 行无封面占位块统一为「灰字 + 白底 + 无线框」低调样式。 */
.page-frame .case-news-two-col .news-thumb--ph {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  background: #fff;
  border: none;
  color: var(--muted);
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
  user-select: none;
}
/* 2026-07-16：启动SOP 完全复刻成功案例版式（容器复用 case-two-col/case-news-two-col 全套：
   圆角/内边距/分隔线/hover/占位块自动继承），仅底色单独改浅灰，与案例的浅蓝区分。 */
.page-frame .two-col-wrap.sop-two-col { background: var(--surface); /* 浅灰底（对齐首页 OPC资讯 --surface） */ }
.page-frame .news-two-col .news-lead {
  display: block;
  margin: 0 -14px 8px;
  border-radius: 14px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  background: var(--surface);
  border: 1px solid var(--line);
  transition: box-shadow .2s ease, transform .2s ease;
}
.page-frame .news-two-col .news-lead:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-lg);
}
.page-frame .news-two-col .news-lead:hover .news-lead-title {
  color: var(--accent);
}
.page-frame .news-two-col .news-lead-cover {
  position: relative;
  aspect-ratio: 16 / 9;
  background: var(--surface);
  overflow: hidden;
}
.page-frame .news-two-col .news-lead-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.page-frame .news-two-col .news-lead-cover--ph {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  color: var(--muted);
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 700;
  letter-spacing: .08em;
  user-select: none;
}
.page-frame .news-two-col .news-lead-cat {
  position: absolute;
  left: 12px;
  top: 12px;
  padding: 3px 10px;
  border-radius: 999px;
  background: rgba(0, 0, 0, .55);
  color: #fff;
  font-size: 11.5px;
  font-weight: 600;
  backdrop-filter: blur(2px);
}
.page-frame .news-two-col .news-lead-body {
  padding: 12px 16px 14px;
}
.page-frame .news-two-col .news-lead-title {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.45;
  color: var(--text);
  transition: color .15s ease;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.page-frame .news-two-col .news-lead-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 8px;
  font-size: 12px;
  color: var(--muted-2);
}
.page-frame .news-two-col .news-lead-views {
  margin-left: auto;
  font-weight: 600;
  color: var(--muted);
}

/* ================================================================== *
 * 2026-07-17 首页交互微调
 * ================================================================== */

/* #6b「你的OPC在哪一站」：卡片由整体链接改为容器 + 卡内双链接（预埋两条路径）。
 * 卡片本体去掉 .stage-card 的 :hover 抬升（改由链接各自高亮），保留渐变/焦点底。 */
.page-frame .stage-links {
  position: relative;
  z-index: 1;
  margin-top: auto;
  padding-top: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
}
.page-frame .stage-link {
  display: inline-flex;
  align-items: center;
  font-size: 13px;
  font-weight: 700;
  color: var(--accent);
  text-decoration: none;
  letter-spacing: .01em;
  transition: color .15s ease, transform .15s ease;
}
.page-frame .stage-link:hover {
  color: var(--accent-hover);
  transform: translateX(2px);
}
/* 容器化后不再整卡跳转，hover 抬升交给链接；卡片仅保留轻微底色反馈 */
.page-frame .stage-card:hover {
  transform: none;
  box-shadow: var(--shadow-sm);
}

/* #6d 资讯行：news-stats（右侧浏览数）与 news-body 顶部对齐（原基线 align-self:flex-end 沉底）。 */
.page-frame .news-row .news-stats {
  align-self: flex-start;
}

/* #6f 创意种子：idea-audience（适合人群）字体精修 + 品牌蓝，与右侧成熟度徽章拉开语义。 */
.page-frame .idea-row-wrap .rich-row .idea-row-meta .idea-audience {
  text-align: right;
  -webkit-line-clamp: 2;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: .01em;
  color: var(--muted);
}
.page-frame .idea-row-wrap .rich-row .idea-row-meta .idea-audience .idea-audience-label {
  font-size: 11px;
  font-weight: 500;
  color: var(--muted);
  opacity: .7;
  padding-right: 3px;
}

/* 2026-07-18：创意种子首页改用 .news-row 版式（idea-row-home），每 item 均含封面缩略图。
   容器补挂 case-news-two-col 复用整套 news-row 面板样式（圆角/内边距/分隔线/hover/占位块）。
   成熟度徽章配色 opc-idea.css 首页不加载，此处补进首页作用域，复刻归档页 rgba 语义色。 */
.page-frame .idea-home-section .news-row .news-stats .idea-mom-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 9px;
  border-radius: var(--radius-pill);
  font-size: 11px;
  font-weight: 500;
  line-height: 1.5;
  border: 1px solid transparent;
  white-space: nowrap;
}
.page-frame .idea-home-section .news-row .idea-mom-pill.mom-emerging {
  background: rgba(52, 211, 153, 0.08); color: rgb(16, 185, 129); border-color: rgba(52, 211, 153, 0.2);
}
.page-frame .idea-home-section .news-row .idea-mom-pill.mom-rising {
  background: rgba(59, 130, 246, 0.08); color: rgb(37, 99, 235); border-color: rgba(59, 130, 246, 0.2);
}
.page-frame .idea-home-section .news-row .idea-mom-pill.mom-validated {
  background: rgba(16, 185, 129, 0.08); color: rgb(5, 150, 105); border-color: rgba(16, 185, 129, 0.2);
}
.page-frame .idea-home-section .news-row .idea-mom-pill.mom-saturated {
  background: rgba(239, 68, 68, 0.08); color: rgb(220, 38, 38); border-color: rgba(239, 68, 68, 0.2);
}
.page-frame .idea-home-section .news-row .idea-mom-pill.mom-transforming {
  background: rgba(168, 85, 247, 0.08); color: rgb(147, 51, 234); border-color: rgba(168, 85, 247, 0.2);
}