/* ============================================================
   品牌站（喜莱收 / 融教通 / 行知澜）：/brand/<brand>
   页头/公告/页脚复用官网组件（common.css / home.css），本文件只放品牌站自己的：
   ① 单图 banner（拆层：背景+设备+手写体出图，文字真 DOM）  ② 正文区块
   ============================================================ */

/* ---------- 首屏 banner ----------
   设计：Pixso 画板「喜莱收收银系统」模块 0:1990，y 0→632；
   该模块把站点页头（72）也画在里面，所以 banner 盒高 = 632 − 72 = 560，
   页头固定吸顶压在 banner 上，视觉总高仍是 632。

   定位：背景与文字必须落在**同一个 1920 定宽居中舞台**内，舞台用首页轮播同款手法
   （left:50% + translateX(-50%)），视口窄于 1920 时两者一起被裁边，不会相对漂移。 */
.hx-bbanner {
  --bbanner-h: 560px;
  position: relative;
  width: 100%;
  min-height: var(--bbanner-h);
  overflow: hidden;
  background: #1d5fd6; /* 图未加载时的兜底底色 */
}

.hx-bbanner__stage {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 1920px;
  min-height: var(--bbanner-h);
}

/* 装饰层：背景图（含设备组合、波浪、手写体 slogan）。只裁边不缩小 */
.hx-bbanner__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
}

/* 文案层：设计里文字列从舞台 x=277 起（不是 1200 内容列的 360），所以按舞台左内距排 */
.hx-bbanner__content {
  position: relative;
  width: 100%;
  box-sizing: border-box;
  padding: 123px 0 0 277px;
  color: #fff;
  /* 设计稿正文/标题都是 Alibaba PuHuiTi 3.0（项目已按 unicode-range 切好子集） */
  font-family: 'AlibabaPuHuiTi-3', Inter, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

/* eyebrow：设计 t=195（含页头 72）→ 123；字号 34 / 行高 49 */
.hx-bbanner__eyebrow {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 400;
  color: #fff;
}

/* 主标题：设计 t=274 → 202，坚排 30 间距；设计里标题是矢量字：
   字高 66、8 个字总宽 641.5 —— 比 PuHuiTi 原生比例更宽，所以按字高定 70 号、7px 字距补总宽 */
.hx-bbanner__title {
  margin: 0;
  padding-top: 30px;
  font-size: 70px;
  line-height: 75px;
  font-weight: 700;
  letter-spacing: 7px;
  color: #fff;
}

/* 副标：设计 t=370 → 298；字号 32 / 行高 46 */
.hx-bbanner__sub {
  margin: 0;
  padding-top: 21px;
  font-size: 32px;
  line-height: 46px;
  font-weight: 400;
  color: #fff;
}

/* chips 行：设计 t=450 → 378；圆 40、图标 24、文字 19px #C8D7FF、块间距 14.5 */
.hx-bbanner__chips {
  display: flex;
  align-items: center;
  gap: 14.5px;
  margin: 0;
  padding: 34px 0 0;
  list-style: none;
}

.hx-bbanner__chip {
  display: flex;
  align-items: center;
  gap: 8px;
}

.hx-bbanner__chip-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #649cfc;
}

.hx-bbanner__chip-icon {
  display: block;
  width: 24px;
  height: 24px;
}

.hx-bbanner__chip-text {
  font-size: 19px;
  line-height: 27px;
  font-weight: 400;
  color: #c8d7ff;
  white-space: nowrap;
}

/* ---------- 页头 logo · 横版变体（融教通）----------
   官网页头的 logo 位是 26×26 方标 + 文字；融教通的稿是 89×34 横版（图上自带「融教通」和 slogan），
   塞进方标位会被 object-fit:cover 裁成只剩左下角一角，所以走 header 的 logoClass 钩子覆盖尺寸。
   只影响传了该类的页面，官网/喜莱收仍是 26×26。 */
.fx-nav__logo-img--wide {
  width: 89px;
  height: 34px;
  object-fit: contain;
}

/* ---------- 首屏 banner · 融教通变体（hx-bbanner--edu）----------
   画板「融教通」0:7244 模块 0:7245：同样是 632 含 72 页头 → 盒高 560。
   和喜莱收的差别不是配色微调，是整套度量都不同（喜莱收深底白字 70/32，融教通浅底深蓝 47/26），
   所以走 variant 而不是把基类改成变量：
     eyebrow  矢量路径出图 211×68，落位 y144（设计 216 − 72）
     h1       y232（= 144 + 68 + 20），47/69，色 #122F8F
     副标     y313（= 232 + 69 + 12），26/40，色 #122F8F
     chips    y387（= 313 + 40 + 34），圆 40 #3C66F1、图标 24、字 19 #1941C5、圆心间距 139 */
.hx-bbanner--edu {
  background: #eaf3ff;
}

.hx-bbanner--edu .hx-bbanner__content {
  padding: 144px 0 0 277px;
  color: #122f8f;
}

/* 眉头字「融教通」：稿里这 3 个字是矢量路径，按字面还原成文本。
   尺寸反推：稿里墨迹 210×66；PuHuiTi 700 下 70px 只到 198×63，按比例取 74px（≈209×66）。
   行高 68 与稿一致，色同 h1。 */
.hx-bbanner--edu .hx-bbanner__eyebrow {
  margin: 0;
  font-size: 74px;
  line-height: 68px;
  font-weight: 700;
  color: #122f8f;
}

.hx-bbanner--edu .hx-bbanner__title {
  padding-top: 20px;
  font-size: 47px;
  line-height: 69px;
  font-weight: 400;
  letter-spacing: 0;
  color: #122f8f;
}

.hx-bbanner--edu .hx-bbanner__sub {
  padding-top: 12px;
  font-size: 26px;
  line-height: 40px;
  font-weight: 400;
  color: #122f8f;
}

.hx-bbanner--edu .hx-bbanner__chips {
  gap: 16px;
  padding-top: 34px;
}

.hx-bbanner--edu .hx-bbanner__chip {
  gap: 8px;
}

.hx-bbanner--edu .hx-bbanner__chip-badge {
  background: #3c66f1;
}

.hx-bbanner--edu .hx-bbanner__chip-text {
  font-size: 19px;
  line-height: 27px;
  color: #1941c5;
}

/* ============================================================
   融教通正文四块（画板 0:7244，模块边界按设计坐标，页面 = 设计 − 72）
   模块1 家校共育 设计 696→1208（页面 624→1136，段高 512）
   模块2 产品概述 设计 1208→1833（页面 1136→1761，段高 625）
   模块3 核心功能 设计 1833→2647（页面 1761→2575，段高 814）
   模块4 智慧校徽 设计 2647→3379（页面 2575→3307，段高 732）
   section 一律 overflow:hidden（定宽 1920 舞台，1920 屏减滚动条后会出横滚）
   ============================================================ */

/* ---------- 模块1 家校共育（0:7247）----------
   段内上留 32 → 1200×448 卡；卡内 29 起标题（34/49）、86 副标（16/24）、126 蓝条（377×4）、190 六条。 */
.hx-edu-promise {
  width: 100%;
  min-height: 512px;
  background: #f9fcff;
  overflow: hidden;
}

.hx-edu-promise__stage {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 1920px;
  min-height: 512px;
}

.hx-edu-promise__content {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  padding-top: 32px;
}

.hx-edu-promise__card {
  min-height: 448px;
  border-radius: 40px;
  background: #eff6ff;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.16);
}

.hx-edu-promise__title {
  margin: 0;
  padding-top: 29px;
  font-size: 34px;
  line-height: 49px;
  font-weight: 400;
  color: #333;
  text-align: center;
}

.hx-edu-promise__sub {
  margin: 0;
  padding-top: 8px;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #2065f2;
  text-align: center;
}

/* 蓝条：稿里是 4px 圆头描边的直线（0:7316，377 宽 #2D72FF） */
.hx-edu-promise__rule {
  display: block;
  width: 377px;
  height: 4px;
  margin: 16px auto 0;
  border-radius: 2px;
  background: #2d72ff;
}

/* 六等分：稿里六个圆心等距 196（不是 200），左右各 12 内距算出来 110/306/…/1090，与稿差 ≤2 */
.hx-edu-promise__list {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  margin: 0;
  padding: 60px 12px 0;
  list-style: none;
}

.hx-edu-promise__item {
  position: relative;
  min-height: 194px;
  text-align: center;
}

/* 条间 1px×180 竖线（#0374FF 20%，稿 0:7323~0:7327 是 rot=-90 的直线） */
.hx-edu-promise__item + .hx-edu-promise__item::before {
  content: '';
  position: absolute;
  left: 0;
  top: 6px;
  width: 1px;
  height: 180px;
  background: rgba(3, 116, 255, 0.2);
}

/* 渐变圆（六个色各不相同，导出 PNG 不用 CSS 近似） */
.hx-edu-promise__badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  height: 80px;
  margin: 0 auto;
  background-repeat: no-repeat;
  background-size: 80px 80px;
}

.hx-edu-promise__icon {
  display: block;
}

.hx-edu-promise__name {
  margin: 22px 0 0;
  font-size: 20px;
  line-height: 29px;
  font-weight: 400;
  color: #333;
}

.hx-edu-promise__desc {
  margin: 15px 0 0;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #8b8a8a;
}

/* ---------- 模块2 产品概述（0:7250）----------
   段高 625，上留 29；标题 0→49，蓝条 59→63，正文行 119 起，四卡 336/460，插图 (533,123)。 */
.hx-edu-overview {
  width: 100%;
  min-height: 625px;
  background: linear-gradient(180deg, #f9fcff 0%, #eff6ff 100%);
  overflow: hidden;
}

.hx-edu-overview__stage {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 1920px;
  min-height: 625px;
}

.hx-edu-overview__content {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  padding-top: 29px;
}

.hx-edu-overview__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 400;
  color: #333;
  text-align: center;
}

.hx-edu-overview__rule {
  display: block;
  width: 190px;
  height: 4px;
  margin: 10px auto 0;
  border-radius: 2px;
  background: #2d72ff;
}

.hx-edu-overview__body {
  display: flex;
  margin-top: 56px;
}

.hx-edu-overview__left {
  width: 504px;
  flex: none;
}

.hx-edu-overview__lead {
  margin: 0;
  font-size: 24px;
  line-height: 37px;
  font-weight: 400;
  color: #555;
}

/* 四张小卡：230×100、列距/行距 24、白→#F2F6FF 渐变、r14、阴影 0 3 6 */
.hx-edu-overview__grid {
  display: grid;
  grid-template-columns: repeat(2, 230px);
  gap: 24px;
  margin: 32px 0 0;
  padding: 0;
  list-style: none;
}

.hx-edu-overview__card {
  display: flex;
  align-items: center;
  min-height: 100px;
  padding-left: 24px;
  gap: 16px;
  border-radius: 14px;
  background: linear-gradient(180deg, #fff 0%, #f2f6ff 100%);
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
}

/* 56 实心圆（#4280FF）+ 24 图标，图标在圆内居中 */
.hx-edu-overview__dot {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  flex: none;
  border-radius: 50%;
  background: #4280ff;
}

.hx-edu-overview__dot-icon {
  display: block;
}

.hx-edu-overview__card-name {
  margin: 0;
  font-size: 25px;
  line-height: 36px;
  font-weight: 400;
  color: #333;
}

/* 插图右缘超出内容列 45（稿 533+712=1245 vs 1200），负右边距放出去，不缩图 */
.hx-edu-overview__right {
  flex: none;
  margin: 4px -45px 0 29px;
}

.hx-edu-overview__illu {
  display: block;
  width: 712px;
  height: 441px;
}

/* ---------- 模块3 核心功能（0:7258~0:7263）----------
   段高 814，上留 29；标题 29→78、副标 86、蓝条 126、六卡 190 起（370×284，列距 45、行距 24）。 */
.hx-edu-feature {
  width: 100%;
  min-height: 814px;
  background: #f9fcff;
  overflow: hidden;
}

.hx-edu-feature__stage {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 1920px;
  min-height: 814px;
}

.hx-edu-feature__content {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  padding-top: 29px;
}

.hx-edu-feature__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 400;
  color: #333;
  text-align: center;
}

.hx-edu-feature__sub {
  margin: 0;
  padding-top: 8px;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #555;
  text-align: center;
}

.hx-edu-feature__rule {
  display: block;
  width: 346px;
  height: 4px;
  margin: 16px auto 0;
  border-radius: 2px;
  background: #2d72ff;
}

.hx-edu-feature__list {
  display: grid;
  grid-template-columns: repeat(3, 370px);
  column-gap: 45px;
  row-gap: 24px;
  margin: 60px 0 0;
  padding: 0;
  list-style: none;
}

/* 卡：左 202 文案栏 + 右 168 截图栏（截图左缘有向卡底色的渐变蒙版） */
.hx-edu-feature__card {
  display: flex;
  min-height: 284px;
  overflow: hidden;
  border-radius: 14px;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.16);
}

.hx-edu-feature__card--blue {
  background: #eff6ff;
}

.hx-edu-feature__card--teal {
  background: #e8fffc;
}

.hx-edu-feature__card--purple {
  background: #f5f5ff;
}

.hx-edu-feature__main {
  width: 202px;
  flex: none;
  padding-top: 48px;
  text-align: center;
}

.hx-edu-feature__badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  margin: 0 auto;
  border-radius: 14px;
}

.hx-edu-feature__card--blue .hx-edu-feature__badge {
  background: #4280ff;
}

.hx-edu-feature__card--teal .hx-edu-feature__badge {
  background: #22c1ab;
}

.hx-edu-feature__card--purple .hx-edu-feature__badge {
  background: #7b77e8;
}

.hx-edu-feature__name {
  margin: 21px 0 0;
  font-size: 22px;
  line-height: 32px;
  font-weight: 400;
  color: #333;
}

.hx-edu-feature__desc {
  margin: 23px 0 0;
  font-size: 17px;
  line-height: 26px;
  font-weight: 400;
  color: #333;
}

.hx-edu-feature__shot {
  position: relative;
  width: 168px;
  flex: none;
}

/* 蒙版：稿 0:7392，175 宽、从透明渐变到卡底色，压在截图左缘（比截图多出 7px） */
.hx-edu-feature__shot::before {
  content: '';
  position: absolute;
  left: -7px;
  top: 0;
  width: 175px;
  height: 100%;
}

