/* =========================================================================
   感尊官网 · 产品组页面样式 pages-product.css（设计师 B，2026-10-24）
   用在：products.html、product-fangchan.html、product-wuzi.html、pricing.html
   规矩：
   - 只在 site.css 之后引入；只用 site.css 的令牌变量，不写裸颜色、裸字号刻度以外的间距；
   - 不改 site.css 里已有组件，只加 .pp-* 前缀的新组件，或在 .pp-* 作用域里给已有组件补位置；
   - 会动的东西包在 prefers-reduced-motion: no-preference 里；手机端（≤ 760px）关重模糊、关持续动画。
   目录：
   1 产品首屏舞台 .pp-stage     2 吸顶子导航 .pp-subnav      3 麻烦清单 .pp-pains
   4 AI 区 .pp-ai / 护栏条 .pp-guard   5 功能交替行 .pp-feat   6 多端扇形 .pp-ends
   7 行业模板 .pp-tpl          8 产品中心 .pp-cat / 空态      9 价格页 .pp-price-*  10 相关文章、小件
   ========================================================================= */

/* ===== 0 产品组局部令牌（全部由 site.css 令牌派生） ===== */
:root {
  --pp-fang-soft: color-mix(in oklab, var(--fang) 9%, var(--surface));
  --pp-wuzi-soft: color-mix(in oklab, var(--wuzi) 11%, var(--surface));
  --pp-wuzi-ink: color-mix(in oklab, var(--wuzi) 62%, var(--ink));
  --pp-fang-ink: color-mix(in oklab, var(--fang) 78%, var(--ink));
  --pp-stage-h: 460px;
  --pp-subnav-h: 52px;
}

/* ===== 1 产品首屏舞台：光晕 + 浏览器 + 手机 + 浮卡（.page-hero--product 的右半边） ===== */
.pp-hero .page-hero__grid { grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr); gap: var(--s-6); }
.pp-hero .h1 { font-size: var(--fs-h1); }
.pp-hero .page-hero__copy .lead { font-size: var(--fs-h4); color: var(--ink-2); }
.pp-hero .page-hero__copy .cluster { margin-top: var(--s-5); }
.pp-hero__note { font-size: var(--fs-xs); color: var(--ink-3); }
.pp-stage { position: relative; height: var(--pp-stage-h); }
.pp-stage__halo { position: absolute; left: 50%; top: 46%; width: 620px; height: 380px; transform: translate(-50%, -50%); border-radius: 50%; z-index: 0; pointer-events: none;
  background: conic-gradient(from 200deg in oklch, var(--ai-1), var(--ai-2), var(--ai-3), var(--ai-4), var(--ai-1)); filter: blur(70px); opacity: 0.26; }
.pp-stage__halo--calm { background: radial-gradient(closest-side, var(--glow-blue), transparent), radial-gradient(closest-side at 70% 60%, color-mix(in oklab, var(--wuzi) 30%, transparent), transparent); filter: blur(30px); opacity: 0.9; }
.pp-stage__browser { position: absolute; z-index: 1; left: 0; top: 8px; width: 520px; }
.pp-stage__browser .device-browser__screen { --ratio: 16 / 10; }
.pp-stage__tablet { position: absolute; z-index: 1; left: 0; top: 12px; --tablet-w: 420px; }
.pp-stage__phone { position: absolute; z-index: 2; right: 0; top: 28px; --phone-w: 216px; }
.pp-stage__card { position: absolute; z-index: 4; left: 0; bottom: 0; width: 340px; border-radius: var(--r-lg); }
/* 舞台遮挡规则：被盖住的截图只露整块区域，不露半行字 —— 首屏后台截图按「第 2 张指标卡止于手机左沿」重算裁切 */
.pp-shot-fang-hero { --shot-w: 203.5%; --shot-x: -17.36%; --shot-y: -6.4%; }
/* 借还台首屏：只取左半「扫一下要借、要还、要领的东西」放大约 2 倍，右侧名单卡不进画面，避免露半截 */
.pp-tablet-zoom { position: relative; }
.pp-tablet-zoom > img { position: absolute; left: 0; top: 0; width: 195%; height: auto; max-width: none; object-fit: initial; transform: translate(0, -27.3%); }
.pp-stage__card .agent-steps { background: var(--surface); }
.pp-stage__tag { position: absolute; z-index: 5; display: inline-flex; align-items: center; gap: var(--s-1); height: 28px; padding: 0 var(--s-3); border-radius: var(--r-pill);
  background: var(--surface); box-shadow: var(--sh-2); font-size: var(--fs-xs); font-weight: var(--fw-semi); color: var(--ink); white-space: nowrap; }
.pp-stage__tag .spark { width: 13px; height: 13px; color: var(--ai-ink); }
.pp-stage__tag .icon { width: 14px; height: 14px; color: var(--brand); }
.pp-stage__tag--phone { right: 24px; top: -6px; }
.pp-stage__tag--screen { left: 16px; top: -20px; }
/* 非 AI 的自动提醒卡：渐变细边 + 实时点，不用 AI 光边 */
.pp-auto { border: 1px solid transparent; background: linear-gradient(var(--surface), var(--surface)) padding-box, var(--grad-edge) border-box; box-shadow: var(--sh-3); }
.pp-auto .agent-steps__head .icon { width: 16px; height: 16px; color: var(--pp-wuzi-ink); }
.pp-auto .agent-steps li[data-state="run"] .st { box-shadow: inset 0 0 0 2px var(--pp-wuzi-soft); border-top: 2px solid var(--wuzi); }
.pp-auto .agent-steps li[data-state="done"] .st { background: var(--ok); }

/* ===== 2 吸顶子导航（概览 / 功能 / 多端 / 价格 / 常见问题） ===== */
.pp-subnav { position: sticky; top: var(--nav-h); z-index: 40; background: color-mix(in oklab, var(--bg) 88%, transparent);
  -webkit-backdrop-filter: saturate(1.4) blur(14px); backdrop-filter: saturate(1.4) blur(14px); box-shadow: inset 0 -1px 0 var(--line); }
.pp-subnav__bar { display: flex; align-items: center; justify-content: space-between; gap: var(--s-4); min-height: var(--pp-subnav-h); }
.pp-subnav__name { display: inline-flex; align-items: center; gap: var(--s-2); font-weight: var(--fw-semi); font-size: var(--fs-ui, 15px); white-space: nowrap; }
.pp-subnav__links { display: flex; gap: var(--s-1); list-style: none; margin: 0; padding: 0; overflow-x: auto; scrollbar-width: none; }
.pp-subnav__links::-webkit-scrollbar { display: none; }
.pp-subnav__links a { display: inline-flex; align-items: center; min-height: 36px; padding: 0 var(--s-3); border-radius: var(--r-pill); font-size: var(--fs-sm); color: var(--ink-2); white-space: nowrap; transition: background-color var(--dur-1), color var(--dur-1); }
.pp-subnav__links a:hover { text-decoration: none; }
@media (hover: hover) { .pp-subnav__links a:hover { background: var(--bg-muted); color: var(--ink); } }
.pp-subnav__links a[aria-current="true"] { background: var(--brand-soft); color: var(--brand-ink); font-weight: var(--fw-semi); }
.pp-subnav .btn { min-height: 36px; }
html:has(.pp-subnav) { scroll-padding-top: calc(var(--nav-h) + var(--pp-subnav-h) + var(--s-4)); }

