/* ============================================================================
 * bug261021（4）官网前台样式补丁（排在上面所有 portal-*.css 之后）
 * ----------------------------------------------------------------------------
 * 1) 问题2：成功案例卡片封面图溢出撑破容器
 *    根因：`.case__top` 是 `height:132px; display:grid; place-items:center`，
 *    而 `.case__top--img img` 只写了 `width/height:100%`。grid 的自动行高会先按
 *    图片的固有比例撑开容器（132px 定高对 grid 而言只是 min-height 语义的约束），
 *    图片因此比圆角容器高，`.case` 的 overflow:hidden 又把圆角裁在文字区上，
 *    视觉上就是「封面盖住了标题、撑破卡片边界」。
 *    改法：把封面块变成定位容器 + 图片绝对定位铺满 + object-fit:cover，
 *    尺寸完全由容器决定，既不溢出也不变形（等比裁剪）。
 * ========================================================================== */
.case__top.case__top--img {
  overflow: hidden;
  /* grid 在 has-img 分支不再需要，避免自动行高被图片固有尺寸撑开 */
  display: block;
}

.case__top.case__top--img img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* ============================================================================
 * 2) 问题6：简历/留资表单改为「字段级」校验提示
 *    原来校验失败只把一句话写进表单底部的 `.form-msg`（绝对定位、压住按钮），
 *    客户反馈「很容易看不到」。现在错误直接挂在对应字段下方，并把输入框描红。
 *    文案与描红状态由 portal-r32d.js（简历表单）与 portal.js（留资表单）加上。
 * ========================================================================== */
.field > .field-err {
  display: block;
  margin: 6px 0 0;
  font-size: 12.5px;
  line-height: 1.5;
  color: #D93026;
}

.field > .field-err[hidden] {
  display: none;
}

.field.is-invalid > input,
.field.is-invalid > select,
.field.is-invalid > textarea,
.field.is-invalid .upload__box {
  border-color: #D93026 !important;
  box-shadow: 0 0 0 2px rgba(217, 48, 38, 0.12);
}

.field.is-invalid > label {
  color: #D93026;
}