.hx-edu-feature__card--blue .hx-edu-feature__shot::before {
  background: linear-gradient(90deg, rgba(239, 246, 255, 0) 0%, #eff6ff 100%);
}

.hx-edu-feature__card--teal .hx-edu-feature__shot::before {
  background: linear-gradient(90deg, rgba(232, 255, 252, 0) 0%, #e8fffc 100%);
}

.hx-edu-feature__card--purple .hx-edu-feature__shot::before {
  background: linear-gradient(90deg, rgba(245, 245, 255, 0) 0%, #f5f5ff 100%);
}

.hx-edu-feature__shot-img {
  display: block;
  width: 168px;
  height: 284px;
}

/* ---------- 模块4 智慧校徽（0:7264）----------
   段高 732，卡 1200×668（上下各 32）；左栏文案 + 右 542×604 面板（面板内 4 行白色小条）。 */
.hx-edu-campus {
  width: 100%;
  min-height: 732px;
  background: linear-gradient(180deg, #f9fcff 0%, #e9f3ff 100%);
  overflow: hidden;
}

.hx-edu-campus__stage {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 1920px;
  min-height: 732px;
}

.hx-edu-campus__content {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  padding-top: 32px;
}

.hx-edu-campus__card {
  display: flex;
  min-height: 668px;
  border-radius: 40px;
  background: linear-gradient(180deg, #f6fbff 0%, #dbebff 100%);
  box-shadow: 0 0 20px rgba(63, 102, 183, 0.25);
}

.hx-edu-campus__left {
  flex: 1 1 auto;
  min-width: 0;
  padding: 56px 0 0 48px;
}

.hx-edu-campus__en {
  margin: 0;
  font-size: 26px;
  line-height: 37px;
  font-weight: 400;
  color: #4280ff;
}

.hx-edu-campus__title {
  margin: 21px 0 0;
  font-size: 53px;
  line-height: 76px;
  font-weight: 400;
  color: #122f8f;
}

.hx-edu-campus__slogan {
  margin: 9px 0 0;
  font-size: 27px;
  line-height: 40px;
  font-weight: 400;
  color: #2c53d5;
}

.hx-edu-campus__desc {
  margin: 76px 0 0;
  font-size: 28px;
  line-height: 43px;
  font-weight: 400;
  color: #333;
}

/* 底部淡蓝条（#2C53D5 20%，470 宽，左内距 52） */
.hx-edu-campus__rule {
  display: block;
  width: 470px;
  height: 4px;
  margin: 58px 0 0 52px;
  border-radius: 2px;
  background: rgba(44, 83, 213, 0.2);
}

/* 三个渐小圆点，与蓝条同一水平线（稿里三个圆心同在 y630） */
.hx-edu-campus__dots {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: -12px;
}

.hx-edu-campus__dot {
  display: block;
  border-radius: 50%;
  background: #2c53d5;
}

.hx-edu-campus__dot--1 {
  width: 16px;
  height: 16px;
}

.hx-edu-campus__dot--2 {
  width: 12px;
  height: 12px;
}

.hx-edu-campus__dot--3 {
  width: 8px;
  height: 8px;
}

/* 右面板：542×604、r20、#F5FAFF→#FFF 渐变、阴影 0 10 15 */
.hx-edu-campus__panel {
  flex: none;
  align-self: flex-start; /* 不写会被 flex stretch 拉到 626，贴住卡底；稿里面板 604、底下留 22 */
  box-sizing: border-box; /* 项目里没有全局 border-box，加了 padding 会把 542 撑成 606 */
  width: 542px;
  min-height: 604px;
  margin: 42px 40px 0 0;
  padding: 30px 32px 24px;
  border-radius: 20px;
  background: linear-gradient(180deg, #f5faff 0%, #fff 100%);
  box-shadow: 0 10px 15px rgba(177, 213, 255, 0.5);
}

.hx-edu-campus__panel-title {
  margin: 0;
  font-size: 25px;
  line-height: 36px;
  font-weight: 400;
  color: #333;
  text-align: center;
}

.hx-edu-campus__rows {
  display: grid;
  row-gap: 16px;
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
}

/* 行：478×112 白底 r12 + 1px #EAF1F9 描边（稿 0:7444 的 stroke；阴影 visible=false 不加） */
.hx-edu-campus__row {
  display: flex;
  align-items: center;
  box-sizing: border-box;
  min-height: 112px;
  padding-left: 40px;
  gap: 32px;
  border: 1px solid #eaf1f9;
  border-radius: 12px;
  background: #fff;
}

.hx-edu-campus__badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  flex: none;
  border-radius: 10px;
}

.hx-edu-campus__badge--amber {
  background: #ffebc7;
}

.hx-edu-campus__badge--blue {
  background: #dbeafe;
}

.hx-edu-campus__badge--green {
  background: #ccf0de;
}

.hx-edu-campus__badge--violet {
  background: #f3dcff;
}

.hx-edu-campus__row-name {
  margin: 0;
  font-size: 19px;
  line-height: 27px;
  font-weight: 400;
  color: #1f2937;
}

.hx-edu-campus__row-desc {
  margin: 8px 0 0;
  font-size: 15px;
  line-height: 22px;
  font-weight: 400;
  color: #1f2937;
}

/* ---------- 模块5 产品优势（设计 3379→3809，段高 430）----------
   0:7252 蓝带 1920×302 从段顶铺下来（页面 3307→3609），带下回到 #F9FCFF；
   内距同模块1：29 标题 / 86 副标 / 126 蓝条（362×4）/ 190 四卡（284×240，步进 305）。 */
.hx-edu-adv {
  width: 100%;
  /* 430 是稿里段高（四卡底边=段底），但卡阴影 0 3 6 要往下溢 9px，
     段底压着下块就会被整片盖掉 —— 留 14 底部余量让阴影画得出来 */
  min-height: 444px;
  background: #f9fcff;
  overflow: hidden;
}

.hx-edu-adv__stage {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 1920px;
  min-height: 444px;
}

/* 装饰：整幅蓝带（定宽 1920，跟着舞台居中，只裁边不缩放） */
.hx-edu-adv__band {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 302px;
  background: #d5e4fc;
}

.hx-edu-adv__content {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  padding: 29px 0 14px;
}

.hx-edu-adv__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 400;
  color: #333;
  text-align: center;
}

.hx-edu-adv__sub {
  margin: 0;
  padding-top: 8px;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #555;
  text-align: center;
}

.hx-edu-adv__rule {
  display: block;
  width: 362px;
  height: 4px;
  margin: 16px auto 0;
  border-radius: 2px;
  background: #2d72ff;
}

.hx-edu-adv__list {
  display: grid;
  grid-template-columns: repeat(4, 284px);
  column-gap: 21px;
  margin: 60px 0 0;
  padding: 0;
  list-style: none;
}

.hx-edu-adv__card {
  box-sizing: border-box; /* 无全局 border-box：不加则 min-height 240 + padding 32 变 272 */
  min-height: 240px;
  padding-top: 32px;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
  text-align: center;
}

/* 68 渐变圆（四色各不相同，导出 PNG）+ 居中图标 */
.hx-edu-adv__badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 68px;
  height: 68px;
  margin: 0 auto;
  background-repeat: no-repeat;
  background-size: 68px 68px;
}

.hx-edu-adv__icon {
  display: block;
}

.hx-edu-adv__name {
  margin: 18px 0 0;
  font-size: 20px;
  line-height: 29px;
  font-weight: 400;
  color: #1a1a2e;
}

.hx-edu-adv__desc {
  margin: 15px 0 0;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #888;
}

/* ---------- 模块6 多端协同管控（设计 3809→4575，段高 766）----------
   标题 61 / 副标 118 / 蓝条 158（348×4）/ 架构图 194（1220.5×539.5，左对齐、右溢 20.5）。 */
.hx-edu-coop {
  width: 100%;
  min-height: 766px;
  background: #f9fcff;
  overflow: hidden;
}

.hx-edu-coop__stage {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 1920px;
  min-height: 766px;
}

.hx-edu-coop__content {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  padding-top: 61px;
}

.hx-edu-coop__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 400;
  color: #333;
  text-align: center;
}

.hx-edu-coop__sub {
  margin: 0;
  padding-top: 8px;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #555;
  text-align: center;
}

.hx-edu-coop__rule {
  display: block;
  width: 348px;
  height: 4px;
  margin: 16px auto 0;
  border-radius: 2px;
  background: #2d72ff;
}

.hx-edu-coop__diagram {
  display: block;
  width: 1221px;
  height: 540px;
  margin-top: 32px;
}

/* ---------- 模块7 更多功能（设计 4575→5079，段高 504）----------
   整段 #E9F1FC 底；内距同前：29 标题 / 86 副标 / 126 蓝条（300×4）/ 190 四卡（284×218）。 */
.hx-edu-more {
  width: 100%;
  min-height: 504px;
  background: #e9f1fc;
  overflow: hidden;
}

.hx-edu-more__stage {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 1920px;
  min-height: 504px;
}

.hx-edu-more__content {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  padding-top: 29px;
}

.hx-edu-more__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 400;
  color: #333;
  text-align: center;
}

.hx-edu-more__sub {
  margin: 0;
  padding-top: 8px;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #555;
  text-align: center;
}

.hx-edu-more__rule {
  display: block;
  width: 300px;
  height: 4px;
  margin: 16px auto 0;
  border-radius: 2px;
  background: #2d72ff;
}

.hx-edu-more__list {
  display: grid;
  grid-template-columns: repeat(4, 284px);
  column-gap: 21px;
  margin: 60px 0 0;
  padding: 0;
  list-style: none;
}

.hx-edu-more__card {
  box-sizing: border-box;
  min-height: 218px;
  padding-top: 32px;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
  text-align: center;
}

.hx-edu-more__badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 68px;
  height: 68px;
  margin: 0 auto;
  border-radius: 50%;
  background: #cee9fe;
}

.hx-edu-more__icon {
  display: block;
}

.hx-edu-more__name {
  margin: 18px 0 0;
  font-size: 20px;
  line-height: 29px;
  font-weight: 400;
  color: #1a1a2e;
}

.hx-edu-more__desc {
  margin: 15px 0 0;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #888;
}

/* ---------- 正文区块（随 Pixso 稿逐块追加） ---------- */
.hx-bplaceholder {
  width: 100%;
  min-height: 420px;
  background: #f7faff;
}

.hx-bplaceholder__content {
  width: 1200px;
  margin: 0 auto;
  padding: 96px 0;
  text-align: center;
}

.hx-bplaceholder__title {
  margin: 0;
  font-size: 24px;
  line-height: 34px;
  font-weight: 500;
  color: #1a2332;
}

.hx-bplaceholder__desc {
  margin: 12px 0 0;
  font-size: 16px;
  line-height: 26px;
  color: #6b7a90;
}

/* ============================================================
   模块1 多行业适配（设计 0:1981 底带 696→1182，486 高）
   底带 #EBF3FF 全宽；内容列 1200；三卡 390×232、gap 15、圆角 10。
   卡面 = 照片 + 45° 蓝渐变叠加（设计 0:2210： #3082FF → #4B78F5CC → #005DFF1A）。
   ============================================================ */
.hx-bsector {
  /* overflow:hidden 必须加：舞台是定宽 1920，视口窄于 1920（含竖向滚动条占宽的 1920 屏）
     时舞台会横向溢出，整页就出现水平滚动条 */
  overflow: hidden;
  width: 100%;
  min-height: 486px;
  background: #ebf3ff;
}

.hx-bsector__stage {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 1920px;
  min-height: 486px;
}

.hx-bsector__content {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  padding: 61px 0 32px;          /* 标题 t=757→61（相对底带），底部留 32 */
  box-sizing: border-box;
  font-family: 'AlibabaPuHuiTi-3', Inter, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

.hx-bsector__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 400;
  color: #333;
  text-align: center;
}

.hx-bsector__sub {
  margin: 8px 0 0;               /* 814 − (757+49) */
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #555;
  text-align: center;
}

.hx-bsector__rule {
  display: block;
  width: 362px;
  height: 5px;
  margin: 16px auto 0;           /* 854 − (814+24) */
  border-radius: 2.5px;
  background: #2d72ff;
}

.hx-bsector__list {
  display: grid;
  grid-template-columns: repeat(3, 390px);
  gap: 15px;
  margin: 59px 0 0;              /* 918 − (854+5)，即蓝条下沿到卡片 */
  padding: 0;
  list-style: none;
}

/* 卡：照片 + 渐变叠加；内容全 DOM */
.hx-bsector__card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-height: 232px;
  padding: 38px 24px 24px;
  box-sizing: border-box;
  border-radius: 10px;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  color: #fff;
}