/* ===== 3 解决哪些麻烦：左侧大标题，右侧「以前 → 现在」清单 ===== */
.pp-pains { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: var(--s-8); align-items: start; }
.pp-pains .sec-head { margin-bottom: 0; position: sticky; top: calc(var(--nav-h) + var(--pp-subnav-h) + var(--s-6)); }
.pp-pains__shot { margin: var(--s-5) 0 0; }
.pp-pains__win { position: relative; display: block; height: var(--pains-h, 290px); overflow: hidden; border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--sh-2); }
.pp-pains__win > img { position: absolute; left: 0; top: 0; width: var(--shot-w, 100%); max-width: none; height: auto; transform: translate(var(--shot-x, 0), var(--shot-y, 0)); }
.pp-pains__cap { margin-top: var(--s-3); }
.pp-pains__cap .spark { width: 13px; height: 13px; color: var(--ai-ink); }
.pp-pains__list { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--s-3); }
.pp-pains__item { display: grid; grid-template-columns: minmax(0, 1fr) 28px minmax(0, 1.15fr); gap: var(--s-4); align-items: center; padding: var(--s-5); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--sh-1); }
.pp-pains__before { color: var(--ink-2); font-size: var(--fs-ui, 15px); line-height: 1.6; }
.pp-pains__before b, .pp-pains__after b { display: block; font-size: var(--fs-xs); font-weight: var(--fw-semi); color: var(--ink-3); margin-bottom: var(--s-1); }
.pp-pains__after { color: var(--ink); font-size: var(--fs-ui, 15px); line-height: 1.6; font-weight: var(--fw-medium); }
.pp-pains__after b { color: var(--ok); }
.pp-pains__arrow { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: var(--bg-subtle); color: var(--ink-3); }
.pp-pains__arrow .icon { width: 16px; height: 16px; }

/* ===== 4 AI 区：运行记录 + 说话找房；底部护栏条 ===== */
.pp-ai { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); gap: var(--s-5); align-items: stretch; }
.pp-ai__run { border-radius: var(--r-lg); }
.pp-ai__voice { position: relative; overflow: hidden; display: grid; grid-template-rows: auto auto 1fr; gap: var(--s-4); }
.pp-ai__voice .card__desc { margin-top: 0; }
.pp-ai__say { display: flex; gap: var(--s-3); align-items: flex-start; padding: var(--s-3) var(--s-4); border-radius: var(--r-md); background: var(--paper); box-shadow: inset 0 0 0 1px var(--paper-line); font-size: var(--fs-body); line-height: 1.6; }
.pp-ai__say .icon { color: var(--ai-ink); margin-top: 3px; }
.pp-ai__chips { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.pp-ai__chip { display: inline-flex; align-items: center; gap: var(--s-2); min-height: 36px; padding: 0 var(--s-3); border-radius: var(--r-pill); background: var(--surface); box-shadow: inset 0 0 0 1.5px color-mix(in oklab, var(--ai-2) 40%, transparent), var(--sh-1); font-size: var(--fs-sm); color: var(--ink); }
.pp-ai__chip small { font-size: var(--fs-xs); color: var(--ink-3); }
.pp-ai__chip--ask { box-shadow: none; border: 1px dashed var(--line-strong); color: var(--ink-2); }
.pp-ai__chip--ask .icon { width: 15px; height: 15px; color: var(--ai-ink); }
.pp-ai__shot { position: relative; min-height: 260px; margin: 0 calc(var(--s-6) * -1) calc(var(--s-6) * -1); display: flex; justify-content: center; align-items: flex-start; padding-top: var(--s-2);
  background: radial-gradient(70% 80% at 50% 100%, var(--ai-soft), transparent 70%); overflow: hidden; }
.pp-ai__shot .device-phone { --phone-w: 280px; margin-bottom: -320px; }
.pp-guard { list-style: none; padding: 0; margin: var(--s-5) 0 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-3); }
.pp-guard li { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: var(--s-3); align-items: start; padding: var(--s-4) var(--s-5); border-radius: var(--r-md); background: var(--surface); box-shadow: var(--sh-1); }
.pp-guard .icon { width: 22px; height: 22px; color: var(--ok); }
.pp-guard b { display: block; font-size: var(--fs-ui, 15px); font-weight: var(--fw-semi); color: var(--ink); }
.pp-guard span { font-size: var(--fs-sm); color: var(--ink-2); line-height: 1.6; }

/* ===== 5 功能交替行：一边文字、一边真实截图 ===== */
.pp-feats { display: grid; gap: var(--s-9); }
.pp-feat { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: var(--s-8); align-items: center; }
.pp-feat--flip { grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); }
.pp-feat--flip .pp-feat__text { order: 2; }
.pp-feat__text > * + * { margin-top: var(--s-4); }
.pp-feat__kicker { display: inline-flex; align-items: center; gap: var(--s-2); font-size: var(--fs-sm); font-weight: var(--fw-semi); color: var(--ink-2); }
.pp-feat__kicker .icon { width: 18px; height: 18px; }
.pp-feat--fang .pp-feat__kicker .icon { color: var(--fang); }
.pp-feat--wuzi .pp-feat__kicker .icon { color: var(--wuzi); }
.pp-feat__title { font-size: var(--fs-h3l, 28px); line-height: 1.3; letter-spacing: var(--track-head); font-weight: var(--fw-bold); text-wrap: balance; }
.pp-feat__desc { font-size: var(--fs-body-lg, 17px); color: var(--ink-2); line-height: 1.75; max-width: 520px; }
.pp-feat .checks { font-size: var(--fs-ui, 15px); }
.pp-feat__media { position: relative; min-height: 420px; border-radius: var(--r-xl); background: var(--bg-subtle); overflow: hidden; isolation: isolate; }
.pp-feat__media > .tech-dots { z-index: -1; }
.pp-feat__media--fang { background: radial-gradient(80% 90% at 85% 10%, var(--pp-fang-soft), transparent 70%), var(--bg-subtle); }
.pp-feat__media--wuzi { background: radial-gradient(80% 90% at 85% 10%, var(--pp-wuzi-soft), transparent 70%), var(--bg-subtle); }
.pp-feat__media--brand { background: radial-gradient(80% 90% at 85% 10%, var(--brand-soft), transparent 70%), var(--bg-subtle); }
.pp-feat__media .device-phone { position: absolute; }
.pp-feat__media .device-browser { position: absolute; }
.pp-feat__caption { position: absolute; left: var(--s-5); bottom: var(--s-4); z-index: 6; font-size: var(--fs-xs); color: var(--ink-3); }
/* 截图局部卡：把手机或后台截图里的一块按约 0.5 倍放大放进白卡，保证正文渲染 ≥ 11px */
.pp-snip { position: absolute; z-index: 5; width: var(--snip-w, 300px); height: var(--snip-h, 180px); overflow: hidden; border-radius: var(--r-md); background: var(--surface); box-shadow: var(--sh-pop); }
.pp-snip > img { position: absolute; left: 0; top: 0; width: var(--shot-w, 200%); max-width: none; height: auto; transform: translate(var(--shot-x, 0), var(--shot-y, 0)); }
.pp-snip__label { position: absolute; left: var(--s-2); bottom: var(--s-2); z-index: 1; height: 24px; padding: 0 var(--s-2); font-size: var(--fs-xs); }

