/* ==========================================================================
   标题节奏统一 · 2026-10-30
   --------------------------------------------------------------------------
   问题：同一个站点里，同级标题的可用宽度出现了四套值
         .sec-head 960 / 940 / 1050，.pf-heading 850，页头 h1 760 / 900，
         产品页首屏文字栏 503 / 599。
         结果是同长度的标题，有的站点一行放下，有的被逼折两行，
         断点还常落在词中间（如「…而是 / 能源运营的统一平台」）。

   原则（本文件只做这一件事，不改字色、不改区块结构）：
     1. 同级标题用同一个 measure —— 区块标题一律用内容区满宽，
        页头主标题不再人为限宽，产品页首屏文字栏五页统一。
     2. 摘要段落不跟着标题拉通，保留易读行宽。
     3. 需要两行时由文案语义决定断点（显式分段），不靠容器宽度碰运气。
     4. 兜底：确实要折行的标题用 balance 均分两行，避免孤字。

   加载顺序：本文件必须在全站最后一个加载（插在 </head> 前）。
   ========================================================================== */

/* ── 1. 区块标题：容器统一为内容区满宽 ───────────────────────────────────── */
/* 这三条原本各自限宽，导致同长度标题在不同页面折行结果不同。
   两个容器都是左对齐、无 auto 外边距，去掉限宽不会造成整体左移。 */
body.v5-site .sec-head,
body.v5-site .cap-technology .sec-head,
body.v5-site.wf-product-family .pf-heading{max-width:none}

/* ── 2. 摘要段落：保持易读行宽，不跟着标题一起拉通 ───────────────────────── */
/* 段落：原先各页 720 / 820 / 860 / 980 四种行宽（首页 980 最宽、读起来最长），
   统一到 800 —— 16px 字号下约 50 字/行，是全站出现最多的值。
   产品页段落原先靠 .pf-heading 的 850 兜底，一并归到同一个 800。 */
/* 用 !important 是因为首页与核心技术页把 .sec-desc 写在了 .sec-head 之外
   （.home-* / .cap-technology 各自带更深的限定），逐页覆盖不下去。 */
body.v5-site .sec-desc{max-width:800px!important}
body.v5-site.wf-product-family .pf-heading>p{max-width:800px}

/* ── 3. 页头主标题：去掉 760px 的人为限宽 ────────────────────────────────── */
/* 原来 solutions 一页额外放开到 900px（其余 760px），已经统一回同一个规则；
   该页标题里人为插入的 <br> 也一并去掉，交给浏览器按容器宽度自然落行。 */
body.v5-site .wf-unified-pagehead .pagehead-inner h1{max-width:none!important}

/* ── 4. 产品页首屏：五页统一字号、两行结构与栅格比例 ─────────────────────── */
/* 字号：FinMe 曾单独用 clamp(…,48px)、其余用 46px，统一取 46px。 */
body.v5-site .wf-pf-hero .pf-hero-copy h1,
body.v5-site .wf-product-family .fm-hero h1{
  font-size:clamp(26px,3.2vw,46px)!important;
  line-height:1.24!important;
  white-space:normal!important;
  margin:0 0 20px!important;
}
/* 五个产品页的 h1 一律「系统名 / 说明语」两行，断点写在 HTML 的 <span> 里 */
body.v5-site .wf-pf-hero .pf-hero-copy h1 span,
body.v5-site .fm-hero h1 span{display:block}

/* 栅格：FinMe 已调成 .76fr:1fr（文字窄、图大），其余四页仍是 1.30fr:1fr，
   同一套模板出现两种比例。统一到 .76fr:1fr，五页图宽一致。 */
body.v5-site .wf-pf-hero .wrap,
body.v5-site .fm-hero .wrap{
  grid-template-columns:minmax(0,.76fr) minmax(0,1fr)!important;
  gap:52px!important;
}
/* 手机端：hero 必须单列堆叠（图/文各占全宽），否则上面的 !important 两列
   会把文字挤成 99px 窄条、图缩到 184px。 */
@media(max-width:767px){
  body.v5-site .wf-pf-hero .wrap,
  body.v5-site .fm-hero .wrap{
    grid-template-columns:minmax(0,1fr)!important;
    gap:26px!important;
  }
}

/* ── 5. 兜底：仍要折行的标题均分两行 ─────────────────────────────────────── */
body.v5-site h1,
body.v5-site h2{text-wrap:balance}

/* 窄屏：显式分段的标题在小屏合成一段，避免两行过短 */
@media(max-width:640px){
  body.v5-site .wf-pf-hero .pf-hero-copy h1 span,
  body.v5-site .fm-hero h1 span{display:inline}
}

/* ── 6. 产品页两列区块：标题提到通栏 ──────────────────────────────────────
   .pf-split 是 .5fr:.5fr 两列（实际各 590px），标题嵌在半栏里必然折行。
   把 .pf-heading 提到 .pf-split 直接子级并跨两列，标题可用宽度 590 → 1180。 */
body.v5-site.wf-product-family .pf-split>.pf-heading{
  grid-column:1/-1;
  align-self:start;
  max-width:none;
  margin-bottom:0;
}
body.v5-site.wf-product-family .pf-split>.pf-heading p{
  max-width:820px;
}

/* reverse 区块左栏往往只有一条备注，居中会留下大片空白，改为顶端对齐 */
body.v5-site.wf-product-family .pf-split.reverse>div{
  align-self:start;
}