.hx-bsector__card--fnb {
  background-image: linear-gradient(69deg, #3082ff 0%, rgba(75, 120, 245, 0.8) 60%, rgba(0, 93, 255, 0.1) 100%), url('/images/brand/cashier/sector-fnb.webp');
}

.hx-bsector__card--hotel {
  background-image: linear-gradient(69deg, #3082ff 0%, rgba(75, 120, 245, 0.8) 60%, rgba(0, 93, 255, 0.1) 100%), url('/images/brand/cashier/sector-hotel.webp');
}

.hx-bsector__card--beauty {
  background-image: linear-gradient(69deg, #3082ff 0%, rgba(75, 120, 245, 0.8) 60%, rgba(0, 93, 255, 0.1) 100%), url('/images/brand/cashier/sector-beauty.webp');
}

.hx-bsector__head {
  display: flex;
  align-items: flex-start;
  gap: 8px;                      /* 图标圆 right 88 → 文字 left 96 */
}

.hx-bsector__badge {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 64px;
  height: 64px;
  margin-top: 2px;               /* 圆 t=40 vs 文字 t=38 */
  border-radius: 50%;
  background: #fff;
}

.hx-bsector__badge-icon {
  display: block;
  width: 38px;
  height: 38px;
}

.hx-bsector__intro {
  min-width: 0;
}

.hx-bsector__name {
  margin: 0;
  font-size: 28px;
  line-height: 40px;
  font-weight: 400;
  color: #fff;
}

.hx-bsector__desc {
  margin: 3px 0 0;               /* 81 − (38+40) */
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  color: #fff;
}

.hx-bsector__tags {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 22px 0 0;              /* 123 − (38+63) */
  padding: 0;
  list-style: none;
}

.hx-bsector__tag {
  display: flex;
  align-items: center;
  gap: 4px;                      /* 圆 16 → 文字 left 44（24+16+4） */
  font-size: 11px;
  line-height: 16px;
  font-weight: 400;
  color: #d5e3ff;
  white-space: nowrap;
}

.hx-bsector__dot {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 16px;
  height: 16px;
  box-sizing: border-box;
  border: 1.5px solid rgba(255, 255, 255, 0.75);
  border-radius: 50%;
}

.hx-bsector__check {
  display: block;
  width: 10px;
  height: 7px;
}

.hx-bsector__btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 184px;
  min-height: 36px;
  margin-top: 17px;              /* 156 − (123+16) */
  padding: 0 0 0 24px;
  box-sizing: border-box;
  border: 1px solid rgba(255, 255, 255, 0.85);
  border-radius: 18px;
  text-decoration: none;
  transition: background-color 0.25s ease;
}

.hx-bsector__btn:hover {
  background: rgba(255, 255, 255, 0.16);
}

.hx-bsector__btn-text {
  font-size: 13px;
  line-height: 18px;
  font-weight: 400;
  color: #fff;
  white-space: nowrap;
}

.hx-bsector__btn-arrow {
  display: block;
  width: 20px;
  height: 12px;
  margin-right: 2px;
}

/* ============================================================
   模块2 产品概述（设计 0:1983 overview，组 1211→1823.44）
   底：0:1980 的 #F6FAFE→#FFFBFB 竖渐变；内容列 1200，左栏 584 ＋ 右栏 616。
   ============================================================ */
.hx-boverview {
  overflow: hidden;
  width: 100%;
  min-height: 642px;
  /* 0:1980 的渐变在 1647 结束（相对本模块 465px），之后是 0:1978 的 #F8F9FD 平色 */
  background: linear-gradient(180deg, #f6fafe 0, #fffbfb 465px, #f8f9fd 466px);
}

.hx-boverview__stage {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 1920px;
  min-height: 642px;
}

.hx-boverview__content {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  padding: 29px 0 0;             /* 组起点 1211 − 底带 1182；底部不留白，模块高 = 组高 641.44 */
  box-sizing: border-box;
  font-family: 'AlibabaPuHuiTi-3', Inter, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

.hx-boverview__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 400;
  color: #333;
  text-align: center;
}

/* 标题下的蓝条：稿里是 h=0 的「直线」，实测渲染 190×5 #2D72FF */
.hx-boverview__rule {
  display: block;
  width: 190px;
  height: 5px;
  margin: 8px auto 0;
  border-radius: 2.5px;
  background: #2d72ff;
}

/* 主体：左栏 584 ＋ 右栏 616；插图上沿比正文高 26，所以正文自己加内距 */
.hx-boverview__body {
  display: grid;
  grid-template-columns: 584px 616px;
  margin-top: 32px;              /* 94 − 62 */
}

.hx-boverview__left {
  padding-top: 26px;             /* 正文 120，插图 94 */
}

.hx-boverview__lead {
  width: 606px;                  /* 稿里正文框 606，字形实际不到 584，不会压到插图 */
  margin: 0;
  font-size: 24px;
  line-height: 35px;
  font-weight: 400;
  color: #555;
}

.hx-boverview__points {
  margin: 31px 0 0;              /* 256 − (120+105) */
  padding: 0;
  list-style: none;
}

.hx-boverview__point {
  display: flex;
  align-items: flex-start;
  gap: 24px;                     /* 圆 70 → 文字 left 94 */
}

.hx-boverview__point + .hx-boverview__point {
  margin-top: 40px;              /* 行距：256 → 366 → 476，圆高 70 */
}

.hx-boverview__dot {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 70px;
  height: 70px;
  margin-top: 2px;               /* 圆 258 vs 文字 256 */
  background-position: center;
  background-repeat: no-repeat;
  background-size: 70px 70px;
}

.hx-boverview__dot-icon {
  display: block;
  width: 32px;
  height: 36px;
}

.hx-boverview__point-text {
  min-width: 0;
}

.hx-boverview__point-name {
  margin: 0;
  font-size: 25px;
  line-height: 36px;
  font-weight: 400;
  color: #333;
}

.hx-boverview__point-desc {
  margin: 6px 0 0;               /* 298 − (256+36) */
  font-size: 20px;
  line-height: 29px;
  font-weight: 400;
  color: #555;
}

.hx-boverview__illu {
  display: block;
  width: 616px;
  height: 518px;
}

/* ============================================================
   模块3 核心功能（设计 0:1984，1820→2230.44；模块盒子 1748→2190 含底部留白）
   3×2 白卡 384×130、radius 10、列步进 408（gap 24）、行步进 170（gap 40）。
   ============================================================ */
.hx-bfeature {
  overflow: hidden;
  width: 100%;
  min-height: 442px;
  background: #f8f9fd;           /* 0:1978 在这段的实际颜色 */
}

.hx-bfeature__stage {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 1920px;
  min-height: 442px;
}

.hx-bfeature__content {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  padding: 0;
  box-sizing: border-box;
  font-family: 'AlibabaPuHuiTi-3', Inter, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

.hx-bfeature__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 400;
  color: #333;
  text-align: center;
}

/* 标题下蓝条：190×6（设计 0:2083 矩形215） */
.hx-bfeature__rule {
  display: block;
  width: 190px;
  height: 6px;
  margin: 10px auto 0;           /* 59 − (0+49) */
  border-radius: 3px;
  background: #2d72ff;
}

.hx-bfeature__list {
  display: grid;
  grid-template-columns: repeat(3, 384px);
  gap: 40px 24px;                /* 行 170 − 130；列 408 − 384 */
  margin: 51px 0 0;              /* 110 − (59+6) */
  padding: 0;
  list-style: none;
}

.hx-bfeature__card {
  display: flex;
  align-items: flex-start;
  gap: 32px;                     /* 圆 24..103 → 文字 135 */
  min-height: 130px;
  padding: 26px 21px 24px 24px;
  box-sizing: border-box;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
}

.hx-bfeature__badge {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 79px;
  height: 79px;
  border-radius: 50%;
  background: #e8f1ff;
}

.hx-bfeature__icon {
  display: block;
  width: 48px;
  height: 48px;
}

.hx-bfeature__text {
  min-width: 0;
  padding-top: 5px;              /* 标题 t=31 vs 圆 t=26 */
}

.hx-bfeature__name {
  margin: 0;
  font-size: 20px;
  line-height: 29px;
  font-weight: 400;
  color: #1a1a2e;
}

.hx-bfeature__card--settle {
  padding-top: 23px;             /* 设计里这张卡标题 t=23（其余 t=31） */
}

.hx-bfeature__card--settle .hx-bfeature__text {
  padding-top: 0;
}

.hx-bfeature__card--settle .hx-bfeature__desc {
  margin-top: 8px;               /* 60 − (23+29) */
}

.hx-bfeature__desc {
  margin: 13px 0 0;              /* 73 − (31+29) */
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #666;
}

/* ============================================================
   模块4 产品优势（设计 0:1986，2291→2644.44；模块盒子 2262→2644，高 382）
   顶部 1920×242 的 #D5E4FC 蓝带（0:1985）压在标题行下，四卡 284×224 压住带子下沿。
   ============================================================ */
.hx-bedge {
  position: relative;
  overflow: hidden;
  width: 100%;
  min-height: 446px;             /* 2262→2708：内容到 2644.44，底部留白 64 */
  background: #fff;
}

/* 装饰层：顶部蓝带 242 高（1920 定宽居中，窄视口只裁边） */
.hx-bedge__band {
  position: absolute;
  top: 0;
  left: 50%;
  width: 1920px;
  height: 242px;
  margin-left: -960px;
  background: #d5e4fc;
}

.hx-bedge__stage {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 1920px;
  min-height: 446px;
}

.hx-bedge__content {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  padding: 29px 0 0;             /* 2291 − 2262 */
  box-sizing: border-box;
  font-family: 'AlibabaPuHuiTi-3', Inter, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

.hx-bedge__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 400;
  color: #333;
  text-align: center;
}

/* 标题下蓝条：190×6（设计 0:2083） */
.hx-bedge__rule {
  display: block;
  width: 190px;
  height: 6px;
  margin: 10px auto 0;           /* 2350 − (2291+49) */
  border-radius: 3px;
  background: #2d72ff;
}

.hx-bedge__list {
  display: grid;
  grid-template-columns: repeat(4, 284px);
  gap: 21px;                     /* 列步进 305 − 284 */
  margin: 64px 0 0;              /* 2420 − (2350+6) */
  padding: 0;
  list-style: none;
}

.hx-bedge__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: 224px;
  padding: 32px 12px 24px;
  box-sizing: border-box;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
}

.hx-bedge__dot {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 68px;
  height: 68px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 68px 68px;
}

.hx-bedge__dot-icon {
  display: block;
}

.hx-bedge__name {
  margin: 18px 0 0;              /* 118 − (32+68) */
  font-size: 20px;
  line-height: 29px;
  font-weight: 400;
  color: #1a1a2e;
  text-align: center;
}

.hx-bedge__desc {
  margin: 7px 0 0;               /* 154 − (118+29) */
  font-size: 16px;
  line-height: 22px;
  font-weight: 400;
  color: #888;
  text-align: center;
}

/* ============================================================
   模块5 移动端小程序（设计 0:1998，2708→3275，高 567）
   满幅蓝底（左边缘 + 手持手机照片 + 右边缘 + 左下波浪 合成为一张 1920×567 图）；
   左栏文字 x=248，右栏 3 条 x=1427~1728。
   ============================================================ */
.hx-bmob {
  position: relative;
  width: 100%;
  min-height: 567px;
  overflow: hidden;
  background: #1261e8;
}

.hx-bmob__stage {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 1920px;
  min-height: 567px;
}

/* 装饰层：整条蓝底 */
.hx-bmob__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 1920px;
  height: 100%;
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 1920px 567px;
  background-image: url('/images/brand/cashier/mobile-band.webp');
}

.hx-bmob__content {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  box-sizing: border-box;
  width: 1920px;
  padding: 100px 192px 0 248px;
  color: #fff;
  font-family: 'AlibabaPuHuiTi-3', Inter, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

.hx-bmob__left {
  width: 880px;                  /* 正文框右缘 971，左侧不压到 1068 的手机 */
}

.hx-bmob__title {
  margin: 0;
  font-size: 70px;
  line-height: 101px;
  font-weight: 400;
  color: #fff;
}

.hx-bmob__sub {
  margin: 7px 0 0;               /* 208 − (100+101) */
  font-size: 50px;
  line-height: 72px;
  font-weight: 400;
  color: #abd0ff;
}

.hx-bmob__desc {
  margin: 48px 0 0;              /* 328 − (208+72) */
  font-size: 30px;
  line-height: 44px;             /* 稿里文本框只有 22 高（两行重叠），按 44 行高还原 */
  font-weight: 400;
  color: #fff;
}

.hx-bmob__list {
  width: 301px;
  margin: 41px 0 0;              /* 右栏首条 141 − 左栏 100 */
  padding: 0;
  list-style: none;
}

.hx-bmob__item {
  display: flex;
  align-items: flex-start;
  gap: 24px;                     /* 圆 1427..1503 → 文字 1527 */
}

.hx-bmob__item + .hx-bmob__item {
  margin-top: 30px;              /* 行距 109 − 文本块高 79（名称 44 + 说明 35） */
}

.hx-bmob__dot {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 76px;
  height: 76px;
  margin-top: 3px;               /* 圆 144 vs 名称 141 */
  border-radius: 50%;
  background: #6daeff;
}

.hx-bmob__icon {
  display: block;
}

.hx-bmob__item-text {
  min-width: 0;
  padding-top: 0;
}

.hx-bmob__item-name {
  margin: 0;
  font-size: 30px;
  line-height: 44px;
  font-weight: 400;
  color: #fff;
}

.hx-bmob__item-desc {
  margin: 0;                     /* 184 − (141+44) = -1 */
  font-size: 24px;
  line-height: 35px;
  font-weight: 400;
  color: #abd0ff;
  white-space: nowrap;
}

/* ============================================================
   模块6 收银流程图（设计 0:1979 + 0:1988，模块区间 3275→3891，高 616）
   830×520 的 #ACD1FF 卡片（radius 20）居中，内含 806×496 流程整图（2x 导出）。
   ============================================================ */
.hx-bflow {
  overflow: hidden;
  width: 100%;
  min-height: 616px;
  /* 设计底是 0:1978 那张浅蓝波纹图（本模块切下来 1920×616），原来误用了纯白 */
  background: #f4f9ff url('/images/brand/cashier/flow-bg.webp') center top no-repeat;
  background-size: 1920px auto;
}

.hx-bflow__stage {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 1920px;
  min-height: 616px;
  padding-top: 64px;             /* 用 padding 不用卡片 margin：margin 会穿出 section 把整块推下去 */
  box-sizing: border-box;
}

.hx-bflow__card {
  width: 830px;
  min-height: 520px;
  margin: 0 auto;
  padding: 12px;                 /* 图 557 − 卡 545 */
  box-sizing: border-box;
  border-radius: 20px;
  background: #acd1ff;
  font-size: 0;                  /* 去掉 inline img 的基线间隙 */
}

.hx-bflow__img {
  display: block;
  width: 806px;
  height: 496px;
}

/* ============================================================
   模块7 应用场景（设计 0:1987，3920→4407.44；模块区间 3891→4439，高 548）
   背景带 0:1982 = #EBF3FF 1920×637（比模块长 89，多出部分落在页脚上方）。
   四卡 270×358、白底 radius 8、gap 40；卡面 246×160 + 图标 + 20 名 + 14 说明。
   ============================================================ */
.hx-bscene {
  position: relative;
  overflow: hidden;
  width: 100%;
  /* 内容到 4439（548），但设计里浅蓝底一直铺到页脚起始 4503 → 盒高取 612，
     否则多出的蓝带会盖住页脚顶部 64px */
  min-height: 612px;
  background: #fff;
}

/* 装饰层：全幅浅蓝带（比模块高 89，overflow 由页脚盖住上沿，视觉与稿一致） */
.hx-bscene__band {
  position: absolute;
  top: 0;
  left: 50%;
  width: 1920px;
  height: 612px;                 /* 3891→4503，正好铺到页脚前 */
  margin-left: -960px;
  background: #ebf3ff;
}

.hx-bscene__stage {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 1920px;
  min-height: 612px;
}

.hx-bscene__content {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  padding: 29px 0 0;             /* 3920 − 3891 */
  box-sizing: border-box;
  font-family: 'AlibabaPuHuiTi-3', Inter, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

.hx-bscene__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 400;
  color: #1a1a2e;
  text-align: center;
}

/* 标题下蓝条：190×6 #1890FF（这块和上面几块的 #2D72FF 不同，按稿取色） */
.hx-bscene__rule {
  display: block;
  width: 190px;
  height: 6px;
  margin: 10px auto 0;
  border-radius: 3px;
  background: #1890ff;
}

.hx-bscene__list {
  display: grid;
  grid-template-columns: repeat(4, 270px);
  gap: 40px;
  margin: 64px 0 0;              /* 3920+129 − (3920+59+6) */
  padding: 0;
  list-style: none;
}

.hx-bscene__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: 358px;
  padding: 12px 12px 24px;
  box-sizing: border-box;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
}

.hx-bscene__pic {
  display: block;
  width: 246px;
  height: 160px;
  border-radius: 8px;
  overflow: hidden;
}

.hx-bscene__img {
  display: block;
  width: 246px;
  height: 160px;
}

.hx-bscene__icon {
  display: block;
  margin-top: 24px;              /* 196 − (12+160) */
}

.hx-bscene__name {
  margin: 11px 0 0;              /* 255 − (196+48) */
  font-size: 20px;
  line-height: 29px;
  font-weight: 400;
  color: #1a1a2e;
  text-align: center;
}

.hx-bscene__desc {
  margin: 13px 0 0;              /* 297 − (255+29) */
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  color: #1a1a2e;
  text-align: center;
  white-space: nowrap;
}

/* ============================================================
   动效（品牌站）：入场 + 卡片
   入场用 IntersectionObserver 加 .is-in（brand.js），CSS 只负责状态与过渡；
   只在 html.js 存在时才隐藏初始态（JS 失效/禁用时不影响可读性）；
   prefers-reduced-motion 下全部关闭。
   ============================================================ */
@media (prefers-reduced-motion: no-preference) {
  /* 入场用 @keyframes 而不是 transition：
     transition 是整体覆盖的属性，写在 .hx-rise 上会把卡片自己的 transform/box-shadow 过渡顶掉
     （表现就是 hover 抬起是"瞬间跳"、没有过渡）。动画不碰 transition，两者互不干扰。
     位移用独立的 translate 属性，也不用 transform，避免压掉卡片 hover 的 translateY(-6px)。 */
  .js .hx-rise {
    opacity: 0;
    translate: 0 28px;
  }

  .js .hx-rise.is-in {
    animation: hx-rise 0.7s cubic-bezier(0.22, 0.61, 0.36, 1) var(--rise-delay, 0ms) both;
  }

  @keyframes hx-rise {
    from {
      opacity: 0;
      translate: 0 28px;
    }
    to {
      opacity: 1;
      translate: none;
    }
  }

  /* 卡片 hover：上浮 + 抬阴影
     节奏取 0.45s ease-out（.22,.61,.36,1）：0.28s ease 收得太急，像"跳"上去 */
  .hx-bsector__card,
  .hx-bfeature__card,
  .hx-bedge__card,
  .hx-bscene__card {
    transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1), box-shadow 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
  }

  .hx-bsector__card:hover,
  .hx-bfeature__card:hover,
  .hx-bedge__card:hover,
  .hx-bscene__card:hover {
    transform: translateY(-6px);
    box-shadow: 0 10px 24px rgba(20, 60, 140, 0.18);
  }

  /* 文字按钮的箭头右移（纯位移，不缩放图标本体） */
  .hx-bsector__btn-arrow {
    transition: transform 0.3s cubic-bezier(0.22, 0.61, 0.36, 1);
  }

  .hx-bsector__btn:hover .hx-bsector__btn-arrow {
    transform: translateX(6px);
  }

  /* 只有「图片卡」在 hover 时推近图片；图标卡（badge / dot）不缩放——
     SVG 圆徽跟着卡片一起放大观感很怪，保持静止 */
  .hx-bscene__img {
    transition: transform 0.5s cubic-bezier(0.22, 0.61, 0.36, 1);
  }

  .hx-bscene__card:hover .hx-bscene__img {
    transform: scale(1.06);
  }
}

/* 入场错开：每块按子项序号给延迟（不写内联 style，避免转义坑） */
.hx-bsector__list > li:nth-child(1) { --rise-delay: 0ms; }
.hx-bsector__list > li:nth-child(2) { --rise-delay: 90ms; }
.hx-bsector__list > li:nth-child(3) { --rise-delay: 180ms; }