/* ===== 6 多端：扇形设备 + 每端一句话 ===== */
.pp-ends { position: relative; overflow-x: clip; }
.pp-ends .device-fan { --fan-h: 470px; --fan-step: 440px; }
.pp-ends__browser { width: 640px; }
.pp-ends__phone { --phone-w: 220px; }
.pp-ends__legend { list-style: none; padding: 0; margin: var(--s-6) 0 0; display: grid; grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr)); gap: var(--s-4); }
.pp-ends__legend li { padding-top: var(--s-4); border-top: 2px solid var(--line); }
.pp-ends__legend li.is-key { border-top-color: var(--brand); }
.pp-ends__legend b { display: flex; align-items: center; gap: var(--s-2); font-size: var(--fs-body); font-weight: var(--fw-semi); }
.pp-ends__legend b .icon { width: 18px; height: 18px; color: var(--brand); }
.pp-ends__legend span { display: block; margin-top: var(--s-1); font-size: var(--fs-sm); color: var(--ink-2); line-height: 1.6; }

/* ===== 7 行业模板 / 四种性质 ===== */
.pp-tpl { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-4); list-style: none; padding: 0; margin: 0; }
.pp-tpl__card .pp-tpl__foot { margin-top: auto; }
.pp-tpl__card { grid-template-rows: auto auto 1fr; }
.pp-tpl__card { position: relative; display: grid; gap: var(--s-3); align-content: start; padding: var(--s-5); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--sh-1); }
.pp-tpl__card--key { border: 1px solid transparent; background: linear-gradient(var(--surface), var(--surface)) padding-box, var(--grad-edge) border-box; box-shadow: var(--sh-2); }
.pp-tpl__name { display: flex; align-items: center; justify-content: space-between; gap: var(--s-2); font-size: var(--fs-h4); font-weight: var(--fw-semi); }
.pp-tpl__rules { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--s-2); }
.pp-tpl__rules li { display: flex; justify-content: space-between; gap: var(--s-3); padding: var(--s-2) var(--s-3); border-radius: var(--r-xs); background: var(--bg-subtle); font-size: var(--fs-sm); color: var(--ink-2); }
.pp-tpl__rules li b { color: var(--ink); font-weight: var(--fw-semi); white-space: nowrap; }
.pp-tpl__foot { font-size: var(--fs-xs); color: var(--ink-3); }
.pp-kinds { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-3); list-style: none; padding: 0; margin: 0; }
.pp-kinds li { display: grid; gap: var(--s-2); align-content: start; padding: var(--s-5); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--sh-1); }
.pp-kinds__name { font-size: var(--fs-body-lg, 17px); font-weight: var(--fw-semi); }
.pp-kinds__eg { font-size: var(--fs-sm); color: var(--ink-3); }
.pp-kinds__how { font-size: var(--fs-ui, 15px); color: var(--ink-2); line-height: 1.65; }
.pp-kinds__code { display: inline-flex; align-self: start; justify-self: start; }
.pp-custom-ai { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--s-5); align-items: center; padding: var(--s-5) var(--s-6); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--sh-1); }
.pp-custom-ai__icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: var(--r-sm); background: var(--ai-soft); color: var(--ai-ink); }
.pp-custom-ai__icon .spark { width: 22px; height: 22px; }

/* ===== 8 产品中心：产品卡、定制卡、即将上线说明、空态 ===== */
.pp-cat-tools { display: grid; gap: var(--s-3); }
.pp-cat-tools .filter-bar { align-items: flex-start; }
.pp-cat-groups { display: grid; gap: var(--s-2); }
.pp-cat-groups .filters { gap: var(--s-2); }
.pp-cat-groups .filters__label { min-width: 40px; }
.pp-cat-meta { display: flex; justify-content: space-between; align-items: center; gap: var(--s-3); font-size: var(--fs-sm); color: var(--ink-3); }
.pp-cat { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--s-5); list-style: none; padding: 0; margin: 0; }
.pp-cat > li { grid-column: span 6; min-width: 0; }
.pp-cat > li.pp-cat__wide { grid-column: span 7; }
.pp-cat > li.pp-cat__narrow { grid-column: span 5; }
.pp-cat > li[hidden] { display: none; }
.pp-pcard { position: relative; display: grid; grid-template-rows: 300px auto; height: 100%; overflow: hidden; border-radius: var(--r-xl); background: var(--surface); box-shadow: var(--sh-2); color: var(--ink);
  transition: transform var(--dur-2) var(--ease-out), box-shadow var(--dur-2) var(--ease-out); }
.pp-pcard--edge { border: 1px solid transparent; background: linear-gradient(var(--surface), var(--surface)) padding-box, var(--grad-edge) border-box; }

.pp-pcard__media { position: relative; overflow: hidden; isolation: isolate; }
.pp-pcard__media--fang { background: radial-gradient(70% 90% at 80% 0%, var(--pp-fang-soft), transparent 70%), radial-gradient(60% 70% at 0% 100%, var(--ai-soft), transparent 70%), var(--bg-subtle); }
.pp-pcard__media--wuzi { background: radial-gradient(70% 90% at 80% 0%, var(--pp-wuzi-soft), transparent 70%), var(--bg-subtle); }
.pp-pcard__media > .tech-dots { z-index: -1; }
.pp-pcard__media .device-browser { position: absolute; left: var(--s-6); top: var(--s-6); width: 470px; }
.pp-pcard__media .device-tablet { position: absolute; left: var(--s-6); top: var(--s-6); --tablet-w: 470px; }
.pp-pcard__media .device-phone { position: absolute; right: var(--s-6); top: var(--s-5); --phone-w: 168px; padding: 6px; border-radius: 28px; }
.pp-pcard__media .device-phone__screen { border-radius: 22px; }
.pp-pcard__media .device-phone__island { top: 11px; height: 14px; }
.pp-pcard__body { display: grid; gap: var(--s-3); padding: var(--s-5) var(--s-6) var(--s-6); align-content: start; }
.pp-pcard__name { display: flex; align-items: center; flex-wrap: wrap; gap: var(--s-2); font-size: var(--fs-h3); font-weight: var(--fw-bold); letter-spacing: var(--track-head); line-height: 1.3; }
.pp-pcard__name a { color: inherit; }
.pp-pcard__name a::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
.pp-pcard__name a:hover { text-decoration: none; }
.pp-pcard__name a:focus-visible { box-shadow: none; }
.pp-pcard:has(.pp-pcard__name a:focus-visible) { box-shadow: var(--focus), var(--sh-2); }
.pp-pcard__def { font-size: var(--fs-ui, 15px); color: var(--ink-2); line-height: 1.7; }
.pp-pcard__ends { display: flex; flex-wrap: wrap; gap: var(--s-2); list-style: none; padding: 0; margin: 0; }
.pp-pcard__foot { display: flex; align-items: center; justify-content: space-between; gap: var(--s-3); padding-top: var(--s-3); border-top: 1px dashed var(--line-strong); }
.pp-pcard__price { font-size: var(--fs-sm); color: var(--ink-2); }
.pp-pcard__price b { font-size: var(--fs-lead); color: var(--ink); font-weight: var(--fw-bold); font-variant-numeric: tabular-nums; }
.pp-pcard__go { position: relative; z-index: 2; }
.pp-custom { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: var(--s-5); align-items: center; height: 100%; padding: var(--s-6); border-radius: var(--r-xl); overflow: hidden; isolation: isolate;
  background: radial-gradient(70% 90% at 100% 0%, var(--brand-soft), transparent 70%), var(--surface); box-shadow: var(--sh-1); }
