/* ==========================================================================
   portal-r30a.css —— bug261020（3）官网前台修复（问题 1 / 5 / 10 / 11 / 12 / 18 / 20）
   加载位置：head.html 里排在 portal.css → portal-extra.css → r29a~r29d 之后，
   所以这里只写「覆盖」，不改 portal.css / portal-extra.css / r29*.css 里已有的规则：
   那三个文件还有别的批次在用，就地改会牵连别的模块（例如 r29d 的合作伙伴 LOGO 画框）。
   ========================================================================== */

/* ---------- 问题1：图片容器露出斜纹底 ----------
   斜纹不是图片自带的，是 portal.css 给 .photo / .photo--map 铺的占位底
   （repeating-linear-gradient），用来表示「这里应该有图」。
   以前图片按原始比例居中，容器又有 aspect-ratio，图片撑不满时四周就露出斜纹，
   看起来像图裂了。这里把底色改成纯白 + 让图片 cover 撑满，
   斜纹只在「真的没有图片、只剩占位文字」时才有意义，所以保留占位态不受影响。
   两个例外必须排除：
     .logo-ph —— 合作伙伴 LOGO 要完整可辨，r29d 已把它设为 contain，这里不能改回 cover；
     .qr      —— 二维码被裁掉边角就扫不出来了，只能 contain。 */
.photo,
.photo--map{background:#fff}
/* 用绝对定位铺满而不是 height:100%：.photo 的高度来自 aspect-ratio，
   绝对定位不依赖百分比高度能否解析，换成别的比例（4x3 / 16x9 / tall）都不会退化成图片原始高度。 */
.photo:not(.logo-ph):not(.qr) > img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
.photo.qr > img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain}

/* ---------- 问题5：后台文案的回车换行在前台丢失 ----------
   后台「文案内容」存的是带 \n 的纯文本，模板用 @{$...} 原样输出，
   而 HTML 默认把连续空白折叠成一个空格，回车就没了。
   只加在确认承载这类后台文案的段落类上（.lead = 各区块的说明段，
   .svc-intro = 板块介绍正文，.photo-caption = 实景图说明，.map-note / .form-note = 提示语，
   .svc-card__sum = 服务项的「一句话简介」，同样由后台填写、同样要按换行展示）；
   不能写全局 p{}：卡片正文、表单提示里模板自带的缩进换行也会被 pre-line 变成空行，排版会散。 */
.lead,
.svc-intro,
.svc-card__sum,
.photo-caption,
.map-note,
.form-note{white-space:pre-line}

/* ---------- 问题10：五步流程卡片 hover 无反馈 ----------
   原来 .step 没有 hover 态，整排卡片看起来是一张静态截图，用户不知道能不能点。
   上浮 + 阴影 + 金色描边 + 底部进度条加深（顺带走一遍亮度动画），
   用 transform 而不是改 margin，避免 hover 时整行高度抖动。 */
.step{transition:transform .28s var(--ease),box-shadow .28s var(--ease),border-color .28s var(--ease)}
.step:hover{transform:translateY(-5px);border-color:var(--gold-400);box-shadow:var(--shadow)}
.step:hover .step__bar{background:var(--gold-100)}
.step:hover .step__bar i{background:linear-gradient(90deg,var(--gold-600),var(--gold-400));animation:r30a-bar .55s var(--ease)}
@keyframes r30a-bar{from{filter:brightness(1.5)}to{filter:brightness(1)}}
@media (prefers-reduced-motion:reduce){
  .step,.step:hover{transition:none;transform:none}
  .step:hover .step__bar i{animation:none}
}

/* ---------- 问题11 / 问题12：案例卡所属行业、标题、封面 ----------
   问题11：所属行业原来只出现在卡片头图左下角的小字（没有封面图时甚至只剩正文里的小标签），
           位置随机；统一收成头图左上角一枚白底胶囊，有封面图时盖在图上也能看清。
   问题12：标题不限行数会把同排卡片撑得高低不齐；封面图靠内联 style 定高，
           图片比例不对时要么留白要么被拉伸，这里统一 cover 填满、裁切而不变形。 */
.case__industry{
  position:absolute;left:14px;top:14px;z-index:2;
  font-size:12px;font-weight:700;letter-spacing:.4px;
  color:var(--navy-800);background:rgba(255,255,255,.94);
  border-radius:6px;padding:4px 10px;box-shadow:0 2px 10px rgba(0,0,0,.14);
}
.case__top--img{background:none;padding:0}
.case__top--img img{display:block;width:100%;height:100%;object-fit:cover}
.case h3{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}

/* ---------- 问题17 / 问题18：核心业务页只显示当前分类 + 服务项网格化 ----------
   问题18：原来 4 个分类各套一个「大白圆角容器」，服务项在容器里整行平铺，
           既页面很长，又让 20 项服务看起来只是 4 段文字。
           这里去掉外层容器（透明、无边框、无阴影、无内边距），
           每个服务项变成独立白卡，网格两列平铺，卡片内部自然就是
           「标题在上、适用对象/交付物在下」的纵向结构。
   问题17：非当前分类的分组用 hidden 隐藏（模板里已按首组渲染可见），
           配合模板里的切换脚本实现「点左侧分类只显示该分类的服务」。
           保留 [hidden] 的 display:none 兜底，防止后续给 .svc-sec 加 display 后失效。 */
.svc-page .svc-sec{background:transparent;border:0;border-radius:0;box-shadow:none;padding:0}
.svc-page .svc-sec + .svc-sec{margin-top:0}
.svc-page .svc-sec[hidden]{display:none}
.svc-page .svc-head{padding-bottom:14px}
.svc-page .svc-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:22px}
.svc-page .svc-card{
  display:flex;flex-direction:column;height:100%;
  background:#fff;border:1px solid var(--line);border-radius:var(--radius-l);
  padding:22px 24px;box-shadow:var(--shadow-s);cursor:default;
}
.svc-page .svc-card:hover{transform:translateY(-3px);border-color:var(--gold-400);box-shadow:var(--shadow)}
.svc-page .svc-card__hd{align-items:flex-start}
.svc-page .svc-card__meta{margin-top:14px}
@media (max-width:1024px){
  .svc-page .svc-cards{grid-template-columns:1fr}
}

/* ---------- 问题20：首页核心业务区右上角「查看全部核心业务」入口 ----------
   首页这个区块是居中的标题组，右侧本来就空着；把入口绝对定位到右上角，
   既能醒目又不打乱居中标题的排版。窄屏时让按钮回到标题下方居中，
   否则会和标题/说明文字重叠（1180px 以下容器内两侧留白不足按钮宽度）。 */
.sec-head-row{position:relative}
.sec-head-row .svc-all{position:absolute;right:0;top:2px}
@media (max-width:1280px){
  .sec-head-row{text-align:center}
  .sec-head-row .svc-all{position:static;display:inline-flex;margin-top:22px}
}