/* ============================================================
   hero-reflow.css — 页面 Hero 瘦身(1920×600) + 左文右图 50/50 通栏
   引用页：manufacturing / rnd / quality / capabilities / brands（草稿阶段）
   说明：scoped 类名（--slim / rf-5050 / rf-kb），
        不复用 about 页的 tw.css（其 .container 会覆盖 style.css 全局类）。
        2026-09-09：hero-mask 白蒙版规则已移除。
        2026-09-10：rf-5050 移动端改文上图下（消除 Hero 图与 50/50 图拼接）。
   v=20260910
============================================================ */

/* ---------- H. Hero 瘦身 ---------- */
.page-hero--slim{
  height:420px;min-height:420px;padding-block:0;
}
@media(min-width:768px){
  .page-hero--slim{height:600px;min-height:600px}
}
/* 去掉原 .page-hero 的洋红 radial / 点阵装饰：仅保留背景图（2026-09-09 白蒙版/面包屑已移除） */
.page-hero--slim::before,
.page-hero--slim::after{content:none}
.page-hero--slim .zone__bg{
  position:absolute;inset:0;
  background-size:cover;background-position:center;background-repeat:no-repeat;
}

/* ---------- T. 50/50 通栏（桌面 左文右图；移动端 文上图下） ----------
   2026-09-10：移动端由「图上文下」改为「文上图下」。
   原顺序（图→文字）会让移动端出现 Hero 图(420px) 与 50/50 大图(360px+)
   两张全宽图直接拼接、文字被压到很低的位置；文字上移后阅读节奏变为
   Hero → 文字 → 图。桌面端（≥1024px）左文右图布局不变。 */
.rf-5050{position:relative;background:#fff;overflow:hidden}
.rf-5050__grid{display:grid;grid-template-columns:1fr}
.rf-5050__text{
  order:1;display:flex;flex-direction:column;justify-content:center;
  padding:56px 32px;
}
.rf-5050__media{order:2;position:relative;overflow:hidden;min-height:360px}
@media(min-width:1024px){
  .rf-5050__grid{grid-template-columns:1fr 1fr;align-items:stretch;min-height:820px}
  .rf-5050__text{order:1;padding:96px 64px}
  .rf-5050__media{order:2;min-height:0}
}
.rf-5050__img,.rf-kb{
  position:absolute;inset:0;
  background-size:cover;background-position:center;background-repeat:no-repeat;
}
/* 图内侧微弱暗渐变（靠文字一侧），与 about 通栏一致 */
.rf-5050__shade{
  position:absolute;top:0;bottom:0;left:0;width:80px;z-index:1;pointer-events:none;
  background:linear-gradient(to right,rgba(0,0,0,.10),transparent);
}
@media(min-width:1024px){.rf-5050__shade{width:112px}}

/* ---------- 左列文字 ---------- */
.rf-title{
  margin-top:20px;
  font-family:var(--font-display,inherit);font-weight:600;
  font-size:clamp(2rem,3.6vw,3rem);line-height:1.1;letter-spacing:-.03em;
  color:var(--ink,#14161b);
}
.rf-title .accent{color:var(--brand,#dd137b)}
.rf-lede{
  margin-top:24px;font-size:var(--fs-lg,1.125rem);
  color:var(--slate,#5a6072);max-width:640px;line-height:1.8;
}
/* 胶囊指标行（原 page-hero__meta 迁移） */
.rf-meta{display:flex;flex-wrap:wrap;gap:12px;margin-top:40px}
.rf-meta span{
  padding:8px 20px;border-radius:999px;font-size:.875rem;font-weight:500;
  color:var(--brand,#dd137b);
  background:rgba(221,19,123,.07);
  border:1px solid rgba(221,19,123,.22);
}

/* ---------- Ken Burns（进入视区内部缓慢放大，不溢出） ---------- */
.rf-kb{transform:scale(1);will-change:transform}
.rf-kb.is-zoom{animation:rfKb 7s ease-out forwards}
@keyframes rfKb{from{transform:scale(1)}to{transform:scale(1.08)}}
@media(prefers-reduced-motion:reduce){.rf-kb.is-zoom{animation:none}}