.pp-custom > .tech-grid { z-index: -1; -webkit-mask-image: radial-gradient(60% 80% at 90% 40%, var(--ink) 20%, transparent 75%); mask-image: radial-gradient(60% 80% at 90% 40%, var(--ink) 20%, transparent 75%); }
.pp-custom__text > * + * { margin-top: var(--s-3); }
.pp-custom__tags { display: flex; flex-wrap: wrap; gap: var(--s-2); list-style: none; padding: 0; margin: 0; }
.pp-custom__text > .pp-custom__tags { margin-top: var(--s-4); }
.pp-custom > svg.line-art { width: 100%; height: auto; }
.pp-soon { display: grid; gap: var(--s-3); align-content: center; justify-items: start; height: 100%; padding: var(--s-6); border-radius: var(--r-xl); background: var(--bg-subtle); border: 1.5px dashed var(--line-strong); }
.pp-soon__icon { display: grid; place-items: center; width: 52px; height: 52px; border-radius: var(--r-md); margin-bottom: var(--s-2); color: var(--brand); border: 1px solid transparent; background: linear-gradient(var(--surface), var(--surface)) padding-box, var(--grad-edge) border-box; box-shadow: var(--sh-1); }
.pp-soon__title { font-size: var(--fs-h4); font-weight: var(--fw-semi); }
.pp-soon p { font-size: var(--fs-ui, 15px); color: var(--ink-2); }
.pp-cat > li.pp-cat-empty { grid-column: 1 / -1; }
.pp-cat-tools .searchbar input:focus-visible { box-shadow: none; }
.pp-cat-empty .empty { padding-block: var(--s-7); }
.pp-hero-mini { position: relative; height: 420px; -webkit-mask-image: linear-gradient(to bottom, var(--ink) 72%, transparent 100%); mask-image: linear-gradient(to bottom, var(--ink) 72%, transparent 100%); }
.pp-hero-mini .device-phone { position: absolute; top: 44px; }
.pp-hero-mini__a { left: 18%; --phone-w: 196px; z-index: 2; }
.pp-hero-mini__b { left: 52%; top: 92px !important; --phone-w: 196px; z-index: 1; }
.pp-hero-mini .pp-stage__tag { z-index: 5; }
.pp-hero-mini__ta { left: 12%; top: 0; }
.pp-hero-mini__tb { left: 50%; top: 48px; }

/* ===== 9 价格页 ===== */
.pp-price-hero .page-hero__grid { grid-template-columns: minmax(0, 1.35fr) minmax(0, 0.65fr); gap: var(--s-7); margin-top: var(--s-5); align-items: center; }
.pp-price-hero > .glow-spot { right: 4%; top: -6%; width: 760px; height: 560px; }
.pp-price-hero > .tech-grid { -webkit-mask-image: radial-gradient(70% 70% at 60% 40%, var(--ink) 30%, transparent 80%); mask-image: radial-gradient(70% 70% at 60% 40%, var(--ink) 30%, transparent 80%); }
.pp-receipt { position: relative; padding: var(--s-5) var(--s-5) var(--s-4); border-radius: var(--r-lg); background: var(--grad-paper); box-shadow: 0 0 0 1px var(--paper-line), var(--sh-3); transform: rotate(1.2deg); }
.pp-receipt__head { display: flex; justify-content: space-between; align-items: baseline; padding-bottom: var(--s-3); border-bottom: 1px dashed var(--line-strong); font-weight: var(--fw-semi); }
.pp-receipt__head .subtle { font-size: var(--fs-xs); font-weight: var(--fw-regular); }
.pp-receipt__rows { margin: 0; display: grid; }
.pp-receipt__rows > div { display: flex; justify-content: space-between; gap: var(--s-3); padding: var(--s-2) 0; border-bottom: 1px dashed var(--paper-line); font-size: var(--fs-sm); }
.pp-receipt__rows dt { color: var(--ink-2); }
.pp-receipt__rows dd { margin: 0; font-weight: var(--fw-semi); color: var(--ink); white-space: nowrap; }
.pp-receipt__foot { margin-top: var(--s-3); padding-right: 72px; font-size: var(--fs-xs); color: var(--ink-3); line-height: 1.6; }
.pp-receipt__stamp { position: absolute; right: var(--s-3); bottom: var(--s-3); }
.pp-price-stage { position: relative; isolation: isolate; }
.pp-price-stage > .pp-stage__halo { z-index: -1; top: 52%; width: 900px; height: 360px; opacity: 0.22; }
.pp-price-ai { display: flex; border-radius: var(--r-lg); }
.pp-price-ai > .price-card { flex: 1; box-shadow: none; }
.pp-price-hero .h1 { font-size: var(--fs-h1); }
.pp-price-hero .lead { max-width: 760px; }
.pp-price-meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2) var(--s-4); font-size: var(--fs-sm); color: var(--ink-3); }
.pp-price-meta .icon { width: 16px; height: 16px; }
.pp-price-meta span { display: inline-flex; align-items: center; gap: var(--s-1); }
.pp-price-grid { margin-top: var(--s-6); }
.pp-price-grid .price-card { padding-top: var(--s-6); }
.pp-price-card__for { font-size: var(--fs-sm); color: var(--ink-3); }
.pp-price-card__prod { display: inline-flex; align-items: center; gap: var(--s-2); font-size: var(--fs-sm); font-weight: var(--fw-semi); color: var(--ink-2); }
.pp-price-card__prod i { width: 8px; height: 8px; border-radius: 50%; background: var(--fang); }
.pp-price-card__prod--wuzi i { background: var(--wuzi); }
.pp-price-card__big { font-size: var(--fs-h3l, 28px); line-height: 1.2; font-weight: var(--fw-bold); letter-spacing: -0.01em; }
.pp-price-group { display: grid; grid-template-columns: minmax(0, 0.75fr) minmax(0, 1.25fr); gap: var(--s-8); align-items: start; }
.pp-price-group > .sec-head { margin-bottom: 0; }
.pp-factors { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-3); }
.pp-factors li { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: var(--s-3); padding: var(--s-4) var(--s-5); border-radius: var(--r-md); background: var(--surface); box-shadow: var(--sh-1); }
.pp-factors b { display: block; font-weight: var(--fw-semi); }
.pp-factors span { font-size: var(--fs-sm); color: var(--ink-2); line-height: 1.6; }
.pp-factors .card__icon { width: 40px; height: 40px; }
.pp-plain { font-size: var(--fs-ui, 15px); color: var(--ink-2); }
.table .pp-yes { color: var(--ok); font-weight: var(--fw-semi); }
.table td .icon { width: 16px; height: 16px; vertical-align: -3px; }
.pp-anchor-chips { display: flex; flex-wrap: wrap; gap: var(--s-2); }

