/* ============================================================
   解决方案 · 编辑式排版（scenes.css）
   ------------------------------------------------------------
   只服务 scenes.html。

   思路：不做"卡片 + 网格 + 满屏细线"的模板式排法，改按刊物的方式排：
     · 标题、痛点、产品名用衬线（宋），正文用黑体，两种字交替产生质感
     · 图文左右交错（单数图在右、双数图在左），页面往下读有节奏
     · 节名做成左侧边注（编号在上、名称在下），正文靠右，不打横线
     · 全篇只留极少的分隔线，靠留白分组

   字号：46 / 19 / 17 / 16 / 14 / 12
   间距：全部落在 4 / 8 的倍数
   行宽：34–40em（中文 34–40 字）
   ============================================================ */

:root {
  /* 全站统一用无衬线，方案页不再单独用宋体 */
  --font-serif: var(--font-sans);
}

/* ============================================================
   一 · 页头
   ------------------------------------------------------------
   页头标题与方案标题统一用衬线，整页才是一套字。
   ============================================================ */
.main-scenes .p-hero__title {
  font-family: var(--font-sans);
  font-weight: 700;
  letter-spacing: -.005em;
}

/* ============================================================
   二 · 目录
   ------------------------------------------------------------
   不用表格线，当前项靠一条伸出来的短横与品牌色标记。
   ============================================================ */
.plans {
  display: grid;
  grid-template-columns: 196px minmax(0, 1fr);
  gap: 56px;
  align-items: start;
  max-width: 1200px;
}

.plans__nav {
  position: sticky;
  top: calc(var(--header-h) + 88px);
  display: flex; flex-direction: column;
  gap: 2px;
}

