/* ==========================================================================
   产品列表页 products.html 专用样式（公共样式在 assets/css/site.css）
   ========================================================================== */

/* ---------------- 页头 ---------------- */
.phead{
  position:relative;overflow:hidden;
  background:var(--ink);color:#fff;
  padding:calc(var(--nav-h) + 78px) 0 74px;
}
.phead__glow{
  position:absolute;width:520px;height:520px;border-radius:50%;filter:blur(90px);opacity:.45;
  top:-200px;left:6%;background:radial-gradient(circle,rgba(0,148,220,.45),transparent 68%);
}
.phead__in{position:relative;z-index:2}
.pcrumb{display:flex;align-items:center;gap:9px;font-size:13px;color:rgba(255,255,255,.46);margin-bottom:22px}
.pcrumb a{color:rgba(255,255,255,.62);text-decoration:none;transition:color .25s}
.pcrumb a:hover{color:#fff}
.pcrumb i{font-style:normal;opacity:.5}
.phead__h1{font-size:clamp(29px,3.6vw,44px);font-weight:700;letter-spacing:-.03em;line-height:1.24;margin-bottom:16px}
.phead__lead{font-size:16px;line-height:1.85;color:rgba(255,255,255,.64);max-width:760px}
.phead__meta{list-style:none;display:flex;gap:44px;margin-top:32px;flex-wrap:wrap}
.phead__meta li{display:flex;flex-direction:column}
.phead__meta b{font-size:29px;font-weight:700;color:#fff;letter-spacing:-.02em;line-height:1.1}
.phead__meta span{font-size:12.5px;color:rgba(255,255,255,.48);margin-top:5px}

/* ---------------- 品类快捷导航 ---------------- */
.pnav{
  position:sticky;top:var(--nav-h);z-index:90;
  background:rgba(255,255,255,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);padding:12px 0;
}
.pnav__in{display:flex;align-items:center;gap:16px}
.pnav__label{font-size:13px;color:var(--text-3);white-space:nowrap;flex-shrink:0}
.pnav__list{display:flex;gap:8px;overflow-x:auto;padding:2px 0;scrollbar-width:none}
.pnav__list::-webkit-scrollbar{display:none}
.pnav__chip{
  flex-shrink:0;display:inline-flex;align-items:center;gap:7px;
  height:38px;padding:0 15px;border-radius:999px;
  border:1px solid var(--line);background:#fff;color:var(--text-2);
  font-family:inherit;font-size:13.5px;cursor:pointer;
  transition:background .25s,border-color .25s,color .25s,transform .25s;
}
.pnav__chip em{font-style:normal;font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--accent)}
.pnav__chip:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-1px)}
.pnav__chip.on{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 4px 14px rgba(0,148,220,.28)}
.pnav__chip.on em{color:rgba(255,255,255,.8)}
.nav__link--cur{color:#fff}
.nav__link--cur::after{width:100%}

/* ---------------- 列表区 ---------------- */
/* 注意：站点公共样式里已有「平台」板块用的 .plist，这里改名 .prodlist 避免撞车 */
.prodlist{padding:74px 0 96px}
.pcat{margin-bottom:50px;padding-top:24px;scroll-margin-top:calc(var(--nav-h) + 72px)}
.pcat:last-child{margin-bottom:0}
.pcat__head{
  display:grid;grid-template-columns:54px 1fr 300px;gap:24px;align-items:start;
  padding-bottom:22px;border-bottom:1px solid var(--line);margin-bottom:24px;
}
/* 该品类还没上传配图时，右侧空位收掉 */
.pcat__head:has(.pcat__pic.slot-empty){grid-template-columns:54px 1fr}
.pcat__head:has(.pcat__pic.slot-empty) .pcat__pic{display:none}
.pcat__no{font-size:29px;font-weight:700;color:var(--accent);opacity:.4;line-height:1.1}
.pcat__t{font-size:clamp(20px,2.1vw,26px);font-weight:700;margin-bottom:9px;letter-spacing:-.01em}
.pcat__lead{font-size:14.6px;color:var(--text-2);line-height:1.85;max-width:730px}
.pcat__count{
  display:inline-block;margin-top:11px;font-size:12.5px;color:var(--accent);
  background:rgba(0,148,220,.08);border-radius:999px;padding:4px 11px;
}
.pcat__pic{
  position:relative;overflow:hidden;border:1px solid var(--line);border-radius:12px;
  aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;background:#fff;
}
.pcat__ph{color:var(--text-3);display:flex}
.pcat__ph svg{width:30px;height:30px}
.pcat__pic.has-img .pcat__ph{display:none}

.pitems{display:grid;gap:22px}
.pitems__none{color:var(--text-3);font-size:15px}

/* ---------------- 产品卡片 ---------------- */
.pdcard{
  display:grid;grid-template-columns:300px 1fr;gap:26px;align-items:start;
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:20px;
  transition:transform .32s,box-shadow .32s,border-color .32s;
}
.pdcard:hover{transform:translateY(-3px);box-shadow:var(--shadow-m);border-color:#D8E0EA}
.pdcard__pic{
  position:relative;overflow:hidden;border-radius:10px;border:1px solid #EDF1F6;
  background:#fff;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;
}
.pdcard__ph{color:var(--text-3);display:flex}
.pdcard__ph svg{width:34px;height:34px}
.pdcard__pic.has-img .pdcard__ph{display:none}
.pdcard__pic.has-contain{background:#fff}

.pdcard__top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.pdcard__code{
  font-size:12px;font-weight:700;letter-spacing:.08em;color:#fff;
  background:var(--ink-3);padding:4px 10px;border-radius:6px;white-space:nowrap;
}
.pdcard__body h3{font-size:18.5px;font-weight:700;letter-spacing:-.01em}
.pdcard__sum{font-size:14.5px;color:var(--text-2);line-height:1.8;margin-bottom:14px}
.pdcard .tags{margin-bottom:16px}

.spec{width:100%;border-collapse:collapse;font-size:13.5px;border-top:1px solid var(--line)}
.spec__r{border-bottom:1px dashed #ECF0F6}
.spec__r.is-hide{display:none}
.spec th{
  text-align:left;font-weight:500;color:var(--text-3);
  padding:8px 18px 8px 0;width:168px;vertical-align:top;line-height:1.6;
}
.spec td{color:var(--text);padding:8px 0;line-height:1.65}
.spec__more{
  margin-top:12px;border:0;background:none;padding:0 0 2px;
  font-family:inherit;font-size:13.5px;font-weight:600;color:var(--accent);
  border-bottom:1px dashed rgba(0,148,220,.55);cursor:pointer;transition:opacity .25s;
}
.spec__more:hover{opacity:.75}

.pdcard__feats{margin-top:16px;background:var(--paper-2);border-radius:10px;padding:13px 16px}
.pdcard__feats h4{font-size:12.5px;color:var(--text-3);font-weight:600;margin-bottom:8px;letter-spacing:.04em}
.pdcard__feats ul{list-style:none}
.pdcard__feats li{
  position:relative;padding-left:17px;font-size:13.8px;color:var(--text-2);line-height:1.8;margin-bottom:3px;
}
.pdcard__feats li::before{
  content:"";position:absolute;left:0;top:9px;width:6px;height:6px;border-radius:50%;background:var(--accent);
}
.pdcard__foot{
  display:flex;align-items:center;gap:20px;flex-wrap:wrap;
  margin-top:18px;padding-top:16px;border-top:1px solid var(--line);
}

/* ---------------- 底部 ---------------- */
.pcta{padding:84px 0}
.pcta__in{position:relative;z-index:2;text-align:center;max-width:720px;margin:0 auto}
.pcta__in h2{margin-bottom:14px}
.pcta__in p{font-size:16.5px;line-height:1.85;color:rgba(255,255,255,.66);margin-bottom:28px}
/* 底部咨询区：电话 / 邮箱直接可拨可点 */
.pcta__contact{
  display:flex;justify-content:center;flex-wrap:wrap;gap:12px 34px;
  list-style:none;margin-top:24px;font-size:15px;color:rgba(255,255,255,.8);
}
.pcta__contact span{color:rgba(255,255,255,.5);margin-right:9px}
.pcta__contact a{
  color:#fff;border-bottom:1px dashed rgba(255,255,255,.4);
  padding-bottom:2px;transition:border-color .25s;
}
.pcta__contact a:hover{border-color:#fff}
/* 页脚联系行样式在 site.css（两页共用） */
.pfoot{grid-template-columns:1.7fr 1fr auto;align-items:start}
.pfoot__act{display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.pfoot__act .btn{width:100%;justify-content:center}

/* ---------------- 平板 ---------------- */
@media (max-width:1080px){
  .phead{padding:calc(var(--nav-h) + 58px) 0 56px}
  .phead__meta{gap:32px}
  .phead__meta b{font-size:25px}
  .pdcard{grid-template-columns:1fr;gap:18px}
  .pdcard__pic{max-width:440px}
  .pcat__head{grid-template-columns:44px 1fr;gap:18px}
  .pcat__pic{grid-column:1 / -1;max-width:520px}
  .pfoot{grid-template-columns:1.3fr 1fr}
  .pfoot__act{grid-column:1 / -1;flex-direction:row}
  .pfoot__act .btn{width:auto}
}

/* ---------------- 手机 ---------------- */
@media (max-width:680px){
  .phead{padding:104px 0 44px;text-align:left}
  .phead__lead{font-size:15px}
  .phead__meta{gap:26px;margin-top:26px}
  .phead__meta b{font-size:23px}
  .pnav{padding:10px 0}
  .pnav__label{display:none}
  .pnav__chip{height:34px;padding:0 13px;font-size:13px}
  .prodlist{padding:52px 0 66px}
  .pcat{margin-bottom:34px;padding-top:18px}
  .pcat__head{grid-template-columns:1fr;gap:10px}
  .pcat__no{font-size:22px}
  .pcat__pic{max-width:none}
  .pdcard{padding:16px}
  .pdcard__pic{max-width:none}
  .pdcard__body h3{font-size:17px}
  .spec{font-size:13px}
  .spec th{width:120px;padding-right:12px}
  .pdcard__foot{gap:14px}
  .pcta{padding:60px 0}
  .pfoot{grid-template-columns:1fr}
  .pfoot__act{flex-direction:column}
  .pfoot__act .btn{width:100%}
}

/* ---------------- 技术咨询弹窗 ---------------- */
.pdlock{overflow:hidden}
.pmodal{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;padding:24px}
.pmodal[hidden]{display:none}
.pmodal__mask{position:absolute;inset:0;background:rgba(9,20,32,.5);backdrop-filter:blur(3px);animation:pmFade .22s ease}
.pmodal__box{
  position:relative;width:100%;max-width:560px;max-height:88vh;overflow:auto;
  background:#fff;border-radius:16px;padding:34px 34px 30px;
  box-shadow:0 30px 80px rgba(6,20,34,.3);animation:pmUp .26s cubic-bezier(.2,.8,.3,1);
}
.pmodal__x{
  position:absolute;top:16px;right:16px;width:34px;height:34px;border:1px solid var(--line);
  background:#fff;border-radius:9px;color:var(--text-2);cursor:pointer;display:flex;
  align-items:center;justify-content:center;transition:.2s;
}
.pmodal__x:hover{color:var(--accent);border-color:var(--accent)}
.pmodal__x svg{width:17px;height:17px}
.pmodal__eyebrow{
  font-size:11.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--accent);margin-bottom:10px;
}
.pmodal__box h3{font-size:21px;line-height:1.45;margin-bottom:10px;padding-right:34px}
.pmodal__sub{font-size:14.5px;line-height:1.8;color:var(--text-2);margin-bottom:18px}
.pmodal__list{
  list-style:none;background:var(--paper-2);border:1px solid var(--line);
  border-radius:12px;padding:6px 0;margin-bottom:22px;
}
.pmodal__list li{
  position:relative;padding:11px 18px 11px 34px;font-size:14px;line-height:1.65;color:var(--text);
}
.pmodal__list li::before{
  content:'';position:absolute;left:18px;top:18px;width:6px;height:6px;border-radius:50%;
  background:var(--accent);opacity:.55;
}
.pmodal__acts{display:flex;flex-wrap:wrap;gap:10px}
.pmodal__link{
  border:none;background:none;color:var(--text-2);padding:0 4px;height:auto;
  font-size:14px;text-decoration:underline;text-underline-offset:3px;align-self:center;
}
.pmodal__link:hover{color:var(--accent)}
@keyframes pmFade{from{opacity:0}to{opacity:1}}
@keyframes pmUp{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
@media (max-width:680px){
  .pmodal{padding:14px}
  .pmodal__box{padding:26px 18px 22px;max-height:90vh}
  .pmodal__box h3{font-size:18px}
  .pmodal__acts .btn{flex:1 1 100%}
  .pmodal__link{flex:1 1 100%;text-align:center;margin-top:2px}
}

/* ===== 移动端可点区域（面包屑等小链接）===== */
@media (max-width:820px){
  .pcrumb{font-size:13.5px}
  .pcrumb a{display:inline-block;padding:5px 0;min-height:30px}
  .pcta__contact a{display:inline-block;padding:5px 0;min-height:30px}
}