/* ===== 10 相关文章、小件 ===== */
.pp-links { display: inline-flex; flex-wrap: wrap; gap: var(--s-1) var(--s-4); }
.pp-posts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-5); list-style: none; padding: 0; margin: 0; }
.pp-price-sum { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: var(--s-7); align-items: center; }
.pp-price-sum .price-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pp-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: currentColor; flex: none; }
.pp-tag-fang { background: var(--pp-fang-soft); color: var(--pp-fang-ink); }
.pp-tag-wuzi { background: var(--pp-wuzi-soft); color: var(--pp-wuzi-ink); }
.pp-stack-tight > * + * { margin-top: var(--s-2); }

/* ===== 动效（只在允许动效时） ===== */
@media (prefers-reduced-motion: no-preference) {
  .pp-stage__phone, .pp-stage__card { transition: transform var(--dur-3) var(--ease-out); }
  .pp-stage:hover .pp-stage__phone { transform: translateY(-4px); }
  .pp-cat > li { transition: opacity var(--dur-2) var(--ease-out); }
}

/* ===== 平板 ≤ 1080 ===== */
@media (max-width: 1280px) {
  .pp-stage__browser { width: 480px; }
  .pp-stage__tablet { --tablet-w: 400px; }
  .pp-shot-fang-hero { --shot-w: 216%; }
  .pp-pcard__media .device-browser, .pp-pcard__media .device-tablet { width: 420px; --tablet-w: 420px; }
}
@media (max-width: 1080px) {
  .pp-hero .page-hero__grid { grid-template-columns: minmax(0, 1fr); }
  .pp-stage { max-width: 640px; margin-inline: auto; width: 100%; }
  .pp-pains, .pp-ai, .pp-feat, .pp-price-group, .pp-price-sum { grid-template-columns: minmax(0, 1fr); gap: var(--s-6); }
  .pp-price-hero .page-hero__grid { grid-template-columns: minmax(0, 1fr); gap: var(--s-5); }
  .pp-receipt { max-width: 440px; }
  .pp-pains .sec-head { position: static; }
  .pp-feat--flip .pp-feat__text { order: 0; }
  .pp-guard, .pp-tpl, .pp-kinds { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pp-ends .device-fan { --fan-step: 360px; }
  .pp-ends__browser { width: 520px; }
  .pp-cat > li, .pp-cat > li.pp-cat__wide, .pp-cat > li.pp-cat__narrow { grid-column: 1 / -1; }
  .pp-posts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pp-subnav__name { display: none; }
}

/* ===== 手机 ≤ 760：单列、关重模糊、截图改小手机框 + 局部卡 ===== */
@media (max-width: 760px) {
  :root { --pp-stage-h: 520px; --pp-subnav-h: 52px; }
  .pp-hero .h1 { font-size: var(--fs-h1); }
  .pp-hero .page-hero__copy .lead { font-size: var(--fs-body); }
  .pp-hero .page-hero__copy .cluster .btn { flex: 1 1 100%; }
  .pp-stage__halo { width: 340px; height: 300px; filter: blur(44px); }
  .pp-stage__browser, .pp-stage__tablet, .pp-stage__tag--screen { display: none; }
  .pp-stage__phone { left: 50%; right: auto; top: 36px; transform: translateX(-50%); --phone-w: 220px; }
  .pp-stage:hover .pp-stage__phone { transform: translateX(-50%); }
  .pp-stage__tag--phone { left: 50%; right: auto; top: 0; transform: translateX(-50%); }
  .pp-stage__card { left: 0; right: 0; width: auto; bottom: 0; }
  .pp-subnav { -webkit-backdrop-filter: none; backdrop-filter: none; background: var(--bg); }
  .pp-subnav .btn { display: none; }
  .pp-subnav__links a { min-height: var(--hit); }
  .pp-pains__item { grid-template-columns: minmax(0, 1fr); gap: var(--s-2); padding: var(--s-4); }
  .pp-pains__arrow { transform: rotate(90deg); }
  .pp-guard, .pp-tpl, .pp-kinds, .pp-factors, .pp-posts { grid-template-columns: minmax(0, 1fr); }
  .pp-feats { gap: var(--s-8); }
  .pp-feat__title { font-size: var(--fs-h3); }
  .pp-feat__desc { font-size: var(--fs-body); }
  .pp-feat__media { min-height: 380px; border-radius: var(--r-lg); }
  .pp-snip { --snip-w: 260px !important; left: var(--s-3) !important; right: auto !important; bottom: var(--s-4) !important; }
  .pp-feat__media .device-phone { --phone-w: 168px !important; }
  .pp-feat__media .device-browser { width: 520px !important; left: var(--s-4) !important; }
  .pp-price-sum .price-grid { grid-template-columns: minmax(0, 1fr); }
  .pp-ai__shot { margin: 0 calc(var(--s-5) * -1) calc(var(--s-5) * -1); }
  .pp-ai__shot .device-phone { --phone-w: 240px; margin-bottom: -280px; }
  .pp-ends .device-fan { min-height: 0; }
  .pp-ends .device-fan > :not(.device-fan__c) { display: none; }
  .pp-ends__browser { width: 100%; }
  .pp-ends__legend { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pp-custom { grid-template-columns: minmax(0, 1fr); padding: var(--s-5); }
  .pp-custom > svg.line-art { display: none; }
  .pp-soon { padding: var(--s-5); }
  .pp-pcard { grid-template-rows: 240px auto; border-radius: var(--r-lg); }
  .pp-pcard__media .device-browser, .pp-pcard__media .device-tablet { left: var(--s-4); top: var(--s-5); width: 360px; --tablet-w: 360px; }
  .pp-pcard__media .device-phone { right: var(--s-4); --phone-w: 132px; }
  .pp-pcard__body { padding: var(--s-4) var(--s-5) var(--s-5); }
  .pp-pcard__foot { flex-wrap: wrap; }
  .pp-pcard__foot .btn { width: 100%; }
  .pp-custom-ai { grid-template-columns: minmax(0, 1fr); padding: var(--s-5); }
  .pp-custom-ai .btn { width: 100%; }
  .pp-hero-mini { height: 340px; }
  .pp-hero-mini__a { left: 2%; --phone-w: 158px; }
  .pp-hero-mini__b { left: auto; right: 2%; --phone-w: 158px; }
  .pp-hero-mini__ta { left: 0; } .pp-hero-mini__tb { left: auto; right: 0; }
  .pp-cat-groups .filters__label { width: 100%; }
  .pp-cat-tools .searchbar input { min-height: var(--hit); }
  .pp-table-left.table--stack td { flex-direction: column; align-items: flex-start; gap: 2px; text-align: left; }
  .pp-links a { min-height: var(--hit); }
  .pp-subnav__links { -webkit-mask-image: linear-gradient(90deg, var(--ink) 82%, transparent); mask-image: linear-gradient(90deg, var(--ink) 82%, transparent); padding-right: var(--s-6); }
  .cta-band .cluster, .pp-price-group .cluster { flex-direction: column; align-items: stretch; }
  .cta-band .cluster .btn, .pp-price-group .cluster .btn { width: 100%; }
  .pp-price-group .cluster .link-more { justify-content: center; }
  .pp-receipt { transform: none; }
  .pp-price-stage > .pp-stage__halo { width: 340px; height: 300px; filter: blur(44px); }
  .pp-pains__win { height: auto; aspect-ratio: 470 / 280; }
  /* 产品中心手机首屏：只留房产电脑后台 + 录房助手，免得 AI 卡压在智慧物资手机上被误读 */
  .pp-stage--mix { --pp-stage-h: 430px; }
  .pp-stage--mix .pp-stage__browser { display: block; left: 0; right: 0; width: auto; top: 0; }
  .pp-stage--mix .pp-stage__phone, .pp-stage--mix .pp-stage__tag--phone { display: none; }
  .pp-stage--mix .pp-shot-fang-hero { --shot-w: 245.6%; }
  .pp-table-links a { display: inline-flex; align-items: center; min-height: var(--hit); }
  .pp-price-hero .h1 { font-size: var(--fs-h1); }
}
@media (prefers-reduced-transparency: reduce) {
  .pp-subnav { background: var(--bg); -webkit-backdrop-filter: none; backdrop-filter: none; }
}


/* ===== 11 最终版（2026-10-24，全站细节深审 + D-107） ===== */
/* 中文孤字孤标点：正文类一律 pretty，标题 balance */
main p, main li, main dd, main td, main figcaption, main summary, .pp-pcard__def { text-wrap: pretty; }
main h2, main h3 { text-wrap: balance; }
/* P0：运行记录铺满被拉高的光边框，不再从底部露出渐变底座 */
.pp-ai__run { display: flex; }
.pp-ai__run > .ai-run { flex: 1; height: 100%; }
/* 首屏说明挪到舞台下面 */
.pp-hero__note--stage { margin-top: var(--s-3); text-align: center; }
/* 非 AI 产品的标题强调：产品色纯色，渐变字只给 AI */
.pp-accent-wuzi { color: var(--pp-wuzi-ink); }
/* 四种东西：码类型标签贴底对齐 */
.pp-kinds li { display: flex; flex-direction: column; }
.pp-kinds__code { margin-top: auto; }
/* 产品卡：不放价格（规划 16.2），写适合谁；手机再右挪盖住后台价格列 */
.pp-pcard__for { font-size: var(--fs-sm); color: var(--ink-2); }
.pp-pcard__media .device-phone { right: var(--s-6); }
/* 持续上线卡：内容居中 */
.pp-soon { justify-items: center; text-align: center; }
/* 对比表三列：标签列定宽，两产品列等宽 */
.pp-cmp { table-layout: fixed; }
.pp-cmp thead th:first-child, .pp-cmp tbody th { width: 180px; }
/* 价格页对比表：两版相同的项合并成一行 */
.pp-same td { color: var(--ink-2); }
/* FAQ 两列等高 */
.faq--cols { align-items: stretch; }
.faq--cols details { height: 100%; }
/* 相关文章：电脑端封面压矮 */
.pp-posts .post-cover { aspect-ratio: auto; height: 120px; }
/* 这个行业还能做什么 + 更新日志 */
.pp-more { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr); gap: var(--s-7); align-items: start; }
.pp-usecases { list-style: none; padding: 0; margin: var(--s-4) 0 var(--s-3); display: grid; gap: var(--s-2); }
.pp-usecase { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "meta icon" "title icon"; align-items: center; gap: 2px var(--s-4); min-height: var(--hit); padding: var(--s-3) var(--s-4); border-radius: var(--r-md); background: var(--surface); box-shadow: var(--sh-1); color: var(--ink); transition: box-shadow var(--dur-1) var(--ease-out); }
.pp-usecase:hover { text-decoration: none; }
@media (hover: hover) { .pp-usecase:hover { box-shadow: inset 0 0 0 1px var(--brand), var(--sh-1); } }
/* 产品卡悬停：只在可悬停指针 + 允许动效时上浮，否则只加深阴影 */
@media (hover: hover) { .pp-pcard:hover { box-shadow: var(--sh-2-hover); } }
@media (hover: hover) and (prefers-reduced-motion: no-preference) { .pp-pcard:hover { transform: translateY(-4px); } }
.pp-cat-groups .filters, .pp-subnav__links { overscroll-behavior-x: contain; }
.pp-usecase__meta { grid-area: meta; font-size: var(--fs-xs); color: var(--ink-3); }
.pp-usecase__title { grid-area: title; font-weight: var(--fw-semi); font-size: var(--fs-ui, 15px); }
.pp-usecase .icon { grid-area: icon; color: var(--brand); }
.pp-log { padding: var(--s-5) var(--s-6); border-radius: var(--r-lg); background: var(--bg-subtle); }
.pp-log h2 { display: flex; align-items: center; }
.pp-log__list { margin-top: var(--s-4); gap: var(--s-4); }
@media (max-width: 1080px) {
  .pp-more { grid-template-columns: minmax(0, 1fr); gap: var(--s-6); }
}
@media (max-width: 760px) {
  .pp-hero--tight { padding-bottom: var(--s-5); }
  .pp-stage--mix { --pp-stage-h: 410px; }
  /* 筛选：每组一行横滑，带渐隐提示 */
  .pp-cat-groups .filters { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, var(--ink) 85%, transparent); mask-image: linear-gradient(90deg, var(--ink) 85%, transparent); padding-right: var(--s-5); }
  .pp-cat-groups .filters::-webkit-scrollbar { display: none; }
  .pp-cat-groups .filters__label { width: auto; flex: none; }
  .pp-cat-groups .chip { flex: none; }
  /* 多端：手机端改成两台手机并排，后台整屏截图只在 ≥ 760 显示 */
  .pp-ends .device-fan { display: flex; justify-content: center; align-items: flex-start; gap: var(--s-3); min-height: 0; }
  .pp-ends .device-fan > * { position: relative; left: auto; transform: none; display: block; opacity: 1; }
  .pp-ends .device-fan > .device-fan__c, .pp-ends .device-fan > .device-fan__l2, .pp-ends .device-fan > .device-fan__r2 { display: none; }
  .pp-ends .device-fan > .device-fan__l1, .pp-ends .device-fan > .device-fan__r1 { display: block; --phone-w: 160px; }
  .pp-ends .sec-head--center { text-align: left; }
  .pp-ends .sec-head--center .sec-head__desc { margin-inline: 0; }
  #ends .sec-head--center { text-align: left; }
  #ends .sec-head--center .sec-head__desc { margin-inline: 0; }
  /* 功能行浏览器框：不出血，地址栏完整；后台截图放大到一块关键卡 */
  .pp-feat__media .device-browser { width: calc(100% - 32px) !important; left: var(--s-4) !important; }
  .device-browser__url { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-inline: var(--s-2); }
  .pp-mzoom { --shot-w: 300% !important; }
  .pp-mzoom-kiosk > img { width: 190% !important; max-width: none; }
  /* 相关文章：手机端去掉封面，只留文字 */
  .pp-posts .post-cover { display: none; }
  .pp-posts { gap: var(--s-4); }
  .pp-posts li { padding-bottom: var(--s-4); border-bottom: 1px solid var(--line); }
  .pp-log { padding: var(--s-5); }
  .pp-cmp thead th:first-child, .pp-cmp tbody th { width: auto; }
  .pp-cmp { table-layout: auto; }
  .pp-cmp td a { display: inline-flex; align-items: center; min-height: var(--hit); }
}