.hx-boverview__points > li:nth-child(1) { --rise-delay: 0ms; }
.hx-boverview__points > li:nth-child(2) { --rise-delay: 100ms; }
.hx-boverview__points > li:nth-child(3) { --rise-delay: 200ms; }

.hx-bfeature__list > li:nth-child(2),
.hx-bfeature__list > li:nth-child(5) { --rise-delay: 80ms; }
.hx-bfeature__list > li:nth-child(3),
.hx-bfeature__list > li:nth-child(6) { --rise-delay: 160ms; }
.hx-bfeature__list > li:nth-child(4) { --rise-delay: 60ms; }

.hx-bedge__list > li:nth-child(2) { --rise-delay: 80ms; }
.hx-bedge__list > li:nth-child(3) { --rise-delay: 160ms; }
.hx-bedge__list > li:nth-child(4) { --rise-delay: 240ms; }

.hx-bmob__item:nth-child(2) { --rise-delay: 90ms; }
.hx-bmob__item:nth-child(3) { --rise-delay: 180ms; }

.hx-bscene__list > li:nth-child(2) { --rise-delay: 80ms; }
.hx-bscene__list > li:nth-child(3) { --rise-delay: 160ms; }
.hx-bscene__list > li:nth-child(4) { --rise-delay: 240ms; }

.hx-bbanner__eyebrow { --rise-delay: 60ms; }
.hx-bbanner__title { --rise-delay: 150ms; }
.hx-bbanner__sub { --rise-delay: 240ms; }
.hx-bbanner__chips { --rise-delay: 330ms; }

.hx-boverview__illu { --rise-delay: 120ms; }

/* ============================================================
   融教通卡片动效（与喜莱收同一套规矩）
   ① 悬停上浮 6px + 抬阴影，节奏 0.45s cubic-bezier(.22,.61,.36,1)
      （0.28s ease 收得太急，看起来像"跳"上去，别改回去）
   ② 卡片里的图标 / 圆徽 / 徽章**不缩放**：SVG 圆徽跟着卡放大线条变粗，观感很怪
   ③ 只有「图片卡」推近图片（这里只有核心功能六卡的手机截图）
   ④ 动作一律放在 prefers-reduced-motion: no-preference 里，系统开了减弱动效就完全静止
   ============================================================ */

@media (prefers-reduced-motion: no-preference) {
  .hx-edu-adv__card,
  .hx-edu-more__card,
  .hx-edu-overview__card,
  .hx-edu-feature__card,
  .hx-edu-campus__row {
    transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1), box-shadow 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
  }

  .hx-edu-more__card:hover,
  .hx-edu-overview__card:hover,
  .hx-edu-feature__card:hover {
    transform: translateY(-6px);
    box-shadow: 0 10px 24px rgba(20, 60, 140, 0.18);
  }

  .hx-edu-adv__card:hover {
    transform: translateY(-6px);
    /* 这块的四卡底边正好压在段底（稿如此），段只多留 14px：
       照搬 0 10 24 的话阴影尾巴会溢出段底被切平（实测 3750→3752 从 240 直接跳回 249）。
       抬升保持 6px 不变，只把阴影收紧到落得进 9px 余量里。 */
    box-shadow: 0 6px 12px rgba(20, 60, 140, 0.18);
  }

  /* 智慧校徽四行：本来就是 1px 描边的白卡，抬起来时描边留住、只加阴影 */
  .hx-edu-campus__row:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 18px rgba(20, 60, 140, 0.14);
  }

  /* 核心功能卡右侧的 App 截图轻微推近（蒙版在 ::before 上，不跟着放大） */
  .hx-edu-feature__shot-img {
    transition: transform 0.5s cubic-bezier(0.22, 0.61, 0.36, 1);
  }

  .hx-edu-feature__card:hover .hx-edu-feature__shot-img {
    transform: scale(1.04);
  }
}

/* 入场错开：每块「标题 → 副标 → 蓝条 → 卡片」依次进来（用变量，不写内联 style，避免 Twirl 转义坑） */
.hx-edu-promise__title,
.hx-edu-overview__title,
.hx-edu-feature__title,
.hx-edu-adv__title,
.hx-edu-coop__title,
.hx-edu-more__title,
.hx-edu-campus__en {
  --rise-delay: 0ms;
}

.hx-edu-promise__sub,
.hx-edu-feature__sub,
.hx-edu-adv__sub,
.hx-edu-coop__sub,
.hx-edu-more__sub,
.hx-edu-campus__title {
  --rise-delay: 70ms;
}

.hx-edu-promise__rule,
.hx-edu-overview__rule,
.hx-edu-feature__rule,
.hx-edu-adv__rule,
.hx-edu-coop__rule,
.hx-edu-more__rule,
.hx-edu-campus__slogan {
  --rise-delay: 140ms;
}

.hx-edu-campus__desc {
  --rise-delay: 210ms;
}

.hx-edu-campus__rule {
  --rise-delay: 280ms;
}

.hx-edu-campus__dots {
  --rise-delay: 340ms;
}

/* 六条 / 四卡 / 六卡按序号错开 */
.hx-edu-promise__list > li:nth-child(2) { --rise-delay: 90ms; }
.hx-edu-promise__list > li:nth-child(3) { --rise-delay: 180ms; }
.hx-edu-promise__list > li:nth-child(4) { --rise-delay: 270ms; }
.hx-edu-promise__list > li:nth-child(5) { --rise-delay: 360ms; }
.hx-edu-promise__list > li:nth-child(6) { --rise-delay: 450ms; }

.hx-edu-overview__grid > li:nth-child(2) { --rise-delay: 80ms; }
.hx-edu-overview__grid > li:nth-child(3) { --rise-delay: 160ms; }
.hx-edu-overview__grid > li:nth-child(4) { --rise-delay: 240ms; }

.hx-edu-feature__list > li:nth-child(2) { --rise-delay: 80ms; }
.hx-edu-feature__list > li:nth-child(3) { --rise-delay: 160ms; }
.hx-edu-feature__list > li:nth-child(4) { --rise-delay: 60ms; }
.hx-edu-feature__list > li:nth-child(5) { --rise-delay: 140ms; }
.hx-edu-feature__list > li:nth-child(6) { --rise-delay: 220ms; }

.hx-edu-adv__list > li:nth-child(2) { --rise-delay: 80ms; }
.hx-edu-adv__list > li:nth-child(3) { --rise-delay: 160ms; }
.hx-edu-adv__list > li:nth-child(4) { --rise-delay: 240ms; }

.hx-edu-more__list > li:nth-child(2) { --rise-delay: 80ms; }
.hx-edu-more__list > li:nth-child(3) { --rise-delay: 160ms; }
.hx-edu-more__list > li:nth-child(4) { --rise-delay: 240ms; }

.hx-edu-campus__rows > li:nth-child(2) { --rise-delay: 70ms; }
.hx-edu-campus__rows > li:nth-child(3) { --rise-delay: 140ms; }
.hx-edu-campus__rows > li:nth-child(4) { --rise-delay: 210ms; }

.hx-edu-coop__diagram {
  --rise-delay: 140ms;
}

.hx-edu-overview__illu {
  --rise-delay: 120ms;
}

/* ============================================================
   行知澜首屏 banner（hx-vbanner）
   画板「行知澜」0:7585 模块 0:7586；设计 0→632 含 72 页头 → 盒高 560。
   与喜莱收/融教通的差别：浅底深蓝字、无 chips、有右侧设备图与三处竖排标注。
   ============================================================ */
.hx-vbanner {
  --vbanner-h: 560px;
  position: relative;
  width: 100%;
  min-height: var(--vbanner-h);
  overflow: hidden;
  background: #f9fcff;
}

.hx-vbanner__stage {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 1920px;
  min-height: var(--vbanner-h);
}

/* 装饰：整张背景图（1920×632，图里含 72 页头区，上移 72 让页头区被裁掉） */
.hx-vbanner__bg {
  position: absolute;
  top: -72px;
  left: 0;
  width: 1920px;
  height: 632px;
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 1920px 632px;
}

/* 装饰：左侧压深（0:7619 1076×632 左起渐变），保证文案对比度 */
.hx-vbanner__shade {
  position: absolute;
  top: 0;
  left: 0;
  width: 1076px;
  height: 560px;
  background: linear-gradient(90deg, rgba(249, 252, 255, .96) 0%, rgba(249, 252, 255, .86) 62%, rgba(249, 252, 255, 0) 100%);
  pointer-events: none;
}

/* 装饰：右侧设备图 0:7623，设计 (1590,373) → 页面 y=301 */
.hx-vbanner__device {
  position: absolute;
  left: 1590px;
  top: 301px;
  width: 177px;
  height: 114px;
}

.hx-vbanner__device img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* 装饰：右侧三处标注 0:7624~0:7626，x=1827，设计 y=152/280/417 → 80/208/345 */
.hx-vbanner__marks {
  margin: 0;
  padding: 0;
  list-style: none;
}

.hx-vbanner__mark {
  position: absolute;
  left: 1827px;
  width: 64px;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #323840;
  text-align: center;
  white-space: nowrap;
}

.hx-vbanner__mark--1 { top: 80px; }
.hx-vbanner__mark--2 { top: 208px; }
.hx-vbanner__mark--3 { top: 345px; }

/* 文案层：设计文字列 x=277（不是内容列 360），按舞台左内距排 */
.hx-vbanner__content {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  padding: 92px 0 0 277px;
  font-family: 'AlibabaPuHuiTi-3', Inter, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

/* 眉头 0:7590：50/72，#2658FF */
.hx-vbanner__eyebrow {
  margin: 0;
  font-size: 50px;
  line-height: 72px;
  font-weight: 700;
  color: #2658ff;
}

/* 主标题 0:7589：70/101，#122F8F，设计 y240 − (92+72) = 76 间距 */
.hx-vbanner__title {
  margin: 0;
  padding-top: 4px;
  font-size: 70px;
  line-height: 101px;
  font-weight: 700;
  color: #122f8f;
}

/* 副标 0:7591：28/40，#122F8F，设计 y351 → 与主标题底(341)间距 10 */
.hx-vbanner__sub {
  margin: 0;
  padding-top: 10px;
  font-size: 28px;
  line-height: 40px;
  font-weight: 400;
  color: #122f8f;
}

/* 正文 0:7592：18/36，#5B5D62，设计 y426 → 与副标底(391)间距 35；稿里 3 段，保行 */
.hx-vbanner__body {
  margin: 0;
  padding-top: 35px;
  font-size: 18px;
  line-height: 36px;
  font-weight: 400;
  color: #5b5d62;
  white-space: pre-line;
}

/* ============================================================
   行知澜正文（画板 0:7585）
   统一结构：stage 定宽 1920 居中（只裁边）→ content 1200 居中 → 行/卡用 flex/grid
   装饰层（背景图/渐变）才允许 absolute，class 带 __bg。
   ============================================================ */
.hx-vov, .hx-vadv, .hx-vfeat, .hx-vhl {
  position: relative;
  width: 100%;
  overflow: hidden;
}

/* 卡片尺寸按设计固定值（284×222 / 284×374 / 380×384 / 290×336），
   必须 border-box，否则 min-height 再叠 padding 会撑高整块，背景图盖不满。 */
.hx-vov *, .hx-vadv *, .hx-vfeat *, .hx-vhl * { box-sizing: border-box; }

.hx-vov__stage, .hx-vadv__stage, .hx-vfeat__stage, .hx-vhl__stage {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 1920px;
}

.hx-vov__content, .hx-vadv__content, .hx-vfeat__content, .hx-vhl__content {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  font-family: 'AlibabaPuHuiTi-3', Inter, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

/* ---------- M1 产品概述（设计 696→1599，高 903）---------- */
.hx-vov { background: #f9fcff; }

/* 装饰：0:7588 渐变块（设计 y480→1383，跨上界，相对模块 top:-216） */
.hx-vov__bg {
  position: absolute;
  top: -216px;
  left: 0;
  width: 1920px;
  height: 903px;
  background: linear-gradient(180deg, #f9fcff 0%, #eff6ff 100%);
}

.hx-vov__content { padding: 61px 0 0; }

.hx-vov__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 700;
  color: #333;
  text-align: center;
}

/* 下划线 0:7594：LINE 190×4 #2D72FF，设计 y816（相对 120），标题底 110 → 间距 10 */
.hx-vov__rule {
  display: block;
  width: 190px;
  height: 4px;
  margin: 10px auto 0;
  background: #2d72ff;
}

/* 左文 + 右图：左列 504，右图区 641×452，间距 55（919−360−504） */
.hx-vov__main {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding-top: 60px;
}

.hx-vov__text { width: 504px; padding-top: 39px; }

.hx-vov__brand {
  margin: 0;
  font-size: 40px;
  line-height: 58px;
  font-weight: 700;
  color: #0073d1;
}

.hx-vov__lead {
  margin: 0;
  padding-top: 15px;
  font-size: 32px;
  line-height: 46px;
  font-weight: 700;
  color: #333;
}

.hx-vov__desc {
  margin: 0;
  padding-top: 38px;
  font-size: 24px;
  line-height: 37px;
  font-weight: 400;
  color: #555;
  white-space: pre-line;
}

/* 右图：整组 0:7598 导出为一张图（641×452 设计；导出 461 高含底部光晕，裁到 452） */
.hx-vov__visual {
  display: block;
  width: 641px;
  height: 452px;
  overflow: hidden;
}

.hx-vov__visual img {
  display: block;
  width: 641px;
  height: 461px;
}

/* 4 卡：284×222，x=360/665/971/1276 → 1200−4×284=64，均分间距 21.33 */
.hx-vov__cards {
  display: grid;
  grid-template-columns: repeat(4, 284px);
  justify-content: space-between;
  margin: 0;
  padding: 13px 0 32px;
  list-style: none;
}

.hx-vov__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: 222px;
  padding: 32px 12px 0;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(31, 66, 137, .06);
}

/* 图标底圆 0:7648：68×68 @卡内 (108,32) → 水平居中 */
.hx-vov__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 68px;
  height: 68px;
  border-radius: 50%;
  background: linear-gradient(135deg, #dbe9ff 0%, #eef5ff 100%);
}

.hx-vov__icon img { display: block; object-fit: contain; }

.hx-vov__card-title {
  margin: 0;
  padding-top: 17px;
  font-size: 22px;
  line-height: 32px;
  font-weight: 700;
  color: #1a1a2e;
  text-align: center;
  white-space: nowrap;
}

.hx-vov__card-desc {
  margin: 0;
  padding-top: 15px;
  font-size: 17px;
  line-height: 25px;
  font-weight: 400;
  color: #888;
  text-align: center;
  white-space: nowrap;
}

/* ---------- M2 产品优势（设计 1599→2230，高 631）---------- */
.hx-vadv { background: #0b2a6b; }

/* 装饰：0:7603 全幅背景图（1920×631） */
.hx-vadv__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 1920px;
  height: 631px;
  background-image: url(/images/brand/vision/adv-bg.webp);
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 1920px 631px;
}

.hx-vadv__content { padding: 29px 0 0; }

.hx-vadv__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 700;
  color: #fff;
  text-align: center;
}

/* 下划线 0:7673：LINE 190×4 #C7D9FF，设计 y1687（相对 88），标题底 78 → 间距 10 */
.hx-vadv__rule {
  display: block;
  width: 190px;
  height: 4px;
  margin: 10px auto 0;
  background: #c7d9ff;
}

/* 装饰条：0:7674 632×54 @(644,1717) + 0:7675 矢量 slogan 566×33 @(677,1728) */
.hx-vadv__bar {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 632px;
  height: 54px;
  margin: 26px auto 0;
  background: linear-gradient(90deg, rgba(57, 132, 255, 0), rgba(57, 132, 255, .55), rgba(57, 132, 255, 0));
  border-radius: 27px;
}

/* 0:7675 设计里是矢量字，内容是文字，必须用真 DOM（可搜、可改、Retina 清晰） */
.hx-vadv__bar-text {
  margin: 0;
  font-size: 28px;
  line-height: 33px;
  font-weight: 700;
  color: #1c7fff;
  white-space: nowrap;
}

/* 4 卡：284×374，1200−4×284=64 → 间距 21.33 */
.hx-vadv__cards {
  display: grid;
  grid-template-columns: repeat(4, 284px);
  justify-content: space-between;
  margin: 0;
  padding: 53px 0 32px;
  list-style: none;
}

.hx-vadv__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: 374px;
  padding: 56px 18px 0;
  background: linear-gradient(180deg, rgba(255, 255, 255, .2) 0%, #fff 100%);
  border-radius: 16px;
}

.hx-vadv__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 116px;
  height: 116px;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 35%, #ffffff 0%, #f2f7ff 100%);
  box-shadow: 0 6px 16px rgba(20, 60, 140, .06);
}

