/* 生活通O2O详情页专属样式：5 个 sections（本页无 JS，无 home.js 逻辑；main 全局 common.css 先行） */
/* v2 镜像 shequo2o 模板：头收敛 sectionHead（lineColor #1890ff）＋卡片 grid 流式＋reveal＋hover（只动本文件） */

/* ============ life 试点：阿里普惠体按字重映射（400→55 Regular，700→85 Bold；族在 common.css 注册） ============ */
[class*="life-"] {
  font-family: 'AlibabaPuHuiTi-3', Inter, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

/* ============ Banner life-banner（区间[696,1080]高384） ============ */
/* 去图层化：section min-height:384＋overflow:hidden；bg 盒定宽 1920 居中（背景定则 B，cover 不动，
   1920 下逐像素一致，窄屏对称裁边）；stage 100%+max-width:1920px；
   content 100%+max-width:1200px 居中承接标题（标题左对齐，用内容列 left:0，1920 下内容左缘 360 不动）；
   文案在内容列内保留；bg 固定 height 改 min-height（残留图层写法修）；无 z-index；无断点 */
.life-banner {
  position: relative;
  width: 100%;
  min-height: 384px;
  overflow: hidden;
  scroll-margin-top: 88px; /* 轮播直达锚：吸顶 72＋16，id="lifb" */
}

.life-banner__bg {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 0;
  width: 1920px;
  min-height: 384px;
  height: 100%;
  background: url('/images/life/life-banner-2452.jpg') center / cover no-repeat;
}

.life-banner__stage {
  position: relative;
  width: 100%;
  max-width: 1920px;
  min-height: 384px;
  margin: 0 auto;
}

.life-banner__content {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 0;
  width: 100%;
  max-width: 1200px;
  min-height: 384px;
}

/* 标题：内容列(0,121) 571×97，80px #1A1A2E 左 */
.life-banner__title {
  position: absolute;
  left: 0;
  top: 121px;
  width: 571px;
  height: 97px;
  margin: 0;
  font-size: 80px;
  line-height: 97px;
  font-weight: 400;
  color: #1a1a2e;
  text-align: left;
  white-space: nowrap;
}

/* 副标题：内容列(0,244) 303×24，20px #1890FF 左 */
.life-banner__sub {
  position: absolute;
  left: 0;
  top: 244px;
  width: 303px;
  height: 24px;
  margin: 0;
  font-size: 20px;
  line-height: 24px;
  font-weight: 400;
  color: #1890ff;
  text-align: left;
  white-space: nowrap;
}

/* ============ 产品概述 life-overview（区间[1080,1749]高669） ============ */
/* 去图层化 v2（镜像 shequo2o 流式）：整组 absolute 改正常流——section 加 box-sizing＋padding-top:67
   （原组 top:67），组改 relative＋margin:0 auto 居中（宽 655，1920 下组左缘 632.5≈633 原值）；
   组内标题/蓝条/配图/描述相对组不动（组是定位上下文）；描述去 height 留 min-height:87（内容长撑组）；
   底 gradient 全幅直接画 section；section 保 min-height:669（组 560＋顶 67＝627，余 42 下垫）；
   头左对齐保持特有，不用 sectionHead；无 z-index；无断点 */
.life-overview {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  min-height: 669px;
  padding-top: 67px;
  background: linear-gradient(180deg, #f6fafe, #fffbfb);
}

.life-overview__group {
  position: relative;
  width: 655px;
  min-height: 560px;
  margin: 0 auto;
}

/* 标题：组内(260,0) 136×41，34px #000 左 */
.life-overview__title {
  position: absolute;
  left: 260px;
  top: 0;
  width: 136px;
  height: 41px;
  margin: 0;
  font-size: 34px;
  line-height: 41px;
  font-weight: 400;
  text-align: left;
  color: #000;
  white-space: nowrap;
}

/* 蓝条：组内(232,53) 190×6 #1890FF */
.life-overview__line {
  position: absolute;
  left: 232px;
  top: 53px;
  width: 190px;
  height: 6px;
  background: #1890ff;
}

/* 配图：组内(0,99) 653×340 r12 cover */
.life-overview__img {
  position: absolute;
  left: 0;
  top: 99px;
  width: 653px;
  height: 340px;
  border-radius: 12px;
  object-fit: cover;
  display: block;
}

/* 描述：组内(8,473) 648×87，24px #555 pre-line（源码换行保留，原案分行；去 height 留 min-height） */
.life-overview__desc {
  position: absolute;
  left: 8px;
  top: 473px;
  width: 648px;
  min-height: 87px;
  margin: 0;
  font-size: 24px;
  line-height: 33px;
  font-weight: 400;
  color: #555;
  white-space: pre-line;
}

/* ============ 核心功能 life-features（区间[1779,2321]高542，底 #F8F9FD） ============ */
/* 去图层化 v2（镜像 shequo2o 流式）：头换 sectionHead（标题 34 #1a1a2e／线 190×6 #1890ff／缝 12），
   section 加 box-sizing＋padding-top:5（原标题 top:5），头高 5+41+12+6=64；
   六卡改 grid 3 列 384px、列缝 24（0/408/816 反推：408−384=24，816−408−384=24，3×384+2×24=1200 整）、
   行缝 40（298−128−130），卡片区 margin-top:64（128−64，原上行卡 top:128 一致）；
   卡改 relative（DOM 顺序即 grid 顺序，inline left/top 删除）；卡内圆/图标/标题/描述相对卡不动；
   底白条改流式跟 grid 下面（relative＋width:990＋margin:32px auto 0，460−(298+130)=32，
   (1200−990)/2=105 居中与原 left:105 等价；条内 item 相对白条不动）；
   stage 去 min-height（高度归 section 管）；无 z-index；无断点 */
.life-features {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  min-height: 542px;
  padding-top: 5px;
  background: #f8f9fd;
}

.lf-features__stage {
  position: relative;
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
}

/* 内容列：grid 3×384，缝 24／行 40，margin-top:64 */
.lf-features__content {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, 384px);
  column-gap: 24px;
  row-gap: 40px;
  width: 100%;
  max-width: 1200px;
  margin: 64px auto 0;
}

/* 格：384×130 白卡 r10（grid 项 relative；hover 上浮照 home.css:634 产品卡值） */
.lf-features__cell {
  position: relative;
  width: 384px;
  height: 130px;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.lf-features__cell:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 24px rgba(37, 99, 200, 0.25);
}

/* 圆底：24,26 79×79 #E8F1FF */
.lf-features__circle {
  position: absolute;
  left: 24px;
  top: 26px;
  width: 79px;
  height: 79px;
  border-radius: 50%;
  background: #e8f1ff;
}

/* 图标：相对格几何，contain（hover 缩放 scale(1.2)，transition 0.3s） */
.lf-features__icon {
  position: absolute;
  object-fit: contain;
  display: block;
  transition: transform 0.3s ease;
}

.lf-features__cell:hover .lf-features__icon {
  transform: scale(1.2);
}

/* 格标题：149,27 w72，18px #1A1A2E 左 */
.lf-features__cell-title {
  position: absolute;
  height: 22px;
  margin: 0;
  font-size: 18px;
  line-height: 22px;
  font-weight: 400;
  color: #1a1a2e;
  text-align: left;
  white-space: nowrap;
}

/* 格描述：149,65 w210（骑手 69/196），14px #666 左 pre-line */
.lf-features__cell-desc {
  position: absolute;
  margin: 0;
  font-size: 14px;
  line-height: 17px;
  font-weight: 400;
  color: #666;
  text-align: left;
  white-space: pre-line;
}

/* 底部白条：流式（relative＋990＋margin:32px auto 0），50 高 r14 白底 */
.lf-features__bottom {
  position: relative;
  width: 990px;
  height: 50px;
  margin: 32px auto 0;
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.lf-features__bottom-item {
  position: absolute;
  display: flex;
  align-items: center;
  gap: 12px;
  height: 18px;
}

/* 蓝圆点 8×8 #1890FF */
.lf-features__dot {
  flex: none;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #1890ff;
}

/* 底条文字 14px #444 */
.lf-features__bottom-text {
  font-size: 14px;
  line-height: 17px;
  font-weight: 400;
  color: #444;
  white-space: nowrap;
}

/* ============ 产品优势 life-adv（区间[2321,2651]高330，底 #D5E4FC 全幅） ============ */
/* 去图层化 v2（镜像 shequo2o 流式）：头换 sectionHead（标题 34 #1a1a2e／线 190×6 #1890ff／缝 12），
   section 加 box-sizing＋padding-top:35（原标题 top:35），头高 35+41+12+6=94；
   四卡改 grid 4 列 285px、列缝 20（0/305/612/915 反推：总缝 1200−4×285=60，均 20；
   均缝下第三卡 610 与原 612 差 2，nth-child(3) left:2px 归整，类比 sq-scenes 末卡做法），
   卡片区 margin-top:64（158−94，原卡 top:158 一致）；
   卡改 relative（inline left 删除）；卡内圆/数字/标题/描述相对卡不动（标题自带 50%+translate 保留）；
   stage 去 min-height；无 z-index；无断点 */
.life-adv {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  min-height: 330px;
  padding-top: 35px;
  background: #d5e4fc;
}

.lf-adv-stage {
  position: relative;
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
}

/* 内容列：grid 4×285，缝 20，margin-top:64 */
.lf-adv-content {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, 285px);
  column-gap: 20px;
  width: 100%;
  max-width: 1200px;
  margin: 64px auto 0;
}

.lf-adv-card {
  position: relative;
  width: 285px;
  height: 140px;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.lf-adv-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 24px rgba(37, 99, 200, 0.25);
}

/* 第三卡左移 2px 归整（均缝 20 下 610→612，与原内容列 x 一致） */
.lf-adv-card:nth-child(3) {
  left: 2px;
}

.lf-adv-icon {
  position: absolute;
  left: 119px;
  top: 16px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #e8f1ff;
}

.lf-adv-num {
  position: absolute;
  height: 39px;
  margin: 0;
  font-size: 32px;
  line-height: 39px;
  font-weight: 400;
  color: #1890ff;
}

.lf-adv-card-title {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 74px;
  height: 19px;
  margin: 0;
  font-size: 16px;
  line-height: 19px;
  font-weight: 400;
  color: #1a1a2e;
  text-align: center;
  white-space: nowrap;
}

.lf-adv-card-desc {
  position: absolute;
  top: 100px;
  height: 15px;
  margin: 0;
  font-size: 12px;
  line-height: 15px;
  font-weight: 400;
  color: #888888;
  text-align: center;
  white-space: nowrap;
}

/* ============ 应用场景 life-sce（区间[2651,3584]高933） ============ */
/* 去图层化 v2（镜像 shequo2o 流式）：头换 sectionHead（标题 34 #1a1a2e／线 190×6 #1890ff／缝 12），
   section 加 box-sizing＋padding-top:35（原 body top:35），头高 41+12+6=53（标题/线纵节奏与原 0/53 一致）；
   body 改正常流（relative＋100%+max-width:1200px＋margin:0 auto；absolute bg 层下按流式教训加
   position:relative 无偏移抬到定位层；1920 下 body 左缘 360 与原 left:360 一致）；
   六卡改 grid 6 列 183px、列缝 20＋justify-content:center（原排序 0/203/407/610/814/1017，
   总缝 1200−6×183=102，均 20.4；取 20＋居中，6×183+5×20=1198，首卡 x≈1，与原 ±1 保像素），
   卡片区 margin-top:51（卡相对 body：104−53=51，原卡 top:104 一致；
   舞台验算：body 顶 35＋头 53＝88，卡顶 35+104=139，139−88=51）；
   卡改 relative（inline left/top 删除）；卡内白/蓝顶/glyph/desc 相对卡不动，round 卡⑥条件类保留；
   sub 改流式居中（relative＋688＋margin:101px auto 0，701−(104+496)=101；absolute/translate 删除）；
   btn 改流式居中（relative＋margin:65px auto 0，785−(701+19)=65；flex 居中保留，不加跳转）；
   bg 盒 width:1920px＋left:50%＋translateX（cover 不动，背景定则 B）改 top:0＋height:100%
   （原 bottom:0 高 933；流式下 section 随内容长，bg 跟高全覆盖，min-height:933 保底）；
   section 保 min-height:933＋overflow:hidden；stage 去 min-height；无 z-index；无断点 */
.life-sce {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  min-height: 933px;
  padding-top: 35px;
  overflow: hidden;
}

.life-sce__bg {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 0;
  width: 1920px;
  height: 100%;
  min-height: 933px;
  background: url('/images/life/life-bg-a75b1f.jpg') center bottom / cover no-repeat;
}

.life-sce__stage {
  position: relative;
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
}

/* 组190：流式内容列（relative 抬定位层，1200 居中） */
.life-sce__body {
  position: relative;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
}

.life-sce__cards {
  position: relative;
  display: grid;
  grid-template-columns: repeat(6, 183px);
  column-gap: 20px;
  justify-content: center;
  width: 100%;
  max-width: 1200px;
  margin: 51px auto 0;
}

.life-sce__card {
  position: relative;
  width: 183px;
  height: 496px;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.life-sce__card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 24px rgba(37, 99, 200, 0.25);
}

.life-sce__card--round .life-sce__white {
  top: 0;
  height: 496px;
  border-radius: 12px;
}

.life-sce__white {
  position: absolute;
  left: 0;
  top: 165px;
  width: 183px;
  height: 331px;
  background: #ffffff;
}

.life-sce__top {
  position: absolute;
  left: 0;
  top: 0;
  width: 183px;
  height: 165px;
  background: #2b7fff;
}

.life-sce__glyph {
  position: absolute;
  display: block;
  object-fit: contain;
  transition: transform 0.3s ease;
}

.life-sce__card:hover .life-sce__glyph {
  transform: scale(1.2);
}

.life-sce__desc {
  position: absolute;
  left: 20px;
  top: 226px;
  margin: 0;
  font-size: 16px;
  line-height: 26px;
  font-weight: 400;
  color: #1a1a2e;
  text-align: left;
  white-space: pre-line;
}

.life-sce__sub {
  position: relative;
  width: 688px;
  margin: 101px auto 0;
  font-size: 16px;
  line-height: 19px;
  font-weight: 400;
  color: #555555;
  text-align: center;
  white-space: nowrap;
}

.life-sce__btn {
  position: relative;
  width: 280px;
  height: 52px;
  margin: 65px auto 0;
  background: linear-gradient(90deg, #1890ff, #40a9ff);
  border-radius: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.life-sce__btn-text {
  font-size: 18px;
  line-height: 22px;
  font-weight: 400;
  color: #ffffff;
  white-space: nowrap;
}

/* ============ 通用区块头 .section-head（life 复用 shequo2o 结构；线色走 inline lineColor #1890ff） ============ */
/* 结构：外壳零边距零内边距不占高；标题 margin:0 居中（字号/行高/色走 inline：34→41）；
   副标题 margin:14px auto 0、16px/19px（life 三头无副标题，规则备用）；
   线高 4、左右 auto＋下 0（宽/顶边距/圆角/底色走 inline；life 线 190→圆角 2，色 #1890ff） */
.section-head {
  margin: 0;
  padding: 0;
}

.section-head__title {
  margin: 0 auto;
  padding: 0;
  font-weight: 400;
  text-align: center;
  white-space: nowrap;
}

.section-head__sub {
  margin: 14px auto 0;
  padding: 0;
  font-size: 16px;
  line-height: 19px;
  font-weight: 400;
  text-align: center;
  white-space: nowrap;
}

.section-head__line {
  height: 4px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0;
  padding: 0;
  background: #1890ff;
}

/* ============ 滚动显现 reveal（同 shequo2o 最小一次性方案，由 common.js 全局 Observer 驱动加 .in） ============ */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.reveal.in {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  .reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
}