/* 终审 last-A：手机端产品卡标题点击区 44px；价格单纸片与价格卡重复，手机端隐藏；借还台截图手机端加高到能看全「继续扫」框 */
@media (max-width: 760px) {
  .pp-pcard__name a { display: inline-flex; align-items: center; min-height: var(--hit); }
  .pp-receipt { display: none; }
  .pp-mzoom-kiosk { --ratio: 5 / 4 !important; }
}

/* ===== 11 适用行业 .pp-ind（产品页 #templates，2026-10-24 接行业模板）=====
   分组页签复用 site.css 的 .tabs（[data-tabs]）；本组只补两处：
   - 页签在手机端折行，不横向滚动；
   - 卡片网格 auto-fit：一组 1 张就铺满一行并改成横排三栏，2 张各占一半，3～4 张等分，不留空格子（#9 ⑧）。 */
.pp-ind__tabs { flex-wrap: wrap; overflow: visible; }
.pp-ind__count { display: inline-grid; place-items: center; min-width: 20px; height: 20px; margin-left: var(--s-2); padding: 0 var(--s-1); border-radius: var(--r-pill); background: var(--bg-subtle); color: var(--ink-3); font-size: var(--fs-xs); font-weight: var(--fw-semi); font-variant-numeric: tabular-nums; }
.tabs__tab[aria-selected="true"] .pp-ind__count { background: var(--pp-wuzi-soft); color: var(--pp-wuzi-ink); }
.pp-ind__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--s-4); list-style: none; padding: 0; margin: 0; }
.pp-ind__card { display: flex; flex-direction: column; gap: var(--s-4); padding: var(--s-5); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--sh-1); }
.pp-ind__card--blank { background: var(--bg-subtle); box-shadow: inset 0 0 0 1px var(--line); }
.pp-ind__name { display: flex; align-items: center; gap: var(--s-2); font-size: var(--fs-h4); font-weight: var(--fw-semi); line-height: 1.4; }
.pp-ind__facts { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: var(--s-3) var(--s-4); align-items: baseline; margin: 0; }
.pp-ind__facts > div { display: contents; }
.pp-ind__facts dt { font-size: var(--fs-xs); color: var(--ink-3); }
.pp-ind__facts dd { margin: 0; font-size: var(--fs-sm); color: var(--ink); line-height: 1.6; }
.pp-ind__like { padding-top: var(--s-3); border-top: 1px dashed var(--line); font-size: var(--fs-sm); color: var(--ink-2); line-height: 1.6; }
.pp-ind__like b { display: block; margin-bottom: var(--s-1); font-size: var(--fs-xs); font-weight: var(--fw-semi); color: var(--ink-3); }
.pp-ind__link { align-self: flex-start; margin-top: auto; }
/* 一组只有 1 张：横排「名称 | 三项事实 | 像不像您」，不让卡片孤零零占三分之一 */
@media (min-width: 761px) {
  .pp-ind__card:only-child { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.6fr) minmax(0, 1.2fr); column-gap: var(--s-6); align-items: start; }
  .pp-ind__card:only-child .pp-ind__like { margin-top: 0; padding-top: 0; padding-left: var(--s-5); border-top: 0; border-left: 1px dashed var(--line); }
}
@media (max-width: 760px) {
  /* 手机端：六个分组排成 3 × 2 的整齐格子，不横向滚动、不参差折行 */
  .pp-ind__tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: 100%; border-radius: var(--r-md); }
  .pp-ind__tabs .tabs__tab { display: inline-flex; align-items: center; justify-content: center; padding: 0 var(--s-2); border-radius: var(--r-sm); }
  .pp-ind__count { margin-left: var(--s-1); }
  .pp-ind__grid { grid-template-columns: minmax(0, 1fr); gap: var(--s-3); }
  .pp-ind__link { min-height: var(--hit); display: inline-flex; align-items: center; }
}