.hx-vadv__icon img { display: block; width: 60px; height: 60px; object-fit: contain; }

.hx-vadv__card-title {
  margin: 0;
  padding-top: 30px;
  font-size: 25px;
  line-height: 36px;
  font-weight: 700;
  color: #1a1a2e;
}

.hx-vadv__card-desc {
  margin: 0;
  padding-top: 13px;
  font-size: 20px;
  line-height: 34px;
  font-weight: 400;
  color: #888;
  text-align: center;
}

/* ---------- M3 核心功能（设计 2230→3244，高 1014）---------- */
.hx-vfeat { background: #f9fcff; }
.hx-vfeat__content { padding: 29px 0 0; }

.hx-vfeat__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 700;
  color: #333;
  text-align: center;
}

.hx-vfeat__sub {
  margin: 0;
  padding-top: 8px;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #555;
  text-align: center;
}

/* 下划线 0:7694：LINE 268×4 #2D72FF，设计 y2356（相对 126），副标底 110 → 间距 16 */
.hx-vfeat__rule {
  display: block;
  width: 268px;
  height: 4px;
  margin: 16px auto 0;
  background: #2d72ff;
}

/* 6 卡：380×384，3 列 × 2 行；列间距 30（1200−3×380=60/2），行间距 24 */
.hx-vfeat__grid {
  display: grid;
  grid-template-columns: repeat(3, 380px);
  justify-content: space-between;
  gap: 24px;
  margin: 0;
  padding: 60px 0 32px;
  list-style: none;
}

.hx-vfeat__card {
  display: flex;
  flex-direction: column;
  min-height: 384px;
  padding: 24px 24px 0;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(31, 66, 137, .06);
}

.hx-vfeat__pic {
  display: block;
  width: 332px;
  height: 216px;
  object-fit: cover;
  border-radius: 10px;
}

.hx-vfeat__card-title {
  margin: 0;
  padding-top: 13px;
  font-size: 22px;
  line-height: 32px;
  font-weight: 700;
  color: #1a1a2e;
}

.hx-vfeat__card-desc {
  margin: 0;
  padding-top: 15px;
  font-size: 17px;
  line-height: 26px;
  font-weight: 400;
  color: #888;
}

/* ---------- M4 AI智能亮点（设计 3244→3844，高 600）---------- */
.hx-vhl { background: #f9fcff; }

/* 装饰：0:7607 全幅背景图 + 0:7608 左侧 1395 宽渐变压深 */
.hx-vhl__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 1920px;
  height: 600px;
  background-image: linear-gradient(90deg, rgba(249, 252, 255, .96) 0%, rgba(249, 252, 255, .72) 55%, rgba(249, 252, 255, 0) 100%), url(/images/brand/vision/hl-bg.webp);
  background-position: center top, center top;
  background-repeat: no-repeat, no-repeat;
  background-size: 1395px 600px, 1920px 600px;
}

.hx-vhl__content { padding: 29px 0 0; }

.hx-vhl__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 700;
  color: #333;
  text-align: center;
}

/* 下划线 0:7610：LINE 220×4 #2D72FF，设计 y3340（相对 96），标题底 78 → 间距 18 */
.hx-vhl__rule {
  display: block;
  width: 220px;
  height: 4px;
  margin: 18px auto 0;
  background: #2d72ff;
}

.hx-vhl__sub {
  margin: 0;
  padding-top: 26px;
  font-size: 28px;
  line-height: 40px;
  font-weight: 700;
  color: #5381ff;
  text-align: center;
}

/* 4 卡：290×336，1200−4×290=40 → 间距 13.33 */
.hx-vhl__cards {
  display: grid;
  grid-template-columns: repeat(4, 290px);
  justify-content: space-between;
  margin: 0;
  padding: 64px 0 32px;
  list-style: none;
}

.hx-vhl__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: 336px;
  padding: 40px 16px 0;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(31, 66, 137, .06);
}

.hx-vhl__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 126px;
  height: 126px;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 35%, #ffffff 0%, #f2f7ff 100%);
  box-shadow: 0 6px 16px rgba(20, 60, 140, .06);
}

.hx-vhl__icon img { display: block; width: 60px; height: 60px; object-fit: contain; }

.hx-vhl__card-title {
  margin: 0;
  padding-top: 15px;
  font-size: 25px;
  line-height: 36px;
  font-weight: 700;
  color: #1a1a2e;
}

.hx-vhl__card-desc {
  margin: 0;
  padding-top: 13px;
  font-size: 20px;
  line-height: 34px;
  font-weight: 400;
  color: #888;
  text-align: center;
}



/* ---------- 适用场景（设计 3844→4360，高 516；内容组 0:7616 从 3873 起）---------- */
.hx-vscene {
  position: relative;
  width: 100%;
  overflow: hidden;
  background: #f9fcff;
}

.hx-vscene * { box-sizing: border-box; }

.hx-vscene__stage {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 1920px;
}

.hx-vscene__content {
  width: 1200px;
  margin: 0 auto;
  padding: 29px 0 96px;
  font-family: 'AlibabaPuHuiTi-3', Inter, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

.hx-vscene__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 700;
  color: #333;
  text-align: center;
}

.hx-vscene__sub {
  margin: 0;
  padding-top: 9px;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #555;
  text-align: center;
}

/* 下划线 0:7741：LINE 268×4 #2D72FF（副标底 82 → 97，间距 15） */
.hx-vscene__rule {
  display: block;
  width: 268px;
  height: 4px;
  margin: 15px auto 0;
  background: #2d72ff;
}

/* 5 卡：224×230，gap 20（5×224 + 4×20 = 1200） */
.hx-vscene__cards {
  display: grid;
  grid-template-columns: repeat(5, 224px);
  gap: 20px;
  margin: 0;
  padding: 60px 0 0;
  list-style: none;
}

.hx-vscene__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: 230px;
  padding: 40px 10px 0;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(31, 66, 137, .06);
}

/* 图标底圆 0:7748：68×68 @卡内 (78,40)，水平居中 */
.hx-vscene__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 68px;
  height: 68px;
  border-radius: 50%;
  background: linear-gradient(135deg, #dbe9ff 0%, #eef5ff 100%);
}

.hx-vscene__icon img { display: block; object-fit: contain; }

.hx-vscene__card-title {
  margin: 0;
  padding-top: 14px;
  font-size: 20px;
  line-height: 29px;
  font-weight: 700;
  color: #1a1a2e;
  text-align: center;
  white-space: nowrap;
}

.hx-vscene__card-desc {
  margin: 0;
  padding-top: 16px;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #888;
  text-align: center;
  white-space: nowrap;
}


/* ============================================================
   行知澜动效（入场 + 卡片 hover），与站内其他品牌同一套：
   HTML 加 .hx-rise，brand.js 的 IntersectionObserver 加 .is-in；
   位移用 translate 属性、入场用 @keyframes，避免压掉卡片 hover 的 transform。
   ============================================================ */
@media (prefers-reduced-motion: no-preference) {
  .hx-vov__card,
  .hx-vadv__card,
  .hx-vfeat__card,
  .hx-vhl__card,
  .hx-vscene__card {
    transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1), box-shadow 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
  }

  .hx-vov__card:hover,
  .hx-vadv__card:hover,
  .hx-vfeat__card:hover,
  .hx-vhl__card:hover,
  .hx-vscene__card:hover {
    transform: translateY(-6px);
    box-shadow: 0 10px 24px rgba(20, 60, 140, 0.18);
  }

  /* 卡片错峰入场 */
  .hx-vov__cards > li,
  .hx-vadv__cards > li,
  .hx-vfeat__grid > li,
  .hx-vhl__cards > li,
  .hx-vscene__cards > li {
    --rise-delay: 0ms;
  }

  .hx-vov__cards > li:nth-child(2),
  .hx-vadv__cards > li:nth-child(2),
  .hx-vfeat__grid > li:nth-child(2),
  .hx-vhl__cards > li:nth-child(2),
  .hx-vscene__cards > li:nth-child(2) { --rise-delay: 80ms; }

  .hx-vov__cards > li:nth-child(3),
  .hx-vadv__cards > li:nth-child(3),
  .hx-vfeat__grid > li:nth-child(3),
  .hx-vhl__cards > li:nth-child(3),
  .hx-vscene__cards > li:nth-child(3) { --rise-delay: 160ms; }

  .hx-vov__cards > li:nth-child(4),
  .hx-vadv__cards > li:nth-child(4),
  .hx-vfeat__grid > li:nth-child(4),
  .hx-vhl__cards > li:nth-child(4),
  .hx-vscene__cards > li:nth-child(4) { --rise-delay: 240ms; }

  .hx-vfeat__grid > li:nth-child(5),
  .hx-vscene__cards > li:nth-child(5) { --rise-delay: 320ms; }

  .hx-vfeat__grid > li:nth-child(6) { --rise-delay: 400ms; }
}


/* ============================================================
   喜莱收 · 餐饮业子页（/brand/cashier/fnb，画板 0:6477）
   首屏独立 banner：设计 0→632 含 72 页头 → 盒高 560。
   ============================================================ */
.hx-fbanner {
  position: relative;
  width: 100%;
  min-height: 560px;
  overflow: hidden;
  background: #0b2a6b;
}

.hx-fbanner * { box-sizing: border-box; }

.hx-fbanner__stage {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 1920px;
  min-height: 560px;
}

/* 装饰：整张背景图（1920×632，含 72 页头区） */
.hx-fbanner__bg {
  position: absolute;
  top: -72px;
  left: 0;
  width: 1920px;
  height: 632px;
  background-image: url(/images/brand/cashier/fnb/banner-bg.webp);
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 1920px 632px;
}

/* 装饰：左侧蒙版 0:6501（1452×632，蓝渐变 #0057D6E6→#0056D4B3→透明），保证文案对比度 */
.hx-fbanner__shade {
  position: absolute;
  top: 0;
  left: 0;
  width: 1452px;
  height: 560px;
  background: linear-gradient(90deg, rgba(0, 87, 214, .9) 0%, rgba(0, 86, 212, .7) 48.5%, rgba(0, 85, 209, 0) 100%);
  pointer-events: none;
}

