/* ==========================================================================
   portal-r33a.css（第 33 轮 · bug261021（2）前台样式补充）

   只追加、不改 portal.css / portal-extra.css / portal-r29*.css / portal-r31*.css，
   删掉 head.html 里指到本文件的那一行 <link> 即可整体回滚。

   覆盖的问题：
     问题5  资讯详情「相关推荐」无封面时的大面积空白 → 用成功案例卡同款渐变占位；
            分类标签固定在左上角常显。
     问题7  资讯卡片 / 列表行整卡整行可点（原来只有「阅读全文」和标题文字可点）。
     问题8  首页「精选成功案例」卡片 hover 无反馈（/cases 页的 hover 只在
            `.case-grid .case` 下生效，首页网格不是那个容器）。
     问题10 招聘页删掉「OPEN POSITIONS」眉标与地点说明后，岗位卡与 tab 保持间距。
     问题11 核心业务服务卡内的标签（.chip）偏大。
   ========================================================================== */

/* ---------- 问题5：相关推荐无封面时的占位色块 ---------- */
/* 有封面时 <img> 绝对定位铺满，这层渐变被完全盖住，因此可以无条件设置，
   与成功案例卡头图 .case__top（portal.css:269-273）用同一套变量与角度。 */
.nd-rel-card__thumb{
  background:linear-gradient(140deg,var(--gold-500),var(--case-bronze) 32%,var(--case-gray) 68%,var(--case-deep));
}

/* 高光压淡：渐变本身已有明暗层次，原来的白色同心圆会让亮金端发灰 */
.nd-rel-card__thumb::after{
  background:radial-gradient(120px 120px at 74% 28%, rgba(255,255,255,.16), transparent 70%);
}

/* 分类标签：不管有没有封面图都固定在缩略图左上角 */
.nd-rel-card__badge{
  position:absolute;
  left:14px;
  top:14px;
  z-index:2;
  max-width:calc(100% - 28px);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:12px;
  font-weight:600;
  line-height:1.6;
  color:var(--navy-900);
  background:rgba(255,255,255,.94);
  border-radius:999px;
  padding:3px 11px;
  box-shadow:0 2px 8px rgba(70,45,15,.18);
}

/* ---------- 问题7：整卡 / 整行可点 ---------- */
/* 卡片本体需要成为定位容器；点击层盖住整张卡（含「阅读全文」按钮，
   两者跳转目标相同，因此不必让按钮再单独吃点击）。 */
.card.card--hit{
  position:relative;
}

.card-hit{
  position:absolute;
  inset:0;
  z-index:5;
  border-radius:inherit;
  /* 无障碍：可聚焦但有焦点环，键盘仍能 Tab 到卡片 */
  text-indent:-9999px;
  overflow:hidden;
}

.card-hit:focus-visible{
  outline:2px solid var(--gold-500);
  outline-offset:-3px;
}

/* 列表行整行是 <a>：清掉链接默认样式，保留 .row 的 grid 布局与 hover 底色 */
.rows a.row{
  color:inherit;
  text-decoration:none;
}

.rows a.row .row__title{
  color:var(--navy-900);
  transition:color .18s var(--ease);
}

.rows a.row:hover .row__title{
  color:var(--gold-600);
}

/* ---------- 问题8：首页精选成功案例 hover 与 /cases 一致 ---------- */
/* /cases 的动效写在 portal-r29c.css 的 `.case-grid .case:hover`，首页网格用的是
   `.grid.grid--3`，选择器不匹配所以完全没有反馈。这里把同样的效果提到 .case 级别，
   容器无关，也不影响 /cases（同值覆盖）。 */
.case{
  transition:transform .26s var(--ease), box-shadow .26s var(--ease), border-color .26s var(--ease);
}

.case:hover{
  transform:translateY(-4px);
  border-color:#E8DCC4;
  box-shadow:0 18px 36px rgba(70,45,15,.14);
}

.case:hover h3{
  color:var(--gold-600);
}

@media (prefers-reduced-motion: reduce){
  .case,
  .case:hover{
    transition:none;
    transform:none;
  }
}

/* ---------- 问题10：招聘岗位区与 tab 的间距 ---------- */
/* 眉标与地点说明（.jobs-intro）已整块删除，岗位网格直接跟在 tab 后面，
   这里补一个上间距，避免卡片贴住 tab 按钮。
   注意：portal-r29c.css:77 有一条同属性规则
   `.jobs-panel[data-panel="positions"] .jobs-grid{margin-top:22px}`（特异性 0,2,1），
   只用 `.jobs-grid`（0,1,0）会被它压掉，所以这里必须用同等特异性的选择器。 */
.jobs-panel[data-panel="positions"] .jobs-grid{
  margin-top:26px;
}

/* ---------- 问题11：核心业务服务卡里的标签缩小 ---------- */
.svc-card .chips{
  margin-top:10px;
  gap:8px;
}

.svc-card .chip{
  gap:6px;
  padding:3px 10px;
  font-size:12px;
  font-weight:400;
  line-height:1.7;
}

.svc-card .chip::before{
  width:5px;
  height:5px;
}