/* ===== 开发还原追加（第 1 次迭代前台：产品清单驱动的通用产品页；设计稿行内样式收进这里） ===== */
.pp-catalog { padding-block: var(--s-6) var(--s-8); }
.pp-paused { display: inline-flex; align-items: center; gap: var(--s-2); margin-top: var(--s-3); padding: var(--s-2) var(--s-3); border-radius: var(--r-sm); background: var(--seal-soft); color: var(--seal); font-size: var(--fs-sm); font-weight: var(--fw-semi); }
.pp-hero__art { width: 100%; max-width: 420px; height: auto; margin-inline: auto; display: block; }
.pp-overview { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-4); }
.pp-ai-list { list-style: none; margin: 0 0 var(--s-6); padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-4); }
.pp-ai-list .checks { margin-top: var(--s-3); }
@media (min-width: 761px) {   /* AI 功能正好 3 项排一行三列；奇数项（5、7…）最后一张占满一行，不留半行空白（上线看图挑出） */
  .pp-ai-list:has(> li:nth-child(3):last-child) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pp-ai-list > li:last-child:nth-child(odd):not(:nth-child(3)) { grid-column: 1 / -1; }
}
.pp-feat--text { grid-template-columns: minmax(0, 1fr); }
.pp-feat__shot { margin: 0; display: grid; place-items: center; height: 100%; padding: var(--s-5); position: relative; z-index: 1; }
.pp-feat__shot .device-phone { --phone-w: 228px; position: relative; }
.pp-feat__shot .device-browser { width: 100%; position: relative; }
.pp-more--one { grid-template-columns: minmax(0, 1fr); }
.pp-more__desc { margin-top: var(--s-2); }
.pp-posts-list { margin-top: var(--s-4); }
.pp-filterbar { display: flex; flex-wrap: wrap; gap: var(--s-3) var(--s-5); align-items: center; }
.pp-filters { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); }
.pp-search { min-width: 260px; }
@media (max-width: 1080px) { .pp-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .pp-overview, .pp-ai-list { grid-template-columns: minmax(0, 1fr); } .pp-search { min-width: 0; width: 100%; } }
.pp-price-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.pp-price-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 820px; }
@media (max-width: 1280px) { .pp-price-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .pp-price-grid--4, .pp-price-grid--2 { grid-template-columns: minmax(0, 1fr); } }

/* 已停售说明页（规划 3.2「停售」）：沿用产品页首屏，只留一列文字；替代产品沿用产品卡网格 */
.pp-retired__copy { max-width: 720px; }
.pp-retired__copy .h1 { margin-top: var(--s-3); }
.pp-retired__copy .lead { margin-top: var(--s-3); font-size: var(--fs-h4); color: var(--ink-2); }
.pp-retired__copy .cluster { margin-top: var(--s-5); }
.pr-grid { --cols: 3; }
.pr-links { margin-top: var(--s-4); }
.pr-more-sec { padding-block: var(--s-6) var(--s-8); }

/* ===== 12 官网体检修复（2026-11-01，第 2 组报告） ===== */
/* 非 AI 标题强调用实色主色，渐变字只给 AI（2-16）；产品页副标题按词断行，不把「客源」拆两行（2-6） */
.pp-h1-em, .pp-title__sub { color: var(--brand); }
.pp-title__sub { word-break: keep-all; overflow-wrap: anywhere; text-wrap: balance; }
/* 首屏只有手机图时，图注跟手机一起靠右（2-15） */
.pp-stage:not(:has(.pp-stage__browser)) + .pp-hero__note--stage { text-align: right; }
@media (max-width: 760px) { .pp-stage:not(:has(.pp-stage__browser)) + .pp-hero__note--stage { text-align: center; } }