.hx-fbanner__content {
  position: relative;
  width: 100%;
  padding: 92px 0 0 277px;
  font-family: 'AlibabaPuHuiTi-3', Inter, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

/* 眉头 0:6505：34/49 #F6FAFF */
.hx-fbanner__eyebrow {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 400;
  color: #f6faff;
}

/* 标题 0:6516/0:6517：两行，字高 66、行距 82；矢量字按文字还原
   行高取 76（大于字高）避免 background-clip:text 把字形下缘裁掉 */
.hx-fbanner__title {
  margin: 22px 0 0;
  font-size: 64px;
  line-height: 76px;
  font-weight: 700;
  letter-spacing: 0;
}

.hx-fbanner__line {
  display: block;
  background: linear-gradient(180deg, #fef9f9 0%, #dde9ff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.hx-fbanner__line + .hx-fbanner__line { margin-top: 6px; }

/* 副标 0:6506：28/40 #9FC2FE（标题底 316.6 → 副标 349.5，间距 33） */
.hx-fbanner__sub {
  margin: 0;
  padding-top: 28px;
  font-size: 28px;
  line-height: 40px;
  font-weight: 400;
  color: #9fc2fe;
}

/* chips 0:6511~0:6520：圆 40、图标 24、文字 19px #C8D7FF（副标底 389.5 → 圆顶 424，间距 34.5） */
.hx-fbanner__chips {
  display: flex;
  align-items: center;
  gap: 14.5px;
  margin: 0;
  padding: 34px 0 0;
  list-style: none;
}

.hx-fbanner__chip {
  display: flex;
  align-items: center;
  gap: 8px;
}

.hx-fbanner__chip-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #649cfc;
}

.hx-fbanner__chip-badge img { display: block; object-fit: contain; }

.hx-fbanner__chip-text {
  font-size: 19px;
  line-height: 27px;
  font-weight: 400;
  color: #c8d7ff;
  white-space: nowrap;
}

/* ============================================================
   喜莱收 · 餐饮业子页正文（画板 0:6477）
   统一：stage 1920 居中 → content 1200 居中；卡片 border-box；装饰层才 absolute。
   ============================================================ */
.hx-fpain, .hx-fscene, .hx-ffeat, .hx-fsync, .hx-fadv {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.hx-fpain *, .hx-fscene *, .hx-ffeat *, .hx-fsync *, .hx-fadv * { box-sizing: border-box; }

.hx-fpain__stage, .hx-fscene__stage, .hx-ffeat__stage, .hx-fsync__stage, .hx-fadv__stage {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 1920px;
}

.hx-fpain__content, .hx-fscene__content, .hx-ffeat__content, .hx-fsync__content, .hx-fadv__content {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  font-family: 'AlibabaPuHuiTi-3', Inter, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

/* ---------- M1 经营痛点（696→1202，高 506）---------- */
.hx-fpain { background: #f6faff; }
.hx-fpain__content { padding: 61px 0 0; }

.hx-fpain__title, .hx-fscene__title, .hx-ffeat__title, .hx-fsync__title, .hx-fadv__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 700;
  color: #333;
  text-align: center;
}

.hx-fpain__sub, .hx-fscene__sub, .hx-ffeat__sub, .hx-fsync__sub {
  margin: 0;
  padding-top: 8px;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #555;
  text-align: center;
}

.hx-fpain__rule, .hx-fscene__rule, .hx-ffeat__rule, .hx-fsync__rule, .hx-fadv__rule {
  display: block;
  margin: 16px auto 0;
  height: 4px;
  background: #2d72ff;
}

.hx-fpain__rule { width: 362px; }
.hx-fscene__rule, .hx-ffeat__rule { width: 300px; }
.hx-fsync__rule { width: 348px; }
.hx-fadv__rule { width: 200px; margin-top: 10px; }

.hx-fpain__cards {
  display: grid;
  grid-template-columns: repeat(5, 224px);
  justify-content: space-between;
  margin: 0;
  padding: 60px 0 32px;
  list-style: none;
}

.hx-fpain__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: 252px;
  padding: 40px 12px 0;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
}

.hx-fpain__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 68px;
  height: 68px;
  border-radius: 50%;
  background: linear-gradient(135deg, #dbe9ff 0%, #eef5ff 100%);
}

.hx-fpain__icon img { display: block; object-fit: contain; }

.hx-fpain__card-title {
  margin: 0;
  padding-top: 14px;
  font-size: 20px;
  line-height: 29px;
  font-weight: 700;
  color: #1a1a2e;
}

.hx-fpain__card-desc {
  margin: 0;
  padding-top: 15px;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #888;
  text-align: center;
}

/* ---------- M2 适用场景（1202→1774，高 572）---------- */
.hx-fscene { background: #f9fcff; }
.hx-fscene__content { padding: 29px 0 0; }

.hx-fscene__cards {
  display: grid;
  grid-template-columns: repeat(4, 280px);
  justify-content: space-between;
  margin: 0;
  padding: 60px 0 32px;
  list-style: none;
}

.hx-fscene__card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: 350px;
  padding: 0 0 0;
  /* 底图底部自带白色，放大 115% 顶部对齐，多余底部由 overflow 裁掉 */
  background: #e4edfb url(/images/brand/cashier/fnb/scene-card-bg.webp) center top / 115% auto no-repeat;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
}

.hx-fscene__pic,
.hx-fscene__card-title,
.hx-fscene__card-desc { position: relative; }

.hx-fscene__pic {
  display: block;
  width: 280px;
  height: 190px;
  object-fit: cover;
}

.hx-fscene__card-title {
  margin: 0;
  padding-top: 30px;
  font-size: 25px;
  line-height: 36px;
  font-weight: 700;
  color: #1e293b;
}

.hx-fscene__card-desc {
  margin: 0;
  padding-top: 16px;
  font-size: 17px;
  line-height: 25px;
  font-weight: 400;
  color: #64748b;
}

/* ---------- M3 核心功能（1774→2462，高 688）---------- */
.hx-ffeat { background: #ebf4ff; }
.hx-ffeat__content { padding: 29px 0 0; }

.hx-ffeat__grid {
  display: flex;
  align-items: flex-start;
  gap: 46px;
  padding: 60px 0 69px;
}

.hx-ffeat__col {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 323px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.hx-ffeat__card {
  display: flex;
  align-items: flex-start;
  width: 323px;
  min-height: 134px;
  padding: 25px 20px 0 24px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
}

.hx-ffeat__badge {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 64px;
  width: 64px;
  height: 64px;
  margin-top: 10px;
  border-radius: 50%;
  background: #3a7afc;
}

.hx-ffeat__badge img { display: block; object-fit: contain; }

.hx-ffeat__body { margin-left: 16px; }

.hx-ffeat__card-title {
  margin: 0;
  font-size: 20px;
  line-height: 29px;
  font-weight: 700;
  color: #333;
}

.hx-ffeat__card-desc {
  margin: 0;
  padding-top: 7px;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #333;
}

.hx-ffeat__main {
  display: block;
  width: 462px;
  height: 409px;
  margin-top: 20px;
  object-fit: contain;
}

/* 中间列：主图 + 光晕椭圆（0:6585，CSS 渐变，导出无数据）+ 组合1（30:1，两道波浪线 466×148）
   坐标相对组 0:6491（组 x=360 y=1964 = 内容列起点，中间列起点 x=369）
   装饰层用 absolute，容器 relative。 */
.hx-ffeat__center {
  position: relative;
  width: 505px;
  min-height: 505px;
  margin-left: -22px;
  margin-right: -21px;
}

.hx-ffeat__halo {
  position: absolute;
  left: -21px;
  top: 180px;
  width: 505px;
  height: 169px;
  border-radius: 50%;
  background: linear-gradient(180deg, #f6faff 0%, #88bcfc 100%);
}

.hx-ffeat__center .hx-ffeat__main {
  position: relative;
  display: block;
  margin: 20px 0 0 21px;
}

.hx-ffeat__deco {
  position: absolute;
  left: -2px;
  top: 357px;
  display: block;
  width: 466px;
  height: 148px;
}

/* ---------- M4 多端协同（2462→3100，高 638）---------- */
.hx-fsync { background: #f6faff; }
.hx-fsync__content { padding: 29px 0 0; }

.hx-fsync__body {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 47px;
  padding: 56px 0 32px;
}

/* 设备组：组合4（30:4）整组导出 765×413，含 3 设备 + 弧线 + 光晕 */
.hx-fsync__devices {
  position: relative;
  width: 765px;
  flex: 0 0 765px;
  margin-left: -12px;
}

.hx-fsync__devices img { display: block; width: 765px; height: 413px; }

/* 纵向装饰线 0:6650（49×361 @相对内容 744,221），设备与卡片之间 */
.hx-fsync__line {
  position: absolute;
  left: 744px;
  top: 88px;
  display: block;
  width: 49px;
  height: 361px;
}

.hx-fsync__cards {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 400px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.hx-fsync__card {
  display: flex;
  align-items: flex-start;
  width: 400px;
  min-height: 96px;
  padding: 16px 20px 0 40px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
}

.hx-fsync__badge {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 64px;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: #d1e0ff;
}

.hx-fsync__badge img { display: block; object-fit: contain; }

.hx-fsync__body-text { margin-left: 24px; }

.hx-fsync__card-title {
  margin: 0;
  font-size: 22px;
  line-height: 32px;
  font-weight: 700;
  color: #333;
}

.hx-fsync__card-desc {
  margin: 0;
  padding-top: 5px;
  font-size: 17px;
  line-height: 25px;
  font-weight: 400;
  color: #333;
}

/* ---------- M5 产品优势（3100→3610，高 510）---------- */
.hx-fadv { background: #ebf4ff; }
.hx-fadv__content { padding: 29px 0 0; }

.hx-fadv__cards {
  display: grid;
  grid-template-columns: repeat(6, 180px);
  gap: 24px;
  margin: 0;
  padding: 60px 0 96px;
  list-style: none;
}

.hx-fadv__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: 262px;
  padding: 40px 10px 0;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
}

.hx-fadv__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background: linear-gradient(135deg, #dbe9ff 0%, #eef5ff 100%);
}

.hx-fadv__icon img { display: block; object-fit: contain; }

.hx-fadv__card-title {
  margin: 0;
  padding-top: 22px;
  font-size: 20px;
  line-height: 29px;
  font-weight: 700;
  color: #333;
}

.hx-fadv__card-desc {
  margin: 0;
  padding-top: 15px;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #333;
  text-align: center;
}

/* 卡片动效（与站内其他品牌一致） */
@media (prefers-reduced-motion: no-preference) {
  .hx-fpain__card, .hx-fscene__card, .hx-ffeat__card, .hx-fsync__card, .hx-fadv__card {
    transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1), box-shadow 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
  }

  .hx-fpain__card:hover, .hx-fscene__card:hover, .hx-ffeat__card:hover, .hx-fsync__card:hover, .hx-fadv__card:hover {
    transform: translateY(-6px);
    box-shadow: 0 10px 24px rgba(20, 60, 140, 0.18);
  }

  .hx-fpain__cards > li, .hx-fscene__cards > li, .hx-ffeat__col > li, .hx-fsync__cards > li, .hx-fadv__cards > li { --rise-delay: 0ms; }
  .hx-fpain__cards > li:nth-child(2), .hx-fscene__cards > li:nth-child(2), .hx-ffeat__col > li:nth-child(2), .hx-fsync__cards > li:nth-child(2), .hx-fadv__cards > li:nth-child(2) { --rise-delay: 80ms; }
  .hx-fpain__cards > li:nth-child(3), .hx-fscene__cards > li:nth-child(3), .hx-fsync__cards > li:nth-child(3), .hx-fadv__cards > li:nth-child(3) { --rise-delay: 160ms; }
  .hx-fpain__cards > li:nth-child(4), .hx-fscene__cards > li:nth-child(4), .hx-fsync__cards > li:nth-child(4), .hx-fadv__cards > li:nth-child(4) { --rise-delay: 240ms; }
  .hx-fpain__cards > li:nth-child(5), .hx-fadv__cards > li:nth-child(5) { --rise-delay: 320ms; }
  .hx-fadv__cards > li:nth-child(6) { --rise-delay: 400ms; }
}

/* ============================================================
   喜莱收 · 酒店子页（/brand/cashier/hotel，画板 0:6735）
   首屏独立 banner：设计 0→632 含 72 页头 → 盒高 560。
   ============================================================ */
.hx-hbanner {
  position: relative;
  width: 100%;
  min-height: 560px;
  overflow: hidden;
  background: #0b2a6b;
}

.hx-hbanner * { box-sizing: border-box; }

.hx-hbanner__stage {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 1920px;
  min-height: 560px;
}

/* 装饰：整张背景图（1920×632，含 72 页头区） */
.hx-hbanner__bg {
  position: absolute;
  top: -72px;
  left: 0;
  width: 1920px;
  height: 632px;
  background-image: url(/images/brand/cashier/hotel/banner-bg.webp);
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 1920px 632px;
}

/* 装饰：左侧蒙版 0:6764（1452×632，与餐饮同款蓝渐变） */
.hx-hbanner__shade {
  position: absolute;
  top: 0;
  left: 0;
  width: 1452px;
  height: 560px;
  background: linear-gradient(90deg, rgba(0, 87, 214, .9) 0%, rgba(0, 86, 212, .7) 48.5%, rgba(0, 85, 209, 0) 100%);
  pointer-events: none;
}

.hx-hbanner__content {
  position: relative;
  width: 100%;
  padding: 123px 0 0 277px;
  font-family: 'AlibabaPuHuiTi-3', Inter, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

/* 眉头 0:6776：34/49 #F6FAFF */
.hx-hbanner__eyebrow {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 400;
  color: #f6faff;
}

/* 标题 0:6778：单行 732×70，10 字 → 70px/70 + 字距 3（700+27=727≈732） */
.hx-hbanner__title {
  margin: 27px 0 0;
  font-size: 70px;
  line-height: 70px;
  font-weight: 700;
  letter-spacing: 3px;
  color: #fff;
}

/* 副标 0:6777：28/40 #9FC2FE（标题底 269 → 副标 300，间距 31） */
.hx-hbanner__sub {
  margin: 0;
  padding-top: 31px;
  font-size: 28px;
  line-height: 40px;
  font-weight: 400;
  color: #9fc2fe;
}

/* chips：圆 40、图标 24、文字 19px #C8D7FF（副标底 340 → 圆顶 378，间距 38） */
.hx-hbanner__chips {
  display: flex;
  align-items: center;
  gap: 14.5px;
  margin: 0;
  padding: 38px 0 0;
  list-style: none;
}

.hx-hbanner__chip {
  display: flex;
  align-items: center;
  gap: 8px;
}

.hx-hbanner__chip-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #649cfc;
}

.hx-hbanner__chip-badge img { display: block; object-fit: contain; }

.hx-hbanner__chip-text {
  font-size: 19px;
  line-height: 27px;
  font-weight: 400;
  color: #c8d7ff;
  white-space: nowrap;
}

/* ---------- 模块1 适用场景（696→1310） ---------- */
.hx-hscene {
  position: relative;
  width: 100%;
  min-height: 614px;
  overflow: hidden;
  background: #f6faff;
}

.hx-hscene * { box-sizing: border-box; }

.hx-hscene__content {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  padding: 61px 0 0;
  text-align: center;
  font-family: 'AlibabaPuHuiTi-3', Inter, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

.hx-hscene__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 700;
  color: #333;
}

.hx-hscene__sub {
  margin: 8px 0 0;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #555;
}

/* 蓝色下划线 0:6745：252×4 #2D72FF @ 设计 y854（副标底 838 → 间距 16） */
.hx-hscene__rule {
  display: block;
  width: 252px;
  height: 4px;
  margin: 16px auto 0;
  background: #2d72ff;
}

/* 卡片组 @ 设计 y918（下划线底 858 → 间距 60） */
.hx-hscene__grid {
  display: grid;
  grid-template-columns: repeat(4, 280px);
  justify-content: space-between;
  margin-top: 60px;
  text-align: left;
}

.hx-hscene__card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-height: 360px;
  padding: 0 32px;
  border-radius: 12px;
  background: linear-gradient(160deg, #fff 0%, #f6faff 100%);
  box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
}

/* 顶图：280×190，顶部两角跟随卡片圆角（用负 margin 出血抵消 padding） */
.hx-hscene__media {
  margin: 0 -32px;
  width: 280px;
  height: 190px;
  border-radius: 12px 12px 0 0;
  overflow: hidden;
}

.hx-hscene__media img {
  display: block;
  width: 280px;
  height: 190px;
  object-fit: cover;
}

/* 圆形徽章：60×60，压住图片底 30px（190 → 160） */
.hx-hscene__badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  margin-top: -30px;
  border: 1px solid #c4d7ff;
  border-radius: 50%;
  background: #fff;
}

.hx-hscene__badge img { display: block; object-fit: contain; }

.hx-hscene__name {
  margin: 14px 0 0;
  font-size: 25px;
  line-height: 36px;
  font-weight: 700;
  color: #1e293b;
}

.hx-hscene__desc {
  margin: 8px 0 0;
  font-size: 17px;
  line-height: 26px;
  font-weight: 400;
  color: #64748b;
}

/* ---------- 模块2 核心功能（1310→1872） ---------- */
.hx-hfeat {
  position: relative;
  width: 100%;
  min-height: 562px;
  overflow: hidden;
  background: #fff;
}

.hx-hfeat * { box-sizing: border-box; }

.hx-hfeat__content {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  padding: 29px 0 26px;
  text-align: center;
  font-family: 'AlibabaPuHuiTi-3', Inter, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

.hx-hfeat__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 700;
  color: #333;
}

.hx-hfeat__sub {
  margin: 8px 0 0;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #555;
}

.hx-hfeat__rule {
  display: block;
  width: 346px;
  height: 4px;
  margin: 16px auto 0;
  background: #2d72ff;
}

/* 主体：左 770 小卡网格 + 35 gap + 右 418 视觉（右侧图溢出内容列 23px，属设计原样） */
.hx-hfeat__body {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 35px;
  margin-top: 60px;
  text-align: left;
}

.hx-hfeat__grid {
  flex: none;
  display: grid;
  grid-template-columns: repeat(3, 244px);
  gap: 36px 19px;
}

.hx-hfeat__card {
  display: flex;
  align-items: flex-start;
  width: 244px;
  min-height: 152px;
  padding: 30px 19px 30px;
  border-radius: 8px;
  background: #f6faff;
  box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
}

.hx-hfeat__ico {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  margin-top: 2px;
  border-radius: 8px;
  background: #0778ff;
}

.hx-hfeat__ico img { display: block; object-fit: contain; }

.hx-hfeat__body-text { margin-left: 16px; }

.hx-hfeat__name {
  margin: 0;
  font-size: 20px;
  line-height: 29px;
  font-weight: 700;
  color: #333;
  white-space: nowrap;
}

.hx-hfeat__desc {
  margin: 7px 0 0;
  font-size: 16px;
  line-height: 28px;
  font-weight: 400;
  color: #333;
  white-space: nowrap;
}

/* ---- 右侧视觉 ---- */
.hx-hfeat__visual {
  position: relative;
  flex: none;
  width: 418px;
  margin-right: -23px;
}

/* 装饰：气泡 0:6750（307×147，含 6px 阴影外扩 → 319.5×159） */
.hx-hfeat__blob {
  position: absolute;
  top: -6px;
  left: 82px;
  width: 320px;
  height: 159px;
}

.hx-hfeat__blob img { display: block; width: 320px; height: 159px; }

/* 气泡上的文字（真 DOM）：行1 20/29、行2 24/35，均 #066CE6 */
.hx-hfeat__vtext {
  position: relative;
  z-index: 2;
  width: 307px;
  margin: 0 0 0 95px;
  padding-top: 22px;
  text-align: center;
}

.hx-hfeat__vt1 {
  display: block;
  font-size: 20px;
  line-height: 29px;
  font-weight: 700;
  color: #066ce6;
}

.hx-hfeat__vt2 {
  display: block;
  margin-top: 4px;
  font-size: 24px;
  line-height: 35px;
  font-weight: 700;
  color: #066ce6;
}

/* 产品图 0:6749：设计框 (1145,1536)（含 20px 阴影外扩）→ 视觉坐标 (-20,36) */
.hx-hfeat__vimg {
  position: relative;
  z-index: 1;
  display: block;
  width: 458px;
  height: 330px;
  margin: -54px 0 0 -20px;
}

/* ---------- 模块3 产品优势（1872→2460） ---------- */
.hx-hadv {
  position: relative;
  width: 100%;
  min-height: 588px;
  overflow: hidden;
  background: #eff6ff;
}

.hx-hadv * { box-sizing: border-box; }

.hx-hadv__content {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  padding: 29px 0 26px;
  text-align: center;
  font-family: 'AlibabaPuHuiTi-3', Inter, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

.hx-hadv__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 700;
  color: #333;
}

/* 下划线 0:6747：188×4 #2D72FF @ 设计 y1960（标题底 1950 → 间距 10） */
.hx-hadv__rule {
  display: block;
  width: 188px;
  height: 4px;
  margin: 10px auto 0;
  background: #2d72ff;
}

/* 卡片组 @ 设计 y2024（下划线底 1964 → 间距 60） */
.hx-hadv__grid {
  display: grid;
  grid-template-columns: repeat(3, 364px);
  justify-content: space-between;
  gap: 24px;
  margin-top: 60px;
  text-align: left;
}

.hx-hadv__card {
  display: flex;
  align-items: flex-start;
  width: 364px;
  min-height: 190px;
  padding: 45px 32px 0 40px;
  border-radius: 8px;
  background: #fff;
}

.hx-hadv__ico {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 72px;
  height: 72px;
  margin-top: 14px;
  border-radius: 50%;
  background: #ebf4ff;
}

.hx-hadv__ico img { display: block; object-fit: contain; }

.hx-hadv__body { margin-left: 24px; }

.hx-hadv__name {
  margin: 0;
  font-size: 22px;
  line-height: 32px;
  font-weight: 700;
  color: #333;
}

.hx-hadv__desc {
  margin: 15px 0 0;
  font-size: 17px;
  line-height: 28px;
  font-weight: 400;
  color: #333;
  white-space: nowrap;
}

/* ---------- 模块4 多端协同管控（2460→3174） ---------- */
.hx-hsync {
  position: relative;
  width: 100%;
  min-height: 714px;
  overflow: hidden;
  background: #f6faff;
}

.hx-hsync * { box-sizing: border-box; }

.hx-hsync__content {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  padding: 29px 0 104px;
  text-align: center;
  font-family: 'AlibabaPuHuiTi-3', Inter, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

.hx-hsync__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 700;
  color: #333;
}

.hx-hsync__sub {
  margin: 8px 0 0;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #555;
}

/* 下划线 0:6887：348×4 #2D72FF @ 设计 y2586（副标底 2570 → 间距 16） */
.hx-hsync__rule {
  display: block;
  width: 348px;
  height: 4px;
  margin: 16px auto 0;
  background: #2d72ff;
}

/* 主体 @ 设计 y2642（下划线底 2590 → 间距 52） */
.hx-hsync__body {
  display: flex;
  align-items: flex-start;
  gap: 47px;
  margin-top: 52px;
  text-align: left;
}

/* 左区：设计 x348（内容列 360 → 出血 -12），宽 765，高 413（装饰点 0:6915 到 3055） */
.hx-hsync__visual {
  position: relative;
  flex: none;
  width: 765px;
  height: 413px;
  margin-left: -12px;
}

.hx-hsync__visual > span {
  position: absolute;
}

.hx-hsync__visual img { display: block; }

.hx-hsync__line1 { top: 0; left: 67px; width: 607px; height: 304px; }
.hx-hsync__line2 { top: 46px; left: 143px; width: 455px; height: 228px; }
.hx-hsync__line3 { top: 42px; left: 756px; width: 49px; height: 361px; }
.hx-hsync__dot1 { top: 30px; left: 211px; width: 24px; height: 24px; }
.hx-hsync__dot2 { top: 295px; left: 179px; width: 28px; height: 28px; }
.hx-hsync__dot3 { top: 386px; left: 666px; width: 27px; height: 27px; }
.hx-hsync__dot4 { top: 348px; left: 12px; width: 47px; height: 47px; }

.hx-hsync__devices {
  position: absolute;
  top: 80px;
  left: 0;
  width: 765px;
  height: 298px;
}

/* 右卡列：起点 设计 1160（左区右缘 1113 + 47） */
.hx-hsync__list {
  flex: none;
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 8px 0 0;
  padding: 0;
  width: 400px;
  list-style: none;
}

.hx-hsync__card {
  display: flex;
  align-items: flex-start;
  width: 400px;
  min-height: 96px;
  padding: 16px 24px 0 40px;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
}

.hx-hsync__ico {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: #d1e0ff;
}

.hx-hsync__ico img { display: block; object-fit: contain; }

.hx-hsync__text { margin-left: 24px; }

.hx-hsync__name {
  margin: 0;
  font-size: 22px;
  line-height: 32px;
  font-weight: 700;
  color: #333;
  white-space: nowrap;
}

.hx-hsync__desc {
  margin: 5px 0 0;
  font-size: 17px;
  line-height: 25px;
  font-weight: 400;
  color: #333;
  white-space: nowrap;
}

/* ============================================================
   酒店子页动效（/brand/cashier/hotel）
   与站内其他品牌同节奏：入场 .hx-rise（brand.js 加 .is-in）+ 卡片 hover 上浮。
   注意：位移用 translate 属性、入场用 @keyframes，不用 transform/transition 覆盖卡片 hover。
   ============================================================ */
@media (prefers-reduced-motion: no-preference) {
  /* ---- banner 文案级联入场（与喜莱收主页同节奏 60/150/240/330ms） ---- */
  .hx-hbanner__eyebrow { --rise-delay: 60ms; }
  .hx-hbanner__title { --rise-delay: 150ms; }
  .hx-hbanner__sub { --rise-delay: 240ms; }
  .hx-hbanner__chips { --rise-delay: 330ms; }

  /* ---- 卡片 hover：上浮 + 抬阴影 ---- */
  .hx-hscene__card,
  .hx-hfeat__card,
  .hx-hadv__card,
  .hx-hsync__card {
    transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1), box-shadow 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
  }

  .hx-hscene__card:hover,
  .hx-hfeat__card:hover,
  .hx-hadv__card:hover,
  .hx-hsync__card:hover {
    transform: translateY(-6px);
    box-shadow: 0 10px 24px rgba(20, 60, 140, 0.18);
  }

  /* ---- 场景卡顶图：hover 轻微推近（0.6s 一档，太快会抖） ---- */
  .hx-hscene__media img {
    transition: transform 0.6s cubic-bezier(0.22, 0.61, 0.36, 1);
  }

  .hx-hscene__card:hover .hx-hscene__media img {
    transform: scale(1.06);
  }

  /* ---- 场景卡圆形徽章：hover 跟着抬一点，与卡片拉开层次 ---- */
  .hx-hscene__badge {
    transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
  }

  .hx-hscene__card:hover .hx-hscene__badge {
    transform: translateY(-3px);
  }

  /* ---- 模块2 功能图标块：hover 时底色提亮一档 ---- */
  .hx-hfeat__ico {
    transition: background-color 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
  }

  .hx-hfeat__card:hover .hx-hfeat__ico {
    background: #2d72ff;
  }

  /* ---- 模块3 圆形图标：hover 时放大 4%（不位移，避免和卡片上浮打架） ---- */
  .hx-hadv__ico {
    transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
  }

  .hx-hadv__card:hover .hx-hadv__ico {
    transform: scale(1.04);
  }

  /* ---- banner chips：hover 上浮 + 圆底提亮 ---- */
  .hx-hbanner__chip {
    transition: transform 0.4s cubic-bezier(0.22, 0.61, 0.36, 1);
  }

  .hx-hbanner__chip:hover {
    transform: translateY(-3px);
  }

  .hx-hbanner__chip-badge {
    transition: background-color 0.4s cubic-bezier(0.22, 0.61, 0.36, 1);
  }

  .hx-hbanner__chip:hover .hx-hbanner__chip-badge {
    background: #8fb6ff;
  }

  /* ---- 卡片错峰入场（80ms 递增，跨行接续） ---- */
  .hx-hscene__grid > article:nth-child(1),
  .hx-hfeat__grid > article:nth-child(1),
  .hx-hadv__grid > article:nth-child(1),
  .hx-hsync__list > li:nth-child(1) { --rise-delay: 0ms; }

  .hx-hscene__grid > article:nth-child(2),
  .hx-hfeat__grid > article:nth-child(2),
  .hx-hadv__grid > article:nth-child(2),
  .hx-hsync__list > li:nth-child(2) { --rise-delay: 80ms; }

  .hx-hscene__grid > article:nth-child(3),
  .hx-hfeat__grid > article:nth-child(3),
  .hx-hadv__grid > article:nth-child(3),
  .hx-hsync__list > li:nth-child(3) { --rise-delay: 160ms; }

  .hx-hscene__grid > article:nth-child(4),
  .hx-hfeat__grid > article:nth-child(4),
  .hx-hadv__grid > article:nth-child(4),
  .hx-hsync__list > li:nth-child(4) { --rise-delay: 240ms; }

  .hx-hfeat__grid > article:nth-child(5),
  .hx-hadv__grid > article:nth-child(5) { --rise-delay: 320ms; }

  .hx-hfeat__grid > article:nth-child(6),
  .hx-hadv__grid > article:nth-child(6) { --rise-delay: 400ms; }

  /* ---- 模块4 设备图：缓慢浮动，让静态区有呼吸感（6s 往返，幅度 8px） ---- */
  .hx-hsync__devices {
    animation: hx-hotel-float 6s ease-in-out infinite alternate;
  }

  @keyframes hx-hotel-float {
    from { translate: 0 0; }
    to { translate: 0 -8px; }
  }
}

/* ============================================================
   喜莱收 · 美业子页（/brand/cashier/beauty，画板 0:6971）
   首屏与酒店/餐饮同版式，但整体是浅色系：白底实景图 + 深色文字。
   设计 0→632 含 72 页头 → 盒高 560。
   ============================================================ */
.hx-mbanner {
  position: relative;
  width: 100%;
  min-height: 560px;
  overflow: hidden;
  background: #eef4ff;
}

.hx-mbanner * { box-sizing: border-box; }

.hx-mbanner__stage {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 1920px;
  min-height: 560px;
}

/* 装饰：整张背景图（1920×632，含 72 页头区） */
.hx-mbanner__bg {
  position: absolute;
  top: -72px;
  left: 0;
  width: 1920px;
  height: 632px;
  background-image: url(/images/brand/cashier/beauty/banner-bg.webp);
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 1920px 632px;
}

/* 装饰：左侧蒙版 0:6998（1200×632，左白右透明） */
.hx-mbanner__shade {
  position: absolute;
  top: 0;
  left: 0;
  width: 1200px;
  height: 560px;
  background: linear-gradient(90deg, rgba(238, 244, 255, .97) 0%, rgba(213, 230, 255, .85) 60%, rgba(193, 218, 255, 0) 100%);
  pointer-events: none;
}

.hx-mbanner__content {
  position: relative;
  width: 100%;
  padding: 123px 0 0 277px;
  font-family: 'AlibabaPuHuiTi-3', Inter, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

/* 眉头 0:7010：34/49 #333 */
.hx-mbanner__eyebrow {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 400;
  color: #333;
}

/* 标题 0:7014：单行 742×73，10 字 → 73px/73 + 字距 1.3；渐变 #004A8D → #002047（上→下） */
.hx-mbanner__title {
  margin: 26px 0 0;
  font-size: 73px;
  line-height: 73px;
  font-weight: 700;
  letter-spacing: 1.3px;
  background: linear-gradient(180deg, #004a8d 0%, #002047 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* 副标 0:7011：28/40 #00244E（标题底 269 → 副标 300，间距 31） */
.hx-mbanner__sub {
  margin: 0;
  padding-top: 31px;
  font-size: 28px;
  line-height: 40px;
  font-weight: 400;
  color: #00244e;
}

/* chips：圆 40/#649CFC、图标 24、文字 19px #00244E（副标底 340 → 圆顶 378，间距 38） */
.hx-mbanner__chips {
  display: flex;
  align-items: center;
  gap: 15px;
  margin: 0;
  padding: 38px 0 0;
  list-style: none;
}

.hx-mbanner__chip {
  display: flex;
  align-items: center;
  gap: 8px;
}

.hx-mbanner__chip-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #649cfc;
}

.hx-mbanner__chip-badge img { display: block; object-fit: contain; }

.hx-mbanner__chip-text {
  font-size: 19px;
  line-height: 27px;
  font-weight: 400;
  color: #00244e;
  white-space: nowrap;
}

/* ---------- 美业 · 模块1 适用场景（696→1310） ---------- */
.hx-mscene {
  position: relative;
  width: 100%;
  min-height: 614px;
  overflow: hidden;
  background: #f6faff;
}

.hx-mscene * { box-sizing: border-box; }

.hx-mscene__content {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  padding: 61px 0 0;
  text-align: center;
  font-family: 'AlibabaPuHuiTi-3', Inter, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

.hx-mscene__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 700;
  color: #333;
}

.hx-mscene__sub {
  margin: 8px 0 0;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #555;
}

/* 下划线 0:6980：252×4 #2D72FF @ 设计 y854（副标底 838 → 间距 16） */
.hx-mscene__rule {
  display: block;
  width: 252px;
  height: 4px;
  margin: 16px auto 0;
  background: #2d72ff;
}

/* 卡片组 @ 设计 y918（下划线底 858 → 间距 60） */
.hx-mscene__grid {
  display: grid;
  grid-template-columns: repeat(4, 280px);
  justify-content: space-between;
  margin-top: 60px;
}

.hx-mscene__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: 360px;
  padding: 0 32px;
  border-radius: 12px;
  background: linear-gradient(160deg, #fff 0%, #f6faff 100%);
  box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
}

/* 顶图：280×190，用负 margin 出血抵消左右 padding */
.hx-mscene__media {
  margin: 0 -32px;
  width: 280px;
  height: 190px;
  border-radius: 12px 12px 0 0;
  overflow: hidden;
}

.hx-mscene__media img {
  display: block;
  width: 280px;
  height: 190px;
  object-fit: cover;
}

/* 圆形徽章 60×60：居中压在图片底 30px 上（190 → 160） */
.hx-mscene__badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  margin-top: -30px;
  border: 1px solid #c4d7ff;
  border-radius: 50%;
  background: #fff;
}

.hx-mscene__badge img { display: block; object-fit: contain; }

.hx-mscene__name {
  margin: 14px 0 0;
  font-size: 25px;
  line-height: 36px;
  font-weight: 700;
  color: #1e293b;
}

.hx-mscene__desc {
  margin: 8px 0 0;
  font-size: 17px;
  line-height: 26px;
  font-weight: 400;
  color: #64748b;
}

/* ---------- 美业 · 模块2 核心功能（1310→1904） ---------- */
.hx-mfeat {
  position: relative;
  width: 100%;
  min-height: 594px;
  overflow: hidden;
  background: #eff6ff;
}

.hx-mfeat * { box-sizing: border-box; }

.hx-mfeat__content {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  padding: 29px 0 21px;
  text-align: center;
  font-family: 'AlibabaPuHuiTi-3', Inter, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

.hx-mfeat__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 700;
  color: #333;
}

.hx-mfeat__sub {
  margin: 8px 0 0;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #555;
}

/* 下划线 0:6981：300×4 #2D72FF @ 设计 y1436（副标底 1420 → 间距 16） */
.hx-mfeat__rule {
  display: block;
  width: 300px;
  height: 4px;
  margin: 16px auto 0;
  background: #2d72ff;
}

/* 三列 @ 设计 y1497（下划线底 1440 → 间距 57）
   左列右缘 678 与中图 659 有 19px 重叠（设计原样，文字不占满所以不撞）→ 中列 margin-left -19 */
.hx-mfeat__body {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  margin-top: 57px;
  text-align: left;
}

.hx-mfeat__col {
  flex: none;
  display: flex;
  flex-direction: column;
  gap: 37px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.hx-mfeat__col--left { width: 318px; }
.hx-mfeat__col--right { width: 284px; margin-left: 17px; }

.hx-mfeat__item {
  display: flex;
  align-items: flex-start;
  min-height: 93px;
}

/* 圆 90×90 白底 + 阴影（项内 y 偏 3） */
.hx-mfeat__ico {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 90px;
  height: 90px;
  margin-top: 3px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
}

/* 图标双层还原：设计是深 #4280FF 在上 + 浅 #C4D5FF 偏移 (2,2) 在下，
   用硬边 drop-shadow 投出同形状的浅色层，省一张贴图 */
.hx-mfeat__ico img {
  display: block;
  object-fit: contain;
  filter: drop-shadow(2px 2px 0 #c4d5ff);
}

.hx-mfeat__txt { margin-left: 24px; }

.hx-mfeat__name {
  margin: 0;
  font-size: 22px;
  line-height: 32px;
  font-weight: 700;
  color: #333;
  white-space: nowrap;
}

.hx-mfeat__desc {
  margin: 6px 0 0;
  font-size: 17px;
  line-height: 28px;
  font-weight: 400;
  color: #333;
  white-space: nowrap;
}

/* 中间产品图：设计组 603×394 @ (659,1478)，导出含阴影外扩 12×21 → 615×415 @ (653,1467.5) */
.hx-mfeat__visual {
  position: relative;
  flex: none;
  width: 603px;
  margin-left: -19px;
}

.hx-mfeat__main {
  position: relative;
  display: block;
  width: 615px;
  height: 415px;
  margin: -29.5px 0 0 -6px;
}

/* 装饰：底部渐变光晕（0:7056 323×40 @ 设计 (800,1744) / 0:7057 82×13 @ (1074,1772)）
   坐标相对 visual（x659 / y1478） */
.hx-mfeat__glow1,
.hx-mfeat__glow2 {
  position: absolute;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  pointer-events: none;
}

.hx-mfeat__glow1 {
  top: 266px;
  left: 141px;
  width: 323px;
  height: 40px;
  background-image: url(/images/brand/cashier/beauty/mf-glow1.webp);
}

.hx-mfeat__glow2 {
  top: 294px;
  left: 415px;
  width: 82px;
  height: 13px;
  background-image: url(/images/brand/cashier/beauty/mf-glow2.webp);
}

/* ---------- 美业 · 模块3 产品优势（1904→2303） ---------- */
.hx-madv {
  position: relative;
  width: 100%;
  min-height: 399px;
  overflow: hidden;
  background: #f3f9ff;
}

.hx-madv * { box-sizing: border-box; }

.hx-madv__content {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  padding: 29px 0 31px;
  text-align: center;
  font-family: 'AlibabaPuHuiTi-3', Inter, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

.hx-madv__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 700;
  color: #333;
}

/* 下划线 0:7094：240×4 #2D72FF @ 设计 y1992（标题底 1982 → 间距 10） */
.hx-madv__rule {
  display: block;
  width: 240px;
  height: 4px;
  margin: 10px auto 0;
  background: #2d72ff;
}

/* 5 项 @ 设计 y2056（下划线底 1996 → 间距 60），左缘 360、右缘 1563 */
.hx-madv__list {
  display: flex;
  justify-content: space-between;
  width: 1203px;
  margin: 60px 0 0;
  padding: 0;
  list-style: none;
}

.hx-madv__item {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 153px;
}

/* 项间竖分隔线：1×214 #4280FF，位于相邻项中点（相对 153 宽项往右 40px） */
.hx-madv__item:not(:last-child)::after {
  content: '';
  position: absolute;
  top: 0;
  left: 193px;
  width: 1px;
  height: 214px;
  background: #4280ff;
}

/* 圆 96×96 渐变（0:7108 等，LINEAR 约 210°：#E8F2FF → #B7D4FC） */
.hx-madv__ico {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 96px;
  height: 96px;
  border-radius: 50%;
  background: linear-gradient(210deg, #e8f2ff 0%, #b7d4fc 100%);
}

.hx-madv__ico img { display: block; object-fit: contain; }

.hx-madv__name {
  margin: 21px 0 0;
  font-size: 22px;
  line-height: 32px;
  font-weight: 700;
  color: #333;
  white-space: nowrap;
}

.hx-madv__desc {
  margin: 15px 0 0;
  font-size: 17px;
  line-height: 26px;
  font-weight: 400;
  color: #333;
  white-space: nowrap;
}

/* ---------- 美业 · 模块4 耗材进销存管理（2303→2876） ---------- */
.hx-minv {
  position: relative;
  width: 100%;
  min-height: 573px;
  overflow: hidden;
  background: #e9f1fc;
}

.hx-minv * { box-sizing: border-box; }

.hx-minv__content {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  padding: 29px 0 10px;
  text-align: center;
  font-family: 'AlibabaPuHuiTi-3', Inter, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

.hx-minv__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 700;
  color: #333;
}

.hx-minv__sub {
  margin: 8px 0 0;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #555;
}

/* 下划线 0:7126：275×4 #2D72FF @ 设计 y2429（副标底 2413 → 间距 16） */
.hx-minv__rule {
  display: block;
  width: 275px;
  height: 4px;
  margin: 16px auto 0;
  background: #2d72ff;
}

/* 主体 @ 设计 y2493（下划线底 2433 → 间距 60）
   左列 544（圆 46 + 16 + 卡 482）+ 29 + 右视觉 668 = 1241，右缘溢出内容列 41px（设计原样） */
.hx-minv__body {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 29px;
  margin-top: 60px;
  text-align: left;
}

.hx-minv__list {
  flex: none;
  display: flex;
  flex-direction: column;
  gap: 23px;
  margin: 0;
  padding: 0;
  list-style: none;
}

/* 行 = 勾选圆 46（垂直居中于 60 高的卡）+ 卡 482 */
.hx-minv__row {
  display: flex;
  align-items: center;
  gap: 16px;
  height: 60px;
}

.hx-minv__check {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: linear-gradient(210deg, #67a2ff 0%, #8fc3ff 100%);
}

.hx-minv__check img { display: block; object-fit: contain; }

.hx-minv__card {
  display: flex;
  align-items: center;
  width: 482px;
  height: 60px;
  padding: 0 24px;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
}

.hx-minv__name {
  flex: none;
  width: 146px;
  margin: 0;
  font-size: 22px;
  line-height: 32px;
  font-weight: 700;
  color: #333;
  white-space: nowrap;
}

.hx-minv__desc {
  margin: 0;
  font-size: 17px;
  line-height: 25px;
  font-weight: 400;
  color: #6a6a6a;
  white-space: nowrap;
}

/* ---- 右侧视觉 0:7131：668×445 @ 设计 (933,2421)，比左列首行高 72px ---- */
.hx-minv__visual {
  position: relative;
  flex: none;
  width: 668px;
  height: 445px;
  margin-top: -72px;
}

.hx-minv__visual > span {
  position: absolute;
  border-radius: 50%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  pointer-events: none;
}

/* 装饰光晕（导出图，定位按设计框左上） */
.hx-minv__halo1 { top: 27px; left: 210px; width: 362px; height: 362px; background-image: url(/images/brand/cashier/beauty/inv-halo1.webp); }
.hx-minv__halo2 { top: 164px; left: 78px; width: 179px; height: 180px; background-image: url(/images/brand/cashier/beauty/inv-halo2.webp); }
.hx-minv__halo3 { top: 278px; left: 489px; width: 138px; height: 140px; background-image: url(/images/brand/cashier/beauty/inv-halo3.webp); }

/* 装饰小圆点（纯渐变，CSS 画） */
.hx-minv__dot1 { top: 23px; left: 501px; width: 88px; height: 88px; background: linear-gradient(210deg, #e8f2ff 0%, #b7d4fc 100%); }
.hx-minv__dot2 { top: 383px; left: 0; width: 34px; height: 34px; background: linear-gradient(210deg, #e8f2ff 0%, #a9cbfa 100%); }
.hx-minv__dot3 { top: 0; left: 586px; width: 16px; height: 16px; background: linear-gradient(210deg, #e2eeff 0%, #b7d4fc 100%); }

/* 底座 0:7151 与产品图 0:7152 */
.hx-minv__base {
  position: absolute;
  top: 19px;
  left: 2px;
  width: 666px;
  height: 426px;
}

.hx-minv__main {
  position: absolute;
  top: 38px;
  left: 27px;
  width: 638px;
  height: 358px;
}

/* 蓝色标注块 0:7161（151×80 #3C9EFE）+ 左下尖角 0:7162 */
.hx-minv__tip {
  position: absolute;
  top: 65px;
  left: 462px;
  width: 151px;
  height: 80px;
  padding: 14px 12px 0;
  border-radius: 8px;
  background: #3c9efe;
  box-shadow: 0 3px 6px rgba(0, 0, 0, .12);
}

/* 尖角：挂在标注块下方偏左（设计 0:7162 @ 相对块 (9,74)，30×18） */
.hx-minv__tip::after {
  content: '';
  position: absolute;
  bottom: -16px;
  left: 9px;
  width: 0;
  height: 0;
  border-left: 11px solid transparent;
  border-right: 19px solid transparent;
  border-top: 18px solid #3c9efe;
}

.hx-minv__tip-text {
  margin: 0;
  font-size: 16px;
  line-height: 24px;
  font-weight: 700;
  color: #fff;
  text-align: center;
}

/* ---------- 美业 · 模块5 营销拓客能力（2876→3414） ---------- */
.hx-mmkt {
  position: relative;
  width: 100%;
  min-height: 538px;
  overflow: hidden;
  background: #f6faff;
}

.hx-mmkt * { box-sizing: border-box; }

.hx-mmkt__content {
  position: relative;
  width: 1200px;
  margin: 0 auto;
  padding: 29px 0 96px;
  text-align: center;
  font-family: 'AlibabaPuHuiTi-3', Inter, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

.hx-mmkt__title {
  margin: 0;
  font-size: 34px;
  line-height: 49px;
  font-weight: 700;
  color: #333;
}

.hx-mmkt__sub {
  margin: 8px 0 0;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #555;
}

/* 下划线 0:7166：330×4 #2D72FF @ 设计 y3002（副标底 2986 → 间距 16） */
.hx-mmkt__rule {
  display: block;
  width: 330px;
  height: 4px;
  margin: 16px auto 0;
  background: #2d72ff;
}

/* 5 卡 @ 设计 y3066（下划线底 3006 → 间距 60），224 宽 gap 20，总 1200 */
.hx-mmkt__list {
  display: grid;
  grid-template-columns: repeat(5, 224px);
  gap: 20px;
  margin: 60px 0 0;
  padding: 0;
  list-style: none;
}

.hx-mmkt__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 224px;
  min-height: 252px;
  padding: 40px 0 0;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
}

/* 圆 68×68（0:7173 等，LINEAR 约 210°：#E8F4FD → #80C5FF） */
.hx-mmkt__ico {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 68px;
  height: 68px;
  border-radius: 50%;
  background: linear-gradient(210deg, #e8f4fd 0%, #80c5ff 100%);
}

.hx-mmkt__ico img { display: block; object-fit: contain; }

.hx-mmkt__name {
  margin: 14px 0 0;
  font-size: 20px;
  line-height: 29px;
  font-weight: 700;
  color: #1a1a2e;
}

.hx-mmkt__desc {
  margin: 15px 0 0;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
  color: #888;
}

/* ============================================================
   美业子页动效（/brand/cashier/beauty）
   与站内其他品牌同节奏：入场 .hx-rise + hover；位移用 translate/transform，不覆盖卡片过渡。
   ============================================================ */
@media (prefers-reduced-motion: no-preference) {
  /* ---- banner 文案级联 ---- */
  .hx-mbanner__eyebrow { --rise-delay: 60ms; }
  .hx-mbanner__title { --rise-delay: 150ms; }
  .hx-mbanner__sub { --rise-delay: 240ms; }
  .hx-mbanner__chips { --rise-delay: 330ms; }

  /* ---- 场景卡 / 营销卡：上浮 + 抬阴影 ---- */
  .hx-mscene__card,
  .hx-mmkt__card {
    transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1), box-shadow 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
  }

  .hx-mscene__card:hover,
  .hx-mmkt__card:hover {
    transform: translateY(-6px);
    box-shadow: 0 10px 24px rgba(20, 60, 140, 0.18);
  }

  /* 场景卡顶图推近 + 徽章抬起 */
  .hx-mscene__media img { transition: transform 0.6s cubic-bezier(0.22, 0.61, 0.36, 1); }
  .hx-mscene__card:hover .hx-mscene__media img { transform: scale(1.06); }
  .hx-mscene__badge { transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1); }
  .hx-mscene__card:hover .hx-mscene__badge { transform: translateY(-3px); }

  /* ---- 核心功能项：圆形图标放大（无卡片底色，不做位移） ---- */
  .hx-mfeat__ico { transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1), box-shadow 0.45s cubic-bezier(0.22, 0.61, 0.36, 1); }
  .hx-mfeat__item:hover .hx-mfeat__ico {
    transform: scale(1.06);
    box-shadow: 0 8px 18px rgba(20, 60, 140, .18);
  }
  .hx-mfeat__item:hover .hx-mfeat__name { color: #0b6cff; }
  .hx-mfeat__name { transition: color 0.45s cubic-bezier(0.22, 0.61, 0.36, 1); }

  /* ---- 产品优势项：圆图标放大 + 标题变色 ---- */
  .hx-madv__ico { transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1); }
  .hx-madv__item:hover .hx-madv__ico { transform: scale(1.06); }
  .hx-madv__name { transition: color 0.45s cubic-bezier(0.22, 0.61, 0.36, 1); }
  .hx-madv__item:hover .hx-madv__name { color: #0b6cff; }

  /* ---- 耗材行：横向卡片，hover 右移 4px + 抬阴影 ---- */
  .hx-minv__card {
    transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1), box-shadow 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
  }

  .hx-minv__row:hover .hx-minv__card {
    transform: translateX(4px);
    box-shadow: 0 8px 18px rgba(20, 60, 140, 0.18);
  }

  .hx-minv__check { transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1); }
  .hx-minv__row:hover .hx-minv__check { transform: scale(1.08); }

  /* ---- 标注块：轻微上下浮动，强调"实时" ---- */
  .hx-minv__tip { animation: hx-beauty-float 5s ease-in-out infinite alternate; }

  @keyframes hx-beauty-float {
    from { translate: 0 0; }
    to { translate: 0 -6px; }
  }

  /* ---- 卡片错峰入场 ---- */
  .hx-mscene__grid > article:nth-child(1),
  .hx-mfeat__col--left > li:nth-child(1),
  .hx-madv__list > li:nth-child(1),
  .hx-minv__list > li:nth-child(1),
  .hx-mmkt__list > li:nth-child(1) { --rise-delay: 0ms; }

  .hx-mscene__grid > article:nth-child(2),
  .hx-mfeat__col--left > li:nth-child(2),
  .hx-madv__list > li:nth-child(2),
  .hx-minv__list > li:nth-child(2),
  .hx-mmkt__list > li:nth-child(2) { --rise-delay: 80ms; }

  .hx-mscene__grid > article:nth-child(3),
  .hx-mfeat__col--left > li:nth-child(3),
  .hx-madv__list > li:nth-child(3),
  .hx-minv__list > li:nth-child(3),
  .hx-mmkt__list > li:nth-child(3) { --rise-delay: 160ms; }

  .hx-mscene__grid > article:nth-child(4),
  .hx-madv__list > li:nth-child(4),
  .hx-minv__list > li:nth-child(4),
  .hx-mmkt__list > li:nth-child(4) { --rise-delay: 240ms; }

  .hx-madv__list > li:nth-child(5),
  .hx-mmkt__list > li:nth-child(5) { --rise-delay: 320ms; }

  /* 核心功能右列跟着左列接续 */
  .hx-mfeat__col--right > li:nth-child(1) { --rise-delay: 240ms; }
  .hx-mfeat__col--right > li:nth-child(2) { --rise-delay: 320ms; }
  .hx-mfeat__col--right > li:nth-child(3) { --rise-delay: 400ms; }
}