.plans__nav-a {
  position: relative;
  display: flex; align-items: baseline; gap: 9px;
  padding: 9px 0 9px 20px;
  font-size: 13.5px; line-height: 1.5;
  color: var(--c-mute);
  transition: color var(--t-fast) var(--e-out);
}
/* 当前项伸出的短横 */
.plans__nav-a::before {
  content: ""; position: absolute;
  left: 0; top: 50%; width: 0; height: 1px;
  background: var(--pa, #2F8A3C);
  transform: translateY(-50%);
  transition: width var(--t-base) var(--e-out);
}
.plans__nav-a b {
  font-family: var(--font-mono); font-size: 10.5px;
  font-weight: 500; letter-spacing: .08em;
  color: var(--c-line-2);
  transition: color var(--t-fast) var(--e-out);
}
.plans__nav-a:hover { color: var(--c-ink); }
.plans__nav-a:hover::before { width: 8px; opacity: .5; }
.plans__nav-a.is-active { color: var(--pa, #2F8A3C); font-weight: 700; }
.plans__nav-a.is-active::before { width: 14px; }
.plans__nav-a.is-active b { color: currentColor; }

.plans__list { min-width: 0; }

/* ============================================================
   三 · 单个方案：图文交错
   ============================================================ */
.plan {
  --pa: #2F8A3C;
  --pa-line: #DCE9D8;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.94fr);
  column-gap: clamp(32px, 4.4vw, 72px);
  align-items: start;
  scroll-margin-top: calc(var(--header-h) + 88px);
}
.plan[data-accent="blue"] {
  --pa: #1465A8;
  --pa-line: #D9E6F2;
}
.plan + .plan { margin-top: clamp(88px, 9vw, 128px); }

.plan > header   { grid-column: 1; grid-row: 1; }
.plan .plan__fig { grid-column: 2; grid-row: 1; }
.plan .plan__body { grid-column: 1 / -1; grid-row: 2; }
.plan .plan__note { grid-column: 1 / -1; grid-row: 3; }

/* 双数方案左右对调，往下读不会一直撞在同一边 */
.plan:nth-of-type(even) > header   { grid-column: 2; }
.plan:nth-of-type(even) .plan__fig { grid-column: 1; }

/* ---------- 章首 ---------- */
.plan__idx {
  font-family: var(--font-mono); font-size: 11px;
  font-weight: 500; letter-spacing: .2em;
  color: var(--pa);
}
.plan__idx::before {
  content: ""; display: block;
  width: 22px; height: 2px; margin-bottom: 18px;
  background: var(--pa);
}
.plan__t {
  margin: 16px 0 0;
  font-family: var(--font-sans);
  font-size: clamp(30px, 3.4vw, 46px);
  font-weight: 600;
  color: var(--c-ink);
  letter-spacing: -.01em;
  line-height: 1.24;
}
.plan__lead {
  margin-top: 18px; max-width: 28em;
  font-size: 16px; line-height: 1.85;
  color: var(--c-slate);
}

/* 配图：4:3，圆角收小更有出版物感 */
.plan__fig { margin: 0; }
.plan__fig img {
  display: block; width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover; object-position: 50% 44%;
  border-radius: 10px;
  background: var(--c-sage);
}
.plan__fig figcaption {
  display: flex; align-items: center; gap: 8px;
  margin-top: 12px;
  font-size: 12px; letter-spacing: .02em;
  color: var(--c-mute);
}
.plan__fig figcaption::before {
  content: ""; width: 12px; height: 1px;
  background: var(--pa); opacity: .45;
}

/* ---------- 正文 ---------- */
.plan__body {
  margin-top: clamp(48px, 5vw, 76px);
  counter-reset: psec;
}

/* 每节：左侧边注（编号 + 节名），右侧内容 */
.plan__sec {
  display: grid;
  grid-template-columns: 128px minmax(0, 1fr);
  column-gap: clamp(24px, 3vw, 48px);
  padding-block: clamp(36px, 4vw, 52px);
}
.plan__sec + .plan__sec { border-top: 1px solid var(--c-line-2); }
.plan__sec:first-child { padding-top: 0; }
.plan__sec:last-child { padding-bottom: 0; }

.plan__h {
  counter-increment: psec;
  font-family: var(--font-sans);
  font-size: 14.5px; font-weight: 600;
  color: var(--c-ink);
  letter-spacing: .02em; line-height: 1.5;
}
.plan__h::before {
  content: counter(psec, decimal-leading-zero);
  display: block; margin-bottom: 7px;
  font-family: var(--font-mono);
  font-size: 10.5px; font-weight: 400;
  letter-spacing: .14em;
  color: var(--pa); opacity: .75;
}
/* 内容统一落在右列；不写死行号，将来某节多一块内容也能往下排 */
.plan__sec > *:not(.plan__h) { grid-column: 2; }

/* 客户与角色：2×2，无框线 */
.plan__roles {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px 40px;
}
.plan__roles dt {
  font-family: var(--font-mono);
  font-size: 10.5px; font-weight: 500; letter-spacing: .16em;
  color: var(--pa); opacity: .78;
}
.plan__roles dd {
  margin-top: 7px;
  font-size: 14.5px; line-height: 1.75;
  color: var(--c-ink-2);
}

/* 核心痛点：大号衬线序号压左，两列 */
.plan__pains {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: clamp(32px, 4vw, 56px);
  row-gap: clamp(28px, 3vw, 40px);
  counter-reset: pain;
}
.plan__pains li {
  counter-increment: pain;
  position: relative;
  padding-left: 46px;
}
.plan__pains li::before {
  content: counter(pain, decimal-leading-zero);
  position: absolute; left: 0; top: -4px;
  font-family: var(--font-sans);
  font-size: 26px; font-weight: 400; line-height: 1;
  letter-spacing: -.02em;
  color: var(--pa); opacity: .2;
}
.plan__pains b {
  display: block;
  font-family: var(--font-sans);
  font-size: 17px; font-weight: 600;
  line-height: 1.55; color: var(--c-ink);
}
.plan__pains span {
  display: block; margin-top: 9px; max-width: 30em;
  font-size: 14px; line-height: 1.8; color: var(--c-slate);
}
.plan__pains em {
  font-style: normal; margin-left: 10px;
  padding: 2px 9px; border-radius: var(--r-pill);
  font-family: var(--font-sans);
  font-size: 11px; font-weight: 700; letter-spacing: .06em;
  color: var(--pa); background: var(--pa-line);
  vertical-align: 3px; white-space: nowrap;
}
.plan__pains .is-main > b { color: var(--pa); }
.plan__pains .is-main::before { opacity: .55; }

/* 产品组合：栏顶一条色线，必需项用实色，其余用浅色 */
.plan__dev {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: clamp(20px, 2.4vw, 32px);
}
.plan__dev[data-cols="4"] { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.plan__dev li {
  padding-top: 18px;
  border-top: 2px solid var(--pa-line);
}
.plan__dev li:has(.plan__tag--must) { border-top-color: var(--pa); }
.plan__dev b {
  display: block;
  font-family: var(--font-sans);
  font-size: 19px; font-weight: 600;
  line-height: 1.4; color: var(--c-ink);
}
.plan__dev b a {
  color: inherit;
  transition: color var(--t-fast) var(--e-out);
}
.plan__dev b a:hover { color: var(--pa); }
.plan__dev b small {
  display: block; margin-top: 5px;
  font-family: var(--font-sans);
  font-size: 12px; font-weight: 400; line-height: 1.6;
  color: var(--c-mute);
}
.plan__dev span {
  display: block; margin-top: 12px;
  font-size: 14px; line-height: 1.8; color: var(--c-slate);
}

/* 角色标签：必需 / 可选 / 延伸项 */
.plan__tag {
  display: inline-block; margin-top: 14px;
  padding: 2px 9px; border-radius: var(--r-pill);
  font-style: normal; font-size: 11.5px; font-weight: 700;
  letter-spacing: .06em;
  color: var(--c-slate); background: var(--c-mist);
}
.plan__tag--must { color: #fff; background: var(--pa); }
.plan__tag--ext { color: var(--pa); background: transparent; box-shadow: inset 0 0 0 1px var(--pa-line); }

/* 范围与约束：整块收进一层极淡的底，与正文区分层次 */
.plan__pairs {
  background: var(--c-mist);
  border-radius: 14px;
  padding: clamp(20px, 2.6vw, 32px) clamp(20px, 2.8vw, 36px);
}
.plan__pairs > div {
  display: grid;
  grid-template-columns: 84px minmax(0, 1fr);
  gap: 20px;
  padding: 12px 0;
}
.plan__pairs > div:first-child { padding-top: 0; }
.plan__pairs > div:last-child { padding-bottom: 0; }
.plan__pairs dt {
  padding-top: 3px;
  font-family: var(--font-mono);
  font-size: 10.5px; font-weight: 500; letter-spacing: .14em;
  color: var(--pa); opacity: .8;
}
.plan__pairs dd {
  margin: 0; max-width: 38em;
  font-size: 14px; line-height: 1.8; color: var(--c-slate);
}
.plan__pairs dd.plan__wide { max-width: none; }

/* 口径约束：双栏条款 */
.plan__rules {
  columns: 2;
  column-gap: 44px;
  padding-top: 2px;
}
.plan__rules li {
  position: relative;
  padding-left: 14px;
  margin-bottom: 9px;
  break-inside: avoid;
  font-size: 13.5px; line-height: 1.75; color: var(--c-slate);
}
.plan__rules li::before {
  content: ""; position: absolute; left: 0; top: .72em;
  width: 3px; height: 3px; border-radius: 50%;
  background: var(--pa); opacity: .45;
}

/* 备注 */
.plan__note {
  display: flex; align-items: center; gap: 9px;
  margin-top: clamp(36px, 4vw, 52px);
  font-size: 12px; letter-spacing: .02em;
  color: var(--c-mute);
}
.plan__note::before {
  content: ""; width: 12px; height: 1px;
  background: var(--pa); opacity: .4;
}

/* ============================================================
   四 · 响应式
   ============================================================ */
@media (max-width: 1080px) {
  .plans { grid-template-columns: 1fr; gap: 0; }
  .plans__nav {
    position: static;
    flex-direction: row; flex-wrap: wrap; gap: 8px;
    margin-bottom: 48px;
  }
  .plans__nav-a {
    padding: 7px 14px;
    border: 1px solid var(--c-line);
    border-radius: var(--r-pill);
    font-size: 13px;
  }
  .plans__nav-a::before { display: none; }
  .plans__nav-a.is-active { border-color: currentColor; }
  .plan { scroll-margin-top: calc(var(--header-h) + 68px); }
}

@media (max-width: 920px) {
  .plan {
    grid-template-columns: 1fr;
    row-gap: 36px;
  }
  .plan > header,
  .plan .plan__fig,
  .plan:nth-of-type(even) > header,
  .plan:nth-of-type(even) .plan__fig { grid-column: 1; grid-row: auto; }
  .plan .plan__body { margin-top: 8px; }
  .plan__fig img { aspect-ratio: 16 / 9; }
  .plan__roles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .plan__dev,
  .plan__dev[data-cols="4"] { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 28px; }
}

@media (max-width: 720px) {
  .plan__sec {
    grid-template-columns: 1fr;
    row-gap: 16px;
  }
  .plan__sec > *:not(.plan__h) { grid-column: 1; }
  .plan__h { display: flex; align-items: baseline; gap: 9px; }
  .plan__h::before { margin-bottom: 0; }
  .plan__pains { grid-template-columns: 1fr; row-gap: 28px; }
  .plan__rules { columns: 1; }
  .plan__pairs > div { grid-template-columns: 1fr; gap: 6px; }
  .plan__fig img { border-radius: 8px; }
}

@media (max-width: 520px) {
  .plan__roles { grid-template-columns: 1fr; gap: 20px; }
  .plan__dev,
  .plan__dev[data-cols="4"] { grid-template-columns: 1fr; }
  .plan__pains li { padding-left: 40px; }
  .plan__pains li::before { font-size: 22px; }
}

/* ============================================================
   新方案版式（s2 / p2）
   ------------------------------------------------------------
   通栏大图 + 四段结构：角色链 / 痛点卡 / 产品卡 / 边界卡。
   目录改成顶部吸附的横向胶囊，往下滑时当前方案high亮。
   ============================================================ */
.s2 { padding-top: clamp(8px, 1.6vw, 18px); }

/* ---- 顶部吸附目录 ---- */
.s2__nav {
  position: sticky; top: var(--header-h); z-index: 30;
  display: flex; flex-wrap: wrap; gap: 8px;
  margin: 0 0 clamp(16px, 2.2vw, 26px);
  padding: 10px 0;
  background: #FFFFFF;
  box-shadow: 0 1px 0 var(--c-line-2);
  border-bottom: 1px solid var(--c-line-2);
}
.s2__nav-a {
  display: inline-flex; align-items: baseline; gap: 8px;
  padding: 8px 16px 8px 13px;
  border-radius: var(--r-pill);
  font-size: 13.5px; font-weight: 600; line-height: 1.3;
  color: var(--c-slate);
  background: var(--c-mist);
  transition: background-color var(--t-fast) var(--e-out),
              color var(--t-fast) var(--e-out),
              box-shadow var(--t-base) var(--e-out);
}
.s2__nav-a b {
  font-family: var(--font-mono);
  font-size: 10.5px; font-weight: 600; letter-spacing: .06em;
  color: var(--c-mute);
}
.s2__nav-a:hover { background: #fff; color: var(--c-ink); box-shadow: 0 2px 10px rgba(14, 40, 24, .07); }
.s2__nav-a.is-active {
  background: var(--pa, #2F8A3C); color: #fff;
  box-shadow: 0 6px 18px rgba(14, 40, 24, .16);
}
.s2__nav-a.is-active b { color: rgba(255, 255, 255, .62); }

/* ---- 单个方案 ---- */
.p2 {
  --pa: #2F8A3C;
  --pa-soft: rgba(47, 138, 60, .07);
  --pa-line: #DCE9D8;
  scroll-margin-top: calc(var(--header-h) + 58px);
}
.p2[data-accent="blue"] {
  --pa: #1465A8;
  --pa-soft: rgba(20, 101, 168, .06);
  --pa-line: #D7E5F2;
}
.p2 + .p2 { margin-top: clamp(64px, 8vw, 108px); }

/* ---- 通栏大图 ---- */
.p2__hero {
  position: relative; margin: 0;
  height: clamp(280px, 30vw, 380px);
  border-radius: clamp(16px, 2vw, 24px);
  overflow: hidden;
  background: var(--c-sage);
}
.p2__hero img { width: 100%; height: 100%; object-fit: cover; display: block; }
.p2__scrim {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(8, 24, 14, .06) 0%, rgba(8, 24, 14, .30) 48%, rgba(8, 24, 14, .80) 100%);
}
.p2__cap {
  position: absolute;
  left: clamp(20px, 3.4vw, 56px); right: clamp(20px, 3.4vw, 56px);
  bottom: clamp(18px, 2.4vw, 34px);
  color: #fff;
}
.p2__idx {
  display: inline-block;
  padding: 4px 11px;
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .18);
  backdrop-filter: blur(6px);
  font-family: var(--font-mono);
  font-size: 11px; font-weight: 600; letter-spacing: .2em;
}
.p2__t {
  margin: 14px 0 0;
  font-family: var(--font-sans);
  font-size: clamp(1.9rem, 3.5vw, 3.1rem);
  line-height: 1.16; font-weight: 700;
  letter-spacing: -.01em;
}
.p2__lead {
  margin: 10px 0 0;
  max-width: 48ch;
  font-size: clamp(13.5px, 1.15vw, 15.5px);
  line-height: 1.72;
  color: rgba(255, 255, 255, .84);
}
.p2__cap-src {
  position: absolute; right: clamp(16px, 2.4vw, 34px); bottom: 14px;
  font-size: 11.5px; color: rgba(255, 255, 255, .5);
}

/* ---- 正文四段 ---- */
.p2__body { max-width: 1140px; }
.p2__sec {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  gap: clamp(18px, 3vw, 46px);
  padding: clamp(26px, 3.2vw, 40px) 0;
  border-top: 1px solid var(--c-line-2);
}
.p2__sec:first-child { border-top: 0; padding-top: clamp(28px, 3.4vw, 44px); }
.p2__sec-h { display: flex; align-items: baseline; gap: 9px; padding-top: 3px; }
.p2__sec-h span {
  font-family: var(--font-mono);
  font-size: 11px; font-weight: 600; letter-spacing: .12em;
  color: var(--pa);
}
.p2__sec-h h3 { font-size: 16px; font-weight: 700; color: var(--c-ink); letter-spacing: .01em; }
.p2__sec-c { min-width: 0; }

/* 角色链 */
.p2__roles {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px; margin: 0; padding: 0; list-style: none;
}
.p2__roles li {
  position: relative;
  padding: 15px 16px 17px;
  border-radius: 14px;
  background: #fff;
  border: 1px solid var(--c-line-2);
}
.p2__roles li::after {
  content: "";
  position: absolute; right: -10px; top: 50%;
  width: 8px; height: 8px;
  border-top: 1.5px solid var(--c-line-2);
  border-right: 1.5px solid var(--c-line-2);
  transform: translateY(-50%) rotate(45deg);
}
.p2__roles li:last-child::after { display: none; }
.p2__roles i {
  display: block; font-style: normal;
  font-size: 10.5px; font-weight: 700; letter-spacing: .16em;
  color: var(--pa);
}
.p2__roles b {
  display: block; margin-top: 8px;
  font-size: 14px; line-height: 1.66; font-weight: 600;
  color: var(--c-ink);
}

/* 痛点卡 */
.p2__pains {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px; margin: 0; padding: 0; list-style: none;
}
.p2__pains li {
  display: flex; gap: 12px;
  padding: 17px 19px 19px;
  border-radius: 14px;
  background: #fff;
  border: 1px solid var(--c-line-2);
  transition: transform var(--t-base) var(--e-out), box-shadow var(--t-base) var(--e-out);
}
.p2__pains li:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(14, 40, 24, .07); }
.p2__pn {
  flex: none;
  font-family: var(--font-mono);
  font-size: 11px; font-weight: 600; letter-spacing: .06em;
  color: #C3D0C7;
  padding-top: 3px;
}
.p2__pains b {
  display: block;
  font-size: 15px; font-weight: 700; line-height: 1.5;
  color: var(--c-ink);
}
.p2__pains em {
  display: inline-block; margin-left: 8px;
  padding: 2px 8px; border-radius: var(--r-pill);
  font-style: normal; font-size: 10.5px; font-weight: 700;
  color: #fff; background: var(--pa);
  vertical-align: 2px;
}
.p2__pains p {
  margin: 7px 0 0;
  font-size: 13.8px; line-height: 1.8; color: var(--c-slate);
}
.p2__pains .is-main { background: var(--pa-soft); border-color: var(--pa-line); }
.p2__pains .is-main .p2__pn { color: var(--pa); }

/* 产品卡 */
.p2__dev {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px; margin: 0; padding: 0; list-style: none;
}
.p2__dev[data-cols="4"] { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.p2__dev li {
  position: relative;
  padding: 20px 18px 20px;
  border-radius: 14px;
  background: #fff;
  border: 1px solid var(--c-line-2);
  border-top: 3px solid var(--pa-line);
}
.p2__dev li:has(.p2__tag--must) { border-top-color: var(--pa); }
.p2__tag {
  position: absolute; right: 14px; top: 14px;
  padding: 3px 9px; border-radius: var(--r-pill);
  font-size: 10.5px; font-weight: 700; letter-spacing: .06em;
  color: var(--c-slate); background: var(--c-mist);
}
.p2__tag--must { color: #fff; background: var(--pa); }
.p2__tag--ext { color: var(--pa); background: transparent; box-shadow: inset 0 0 0 1px var(--pa-line); }
.p2__dev b {
  display: block;
  padding-right: 46px;
  font-family: var(--font-sans);
  font-size: 18.5px; font-weight: 600; line-height: 1.4;
  color: var(--c-ink);
}
.p2__dev b a { color: inherit; transition: color var(--t-fast) var(--e-out); }
.p2__dev b a:hover { color: var(--pa); }
.p2__dev small {
  display: block; margin-top: 6px;
  font-size: 12px; line-height: 1.6; color: var(--c-mute);
}
.p2__dev p {
  margin: 10px 0 0;
  font-size: 13.5px; line-height: 1.75; color: var(--c-slate);
}

/* 边界：三张信息卡 + 口径清单 */
.p2__scope {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.p2__sc {
  padding: 17px 19px 19px;
  border-radius: 14px;
  background: var(--c-mist);
}
.p2__sc-k {
  display: block;
  font-size: 10.5px; font-weight: 700; letter-spacing: .16em;
  color: var(--pa);
}
.p2__sc p {
  margin: 8px 0 0;
  font-size: 13.5px; line-height: 1.8; color: var(--c-slate);
}

.p2__rules {
  margin-top: 14px;
  padding: 20px 24px 22px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid var(--c-line-2);
}
.p2__rules-h {
  display: flex; align-items: baseline; gap: 8px;
  margin: 0;
  font-size: 11.5px; font-weight: 700; letter-spacing: .14em;
  color: var(--c-ink);
}
.p2__rules-h i {
  font-style: normal;
  font-family: var(--font-mono);
  font-size: 10.5px; letter-spacing: .06em;
  color: var(--c-mute);
}
.p2__rules ul {
  margin: 12px 0 0; padding: 0; list-style: none;
  display: grid; gap: 9px;
}
.p2__rules li {
  position: relative;
  padding-left: 17px;
  font-size: 13.5px; line-height: 1.85; color: var(--c-slate);
}
.p2__rules li::before {
  content: "";
  position: absolute; left: 0; top: 10px;
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--pa); opacity: .45;
}

.p2__note { margin: 16px 0 0; font-size: 12px; color: var(--c-mute); }

/* ---- 收尾 CTA ---- */
.s2__cta {
  margin-top: clamp(56px, 7vw, 96px);
  display: flex; align-items: center; justify-content: space-between; gap: 28px;
  padding: clamp(26px, 3.4vw, 44px);
  border-radius: clamp(16px, 2vw, 22px);
  background: linear-gradient(120deg, #F3FAF3 0%, #EFF7FB 100%);
  border: 1px solid var(--c-line-2);
}
.s2__cta h2 {
  font-family: var(--font-sans);
  font-size: clamp(1.35rem, 2.1vw, 1.9rem);
  line-height: 1.3; font-weight: 700;
}
.s2__cta p {
  margin: 10px 0 0;
  max-width: 52ch;
  font-size: 14px; line-height: 1.75; color: var(--c-slate);
}

/* ---- 响应式 ---- */
@media (max-width: 1024px) {
  .p2__roles, .p2__dev[data-cols="4"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .p2__roles li::after { display: none; }
  .p2__scope { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 900px) {
  .p2__sec { grid-template-columns: 1fr; gap: 14px; }
  .p2__sec-h { padding-bottom: 2px; }
  .p2__pains { grid-template-columns: 1fr; }
  .p2__dev { grid-template-columns: 1fr 1fr; }
  .s2__cta { flex-direction: column; align-items: flex-start; }
  .p2__cap-src { display: none; }
}

@media (max-width: 560px) {
  .p2__roles, .p2__dev, .p2__dev[data-cols="4"], .p2__scope { grid-template-columns: 1fr; }
  .p2__hero { height: clamp(260px, 58vw, 340px); }
}

/* ============================================================
   左图右文（2026-10 改版）
   ------------------------------------------------------------
   左栏：场景图 + 方案标题，滚动时固定；
   右栏：客户 / 痛点 / 产品 / 边界，单列向下读。
   ============================================================ */
.p2__grid {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  gap: clamp(28px, 3.6vw, 60px);
  align-items: start;
}
.p2__side { position: sticky; top: calc(var(--header-h) + 86px); }

.p2__fig {
  position: relative; margin: 0;
  height: clamp(300px, 42vh, 440px);
  border-radius: clamp(16px, 1.8vw, 22px);
  overflow: hidden;
  background: var(--c-sage);
}
.p2__fig img { width: 100%; height: 100%; object-fit: cover; display: block; }
.p2__cap-src {
  position: absolute; left: 14px; bottom: 13px;
  padding: 5px 12px; border-radius: var(--r-pill);
  background: rgba(8, 24, 14, .46);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  color: #fff; font-size: 11.5px; letter-spacing: .02em;
}

.p2__intro { margin: 0 0 clamp(16px, 1.8vw, 22px); }
.p2__idx {
  display: inline-block;
  padding: 4px 11px; border-radius: var(--r-pill);
  background: var(--pa-soft); color: var(--pa);
  font-family: var(--font-mono);
  font-size: 11px; font-weight: 600; letter-spacing: .18em;
}
.p2__t {
  margin: 14px 0 0;
  font-size: clamp(1.55rem, 2.3vw, 2.15rem);
  line-height: 1.22; font-weight: 700;
  color: var(--c-ink); letter-spacing: -.01em;
}
.p2__lead {
  margin: 10px 0 0;
  font-size: 14px; line-height: 1.75; color: var(--c-slate);
}

/* 右列：单列流，把宽度让给文字 */
.p2__body { max-width: none; }
.p2__sec {
  grid-template-columns: 1fr;
  gap: 12px;
  padding: clamp(22px, 2.6vw, 32px) 0;
}
.p2__sec-h { padding-top: 0; }
.p2__sec:first-child { padding-top: 6px; border-top: 0; }

.p2__roles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.p2__roles li::after { display: none; }
.p2__pains { grid-template-columns: 1fr; }
.p2__dev,
.p2__dev[data-cols="4"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.p2__scope { grid-template-columns: 1fr; }

@media (max-width: 900px) {
  .p2__grid { grid-template-columns: 1fr; gap: 20px; }
  .p2__side { position: static; }
  .p2__fig { height: clamp(220px, 46vw, 300px); }
  .p2__t { font-size: clamp(1.4rem, 5vw, 1.8rem); }
}
@media (max-width: 560px) {
  .p2__roles,
  .p2__dev,
  .p2__dev[data-cols="4"] { grid-template-columns: 1fr; }
}

/* 产品卡是奇数个时，最后一张横跨整行，避免右下角空一块 */
@media (min-width: 901px) {
  .p2__dev li:last-child:nth-child(odd) { grid-column: span 2; }
  .p2__dev li:last-child:nth-child(odd) p { max-width: 56ch; }
}

/* ============================================================
   分类收敛：四段 → 三段（客户与痛点 / 产品组合 / 边界与口径）
   ------------------------------------------------------------
   角色链不再单独占一段，改成一组紧凑的行放在痛点上方，
   既保留「谁决策、谁执行」的信息，又不再多一级标题。
   ============================================================ */
.p2__roles {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 clamp(20px, 2.4vw, 36px);
  margin: 0 0 clamp(14px, 1.7vw, 20px);
}
.p2__roles li {
  display: flex; align-items: baseline; gap: 9px;
  padding: 9px 0; min-height: 0;
  background: none;
  border: 0; border-bottom: 1px dashed var(--c-line-2);
  border-radius: 0;
}
.p2__roles li::after { display: none; }
.p2__roles i {
  flex: none; width: 30px;
  font-size: 10.5px; font-weight: 700; letter-spacing: .04em;
  color: var(--pa);
}
.p2__roles b {
  margin-top: 0;
  font-size: 13.4px; font-weight: 600; line-height: 1.62;
  color: var(--c-ink);
}
.p2__pains { margin-top: 0; }

/* 段落标题在右栏里保持短小，避免「分类感」过重 */
.p2__sec-h span { opacity: .55; }

@media (max-width: 560px) {
  .p2__roles { grid-template-columns: 1fr; }
}

/* ---- 分类内再收一层：把「边界与口径」的三张色块卡改成标签行 ----
   与大块的痛点卡、产品卡形成节奏差，整页不再是「一片卡片森林」 */
.p2__scope {
  grid-template-columns: 1fr;
  gap: 0;
}
.p2__sc {
  display: flex; gap: clamp(12px, 1.4vw, 18px);
  padding: 11px 0;
  background: none;
  border-radius: 0;
  border-bottom: 1px dashed var(--c-line-2);
}
.p2__sc:last-child { border-bottom: 0; }
.p2__sc-k {
  flex: none; width: 66px; padding-top: 2px;
  font-size: 11px; letter-spacing: .06em;
  color: var(--pa);
}
.p2__sc p {
  margin: 0;
  font-size: 13.4px; line-height: 1.76; color: var(--c-slate);
}

/* ---- 痛点与产品卡：压一压内边距，一屏能看到整段 ---- */
.p2__pains { gap: 10px; }
.p2__pains li { padding: 14px 17px 16px; }
.p2__pains p { margin-top: 6px; font-size: 13.4px; line-height: 1.76; }
.p2__dev { gap: 12px; }
.p2__dev li { padding: 18px 16px 18px; }
.p2__dev p { margin-top: 9px; font-size: 13.2px; line-height: 1.72; }

/* 口径约束并入标签行：右侧可挂多条说明 */
.p2__sc-b { min-width: 0; display: grid; gap: 6px; }
.p2__sc-b p { margin: 0; font-size: 13.4px; line-height: 1.76; color: var(--c-slate); }
/* 末尾备注跟着行式列表走 */
.p2__note { margin-top: 22px; }

/* ============================================================
   一屏一方案（2026-10 改版）
   ------------------------------------------------------------ 
   痛点与产品组合全部改行式：一条一行往下读，
   去掉边界与口径段，右栏一屏读完一个方案。
   ============================================================ */

/* ---- 痛点：紧凑行式（客户与痛点 = 一块） ---- */
.p2__pl {
  margin: 0; padding: 0; list-style: none;
}
.p2__pl li {
  position: relative;
  padding: 9px 0 10px 16px;
  border-bottom: 1px dashed var(--c-line-2);
  font-size: 13.6px; line-height: 1.72; color: var(--c-slate);
}
.p2__pl li:last-child { border-bottom: 0; }
.p2__pl li::before {
  content: "";
  position: absolute; left: 2px; top: 17px;
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--pa); opacity: .4;
}
.p2__pl li.is-main::before { opacity: 1; }
.p2__pl b {
  font-weight: 700; color: var(--c-ink);
}
.p2__pl b::after { content: "："; }
.p2__pl em {
  font-style: normal;
  font-size: 10px; font-weight: 700; letter-spacing: .04em;
  color: #fff; background: var(--pa);
  padding: 2px 8px; border-radius: var(--r-pill);
  margin-left: 8px; vertical-align: 2px;
}
.p2__pl span { color: var(--c-slate); }

/* ---- 产品组合：行式 ---- */
.p2__devs {
  margin: 0; padding: 0; list-style: none;
}
.p2__devs li {
  padding: 9px 0;
  border-bottom: 1px dashed var(--c-line-2);
  font-size: 13.6px; line-height: 1.7; color: var(--c-slate);
}
.p2__devs li:last-child { border-bottom: 0; }
.p2__devs li.p2__devs-gk {
  padding: 15px 0 3px;
  border-bottom: 0;
  font-size: 11px; font-weight: 700; letter-spacing: .16em;
  color: var(--pa);
}
.p2__devs b { color: var(--c-ink); font-weight: 700; }
.p2__devs b a { color: inherit; }
.p2__devs b a:hover { color: var(--pa); }
.p2__devs i {
  font-style: normal;
  font-size: 10.5px; font-weight: 700; letter-spacing: .04em;
  padding: 2px 9px; border-radius: var(--r-pill);
  margin: 0 8px; vertical-align: 1px;
  color: var(--c-slate); background: var(--c-mist);
}
.p2__devs i.must { color: #fff; background: var(--pa); }
.p2__devs i.ext {
  color: var(--pa); background: transparent;
  box-shadow: inset 0 0 0 1px var(--pa-line);
}
.p2__devs span { color: var(--c-slate); }

/* ---- 一屏压缩 ---- */
.p2 + .p2 { margin-top: clamp(48px, 6vw, 76px); }
.p2__grid { gap: clamp(22px, 2.8vw, 44px); }
.p2__fig { height: clamp(240px, 32vh, 340px); }
.p2__sec { gap: 10px; padding: clamp(16px, 2vw, 24px) 0; }
.p2__sec:first-child { padding-top: 4px; }
.p2__note { margin-top: 14px; }
.p2__lead { max-width: 40ch; }

@media (max-width: 900px) {
  .p2__pl li, .p2__devs li { font-size: 13.2px; }
}

/* 产品组合超过 5 条时双列（方案 06） */
.p2__devs[data-cols="2"] {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: clamp(24px, 3vw, 44px);
}
.p2__devs[data-cols="2"] .p2__devs-gk { grid-column: 1 / -1; }
@media (max-width: 900px) {
  .p2__devs[data-cols="2"] { grid-template-columns: 1fr; }
}

/* 卡片版式里的分层组标题（方案 06 用） */
.p2__dev .p2__gk {
  grid-column: 1 / -1;
  padding: 12px 0 2px;
  font-size: 11px; font-weight: 700; letter-spacing: .16em;
  color: var(--pa);
}
.p2__dev .p2__gk:first-child { padding-top: 0; }

/* ============================================================
   一屏一方案 · 最终版（2026-10-30）
   - 图片不跟随滚动（去 sticky），滚到下一方案图即切换
   - 痛点恢复 2×2 编号卡片条
   ============================================================ */
.p2__side { position: static; }
.p2__pains { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.p2__fig { height: clamp(260px, 36vh, 380px); }
.p2 + .p2 { margin-top: clamp(44px, 5.5vw, 68px); }
.p2__sec { gap: 12px; padding: clamp(16px, 2vw, 24px) 0; }
.p2__sec:first-child { padding-top: 2px; }
.p2__pains li { padding: 15px 17px 17px; }
.p2__pains p { margin-top: 6px; font-size: 13.4px; line-height: 1.74; }
.p2__pains b { font-size: 14.5px; }

/* ============================================================
   翻页式滚动（2026-10-30）
   一个方案 = 一屏：滚动停止时自动吸附到最近的方案顶部，
   不会出现「上一模块还挂在上面、下一模块又冒出来」的中间态。
   长内容（如方案 06）在吸附位内仍可自由滚完。
   ============================================================ */
html { scroll-snap-type: y mandatory; }
.main-scenes .p-hero {
  scroll-snap-align: start;
  scroll-margin-top: var(--header-h);
}
.p2 { scroll-snap-align: start; }
.site-footer { scroll-snap-align: start; }

/* 方案 06 内容超一屏：产品组合段增加内部停靠点，
   滚动节奏 = 方案顶 → 产品组合 → 下一方案，内容一屏不漏 */
#eap .p2__dev {
  scroll-snap-align: start;
  scroll-margin-top: calc(var(--header-h) + 120px);
}

/* ============================================================
   一屏一模块 · 独占（2026-10-30）
   每个方案撑满一屏：内容不足一屏时以留白补足，
   屏幕内不会出现下一个方案的任何内容；往下滑即翻到下一屏。
   ============================================================ */
.p2 {
  min-height: calc(100svh - var(--header-h) - 78px);
  box-sizing: border-box;
}
.p2 + .p2 { margin-top: 0; }

/* 内容压缩：确保六个方案的自然高度都能装进一屏配额，
   min-height 的留白才真正生效（屏内绝不出现下一方案） */
.p2__fig { height: clamp(230px, 29vh, 300px); }
.p2__intro { margin-bottom: clamp(12px, 1.4vw, 18px); }
.p2__t { font-size: clamp(1.4rem, 2vw, 1.9rem); }
.p2__sec { gap: 9px; padding: 17px 0; }
.p2__sec:first-child { padding-top: 0; }
.p2__pains { gap: 11px; }
.p2__pains li { padding: 12px 15px 14px; }
.p2__pains b { font-size: 14px; }
.p2__pains p { margin-top: 5px; font-size: 13px; line-height: 1.66; }
.p2__dev { gap: 11px; }
.p2__dev li { padding: 13px 15px 14px; }
.p2__dev b { font-size: 16.5px; }
.p2__dev small { margin-top: 4px; font-size: 11.5px; }
.p2__dev p { margin-top: 7px; font-size: 12.9px; line-height: 1.62; }
.p2__note { margin-top: 12px; }

/* 第二档压缩：贴紧导航，图更矮 */
.p2 { scroll-margin-top: calc(var(--header-h) + 58px); min-height: calc(100svh - var(--header-h) - 58px); }
.p2__fig { height: clamp(220px, 26vh, 270px); }
.p2__sec { padding: 15px 0; }
.p2__pains li { padding: 11px 14px 12px; }
.p2__pains p { font-size: 12.8px; line-height: 1.62; }
.p2__dev li { padding: 12px 14px 13px; }
.p2__dev p { font-size: 12.6px; line-height: 1.58; margin-top: 6px; }
.p2__intro { margin-bottom: 10px; }

/* ============================================================
   排版拉宽 · 图片固定左上（2026-10-30）
   左栏收窄只放「标题 + 客户 + 场景图」，图永远钉在左上；
   右栏吃满剩余宽度，卡片更大更舒展，消除空旷感。
   ============================================================ */
.p2__grid {
  grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr);
  gap: clamp(24px, 2.6vw, 44px);
  align-items: start;
}
.p2__fig { height: clamp(280px, 36vh, 400px); }
.p2__lead { max-width: 34ch; }

/* 字号随宽版回调，读起来不局促 */
.p2__pains { gap: 13px; }
.p2__pains li { padding: 14px 17px 16px; }
.p2__pains b { font-size: 14.5px; }
.p2__pains p { font-size: 13.4px; line-height: 1.7; }
.p2__dev { gap: 13px; }
.p2__dev li { padding: 15px 17px 16px; }
.p2__dev b { font-size: 17.5px; }
.p2__dev small { font-size: 12px; }
.p2__dev p { font-size: 13.2px; line-height: 1.66; }
.p2__sec { gap: 10px; padding: 16px 0; }

/* 方案页的吸附对齐完全由 scroll-margin 控制，
   抵消全站 scroll-padding（否则两者叠加，方案顶会露出上一屏尾巴） */
html { scroll-padding-top: 0; }

/* 方案页 body 带 has-pnav，pages.css 给它加了 162px 的 scroll-padding，
   此处同特异性覆盖归零，吸附对齐只由 scroll-margin 决定 */
html.has-pnav { scroll-padding-top: 0; }

/* ============================================================
   三栏铺开版（2026-10-30）
   左：标题 + 客户 + 图（图纵向撑满，左侧不留白）
   中：客户与痛点 —— 四个痛点竖排一列
   右：产品组合 —— 卡片竖排
   整体字号放大，一屏铺满
   ============================================================ */
.p2__grid {
  grid-template-columns: minmax(0, .84fr) minmax(0, 2.16fr);
  gap: clamp(26px, 2.4vw, 40px);
  align-items: stretch;
}
.p2__side {
  display: flex; flex-direction: column;
  height: 100%;
}
.p2__intro { margin-bottom: clamp(14px, 1.4vw, 20px); }
.p2__fig {
  flex: 1 1 auto;
  height: auto;
  min-height: clamp(280px, 34vh, 420px);
}
.p2__t { font-size: clamp(1.6rem, 2.3vw, 2.1rem); }
.p2__lead { font-size: 14.5px; line-height: 1.78; max-width: 32ch; }

/* 右半区拆成两列：痛点一列、产品一列 */
.p2__body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
  gap: clamp(22px, 2vw, 36px);
  align-items: start;
  align-content: start;
}
.p2__sec { grid-template-columns: 1fr; gap: 12px; padding: 0; }
.p2__sec:first-child { padding-top: 0; }
.p2__note { grid-column: 1 / -1; margin-top: 18px; }
.p2__sec-h h3 { font-size: 17px; }

/* 痛点：竖排一列，放大 */
.p2__pains {
  grid-template-columns: 1fr;
  gap: 12px;
}
.p2__pains li {
  padding: 16px 18px 18px;
  border: 1px solid var(--c-line-2);
  border-radius: 14px;
  background: #fff;
}
.p2__pains b { font-size: 15.5px; }
.p2__pains p { margin-top: 7px; font-size: 14px; line-height: 1.74; }

/* 产品：竖排，放大 */
.p2__dev { grid-template-columns: 1fr; gap: 12px; }
.p2__dev[data-cols] { grid-template-columns: 1fr; }
.p2__dev li { padding: 16px 18px 18px; }
.p2__dev b { font-size: 18px; }
.p2__dev small { font-size: 12.5px; }
.p2__dev p { margin-top: 7px; font-size: 14px; line-height: 1.7; }

/* 方案 06 产品条目多，产品列仍双列以压住高度 */
#eap .p2__dev[data-cols="2"] { grid-template-columns: 1fr 1fr; }

@media (max-width: 1100px) {
  .p2__grid { grid-template-columns: 1fr; }
  .p2__body { grid-template-columns: 1fr; }
  .p2__fig { min-height: 260px; }
}

/* 产品列强制单列（覆盖旧的三列/两列规则与奇数跨列 hack） */
.p2__body .p2__dev,
.p2__body .p2__dev[data-cols],
.p2__body .p2__dev[data-cols="3"],
.p2__body .p2__dev[data-cols="4"] {
  grid-template-columns: 1fr !important;
}
.p2__body .p2__dev li:last-child:nth-child(odd) { grid-column: auto !important; }
/* 方案 06 例外：产品多，双列 */
#eap .p2__body .p2__dev[data-cols="2"] { grid-template-columns: 1fr 1fr !important; }

/* 只让「方案」做吸附点：页首与页脚自由滚动，避免首屏跳位 */
.main-scenes .p-hero { scroll-snap-align: none; }
.site-footer { scroll-snap-align: none; }

/* ============================================================
   纵向铺满：卡片吃掉剩余高度，一屏不留大片空白
   ============================================================ */
.p2 { display: grid; grid-auto-rows: minmax(0, 1fr); }
.p2__grid { height: 100%; }
.p2__side, .p2__body { height: 100%; }
.p2__body { grid-template-rows: minmax(0, 1fr) auto; }
.p2__sec {
  height: 100%;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  align-content: stretch;
}
.p2__sec-c { height: 100%; min-height: 0; }
.p2__pains, .p2__dev {
  height: 100%;
  align-content: space-between;
  grid-auto-rows: auto;
}
.p2__pains li, .p2__dev li { display: flex; flex-direction: column; justify-content: flex-start; }
/* 卡片本身给一点厚度，间距不至于被撑得过散 */
.p2__pains li { padding: 18px 20px 20px; }
.p2__dev li { padding: 18px 20px 20px; }
.p2__note { align-self: end; }

/* 方案底部留白：吸附到下一屏时，上方只看到空白而不是上一屏的备注文字 */
.p2 { padding-bottom: clamp(28px, 3.4vw, 56px); }

/* 顶栏在方案页给实底（默认半透明+模糊，上一屏文字会淡淡透出） */
.site-header.is-stuck { background: #fff; }

/* 方案页顶栏常驻白底（不依赖 is-stuck，避免上一屏文字透出） */
.site-header { background: #fff; }

/* 顶栏在方案页彻底不透明：关掉毛玻璃，杜绝上一屏文字透出 */
.main-scenes ~ .site-header,
.site-header,
.site-header.is-stuck {
  background: #fff;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

/* 方案页顶栏滚动后不缩高（缩高会在吸附位留出 12px 缝，上一屏文字从缝里露出来） */
.site-header.is-stuck { height: var(--header-h); }

/* ============================================================
   最终版式（2026-10-30 收口）：左图右文 · 半侧半侧
   左半：标题 + 客户 + 横版场景图
   右半：01 客户与痛点（2×2 卡） + 02 产品组合（卡片两列）
   一屏一方案，内容不满一屏时下方留白，滚动吸附翻页
   ============================================================ */

/* 一屏高度 + 吸附位 */
.p2 {
  display: block;
  min-height: calc(100svh - var(--header-h) - 58px);
  padding-bottom: 0;
  scroll-margin-top: calc(var(--header-h) + 58px);
}

/* 两栏 */
.p2__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.04fr);
  gap: clamp(28px, 3vw, 54px);
  align-items: start;
  height: auto;
}

/* 左栏：标题 + 横图（不拉伸） */
.p2__side {
  display: block;
  position: static;
  height: auto;
}
.p2__intro { margin-bottom: clamp(14px, 1.6vw, 20px); }
.p2__fig {
  flex: none;
  height: clamp(258px, 34vh, 360px);
  min-height: 0;
}
.p2__t { font-size: clamp(1.55rem, 2.2vw, 2rem); }
.p2__lead { font-size: 14.5px; line-height: 1.76; max-width: 34ch; }

/* 右栏：单列流（痛点段 → 产品段） */
.p2__body {
  display: block;
  height: auto;
}
.p2__sec {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto auto;
  gap: 11px;
  padding: clamp(0px, .6vw, 6px) 0 clamp(18px, 2vw, 24px);
  height: auto;
  align-content: start;
}
.p2__sec:first-child { padding-top: 0; }
.p2__sec-c { height: auto; min-height: 0; }
.p2__sec-h h3 { font-size: 16.5px; }

/* 痛点：2×2 卡片 */
.p2__pains {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  height: auto;
  align-content: start;
}
.p2__pains li {
  display: block;
  padding: 15px 17px 17px;
  border: 1px solid var(--c-line-2);
  border-radius: 14px;
  background: #fff;
}
.p2__pains b { font-size: 14.5px; }
.p2__pains p { margin-top: 6px; font-size: 13.4px; line-height: 1.72; }

/* 产品：两列卡片（第 3 张跨行补位） */
.p2__dev,
.p2__dev[data-cols],
.p2__dev[data-cols="3"],
.p2__dev[data-cols="4"] {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px;
  height: auto;
  align-content: start;
}
.p2__dev li {
  display: block;
  padding: 15px 17px 16px;
}
.p2__dev b { font-size: 17px; }
.p2__dev small { margin-top: 4px; font-size: 12px; }
.p2__dev p { margin-top: 7px; font-size: 13.2px; line-height: 1.68; }
.p2__dev li:last-child:nth-child(odd) { grid-column: 1 / -1; }
/* 方案 06 产品多，双列照旧 */
#eap .p2__dev[data-cols="2"] { grid-template-columns: 1fr 1fr !important; }

.p2__note { margin-top: 16px; align-self: auto; }

@media (max-width: 900px) {
  .p2__grid { grid-template-columns: 1fr; }
  .p2__fig { height: clamp(200px, 46vw, 280px); }
  .p2__pains { grid-template-columns: 1fr; }
  .p2__dev, .p2__dev[data-cols="3"], .p2__dev[data-cols="4"] { grid-template-columns: 1fr !important; }
  .p2__dev li:last-child:nth-child(odd) { grid-column: auto; }
}

/* 产品卡两列（特异性压过第二十轮的单列 !important） */
.p2 .p2__body .p2__dev,
.p2 .p2__body .p2__dev[data-cols],
.p2 .p2__body .p2__dev[data-cols="2"],
.p2 .p2__body .p2__dev[data-cols="3"],
.p2 .p2__body .p2__dev[data-cols="4"] {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.p2 .p2__body .p2__dev li:last-child:nth-child(odd) { grid-column: 1 / -1; }

/* 收一收高度，让六个方案都能在吸附位内看完 */
.p2__fig { height: clamp(220px, 30vh, 330px); }
.p2__intro { margin-bottom: clamp(12px, 1.3vw, 16px); }
.p2__sec { padding-bottom: clamp(14px, 1.6vw, 20px); }
.p2__pains { gap: 10px; }
.p2__pains li { padding: 13px 15px 14px; }
.p2__pains p { font-size: 13px; line-height: 1.66; }
.p2__dev { gap: 10px; }
.p2__dev li { padding: 13px 15px 14px; }
.p2__dev p { font-size: 12.9px; line-height: 1.64; }
.p2__note { margin-top: 12px; }

/* 最后收口：图与卡片再压一档，05 也能一屏读完 */
.p2__fig { height: clamp(210px, 28vh, 310px); }
.p2__sec { padding-bottom: clamp(12px, 1.3vw, 16px); }
.p2__pains li { padding: 12px 15px 13px; }
.p2__dev li { padding: 12px 15px 13px; }
.p2__note { margin-top: 10px; font-size: 11.5px; }

/* 段落头与卡片标题微收，给 02/04/05 挤出 30-50px */
.p2__sec-h { gap: 8px; }
.p2__sec-h h3 { font-size: 15.5px; }
.p2__pains b { font-size: 14px; }
.p2__pains p { font-size: 12.8px; line-height: 1.62; }
.p2__dev b { font-size: 16.5px; }
.p2__dev p { font-size: 12.7px; line-height: 1.6; }
.p2__dev small { font-size: 11.5px; margin-top: 3px; }

/* ============================================================
   专业版式收口（2026-10-30 晚）
   1. 版心收窄到 1400：两侧留出呼吸，不再横贯全屏
   2. 每屏内容垂直居中：上方是导航、下方是余白，不塞满也不留大白边
   3. 顶部目录改成极简下划线 tab（去掉彩色胶囊）
   ============================================================ */
.s2 > .wrap { max-width: 1400px; }

/* 每屏：撑满可用高度 + 内容居中 */
.p2 {
  display: grid;
  align-content: safe center;
  min-height: calc(100svh - var(--header-h) - 58px);
  padding-bottom: clamp(18px, 2.4vw, 34px);
}
.p2__grid {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.04fr);
  gap: clamp(36px, 3.4vw, 64px);
  align-items: center;
}
.p2__fig { height: clamp(280px, 38vh, 400px); }

/* 左栏文案微调，和右栏卡片对齐更稳 */
.p2__intro { margin-bottom: clamp(16px, 1.8vw, 24px); }
.p2__t { font-size: clamp(1.6rem, 2.2vw, 2.05rem); line-height: 1.24; }
.p2__lead { margin-top: 12px; font-size: 14.5px; line-height: 1.8; max-width: 32ch; }

/* 卡片回到舒展的间距 */
.p2__sec { padding-bottom: clamp(16px, 1.8vw, 24px); }
.p2__sec-h h3 { font-size: 16px; }
.p2__pains { gap: 14px; }
.p2__pains li { padding: 16px 18px 17px; }
.p2__pains b { font-size: 14.6px; }
.p2__pains p { margin-top: 6px; font-size: 13.4px; line-height: 1.72; }
.p2__dev { gap: 14px; }
.p2__dev li { padding: 16px 18px 17px; }
.p2__dev b { font-size: 17px; }
.p2__dev p { margin-top: 7px; font-size: 13.2px; line-height: 1.68; }

/* ---- 顶部目录：极简下划线 tab ---- */
.s2__nav {
  display: flex; flex-wrap: wrap;
  gap: clamp(16px, 2vw, 34px);
  margin: 0 0 clamp(22px, 2.6vw, 34px);
  padding: 6px 0 12px;
  background: #fff;
  border-bottom: 1px solid var(--c-line-2);
  box-shadow: none;
}
.s2__nav-a {
  position: relative;
  display: inline-flex; align-items: baseline; gap: 7px;
  padding: 4px 0;
  border-radius: 0;
  background: none !important;
  box-shadow: none !important;
  font-size: 13.5px; font-weight: 500; letter-spacing: .01em;
  color: var(--c-mute);
  transition: color var(--t-fast) var(--e-out);
}
.s2__nav-a b {
  font-family: var(--font-mono);
  font-size: 10.5px; font-weight: 600; letter-spacing: .06em;
  color: #B7C4BB;
  transition: color var(--t-fast) var(--e-out);
}
.s2__nav-a::after {
  content: "";
  position: absolute; left: 0; right: 0; bottom: -13px;
  height: 2px; border-radius: 2px;
  background: var(--pa, #2F8A3C);
  transform: scaleX(0); transform-origin: left center;
  transition: transform .32s var(--e-out, ease);
}
.s2__nav-a:hover { color: var(--c-ink); }
.s2__nav-a:hover b { color: var(--pa, #2F8A3C); }
.s2__nav-a.is-active { color: var(--c-ink); font-weight: 600; }
.s2__nav-a.is-active b { color: var(--pa, #2F8A3C); }
.s2__nav-a.is-active::after { transform: scaleX(1); }

@media (max-width: 900px) {
  .p2__fig { height: clamp(220px, 44vw, 300px); }
  .p2__grid { gap: 24px; }
  .s2__nav { gap: 16px; }
  .s2__nav-a { font-size: 12.5px; }
}

/* 精修：右栏压到一屏内，左栏标题在上、图居下与右栏底对齐 */
.p2__grid { align-items: stretch; }
.p2__side {
  display: flex; flex-direction: column; justify-content: space-between;
  height: 100%;
}
.p2__fig { height: clamp(300px, 42vh, 420px); }
.p2__sec { padding-bottom: clamp(12px, 1.4vw, 18px); }
.p2__pains { gap: 12px; }
.p2__pains li { padding: 13px 16px 14px; }
.p2__pains p { font-size: 13.2px; line-height: 1.68; }
.p2__dev { gap: 12px; }
.p2__dev li { padding: 13px 16px 14px; }
.p2__dev p { font-size: 13px; line-height: 1.64; }
.p2__note { margin-top: 8px; }

/* 图紧跟标题（不要被 space-between 推到底） */
.p2__side { justify-content: flex-start; gap: clamp(16px, 1.8vw, 22px); }
.p2__intro { margin-bottom: 0; }
.p2__fig { height: clamp(300px, 44vh, 410px); }

/* 再挤 30px：让 05（8 张卡）也完整落在一屏内 */
.p2__sec { padding-bottom: 8px; }
.p2__sec-h { margin-bottom: 2px; }
.p2__pains li { padding: 12px 15px 13px; }
.p2__pains p { font-size: 13px; line-height: 1.64; }
.p2__dev li { padding: 12px 15px 13px; }
.p2__dev p { font-size: 12.8px; line-height: 1.6; }
.p2__dev small { margin-top: 2px; }
.p2__note { margin-top: 6px; }

/* ============================================================
   满版排版（2026-10-30 晚·定稿方向）
   1. 版心放到 1800，大屏也铺满，两侧不留大空
   2. 左半：大图（更高更重），右半：卡片矩阵吃满整屏高度
   3. 卡片内容垂直居中、加顶部色线与大号序号水印，做出层次
   ============================================================ */
.s2 > .wrap { max-width: 1800px; }

.p2 { align-content: stretch; padding-bottom: clamp(14px, 1.6vw, 22px); }
.p2__grid {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.02fr);
  gap: clamp(32px, 3.2vw, 60px);
  align-items: stretch;
}
.p2__side { justify-content: flex-start; gap: clamp(18px, 1.9vw, 26px); }
.p2__fig {
  height: clamp(340px, 47vh, 480px);
  border-radius: clamp(14px, 1.4vw, 20px);
}

/* 右半吃满一屏：两段按内容分配，卡片均分每段高度 */
.p2__body {
  display: flex; flex-direction: column;
  height: 100%;
  min-height: 0;
}
.p2__sec {
  flex: 1 1 auto;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  padding-bottom: clamp(14px, 1.6vw, 20px);
  min-height: 0;
}
.p2__sec-c { display: grid; min-height: 0; }
.p2__pains, .p2__dev {
  height: 100%;
  grid-auto-rows: minmax(0, 1fr);
  align-content: stretch;
}

/* 卡片：垂直居中，加顶部色线，痛点编号做大号水印 */
.p2__pains li,
.p2__dev li {
  position: relative;
  display: flex; flex-direction: column; justify-content: center;
  padding: clamp(16px, 1.8vw, 24px) clamp(18px, 1.9vw, 24px);
  border-radius: 14px;
  overflow: hidden;
}
.p2__pains li::before,
.p2__dev li::before {
  content: "";
  position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: var(--pa);
  opacity: .18;
}
.p2__pains .p2__pn {
  position: absolute; right: 16px; top: 12px;
  font-family: var(--font-mono);
  font-size: 26px; font-weight: 700; line-height: 1;
  color: var(--pa); opacity: .12;
  pointer-events: none;
}
.p2__pains li.is-main::before { opacity: .55; width: 4px; }
.p2__pains b { font-size: clamp(15px, 1.15vw, 16.5px); }
.p2__pains p { margin-top: 7px; font-size: clamp(13px, 1vw, 14px); line-height: 1.7; }
.p2__dev b { font-size: clamp(17px, 1.3vw, 19px); }
.p2__dev small { margin-top: 5px; font-size: 12.5px; }
.p2__dev p { margin-top: 8px; font-size: clamp(13px, .95vw, 13.8px); line-height: 1.66; }
.p2__dev li:has(.p2__tag--must)::before { opacity: .55; width: 4px; }
.p2__note { margin-top: 10px; }

/* 满版但收住高度：卡片内边距与字号回调，产品第二行必须完整 */
.p2__fig { height: clamp(320px, 43vh, 420px); }
.p2__pains li, .p2__dev li {
  padding: clamp(14px, 1.5vw, 18px) clamp(16px, 1.7vw, 20px);
}
.p2__pains b { font-size: clamp(14.6px, 1.1vw, 15.6px); }
.p2__pains p { margin-top: 6px; font-size: clamp(12.8px, .95vw, 13.4px); line-height: 1.64; }
.p2__dev b { font-size: clamp(16.5px, 1.25vw, 18px); }
.p2__dev small { margin-top: 4px; font-size: 12px; }
.p2__dev p { margin-top: 7px; font-size: clamp(12.8px, .92vw, 13.4px); line-height: 1.6; }
.p2__pains { gap: 12px; }
.p2__dev { gap: 12px; }
.p2__sec { padding-bottom: clamp(12px, 1.4vw, 16px); }
.p2__note { margin-top: 6px; }

/* 卡片按内容高度排，不强制等高，避免文字被裁 */
.p2__sec-c { display: block; }
.p2__pains, .p2__dev {
  height: auto;
  grid-auto-rows: auto;
  align-content: start;
}
.p2__pains li, .p2__dev li { overflow: visible; }

/* ============================================================
   回归连续滚动（2026-10-30 收尾定稿）
   - 取消滚动吸附与一屏独占：正常滚动，能看到下一段开头
   - 方案之间用「分隔线 + 大间距」区分，方案头加色条与序号
   ============================================================ */
html { scroll-snap-type: none !important; }

.p2 {
  display: block !important;
  min-height: 0 !important;
  align-content: normal;
  padding-bottom: 0;
}
.p2 + .p2 {
  margin-top: clamp(52px, 6vw, 88px);
  padding-top: clamp(40px, 4.4vw, 64px);
  border-top: 1px solid var(--c-line-2);
}

.p2__grid { align-items: start; }
.p2__side { gap: clamp(16px, 1.8vw, 22px); }
.p2__body { display: block; height: auto; }
.p2__sec { display: block; padding-bottom: clamp(18px, 2vw, 26px); }
.p2__sec-c { display: block; }
.p2__fig { height: clamp(280px, 36vh, 380px); }

/* 方案头：左侧色条 + 序号，场景一眼可辨 */
.p2__intro {
  position: relative;
  padding-left: clamp(16px, 1.6vw, 22px);
  border-left: 3px solid var(--pa);
}
.p2__idx {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--font-mono);
  font-size: 11.5px; font-weight: 700; letter-spacing: .16em;
  color: var(--pa);
}
.p2__t {
  margin-top: 10px;
  font-size: clamp(1.55rem, 2.1vw, 1.95rem);
  line-height: 1.26;
  letter-spacing: -.01em;
}
.p2__lead {
  margin-top: 10px;
  font-size: 14px; line-height: 1.78; color: var(--c-slate);
  max-width: 32ch;
}

/* 卡片回到自然的纵向节奏 */
.p2__pains { gap: 12px; height: auto; grid-auto-rows: auto; }
.p2__dev { gap: 12px; height: auto; grid-auto-rows: auto; }
.p2__pains li, .p2__dev li {
  justify-content: flex-start;
  padding: clamp(15px, 1.6vw, 19px) clamp(17px, 1.7vw, 21px);
}
.p2__sec-h { margin-bottom: 12px; }

/* 图与右栏高度更接近，缩短方案之间的间距 */
.p2__fig { height: clamp(250px, 32vh, 330px); }
.p2 + .p2 {
  margin-top: clamp(36px, 4vw, 56px);
  padding-top: clamp(28px, 3.2vw, 44px);
}

/* 图高与右栏内容高度对齐（约 300），两侧底部齐平 */
.p2__fig { height: clamp(285px, 37vh, 370px); }

/* ============================================================
   去框（2026-10-30 定稿）：不用卡片，改用排版层级区分
   方案头：序号 + 短横线 + 标题，无竖色条
   痛点：两列目录式清单（编号 + 标题 + 说明），只留上边细线
   产品：规格表式行（名称·定位 … 角标 / 下一行职责）
   ============================================================ */

/* 方案头 */
.p2__intro {
  border-left: 0 !important;
  padding-left: 0 !important;
}
.p2__idx {
  display: inline-flex; align-items: center; gap: 12px;
  font-family: var(--font-mono);
  font-size: 11px; font-weight: 600; letter-spacing: .2em;
  color: var(--c-mute);
  background: none; padding: 0;
}
.p2__idx::after {
  content: "";
  width: clamp(28px, 3vw, 44px); height: 1px;
  background: currentColor; opacity: .5;
}
.p2__t {
  margin-top: 12px;
  font-size: clamp(1.6rem, 2.2vw, 2.05rem);
  line-height: 1.24; letter-spacing: -.012em;
}
.p2__lead {
  margin-top: 10px;
  font-size: 14px; line-height: 1.8;
  color: var(--c-slate); max-width: 30ch;
}

/* 图：无框无描边 */
.p2__fig {
  border-radius: 10px;
  overflow: hidden;
  box-shadow: none;
}

/* 痛点：目录式清单 */
.p2__pains {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 clamp(24px, 2.6vw, 44px);
  height: auto;
  display: grid;
}
.p2__pains li {
  position: relative;
  display: block;
  background: none !important;
  border: 0 !important;
  border-top: 1px solid var(--c-line-2) !important;
  border-radius: 0 !important;
  padding: 15px 0 17px !important;
}
.p2__pains li::before { display: none !important; }
.p2__pains .p2__pn {
  position: static !important;
  display: inline-block;
  margin-right: 9px;
  font-family: var(--font-mono);
  font-size: 11px; font-weight: 600;
  color: var(--c-mute); opacity: .9;
  vertical-align: 1px;
}
.p2__pains b {
  display: inline;
  font-size: clamp(14.6px, 1.1vw, 15.6px);
  font-weight: 700; color: var(--c-ink);
}
.p2__pains b em {
  font-size: 10px; padding: 2px 7px; margin-left: 7px;
  background: var(--pa); color: #fff; border-radius: var(--r-pill);
  vertical-align: 2px;
}
.p2__pains p {
  margin-top: 7px;
  font-size: clamp(13px, .98vw, 13.8px); line-height: 1.72;
  color: var(--c-slate);
}

/* 产品：规格表行 */
.p2__dev,
.p2__dev[data-cols],
.p2__dev[data-cols="2"],
.p2__dev[data-cols="3"],
.p2__dev[data-cols="4"] {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0 !important;
  height: auto;
}
.p2__dev li {
  display: flex !important;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 10px;
  background: none !important;
  border: 0 !important;
  border-top: 1px solid var(--c-line-2) !important;
  border-radius: 0 !important;
  padding: 14px 0 15px !important;
  overflow: visible;
}
.p2__dev li::before { display: none !important; }
.p2__dev b { order: 1; font-size: clamp(16px, 1.2vw, 17.5px); }
.p2__dev small { order: 2; margin: 0 !important; font-size: 12px; color: var(--c-mute); }
.p2__dev .p2__tag {
  order: 3; margin-left: auto;
  position: static !important;
  font-size: 10.5px; padding: 2px 9px;
  background: var(--c-mist); color: var(--c-slate);
  box-shadow: none;
}
.p2__dev .p2__tag--must { background: var(--pa); color: #fff; }
.p2__dev .p2__tag--ext { background: transparent; box-shadow: inset 0 0 0 1px var(--pa-line); color: var(--pa); }
.p2__dev p {
  order: 4; flex: 1 0 100%;
  margin-top: 5px !important;
  font-size: clamp(12.9px, .96vw, 13.6px); line-height: 1.68;
  color: var(--c-slate);
}

/* 段落小标题更像栏目名 */
.p2__sec-h { margin-bottom: 4px !important; }
.p2__sec-h span {
  font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .16em;
  color: var(--c-mute); opacity: .8;
}
.p2__sec-h h3 {
  font-size: 15px !important; font-weight: 700;
  color: var(--c-ink); letter-spacing: .01em;
}

/* 产品清单强制单列（压过之前的两列 !important，规格表需要通栏） */
.p2 .p2__body .p2__dev,
.p2 .p2__body .p2__dev[data-cols],
.p2 .p2__body .p2__dev[data-cols="2"],
.p2 .p2__body .p2__dev[data-cols="3"],
.p2 .p2__body .p2__dev[data-cols="4"] {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0 !important;
}
.p2 .p2__body .p2__dev li {
  display: flex !important;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 10px;
}
.p2 .p2__body .p2__dev li:last-child:nth-child(odd) { grid-column: auto !important; }

/* 产品行用 grid 明确分区：名称/角标一行、定位一行、职责通栏 */
.p2 .p2__body .p2__dev li {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: baseline;
  gap: 3px 14px;
  padding: 14px 0 15px !important;
  background: none !important;
  border: 0 !important;
  border-top: 1px solid var(--c-line-2) !important;
  border-radius: 0 !important;
}
.p2 .p2__body .p2__dev b { grid-column: 1; grid-row: 1; }
.p2 .p2__body .p2__dev .p2__tag {
  grid-column: 2; grid-row: 1; justify-self: end;
  margin: 0 !important; position: static !important;
}
.p2 .p2__body .p2__dev small { grid-column: 1; grid-row: 2; margin: 0 !important; }
.p2 .p2__body .p2__dev p {
  grid-column: 1 / -1; grid-row: 3;
  margin-top: 5px !important;
}

/* 图给足存在感，左栏不至于空 */
.p2__fig { height: clamp(300px, 40vh, 400px) !important; }

/* ============================================================
   两种语言并存（2026-10-30 定稿）
   产品组合：白底描边卡片（保留框）
   客户与痛点：浅底色块 + 圆形序号徽章（不套框）
   ============================================================ */

/* ---- 产品组合：恢复卡片 ---- */
.p2 .p2__body .p2__dev,
.p2 .p2__body .p2__dev[data-cols],
.p2 .p2__body .p2__dev[data-cols="2"],
.p2 .p2__body .p2__dev[data-cols="3"],
.p2 .p2__body .p2__dev[data-cols="4"] {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
}
.p2 .p2__body .p2__dev li {
  position: relative;
  display: block !important;
  background: #fff !important;
  border: 1px solid var(--c-line-2) !important;
  border-radius: 14px !important;
  padding: 16px 18px 17px !important;
  transition: border-color var(--t-base) var(--e-out), box-shadow var(--t-base) var(--e-out), transform var(--t-base) var(--e-out);
}
.p2 .p2__body .p2__dev li:hover {
  border-color: var(--pa-line) !important;
  box-shadow: 0 8px 20px -14px rgba(14, 40, 24, .35);
  transform: translateY(-2px);
}
.p2 .p2__body .p2__dev li::before { display: none !important; }
.p2 .p2__body .p2__dev b {
  display: block;
  font-size: clamp(16px, 1.18vw, 17.5px);
  line-height: 1.4;
  padding-right: 52px;
}
.p2 .p2__body .p2__dev small {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  color: var(--c-mute);
}
.p2 .p2__body .p2__dev p {
  margin-top: 7px;
  font-size: clamp(12.9px, .95vw, 13.4px);
  line-height: 1.66;
}
.p2 .p2__body .p2__dev .p2__tag {
  position: absolute !important;
  right: 13px; top: 13px;
  margin: 0 !important;
  font-size: 10.5px; padding: 2px 9px;
  background: var(--c-mist); color: var(--c-slate);
}
.p2 .p2__body .p2__dev .p2__tag--must { background: var(--pa); color: #fff; }
.p2 .p2__body .p2__dev .p2__tag--ext { background: transparent; box-shadow: inset 0 0 0 1px var(--pa-line); color: var(--pa); }
/* 三张卡时最后一张横跨，避免右侧留空 */
.p2 .p2__body .p2__dev li:last-child:nth-child(odd) { grid-column: 1 / -1 !important; }
/* 06 的三层组标题跨列 */
.p2 .p2__body .p2__dev .p2__gk { grid-column: 1 / -1 !important; padding: 12px 0 2px; }

/* ---- 痛点：浅色块 + 圆形序号徽章 ---- */
.p2 .p2__body .p2__pains {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.p2 .p2__body .p2__pains li {
  position: relative;
  display: block !important;
  background: var(--c-mist) !important;
  border: 0 !important;
  border-radius: 12px !important;
  padding: 15px 18px 16px 54px !important;
}
.p2 .p2__body .p2__pains li::before { display: none !important; }
.p2 .p2__body .p2__pains .p2__pn {
  position: absolute !important;
  left: 16px; top: 15px;
  display: flex; align-items: center; justify-content: center;
  width: 24px; height: 24px;
  border-radius: 50%;
  background: #fff;
  color: var(--c-mute);
  font-family: var(--font-mono);
  font-size: 10.5px; font-weight: 700;
  letter-spacing: 0;
  box-shadow: 0 1px 2px rgba(14, 40, 24, .06);
  opacity: 1;
  margin: 0;
  vertical-align: baseline;
}
.p2 .p2__body .p2__pains b {
  display: block;
  font-size: clamp(14.6px, 1.06vw, 15.4px);
  line-height: 1.5;
  font-weight: 700;
  color: var(--c-ink);
}
.p2 .p2__body .p2__pains p {
  margin-top: 6px;
  font-size: clamp(12.8px, .95vw, 13.4px);
  line-height: 1.68;
  color: var(--c-slate);
}
/* 主痛点：底色加深，徽章上色 */
.p2 .p2__body .p2__pains li.is-main {
  background: var(--pa-soft) !important;
  box-shadow: inset 3px 0 0 var(--pa);
}
.p2 .p2__body .p2__pains li.is-main .p2__pn {
  background: var(--pa); color: #fff;
  box-shadow: none;
}
.p2 .p2__body .p2__pains b em {
  background: var(--pa); color: #fff;
  font-size: 10px; padding: 2px 7px; border-radius: var(--r-pill);
  margin-left: 7px; vertical-align: 2px;
}

/* 痛点区呼吸再松一点 */
.p2 .p2__body .p2__pains { gap: 14px; }
.p2 .p2__body .p2__pains li { padding: 16px 18px 17px 56px !important; }
.p2 .p2__body .p2__pains .p2__pn { left: 17px; top: 16px; width: 25px; height: 25px; }

/* 痛点区呼吸再松一点 */
.p2 .p2__body .p2__pains { gap: 14px; }
.p2 .p2__body .p2__pains li { padding: 16px 18px 17px 56px !important; }
.p2 .p2__body .p2__pains .p2__pn { left: 17px; top: 16px; width: 25px; height: 25px; }

/* ============================================================
   解决方案 v2（11-02）
   1. 去掉方案头序号、痛点序号、底部备注
   2. 图片与右栏内容等高：左右底部齐平
   ============================================================ */

/* 方案头：没有序号了，标题直接起 */
.p2__t { margin-top: 0 !important; }

/* 左右等高 */
.p2__grid { align-items: stretch !important; }
.p2__side {
  display: flex !important;
  flex-direction: column;
  height: 100%;
  gap: clamp(14px, 1.5vw, 18px) !important;
}
.p2__intro { flex: none; }
.p2__fig {
  flex: 1 1 auto;
  height: auto !important;
  min-height: 240px;
}
.p2__fig img { height: 100%; }

/* 痛点去掉序号：内边距回到常规，主痛点仍保留左侧标线 */
.p2 .p2__body .p2__pains li {
  padding: 16px 18px 17px !important;
}
.p2 .p2__body .p2__pains .p2__pn { display: none !important; }

/* 图与文字底部齐平后，间距略收 */
.p2__sec { padding-bottom: clamp(14px, 1.6vw, 20px); }

/* ============================================================
   方案版式 v3（11-02 下午）
   1. 方案名与客户提到两栏之上，整行起头
   2. 图片顶端对齐右侧文字起、底端对齐文字收（严格等高）
   3. 客户与痛点只留主标题，去掉说明小字
   ============================================================ */

/* ---- 方案头：一行起头，标题 + 客户同基线 ---- */
.p2__head {
  margin-bottom: clamp(18px, 2vw, 26px);
  padding-bottom: clamp(14px, 1.5vw, 18px);
  border-bottom: 1px solid var(--c-line-2);
}
.p2 .p2__intro {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 6px clamp(18px, 2.2vw, 32px);
  padding-left: 0 !important;
  border-left: 0 !important;
}
.p2 .p2__t {
  margin: 0 !important;
  font-size: clamp(1.5rem, 2vw, 1.85rem);
  line-height: 1.2;
  letter-spacing: -.012em;
}
.p2 .p2__lead {
  margin: 0 !important;
  max-width: none !important;
  font-size: clamp(13px, .96vw, 13.8px);
  line-height: 1.6;
  color: var(--c-mute);
}

/* ---- 两栏严格等高：图随右栏起止 ---- */
.p2 .p2__grid { align-items: stretch !important; }
.p2 .p2__side {
  display: block !important;
  height: 100% !important;
  min-height: 0;
  gap: 0 !important;
}
.p2 .p2__fig {
  height: 100% !important;
  min-height: 0 !important;
  margin: 0;
}
.p2 .p2__fig img {
  width: 100%;
  height: 100% !important;
  object-fit: cover;
  object-position: center;
}

/* ---- 客户与痛点：只留标题 ---- */
.p2 .p2__body .p2__pains {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 12px;
}
.p2 .p2__body .p2__pains li {
  display: flex !important;
  align-items: center;
  padding: 15px 18px !important;
  background: var(--c-mist) !important;
  border-radius: 10px !important;
}
.p2 .p2__body .p2__pains li > div {
  display: flex; align-items: center; gap: 10px;
  min-width: 0;
}
.p2 .p2__body .p2__pains b {
  font-size: clamp(14.6px, 1.04vw, 15.4px);
  line-height: 1.45;
  font-weight: 700;
  color: var(--c-ink);
}
.p2 .p2__body .p2__pains li.is-main {
  background: var(--pa-soft) !important;
  box-shadow: inset 3px 0 0 var(--pa);
}
.p2 .p2__body .p2__pains li.is-main b em {
  display: inline-block;
  margin-left: 8px; vertical-align: 1px;
}

/* 痛点标题左对齐（旧规则里有居中） */
.p2 .p2__body .p2__pains li,
.p2 .p2__body .p2__pains li > div { text-align: left !important; }
.p2 .p2__body .p2__pains li > div { justify-content: flex-start; width: 100%; }

/* 方案 06 内容最多：产品改三列以压低高度，避免左图被拉成竖图 */
#eap .p2__body .p2__dev { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
#eap .p2__body .p2__dev .p2__gk { grid-column: 1 / -1 !important; }
#eap .p2__body .p2__dev li:last-child:nth-child(odd) { grid-column: auto !important; }
#eap .p2__body .p2__dev li { padding: 14px 15px 15px !important; }
#eap .p2__body .p2__dev b { font-size: 15.5px !important; padding-right: 44px !important; }

/* 图片高度上限：极长方案下仍保持横构图，顶部对齐文字 */
.p2 .p2__fig { max-height: 560px; }

/* 覆盖第 1193 行的 #eap 双列（同特异性、后置生效） */
#eap .p2__body .p2__dev[data-cols="2"] { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }

/* 06 痛点四列一行，进一步压高度让图文齐平 */
#eap .p2__body .p2__pains { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 8px !important; }
#eap .p2__body .p2__pains li { padding: 13px 14px !important; }
#eap .p2__body .p2__pains b { font-size: 13.8px !important; }

/* ---- 窄屏回落：单列堆叠，图片回到横版比例 ---- */
@media (max-width: 900px) {
  .p2 .p2__grid { grid-template-columns: minmax(0, 1fr) !important; gap: 20px !important; }
  .p2 .p2__fig {
    height: auto !important;
    max-height: none !important;
    aspect-ratio: 16 / 10;
  }
  .p2 .p2__body .p2__pains,
  #eap .p2__body .p2__pains { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .p2 .p2__body .p2__dev,
  .p2 .p2__body .p2__dev[data-cols="2"],
  #eap .p2__body .p2__dev,
  #eap .p2__body .p2__dev[data-cols="2"] { grid-template-columns: minmax(0, 1fr) !important; }
  #eap .p2__body .p2__dev .p2__gk { grid-column: 1 / -1 !important; }
  .p2 .p2__body .p2__dev li:last-child:nth-child(odd) { grid-column: auto !important; }
  .p2__head { margin-bottom: 16px; }
}
@media (max-width: 560px) {
  .p2 .p2__body .p2__pains,
  #eap .p2__body .p2__pains { grid-template-columns: minmax(0, 1fr) !important; }
  .p2 .p2__intro { gap: 4px 12px; }
}