/* 产品页：截图不够时的功能卡片网格（2-2） */
.pp-fgrid__item { display: flex; flex-direction: column; gap: var(--s-2); }
.pp-fgrid__mod { font-size: var(--fs-xs); font-weight: var(--fw-semi); color: var(--ink-3); letter-spacing: var(--track-head); }
.pp-ov-empty { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s-4); padding: var(--s-5) var(--s-6); border-radius: var(--r-lg); background: var(--bg-subtle); color: var(--ink-2); }

/* 多端一节：截图不够画扇形时，每端一张「图标 + 一句话」小卡；去掉像标签页的高亮线（2-3） */
.pp-ends__legend--cards { margin-top: 0; }
.pp-ends__legend--cards li { display: grid; gap: var(--s-2); align-content: start; padding: var(--s-5); border-top: 0; border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--sh-1); }
.pp-ends__legend--cards b { font-size: var(--fs-body-lg); }
.pp-ends__legend li.is-key { border-top-color: var(--line); }
@media (max-width: 760px) {
  .pp-ends__legend--cards { grid-template-columns: minmax(0, 1fr); gap: var(--s-3); }
  .pp-ends__legend--cards li { grid-template-columns: auto minmax(0, 1fr); column-gap: var(--s-3); row-gap: var(--s-1); padding: var(--s-4); }
  .pp-ends__legend--cards li .card__icon { grid-row: span 2; }
}

/* 价格卡：强调只给一张（主色描边 + 实心按钮），写清「买到什么」（2-7、2-11） */
.pp-price-card--pick { box-shadow: inset 0 0 0 1.5px var(--brand), var(--sh-2); }
.pp-price-card__inc { font-size: var(--fs-sm); }
.pp-price-card__inc .icon { width: 16px; height: 16px; }
.pp-receipt__foot { padding-right: 0; }

/* 对比表：按组分段，金额右对齐等宽数字，各版相同的项合并成一格居中（2-7、2-8） */
.pp-cmp thead th:first-child { width: auto; }
.pp-cmp th.pp-cmp__plan { width: 240px; }
.pp-cmp td, .pp-cmp th.pp-cmp__plan { text-align: right; }
.pp-cmp tbody tr:last-child > * { border-bottom: 1px solid var(--line); }
.pp-cmp tbody:last-child tr:last-child > * { border-bottom: 0; }
.pp-cmp td.pp-same__v { text-align: center; color: var(--ink-2); }
.pp-cmp__group th { padding-block: var(--s-2); font-size: var(--fs-xs); font-weight: var(--fw-semi); color: var(--ink-3); background: var(--bg-subtle); letter-spacing: var(--track-head); }
@media (max-width: 1080px) { .pp-cmp th.pp-cmp__plan { width: 180px; } }
@media (max-width: 760px) {
  .pp-cmp td, .pp-cmp td.pp-same__v { text-align: left; }
  .pp-cmp th.pp-cmp__plan { width: auto; }
  .pp-cmp tr.pp-cmp__group { padding: 0; background: var(--bg-subtle); }
  .pp-cmp tr.pp-cmp__group th { display: block; width: auto; padding: var(--s-2) var(--s-4); border: 0; }
}

/* 产品中心：只有 1 款时首屏只留文字，目录是一张通栏横卡；定制卡占满一行（2-4、2-9） */
.pp-hero--solo .page-hero__grid { grid-template-columns: minmax(0, 1fr); }
.pp-hero--solo .page-hero__copy { max-width: 760px; }
.pp-cat > li.pp-cat__full { grid-column: 1 / -1; }
.pp-cat--solo > li { grid-column: 1 / -1; }
.pp-pcard--solo { grid-template-rows: none; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); min-height: 420px; }
.pp-pcard--solo .pp-pcard__media { min-height: 420px; }
.pp-pcard--solo .pp-pcard__media .device-phone { right: auto; left: 50%; transform: translateX(-50%); top: var(--s-6); --phone-w: 220px; }
.pp-pcard--solo .pp-pcard__media:has(.device-browser) .device-phone { left: auto; right: var(--s-6); transform: none; --phone-w: 168px; }
.pp-pcard--solo .pp-pcard__body { align-content: center; padding: var(--s-7) var(--s-7) var(--s-7) var(--s-6); gap: var(--s-4); }
.pp-pcard__pts { font-size: var(--fs-sm); }
.pp-pcard__pts b { color: var(--ink); font-weight: var(--fw-semi); }
@media (max-width: 1080px) {
  .pp-pcard--solo { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .pp-pcard--solo .pp-pcard__media { min-height: 360px; }
  .pp-pcard--solo .pp-pcard__body { padding: var(--s-5) var(--s-6) var(--s-6); }
}
@media (max-width: 760px) {
  .pp-pcard--solo .pp-pcard__media { min-height: 300px; }
  .pp-pcard--solo .pp-pcard__media .device-phone { --phone-w: 160px; }
  .pp-pcard--solo .pp-pcard__body { padding: var(--s-4) var(--s-5) var(--s-5); }
}

/* ===== 11 在线体验（接入规范 19.6.2）：首屏「先看演示」下的小字、每端一张体验卡、价格区「预约演示」一行 ===== */
.pp-demo-note { margin-top: var(--s-2); }
.pp-demo__hl { list-style: none; padding: 0; margin: var(--s-3) 0 0; display: flex; flex-wrap: wrap; gap: var(--s-2); }
.pp-demo { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); gap: var(--s-4); }
.pp-demo__card { display: grid; grid-template-rows: auto auto 1fr auto; gap: var(--s-3); padding: var(--s-5); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--sh-1); }
.pp-demo__head { display: flex; align-items: center; gap: var(--s-3); }
.pp-demo__name { font-size: var(--fs-h4); font-weight: var(--fw-semi); }
.pp-demo__desc { font-size: var(--fs-ui); color: var(--ink-2); line-height: 1.65; }
.pp-demo__qr { margin: 0; display: flex; align-items: center; gap: var(--s-4); align-self: end; }
/* 码固定白底：暗色模式、换主题色都扫得出（19.8 第 8 维） */
.pp-demo__qr img { width: 132px; height: 132px; padding: var(--s-1); border-radius: var(--r-xs); background: var(--p-white); box-shadow: inset 0 0 0 1px var(--line); }
.pp-demo__qr figcaption { font-size: var(--fs-sm); color: var(--ink-3); }
.pp-demo__card:not(.pp-demo__card--qr) .btn { align-self: end; }
.pp-demo__open { display: none; }
.pp-demo__foot { display: flex; gap: var(--s-2); align-items: flex-start; margin-top: var(--s-5); font-size: var(--fs-sm); color: var(--ink-3); line-height: 1.7; }
.pp-demo__foot .icon { flex: none; width: 16px; height: 16px; margin-top: 3px; color: var(--ink-3); }
.pp-demo__foot a { color: var(--brand-ink); }
.pp-price-demo { margin-top: var(--s-4); font-size: var(--fs-ui); color: var(--ink-2); display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); }
@media (max-width: 1080px) { .pp-demo { grid-template-columns: repeat(min(var(--cols, 3), 2), minmax(0, 1fr)); } }
/* 手机上：不出码（扫自己屏幕扫不了），直接点「在手机上打开」 */
@media (max-width: 760px) {
  .pp-demo { grid-template-columns: minmax(0, 1fr); }
  .pp-demo__qr { display: none; }
  .pp-demo__open { display: inline-flex; }
}
