/* ==========================================================================
   产品详情页（淘宝式）—— 只被 templates/product_detail.html 引用
   颜色一律走 style.css 的 --c-* token，暗色主题自动跟随；
   这里只补详情页自己的几个：卡片底色、价格色、购买按钮色。
   ========================================================================== */
.pdp {
  --pdp-surface: #f5f7fa;
  --pdp-surface-2: #edf1f6;
  --pdp-line: rgba(15, 23, 42, .09);
  --pdp-price: #e8340c;
  --pdp-buy: linear-gradient(90deg, #ff9000, #ff5000);
  --pdp-buy-shadow: rgba(255, 80, 0, .28);
  --pdp-radius: 12px;
  --pdp-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 10px 30px rgba(15, 23, 42, .06);
  --pdp-nav-h: 72px;
  padding: 96px 0 72px;
}
html[data-theme="dark-gray"] .pdp {
  --pdp-surface: var(--c-card);
  --pdp-surface-2: var(--c-surface);
  --pdp-line: rgba(226, 232, 240, .10);
  --pdp-price: #ff7a52;
  --pdp-shadow: 0 10px 30px rgba(0, 0, 0, .22);
}
.pdp-container { max-width: 1440px; }

/* ── 面包屑 ─────────────────────────────────────────── */
.pdp-crumb { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 16px; font-size: 13px; color: var(--c-text-3); }
.pdp-crumb a:hover { color: var(--c-accent-text); }
.pdp-crumb strong { color: var(--c-text); font-weight: 600; max-width: 40ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ── 通用卡片 / 按钮 ─────────────────────────────────── */
.pdp-card, .pdp-panel, .pdp-hero {
  background: var(--pdp-surface);
  border: 1px solid var(--pdp-line);
  border-radius: var(--pdp-radius);
  box-shadow: var(--pdp-shadow);
}
.pdp-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  height: 46px; padding: 0 26px; border-radius: 999px; border: 1px solid transparent;
  font-size: 15px; font-weight: 700; letter-spacing: .5px; white-space: nowrap;
  transition: transform .2s var(--ease), box-shadow .2s var(--ease), background .2s, border-color .2s, color .2s;
}
.pdp-btn:hover { transform: translateY(-1px); }
.pdp-btn-sm { height: 34px; padding: 0 16px; font-size: 13px; }
.pdp-btn-primary { background: var(--c-accent); color: var(--c-on-accent); box-shadow: 0 6px 18px var(--c-accent-glow); }
.pdp-btn-primary:hover { box-shadow: 0 10px 26px var(--c-accent-glow); }
.pdp-btn-buy { background: var(--pdp-buy); color: #fff; box-shadow: 0 6px 18px var(--pdp-buy-shadow); }
.pdp-btn-buy:hover { box-shadow: 0 10px 26px var(--pdp-buy-shadow); }
.pdp-btn-ghost { background: transparent; color: var(--c-text); border-color: var(--c-border); }
.pdp-btn-ghost:hover { border-color: var(--c-accent); color: var(--c-accent-text); }
.pdp-h2 { display: flex; align-items: center; gap: 10px; margin: 0 0 18px; font-size: 18px; font-weight: 800; color: var(--c-text); }
.pdp-h2::before { content: ''; width: 4px; height: 18px; border-radius: 2px; background: var(--c-accent-gradient); }

/* ── 首屏 ───────────────────────────────────────────── */
.pdp-hero {
  display: grid; grid-template-columns: minmax(0, 480px) minmax(0, 1fr);
  gap: 44px; padding: 28px; margin-bottom: 20px; position: relative;
}

/* 主图区 */
.pdp-gallery { position: relative; min-width: 0; }
.pdp-stage {
  position: relative; aspect-ratio: 1 / 1; border-radius: 10px; overflow: hidden;
  background: #fff; border: 1px solid var(--pdp-line); outline: none;
}
html[data-theme="dark-gray"] .pdp-stage { background: rgba(255, 255, 255, .03); }
.pdp-stage:focus-visible { box-shadow: 0 0 0 3px var(--c-accent-glow); }
.pdp-slide { position: absolute; inset: 0; display: grid; place-items: center; opacity: 0; visibility: hidden; transition: opacity .35s var(--ease), visibility .35s; }
.pdp-slide.is-active { opacity: 1; visibility: visible; }
.pdp-slide picture { display: contents; }
.pdp-slide img { width: 100%; height: 100%; object-fit: contain; cursor: zoom-in; }
.pdp-slide video { width: 100%; height: 100%; object-fit: contain; background: #0b0f14; }
.pdp-slide-empty span { font-size: 120px; font-weight: 900; color: var(--c-border); }
.pdp-ribbon { position: absolute; top: 14px; left: 14px; z-index: 3; padding: 4px 12px; border-radius: 999px; background: var(--pdp-buy); color: #fff; font-size: 12px; font-weight: 700; }
.pdp-badge-gif { position: absolute; top: 12px; right: 12px; z-index: 2; padding: 3px 8px; border-radius: 6px; background: rgba(15, 23, 42, .72); color: #fff; font-size: 11px; font-weight: 800; letter-spacing: .5px; }
.pdp-counter { position: absolute; right: 12px; bottom: 12px; z-index: 3; padding: 3px 10px; border-radius: 999px; background: rgba(15, 23, 42, .55); color: #fff; font-size: 12px; font-variant-numeric: tabular-nums; }
.pdp-stage.on-video .pdp-counter { bottom: 58px; }
.pdp-stage-nav {
  position: absolute; top: 50%; z-index: 4; width: 38px; height: 58px; margin-top: -29px;
  border: 0; background: rgba(15, 23, 42, .38); color: #fff; font-size: 28px; line-height: 1;
  opacity: 0; transition: opacity .2s, background .2s;
}
.pdp-stage-nav.prev { left: 0; border-radius: 0 8px 8px 0; }
.pdp-stage-nav.next { right: 0; border-radius: 8px 0 0 8px; }
.pdp-stage:hover .pdp-stage-nav { opacity: 1; }
.pdp-stage-nav:hover { background: rgba(15, 23, 42, .62); }
.pdp-lens {
  position: absolute; left: 0; top: 0; z-index: 2; pointer-events: none; display: none;
  background: rgba(37, 99, 235, .12); border: 1px solid rgba(37, 99, 235, .45);
  background-image: radial-gradient(rgba(255, 255, 255, .5) 1px, transparent 1px); background-size: 4px 4px;
}
.pdp-stage.zooming .pdp-lens { display: block; }
.pdp-stage.zooming .pdp-slide img { cursor: crosshair; }
.pdp-zoom {
  position: absolute; top: 0; left: calc(100% + 24px); z-index: 20;
  width: min(520px, calc(100vw - 100% - 120px)); aspect-ratio: 1 / 1;
  background-color: #fff; background-repeat: no-repeat; border: 1px solid var(--pdp-line);
  border-radius: 10px; box-shadow: 0 18px 50px rgba(15, 23, 42, .22);
  opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .15s;
}
.pdp-zoom.show { opacity: 1; visibility: visible; }

/* 缩略图 */
.pdp-thumbs-wrap { position: relative; display: flex; align-items: center; gap: 6px; margin-top: 12px; }
.pdp-thumbs { display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none; padding: 2px; flex: 1; }
.pdp-thumbs::-webkit-scrollbar { display: none; }
.pdp-thumbs-arrow { flex: 0 0 22px; height: 64px; border: 0; border-radius: 6px; background: transparent; color: var(--c-text-3); font-size: 22px; }
.pdp-thumbs-arrow:hover { background: var(--pdp-surface-2); color: var(--c-text); }
.pdp-thumb {
  position: relative; flex: 0 0 72px; height: 72px; padding: 0; overflow: hidden; scroll-snap-align: start;
  border: 2px solid transparent; border-radius: 8px; background: #fff; opacity: .72;
  transition: border-color .15s, opacity .15s;
}
html[data-theme="dark-gray"] .pdp-thumb { background: rgba(255, 255, 255, .04); }
.pdp-thumb img, .pdp-thumb video { width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.pdp-thumb:hover { opacity: 1; }
.pdp-thumb.is-active { border-color: var(--pdp-price); opacity: 1; }
.pdp-thumb-play { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(15, 23, 42, .28); }
.pdp-thumb-play::after { content: ''; border-left: 14px solid #fff; border-top: 9px solid transparent; border-bottom: 9px solid transparent; margin-left: 3px; filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .4)); }

/* 右侧信息 */
.pdp-info { min-width: 0; display: flex; flex-direction: column; }
.pdp-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.pdp-tag { padding: 2px 9px; border-radius: 4px; font-size: 12px; font-weight: 600; color: var(--c-accent-text); background: rgba(37, 99, 235, .09); }
.pdp-tag.is-hot { color: #fff; background: var(--pdp-buy); }
.pdp-tag.is-brand { color: var(--c-text-2); background: var(--pdp-surface-2); }
.pdp-title { margin: 0 0 10px; font-size: clamp(22px, 2.3vw, 28px); line-height: 1.35; font-weight: 800; color: var(--c-text); letter-spacing: -.2px; }
.pdp-slogan { margin: 0 0 16px; font-size: 15px; line-height: 1.6; font-weight: 600; color: var(--pdp-price); }

.pdp-price-panel {
  display: flex; flex-direction: column; gap: 12px; padding: 16px 18px; margin-bottom: 16px; border-radius: 10px;
  background:
    radial-gradient(120% 140% at 100% 0%, rgba(255, 120, 60, .10), transparent 55%),
    linear-gradient(90deg, rgba(37, 99, 235, .07), rgba(8, 145, 178, .05));
  border: 1px solid rgba(37, 99, 235, .10);
}
.pdp-row { display: flex; align-items: baseline; gap: 14px; min-width: 0; }
.pdp-label { flex: 0 0 auto; width: 36px; font-size: 13px; color: var(--c-text-3); }
.pdp-price { display: inline-flex; align-items: baseline; color: var(--pdp-price); font-weight: 800; line-height: 1; }
.pdp-price em { font-style: normal; font-size: 18px; margin-right: 2px; }
.pdp-price strong { font-size: 34px; letter-spacing: -.5px; font-variant-numeric: tabular-nums; }
.pdp-price small { font-size: 18px; }
.pdp-price.is-quote strong { font-size: 28px; }
.pdp-price-note { font-size: 12px; color: var(--c-text-3); }
.pdp-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.pdp-chips span { padding: 3px 10px; border-radius: 999px; font-size: 12.5px; color: var(--c-text-2); background: var(--pdp-surface); border: 1px solid var(--pdp-line); }

.pdp-desc { position: relative; margin-bottom: 16px; }
.pdp-desc p { margin: 0; font-size: 14px; line-height: 1.85; color: var(--c-text-2); display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.pdp-desc.is-open p { -webkit-line-clamp: unset; display: block; }
.pdp-desc-more { margin-top: 4px; padding: 0; border: 0; background: none; color: var(--c-accent-text); font-size: 13px; }

.pdp-keyspecs { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 10px; margin-bottom: 16px; }
.pdp-keyspec { display: flex; flex-direction: column; gap: 4px; padding: 12px 12px; border-radius: 10px; background: var(--pdp-surface-2); border: 1px solid var(--pdp-line); min-width: 0; }
.pdp-keyspec strong { font-size: 15px; font-weight: 800; color: var(--c-text); line-height: 1.35; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.pdp-keyspec span { font-size: 12px; color: var(--c-text-3); }

.pdp-meta { display: flex; flex-direction: column; gap: 10px; margin: 0 0 22px; padding: 0 2px; }
.pdp-meta > div { display: flex; gap: 14px; align-items: baseline; font-size: 13.5px; }
.pdp-meta dt { flex: 0 0 36px; color: var(--c-text-3); }
.pdp-meta dd { margin: 0; color: var(--c-text-2); min-width: 0; }
.pdp-services { display: flex; flex-wrap: wrap; gap: 4px 16px; }
.pdp-services span { position: relative; padding-left: 18px; }
.pdp-services span::before { content: '✓'; position: absolute; left: 0; top: 0; color: var(--c-success); font-weight: 800; }
.pdp-link { color: var(--c-accent-text); }
.pdp-link:hover { text-decoration: underline; }

.pdp-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: auto; }
.pdp-actions .pdp-btn { min-width: 150px; }

/* ── 下半屏：侧栏 + 主栏 ─────────────────────────────── */
.pdp-body { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 20px; align-items: start; }
.pdp-side { display: flex; flex-direction: column; gap: 16px; }
.pdp-card { padding: 18px; }
.pdp-shop { text-align: center; }
.pdp-shop-logo { height: 30px; width: auto; margin: 4px auto 10px; filter: brightness(0) saturate(100%) invert(31%) sepia(87%) saturate(2763%) hue-rotate(214deg) brightness(94%) contrast(95%); }
html[data-theme="dark-gray"] .pdp-shop-logo { filter: brightness(0) saturate(100%) invert(63%) sepia(82%) saturate(1121%) hue-rotate(196deg) brightness(103%) contrast(101%); }
.pdp-shop-name { font-weight: 800; color: var(--c-text); font-size: 15px; }
.pdp-shop-desc { margin: 6px 0 14px; font-size: 12.5px; line-height: 1.6; color: var(--c-text-3); }
.pdp-shop-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.pdp-shop-actions .pdp-btn { padding: 0 8px; }
.pdp-shop-qr { margin: 16px 0 0; padding-top: 14px; border-top: 1px dashed var(--pdp-line); }
.pdp-shop-qr img { width: 112px; height: 112px; margin: 0 auto; border-radius: 8px; background: #fff; padding: 4px; }
.pdp-shop-qr figcaption { margin-top: 6px; font-size: 12px; color: var(--c-text-3); }
.pdp-side-title { margin: 0 0 12px; font-size: 14px; font-weight: 800; color: var(--c-text); text-align: center; }
.pdp-related-list { display: flex; flex-direction: column; gap: 14px; }
.pdp-related-item { display: flex; flex-direction: column; gap: 4px; }
.pdp-related-img { display: grid; place-items: center; aspect-ratio: 1 / 1; overflow: hidden; border-radius: 8px; background: #fff; border: 1px solid var(--pdp-line); }
html[data-theme="dark-gray"] .pdp-related-img { background: rgba(255, 255, 255, .04); }
.pdp-related-img img { width: 100%; height: 100%; object-fit: contain; transition: transform .35s var(--ease); }
.pdp-related-img i { font-style: normal; font-size: 40px; font-weight: 900; color: var(--c-border); }
.pdp-related-item:hover img { transform: scale(1.04); }
.pdp-related-name { font-size: 13px; line-height: 1.45; color: var(--c-text); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pdp-related-item:hover .pdp-related-name { color: var(--c-accent-text); }
.pdp-related-meta { font-size: 13px; font-weight: 700; color: var(--pdp-price); }

.pdp-main { min-width: 0; display: flex; flex-direction: column; gap: 20px; }

/* 吸顶 tab */
.pdp-tabs {
  position: sticky; top: var(--pdp-nav-h); z-index: 30;
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  height: 52px; padding: 0 8px 0 4px; margin-bottom: -8px;
  background: var(--pdp-surface); border: 1px solid var(--pdp-line); border-radius: var(--pdp-radius);
  box-shadow: var(--pdp-shadow);
}
.pdp-tabs.is-stuck { border-radius: 0 0 var(--pdp-radius) var(--pdp-radius); box-shadow: 0 8px 24px rgba(15, 23, 42, .12); }
.pdp-tabs-list { display: flex; height: 100%; overflow-x: auto; scrollbar-width: none; }
.pdp-tabs-list::-webkit-scrollbar { display: none; }
.pdp-tab { position: relative; display: inline-flex; align-items: center; gap: 5px; padding: 0 20px; height: 100%; font-size: 15px; font-weight: 600; color: var(--c-text-2); white-space: nowrap; }
.pdp-tab i { font-style: normal; font-size: 11px; font-weight: 700; color: var(--c-text-3); }
.pdp-tab:hover { color: var(--c-text); }
.pdp-tab.is-active { color: var(--pdp-price); }
.pdp-tab.is-active::after { content: ''; position: absolute; left: 20px; right: 20px; bottom: 0; height: 3px; border-radius: 3px 3px 0 0; background: var(--pdp-price); }
.pdp-tabs-cta { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.pdp-tabs-name { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; font-weight: 700; color: var(--c-text); opacity: 0; transition: opacity .2s; }
.pdp-tabs.is-stuck .pdp-tabs-name { opacity: 1; }

.pdp-panel { overflow: hidden; scroll-margin-top: calc(var(--pdp-nav-h) + 64px); }
.pdp-pad { padding: 26px 28px; }
.pdp-params, .pdp-flow .pdp-sec-head, .pdp-flow-divider { scroll-margin-top: calc(var(--pdp-nav-h) + 64px); }

/* 参数信息（淘宝"参数信息"那一格） */
.pdp-params { padding: 26px 28px 22px; border-bottom: 1px solid var(--pdp-line); }
.pdp-params-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 24px; margin: 0; }
.pdp-param { display: flex; gap: 10px; padding: 9px 0; border-bottom: 1px dashed var(--pdp-line); font-size: 13px; line-height: 1.55; min-width: 0; }
.pdp-param dt { flex: 0 0 auto; max-width: 45%; color: var(--c-text-3); }
.pdp-param dt::after { content: '：'; }
.pdp-param dd { margin: 0; color: var(--c-text); word-break: break-word; min-width: 0; }

/* 图文详情：图片无缝竖排，跟淘宝长图一样 */
.pdp-flow { max-width: 820px; margin: 0 auto; padding: 8px 0 36px; }
.pdp-flow-divider { display: flex; align-items: center; gap: 16px; margin: 20px 28px 24px; color: var(--c-text-3); font-size: 13px; letter-spacing: 4px; }
.pdp-flow-divider::before, .pdp-flow-divider::after { content: ''; flex: 1; height: 1px; background: linear-gradient(90deg, transparent, var(--c-border), transparent); }
.pdp-sec-head { text-align: center; padding: 40px 28px 22px; }
.pdp-sec-head h3 { display: inline-block; position: relative; margin: 0; padding-bottom: 12px; font-size: clamp(20px, 2.2vw, 26px); font-weight: 850; color: var(--c-text); letter-spacing: .5px; }
.pdp-sec-head h3::after { content: ''; position: absolute; left: 50%; bottom: 0; width: 44px; height: 3px; margin-left: -22px; border-radius: 3px; background: var(--c-accent-gradient); }
.pdp-sec-head p { margin: 12px auto 0; max-width: 560px; font-size: 14px; line-height: 1.7; color: var(--c-text-3); }
.pdp-text-title { margin: 28px 28px 10px; font-size: 19px; font-weight: 800; color: var(--c-text); text-align: center; }
.pdp-text { padding: 12px 36px 18px; }
.pdp-text p { margin: 0; font-size: 15px; line-height: 2; color: var(--c-text-2); white-space: pre-line; text-align: justify; }
.pdp-img { position: relative; margin: 0; }
.pdp-img picture { display: contents; }
.pdp-img img { display: block; width: 100%; height: auto; cursor: zoom-in; }
.pdp-img.has-cap { margin-bottom: 18px; }
.pdp-img figcaption, .pdp-video figcaption { padding: 10px 28px 0; font-size: 13px; color: var(--c-text-3); text-align: center; line-height: 1.6; }
.pdp-video { margin: 18px 0; }
.pdp-video-frame { position: relative; background: #0b0f14; }
.pdp-video-frame video, .pdp-video-frame iframe { display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; }
.pdp-html { padding: 8px 28px; }
.pdp-pdf { margin: 20px 28px; }
.pdp-empty-detail p { margin: 0; text-align: center; color: var(--c-text-3); }
.pdp-empty-detail a { color: var(--c-accent-text); }

/* 资料下载 */
.pdp-downloads { display: flex; flex-direction: column; gap: 10px; }
.pdp-dl { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border-radius: 10px; background: var(--pdp-surface-2); border: 1px solid var(--pdp-line); transition: border-color .2s; }
.pdp-dl:hover { border-color: var(--c-border-h); }
.pdp-dl-ico { flex: 0 0 44px; height: 44px; display: grid; place-items: center; border-radius: 8px; font-size: 11px; font-weight: 800; color: #fff; background: #64748b; letter-spacing: .5px; }
.pdp-dl-ico.ft-pdf { background: #e5484d; }
.pdp-dl-ico.ft-zip, .pdp-dl-ico.ft-rar, .pdp-dl-ico.ft-7z { background: #d97706; }
.pdp-dl-ico.ft-doc, .pdp-dl-ico.ft-docx { background: #2563eb; }
.pdp-dl-ico.ft-exe, .pdp-dl-ico.ft-msi, .pdp-dl-ico.ft-apk, .pdp-dl-ico.ft-dmg { background: #0891b2; }
.pdp-dl-info { flex: 1; min-width: 0; }
.pdp-dl-title { font-size: 14.5px; font-weight: 700; color: var(--c-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pdp-dl-meta { margin-top: 3px; font-size: 12.5px; color: var(--c-text-3); }

/* 资质 / 案例 / 售后 */
.pdp-trust-group + .pdp-trust-group { margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--pdp-line); }
.pdp-trust-label { margin-bottom: 12px; font-size: 12px; font-weight: 800; letter-spacing: 1px; color: var(--c-text-3); }
.pdp-certs { display: flex; flex-wrap: wrap; gap: 10px; }
.pdp-cert { display: flex; flex-direction: column; gap: 2px; padding: 10px 16px 10px 40px; position: relative; border-radius: 10px; background: var(--pdp-surface-2); border: 1px solid var(--pdp-line); }
.pdp-cert::before { content: '✓'; position: absolute; left: 12px; top: 10px; width: 18px; height: 18px; border-radius: 50%; display: grid; place-items: center; font-size: 11px; font-weight: 900; color: #fff; background: var(--c-success); }
.pdp-cert strong { font-size: 14px; color: var(--c-text); }
.pdp-cert span { font-size: 12px; color: var(--c-text-3); }
.pdp-cases { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
.pdp-case { padding: 16px 18px; border-radius: 10px; background: var(--pdp-surface-2); border: 1px solid var(--pdp-line); border-top: 3px solid var(--c-accent); }
.pdp-case h3 { margin: 0 0 6px; font-size: 15px; color: var(--c-text); }
.pdp-case p { margin: 0; font-size: 13.5px; line-height: 1.75; color: var(--c-text-2); }
.pdp-service-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.pdp-service-list li { display: flex; flex-direction: column; gap: 3px; padding: 12px 14px 12px 40px; position: relative; border-radius: 10px; background: var(--pdp-surface-2); }
.pdp-service-list li::before { content: '✓'; position: absolute; left: 14px; top: 12px; color: var(--c-success); font-weight: 900; }
.pdp-service-list strong { font-size: 14px; color: var(--c-text); }
.pdp-service-list span { font-size: 13px; color: var(--c-text-3); line-height: 1.6; }

/* FAQ */
.pdp-faq { display: flex; flex-direction: column; }
.pdp-faq-item { border-bottom: 1px solid var(--pdp-line); }
.pdp-faq-item:first-child { border-top: 1px solid var(--pdp-line); }
.pdp-faq-item summary { position: relative; display: flex; align-items: center; gap: 12px; padding: 15px 32px 15px 0; cursor: pointer; list-style: none; font-size: 15px; font-weight: 650; color: var(--c-text); }
.pdp-faq-item summary::-webkit-details-marker { display: none; }
.pdp-faq-item summary::after { content: '+'; position: absolute; right: 6px; font-size: 20px; font-weight: 400; color: var(--c-text-3); }
.pdp-faq-item[open] summary::after { content: '−'; }
.pdp-faq-item i { flex: 0 0 22px; height: 22px; display: grid; place-items: center; border-radius: 6px; font-style: normal; font-size: 12px; font-weight: 800; color: #fff; background: var(--c-accent); }
.pdp-faq-body { display: flex; gap: 12px; padding: 0 32px 16px 0; font-size: 14px; line-height: 1.85; color: var(--c-text-2); }
.pdp-faq-body i { background: var(--pdp-price); }

/* ── 手机底部操作条 ─────────────────────────────────── */
.pdp-bottombar { display: none; }

/* ── 灯箱 ───────────────────────────────────────────── */
.pdp-lightbox { position: fixed; inset: 0; z-index: 3000; display: grid; place-items: center; padding: 48px 72px; background: rgba(6, 9, 14, .9); opacity: 0; visibility: hidden; transition: opacity .2s, visibility .2s; }
.pdp-lightbox.show { opacity: 1; visibility: visible; }
.pdp-lightbox img { max-width: 100%; max-height: calc(100vh - 96px); object-fit: contain; border-radius: 6px; }
.pdp-lb-close { position: absolute; top: 14px; right: 18px; width: 44px; height: 44px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .12); color: #fff; font-size: 28px; line-height: 1; }
.pdp-lb-nav { position: absolute; top: 50%; width: 48px; height: 72px; margin-top: -36px; border: 0; border-radius: 10px; background: rgba(255, 255, 255, .1); color: #fff; font-size: 34px; }
.pdp-lb-nav:hover, .pdp-lb-close:hover { background: rgba(255, 255, 255, .22); }
.pdp-lb-nav.prev { left: 14px; }
.pdp-lb-nav.next { right: 14px; }
.pdp-lightbox.single .pdp-lb-nav { display: none; }
.pdp-lb-count { position: absolute; bottom: 16px; left: 50%; transform: translateX(-50%); color: rgba(255, 255, 255, .8); font-size: 13px; font-variant-numeric: tabular-nums; }
html.pdp-noscroll, html.pdp-noscroll body { overflow: hidden; }

/* ── 响应式 ─────────────────────────────────────────── */
@media (max-width: 1100px) {
  .pdp-hero { grid-template-columns: minmax(0, 420px) minmax(0, 1fr); gap: 32px; }
  .pdp-params-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pdp-tabs-name { display: none; }
}
@media (max-width: 1023px) {
  .pdp-zoom, .pdp-lens { display: none !important; }
}
@media (max-width: 900px) {
  .pdp-hero { grid-template-columns: minmax(0, 1fr); gap: 24px; padding: 20px; }
  .pdp-gallery { max-width: 560px; width: 100%; margin: 0 auto; }
  .pdp-body { grid-template-columns: minmax(0, 1fr); }
  .pdp-side { position: static; order: 2; }
  .pdp-shop { display: none; }
  .pdp-related-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
}
@media (max-width: 768px) {
  .pdp { --pdp-nav-h: 64px; padding: 64px 0 88px; }
  .pdp-container { padding: 0; }
  .pdp-crumb { display: none; }
  .pdp-hero { padding: 0 0 18px; border-radius: 0; border-left: 0; border-right: 0; margin-bottom: 10px; }
  .pdp-gallery { max-width: none; }
  .pdp-stage { border-radius: 0; border: 0; }
  .pdp-stage-nav { display: none; }
  .pdp-thumbs-wrap { padding: 0 12px; }
  .pdp-thumbs-arrow { display: none; }
  .pdp-thumb { flex-basis: 56px; height: 56px; }
  .pdp-info { padding: 0 16px; }
  .pdp-price strong { font-size: 30px; }
  .pdp-actions { display: none; }
  .pdp-meta { margin-bottom: 4px; }
  .pdp-card, .pdp-panel { border-radius: 0; border-left: 0; border-right: 0; }
  .pdp-body { gap: 10px; }
  .pdp-main { gap: 10px; }
  .pdp-tabs { border-radius: 0; border-left: 0; border-right: 0; margin-bottom: 0; height: 46px; }
  .pdp-tabs-cta { display: none; }
  .pdp-tab { padding: 0 14px; font-size: 14px; }
  .pdp-tab.is-active::after { left: 14px; right: 14px; }
  .pdp-params { padding: 20px 16px 16px; }
  .pdp-params-grid { grid-template-columns: minmax(0, 1fr); }
  .pdp-pad { padding: 20px 16px; }
  .pdp-text { padding: 10px 18px 14px; }
  .pdp-text p { font-size: 14.5px; line-height: 1.9; }
  .pdp-sec-head { padding: 30px 18px 16px; }
  .pdp-html { padding: 8px 16px; }
  .pdp-pdf { margin: 16px; }
  .pdp-lightbox { padding: 56px 0; }
  .pdp-lb-nav { display: none; }

  .pdp-bottombar {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 900;
    display: flex; align-items: center; gap: 4px; padding: 8px 10px calc(8px + env(safe-area-inset-bottom));
    background: var(--c-elevated); border-top: 1px solid var(--c-border); box-shadow: 0 -6px 20px rgba(15, 23, 42, .08);
  }
  .pdp-bb-icon { display: flex; flex-direction: column; align-items: center; gap: 1px; min-width: 46px; padding: 0 4px; border: 0; background: none; font-size: 11px; color: var(--c-text-2); }
  .pdp-bb-icon span { font-size: 18px; line-height: 1.1; color: var(--c-text); }
  .pdp-bb-btns { flex: 1; display: flex; height: 42px; margin-left: 6px; border-radius: 999px; overflow: hidden; }
  .pdp-bb-btns a { flex: 1; display: grid; place-items: center; font-size: 14.5px; font-weight: 700; color: #fff; }
  .pdp-bb-consult { background: var(--c-accent); }
  .pdp-bb-buy { background: var(--pdp-buy); }
  .pdp-bb-btns.is-pair .pdp-bb-consult { background: linear-gradient(90deg, #3b82f6, var(--c-accent)); }
}
@media (prefers-reduced-motion: reduce) {
  .pdp-slide, .pdp-btn, .pdp-related-img img { transition: none; }
}
.pdp-related-meta.is-muted { color: var(--c-text-3); font-weight: 500; font-size: 12px; }

/* 手机上底部有操作条：全站右下角"客服"浮钮往上让开，重点参数改两列 */
@media (max-width: 768px) {
  body:has(.pdp-bottombar) .mc-customer-widget { bottom: calc(76px + env(safe-area-inset-bottom)); }
  .pdp-keyspecs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}