/* =========================================================
   Product Page v2  —  Diversitech Global
   参照 sinotools 的「型号 + 规格 + 询盘清单」B2B 呈现
   复用 styles.css 已有变量与 .pd-* / .detail-table 类
   ========================================================= */

/* ---------- 画廊 + 视频 ---------- */
.pd-gallery{position:sticky;top:96px}
.pd-main-image{
  position:relative;
  border:1px solid #d8e6ee;
  background:#fff;
  min-height:560px;
  display:flex;align-items:center;justify-content:center;
  padding:24px;border-radius:18px;overflow:hidden;
}
.pd-main-image img{
  width:100%;height:100%;max-height:520px;object-fit:contain;
  transition:transform .45s ease;
}
/* hover 放大（桌面端） */
@media(hover:hover){
  .pd-main-image{cursor:zoom-in}
  .pd-main-image:hover img{transform:scale(1.06)}
}
/* 视频块：阿里来源多为视频，抓取后补回 */
.pp-video-wrap{
  position:relative;border:1px solid #d8e6ee;background:#0b1b31;
  border-radius:18px;overflow:hidden;min-height:300px;
  display:flex;align-items:center;justify-content:center;
}
.pp-video-wrap video{width:100%;height:100%;max-height:520px;display:block;background:#0b1b31}
.pp-video-poster{
  position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:14px;color:#cdd8e8;
  background:radial-gradient(circle at 50% 30%,rgba(62,169,185,.25),transparent 60%),#0b1b31;
  cursor:pointer;text-align:center;padding:20px;
}
.pp-video-poster .play{
  width:72px;height:72px;border-radius:50%;background:var(--accent);
  display:grid;place-items:center;box-shadow:0 16px 42px rgba(62,169,185,.4);
  transition:transform .25s;
}
.pp-video-poster:hover .play{transform:scale(1.08)}
.pp-video-poster small{color:#9fb1c4;font-size:13px;max-width:320px}
.pp-media-tabs{
  display:flex;gap:8px;margin:14px 0 0;flex-wrap:wrap;
}
.pp-media-tab{
  border:1px solid #d8e6ee;background:#fff;color:#3c424b;
  font-weight:800;font-size:13px;padding:9px 14px;border-radius:999px;cursor:pointer;
  transition:.2s;
}
.pp-media-tab.active{background:#173A46;color:#fff;border-color:#173A46}
/* 缩略图 */
.pd-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:18px}
.pd-thumbs img,.pd-thumbs .pp-thumb{
  height:104px;width:100%;object-fit:contain;border:1px solid #d8e6ee;
  background:#f8fbfd;padding:8px;border-radius:12px;cursor:pointer;
  transition:border-color .2s,box-shadow .2s;
}
.pd-thumbs img.active,.pd-thumbs .pp-thumb.active{
  border-color:var(--accent);box-shadow:0 0 0 2px rgba(62,169,185,.25);
}

/* ---------- 信息区：型号 + 差异化描述 ---------- */
.pd-info-box{border:1px solid #d8e6ee;background:#fff;padding:28px 30px 30px;border-radius:18px}
.pd-info-box h1{color:#173A46;font-size:clamp(30px,3.4vw,46px);line-height:1.15;letter-spacing:-.035em;margin:6px 0 16px}
.pd-model{
  display:inline-flex;align-items:center;gap:10px;
  background:#eef8fb;border:1px solid #cfe7ee;color:#0e6f86;
  font-weight:900;font-size:15px;letter-spacing:.04em;
  padding:8px 14px;border-radius:999px;margin-bottom:18px;
}
.pd-model b{font-size:17px}
.pd-tags{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.pd-tags .tag{font-size:12px;font-weight:850;color:#26364c;background:#edf3fb;border:1px solid #dde6f2;padding:6px 10px;border-radius:999px}
.pd-features{color:#3c424b;font-size:16px;line-height:1.7}
.pd-features p{margin:0 0 10px}
.pd-features ul{margin:0;padding-left:20px}
.pd-features li{margin:6px 0}

/* ---------- 询盘侧栏（吸顶）+ Add to Inquiry List ---------- */
.pd-side{display:grid;gap:22px;align-items:start}
.pd-inquiry-box{border:1px solid #d8e6ee;background:#fff;padding:24px 28px 28px;border-radius:18px}
.pd-inquiry-box.sticky{position:sticky;top:96px}
.pd-inquiry-intro span{color:#0e6f86;font-weight:900;letter-spacing:.14em;text-transform:uppercase;font-size:12px}
.pd-inquiry-intro h2{color:#173A46;font-size:26px;margin:8px 0 8px;letter-spacing:-.03em}
.pd-inquiry-intro p{color:#637780;margin:0 0 18px;font-size:14px}
.pd-form{display:grid;gap:14px}
.pd-form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.pd-form input,.pd-form textarea{
  width:100%;border:1px solid #cfdde8;background:#f8fbfd;
  padding:14px 16px;font:inherit;font-size:16px;border-radius:12px;
}
.pd-form textarea{min-height:104px;resize:vertical}
.pd-form button{
  width:100%;border:0;background:var(--accent);color:#fff;
  padding:15px 20px;font-size:16px;font-weight:900;cursor:pointer;border-radius:12px;
  transition:.2s transform,.2s box-shadow;
}
.pd-form button:hover{transform:translateY(-1px);box-shadow:0 12px 28px rgba(62,169,185,.35)}
.pp-inquiry-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:4px}
.pp-btn-list{
  border:1px solid var(--accent);background:#fff;color:#0e6f86;
  padding:13px 16px;font-size:15px;font-weight:850;cursor:pointer;border-radius:12px;
  transition:.2s;
}
.pp-btn-list:hover{background:#eef8fb}
.pp-btn-list.added{background:#173A46;color:#fff;border-color:#173A46}

/* 浮动询盘清单徽标 */
.pp-inquiry-bar{
  position:fixed;left:20px;bottom:20px;z-index:45;
  display:flex;align-items:center;gap:12px;
  background:#173A46;color:#fff;border-radius:999px;padding:12px 18px;
  box-shadow:0 16px 42px rgba(23,58,70,.3);cursor:pointer;
  transform:translateY(140%);transition:transform .35s ease;
}
.pp-inquiry-bar.show{transform:translateY(0)}
.pp-inquiry-bar .count{
  background:var(--accent);min-width:24px;height:24px;border-radius:999px;
  display:grid;place-items:center;font-weight:900;font-size:13px;padding:0 7px;
}

/* ---------- 规格表（复用 .detail-table） ---------- */
.pp-block{padding:74px 0 86px;background:#f4f9fc}
.pp-block.alt{background:#fff}
.pp-block-head{max-width:900px;margin-bottom:34px}
.pp-block-head span{display:block;color:#0e80b8;letter-spacing:.18em;text-transform:uppercase;font-weight:900;margin-bottom:10px;font-size:13px}
.pp-block-head h2{color:#092b53;font-size:clamp(30px,3.6vw,46px);line-height:1.06;letter-spacing:-.04em;margin:0 0 12px}
.pp-block-head p{color:#5b7285;font-size:16px;line-height:1.7;margin:0}
.pp-spec-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:30px;align-items:start}
.detail-table{width:100%;border:1px solid #dcecf3;border-radius:14px;overflow:hidden;border-collapse:separate}
.detail-row{display:grid;grid-template-columns:190px 1fr;border-bottom:1px solid #dcecf3}
.detail-row:last-child{border-bottom:none}
.detail-row b{background:#f2f8fc;padding:14px 16px;color:#10395e;font-weight:800}
.detail-row span{padding:14px 16px;color:#557085}
.pp-oem-list{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.pp-oem-list li{
  display:flex;gap:12px;align-items:flex-start;background:#fff;
  border:1px solid #d5e8f0;border-radius:14px;padding:14px 16px;
}
.pp-oem-list .ic{flex:0 0 auto;width:34px;height:34px;border-radius:10px;background:#eef8fb;color:#0e6f86;display:grid;place-items:center;font-weight:900}
.pp-oem-list b{display:block;color:#092b53}
.pp-oem-list span{display:block;color:#5b7285;font-size:14px}

/* ---------- 特性卡 ---------- */
.pp-feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.pp-feature{background:#fff;border:1px solid #d8e6ee;border-radius:20px;padding:26px;box-shadow:0 12px 34px rgba(24,77,105,.06)}
.pp-feature .ic{width:48px;height:48px;border-radius:14px;background:#173A46;color:#fff;display:grid;place-items:center;font-size:22px;margin-bottom:16px}
.pp-feature h3{color:#092b53;font-size:20px;margin:0 0 10px;letter-spacing:-.02em}
.pp-feature p{color:#5b7285;line-height:1.66;margin:0}

/* ---------- 相关产品 hover ---------- */
.pd-related-grid.paged-related{grid-template-columns:repeat(4,1fr);gap:22px}
.pd-related-card{transition:.24s transform,.24s box-shadow;border-radius:22px}
@media(hover:hover){
  .pd-related-card:hover{transform:translateY(-5px);box-shadow:0 22px 50px rgba(24,77,105,.14)}
}
.pd-related-card img{background:#f8fbfd;border-radius:16px}

/* ---------- 滚动进场动画（无 JS 时可见） ---------- */
.pp-ready .pp-reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s ease}
.pp-ready .pp-reveal.is-visible{opacity:1;transform:none}
.pp-ready .pp-reveal[data-delay="1"]{transition-delay:.08s}
.pp-ready .pp-reveal[data-delay="2"]{transition-delay:.16s}
.pp-ready .pp-reveal[data-delay="3"]{transition-delay:.24s}

/* ---------- 响应式 ---------- */
@media(max-width:1000px){
  .pd-main-grid{grid-template-columns:1fr}
  .pd-gallery{position:static}
  .pd-inquiry-box.sticky{position:static}
  .pp-spec-grid{grid-template-columns:1fr}
  .pp-feature-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:700px){
  .pd-form-row,.pp-inquiry-actions{grid-template-columns:1fr}
  .pp-feature-grid,.pd-related-grid.paged-related,.pd-thumbs{grid-template-columns:repeat(2,1fr)}
  .pd-main-image{min-height:380px}
  .pp-block{padding:54px 0 64px}
}
