/* ===== 下载中心 /download/ ===== */
.page-products{
  --pd-cut: polygon(14px 0, 100% 0, 100% calc(100% - 14px), calc(100% - 14px) 100%, 0 100%, 0 14px);
  --pd-pad: clamp(44px, 7vw, 84px);
  position:relative;
  display:block;
  overflow-x:clip;
}

/* --- 首屏 --- */
.page-products .pd-hero{
  position:relative;
  padding: clamp(22px,5vw,54px) 0 clamp(20px,4vw,38px);
}
.page-products .pd-hero::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(120% 80% at 6% 0%, rgba(47,243,208,.14), transparent 58%),
    radial-gradient(90% 70% at 98% 8%, rgba(255,122,61,.10), transparent 62%);
}
.page-products .pd-hero .wrap{ position:relative; }

.page-products .pd-hero h1{
  font-family: var(--font-display);
  font-weight:800;
  letter-spacing:-.02em;
  line-height:1.06;
  font-size: clamp(2rem, 6.4vw, 3.85rem);
  color: var(--mist);
  margin: 14px 0 0;
  max-width: 15em;
}
.page-products .pd-hero .lead{
  margin: 18px 0 0;
  max-width: 34em;
  color: var(--ink-dim);
  font-size: clamp(.98rem, 1.6vw, 1.06rem);
  line-height:1.78;
}
.page-products .pd-hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top: clamp(22px,3.5vw,30px);
}

/* --- 入口刻度线 --- */
.page-products .pd-scale{ padding-bottom: clamp(16px,3vw,28px); }
.page-products .pd-scale-track{
  position:relative;
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 18px 14px;
  border-top: 1px solid var(--line);
  padding-top: 20px;
}
.page-products .pd-scale-track::before{
  content:"";
  position:absolute;
  left:0; top:-1px; height:2px; width:44%;
  background: linear-gradient(90deg, var(--cyan), var(--orange) 68%, transparent);
}
.page-products .pd-scale-item{
  position:relative;
  padding-left: 14px;
  font-size:.78rem;
  letter-spacing:.14em;
  color: var(--steel);
}
.page-products .pd-scale-item::before{
  content:"";
  position:absolute;
  left:0; top:.5em;
  width:6px; height:6px;
  background: var(--cyan);
  clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
}
.page-products .pd-scale-item .num{
  display:block;
  font-size:.76rem;
  letter-spacing:.1em;
  color: var(--cyan);
  margin-bottom:6px;
}

/* --- 图片框架 --- */
.page-products .pd-figure{
  position:relative;
  margin:0;
  background: var(--hull);
  border:1px solid var(--line);
  clip-path: var(--pd-cut);
  overflow:hidden;
}
.page-products .pd-figure img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
}
.page-products .pd-figcap{
  position:absolute;
  left:0; bottom:0;
  max-width: 86%;
  padding: 6px 12px;
  font-size:.72rem;
  letter-spacing:.1em;
  color: var(--ink-dim);
  background: rgba(6,26,46,.78);
}
.page-products .pd-band{ padding-top: clamp(16px,3vw,28px); }
.page-products .pd-figure--steps{ margin-top: clamp(24px,4vw,40px); }
.page-products .pd-figure--band{ margin-top: clamp(22px,4vw,36px); }

/* --- 区块节奏 --- */
.page-products .pd-section{ padding-top: var(--pd-pad); }
.page-products .pd-section--last{ padding-bottom: clamp(28px,5vw,54px); }

.page-products .pd-h2{
  font-family: var(--font-display);
  font-weight:800;
  letter-spacing:-.01em;
  line-height:1.14;
  font-size: clamp(1.5rem, 4.2vw, 2.4rem);
  color: var(--mist);
  margin: 12px 0 0;
  max-width: 18em;
}
.page-products .pd-body{
  margin: 14px 0 0;
  max-width: 38em;
  color: var(--ink-dim);
  font-size:.97rem;
  line-height:1.78;
}

/* --- 分栏 --- */
.page-products .pd-split{
  display:grid;
  grid-template-columns: minmax(0,1fr);
  gap: clamp(20px,4vw,44px);
  align-items:start;
}

/* --- 关键数字带 --- */
.page-products .pd-facts{
  list-style:none;
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 14px;
  margin: clamp(20px,3vw,30px) 0 0;
  padding: 18px 0 0;
  border-top:1px solid var(--line);
}
.page-products .pd-facts li{ display:flex; flex-direction:column; gap:5px; }
.page-products .pd-fact-num{
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: clamp(1.35rem, 3.6vw, 1.85rem);
  line-height:1;
  color: var(--cyan);
}
.page-products .pd-fact-label{
  font-size:.74rem;
  letter-spacing:.06em;
  color: var(--steel);
  line-height:1.5;
}

/* --- 三步流程 --- */
.page-products .pd-steps{
  list-style:none;
  margin: clamp(22px,4vw,34px) 0 0;
  padding:0;
  border-top:1px solid var(--line);
}
.page-products .pd-step{
  position:relative;
  display:grid;
  grid-template-columns: 54px minmax(0,1fr);
  gap: 4px 16px;
  padding: 20px 0;
  border-bottom:1px solid var(--line);
}
.page-products .pd-step::after{
  content:"";
  position:absolute;
  left:0; bottom:-1px;
  height:1px; width:0;
  background: linear-gradient(90deg, var(--cyan), transparent);
  transition: width .35s var(--ease);
}
.page-products .pd-step:hover::after{ width:38%; }
.page-products .pd-step-no{
  grid-row: 1 / span 2;
  font-family: var(--font-mono);
  font-size: 1.35rem;
  line-height:1;
  color: var(--orange);
  padding-top:3px;
  transition: color .25s var(--ease);
}
.page-products .pd-step:hover .pd-step-no{ color: var(--cyan); }
.page-products .pd-step-title{
  margin:0;
  font-family: var(--font-display);
  font-weight:700;
  font-size: clamp(1.02rem, 2.4vw, 1.16rem);
  letter-spacing:.01em;
  color: var(--mist);
  line-height:1.35;
}
.page-products .pd-step-text{
  margin: 0;
  font-size:.92rem;
  line-height:1.7;
  color: var(--ink-dim);
  max-width: 34em;
}

/* --- 四种入口面板 --- */
.page-products .pd-entries{
  display:grid;
  grid-template-columns: minmax(0,1fr);
  gap:16px;
  margin-top: clamp(24px,4vw,38px);
}
.page-products .pd-entry{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:10px;
  padding: 22px 20px 26px;
  background: linear-gradient(158deg, var(--hull), rgba(6,26,46,.9));
  border:1px solid var(--line);
  clip-path: var(--pd-cut);
  transition: border-color .25s var(--ease), background-color .25s var(--ease);
}
.page-products .pd-entry::before{
  content:"";
  position:absolute;
  left:0; top:0;
  height:2px; width:0;
  background: linear-gradient(90deg, var(--cyan), var(--orange));
  transition: width .32s var(--ease);
}
.page-products .pd-entry::after{
  content:"";
  position:absolute;
  right:16px; bottom:14px;
  width:34px; height:2px;
  background: var(--orange);
  transform: rotate(-38deg);
  transform-origin: right center;
  opacity:.45;
  transition: opacity .25s var(--ease), width .25s var(--ease);
}
.page-products .pd-entry:hover,
.page-products .pd-entry:focus-within{
  border-color: var(--cyan);
}
.page-products .pd-entry:hover::before,
.page-products .pd-entry:focus-within::before{ width:100%; }
.page-products .pd-entry:hover::after,
.page-products .pd-entry:focus-within::after{ opacity:1; width:52px; }

.page-products .pd-entry-no{
  font-family: var(--font-mono);
  font-size:.78rem;
  letter-spacing:.14em;
  color: var(--steel);
}
.page-products .pd-entry-title{
  margin:0;
  font-family: var(--font-display);
  font-weight:800;
  font-size:1.2rem;
  letter-spacing:.01em;
  color: var(--mist);
}
.page-products .pd-entry-text{
  margin:0;
  font-size:.92rem;
  line-height:1.72;
  color: var(--ink-dim);
}
.page-products .pd-entry .tag{ margin-top:auto; align-self:flex-start; }

/* --- 三种阅读模式切换 --- */
.page-products .pd-modes{
  position:relative;
  margin-top: clamp(24px,4vw,40px);
}
.page-products .pd-mode-radio,
.page-products .pd-sub-radio{
  position:absolute;
  width:1px; height:1px;
  margin:0;
  opacity:0;
  pointer-events:none;
}
.page-products .pd-mode-tabs{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.page-products .pd-mode-tab{
  cursor:pointer;
  padding: 10px 18px;
  font-family: var(--font-display);
  font-weight:700;
  font-size:.92rem;
  letter-spacing:.03em;
  color: var(--steel);
  background: transparent;
  border:1px solid var(--line);
  clip-path: var(--cut-sm);
  transition: color .2s var(--ease), background-color .2s var(--ease), border-color .2s var(--ease);
}
.page-products .pd-mode-tab:hover{
  color: var(--mist);
  border-color: var(--cyan);
}
.page-products .pd-mode-radio:focus-visible ~ .pd-mode-tabs{
  outline: 2px solid var(--cyan);
  outline-offset: 4px;
}
.page-products #mode-report:checked ~ .pd-mode-tabs label[for="mode-report"],
.page-products #mode-data:checked ~ .pd-mode-tabs label[for="mode-data"],
.page-products #mode-compare:checked ~ .pd-mode-tabs label[for="mode-compare"]{
  color: var(--deep);
  background: var(--cyan);
  border-color: var(--cyan);
}

.page-products .pd-mode-panels{ margin-top: 22px; }
.page-products .pd-mode-panel{ display:none; }
.page-products #mode-report:checked ~ .pd-mode-panels > .pd-mode-panel:nth-child(1),
.page-products #mode-data:checked ~ .pd-mode-panels > .pd-mode-panel:nth-child(2),
.page-products #mode-compare:checked ~ .pd-mode-panels > .pd-mode-panel:nth-child(3){
  display:block;
  animation: pd-fade .28s var(--ease) both;
}
@keyframes pd-fade{
  from{ opacity:0; transform: translateY(6px); }
  to{ opacity:1; transform:none; }
}
.page-products .pd-mode-panel .serif-note{
  margin:0 0 10px;
  color: var(--mist);
}
.page-products .pd-mode-panel .pd-body{ margin-top:0; }

/* --- 设备参数表 --- */
.page-products .pd-spec{
  list-style:none;
  margin: clamp(20px,3.5vw,30px) 0 0;
  padding:0;
  border-top:1px solid var(--line);
}
.page-products .pd-spec-row{
  display:grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 4px 16px;
  padding: 14px 0;
  border-bottom:1px solid var(--line);
}
.page-products .pd-spec-key{
  font-size:.86rem;
  letter-spacing:.06em;
  color: var(--steel);
}
.page-products .pd-spec-val{
  font-size:.95rem;
  color: var(--cyan);
  white-space:nowrap;
}
.page-products .pd-spec-hint{
  grid-column: 1 / -1;
  font-size:.78rem;
  color: var(--ink-faint);
  line-height:1.6;
}

/* --- 订阅频率 --- */
.page-products .pd-sub{ margin-top: clamp(26px,4vw,38px); }
.page-products .pd-sub-label{
  margin:0 0 14px;
  font-size:.74rem;
  letter-spacing:.16em;
  color: var(--steel);
}
.page-products .pd-sub-list{
  display:grid;
  grid-template-columns: minmax(0,1fr);
  gap:10px;
}
.page-products .pd-sub-item{
  cursor:pointer;
  display:grid;
  grid-template-columns: 18px minmax(0,1fr);
  gap: 4px 12px;
  padding: 14px 16px;
  background: rgba(11,39,64,.55);
  border:1px solid var(--line);
  clip-path: var(--pd-cut);
  transition: border-color .22s var(--ease), background-color .22s var(--ease);
}
.page-products .pd-sub-item:hover{ border-color: var(--cyan); }
.page-products .pd-sub-dot{
  grid-row: 1 / span 2;
  align-self:start;
  margin-top:5px;
  width:12px; height:12px;
  border:1px solid var(--steel);
  border-radius:50%;
  transition: background-color .2s var(--ease), border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.page-products .pd-sub-name{
  font-family: var(--font-display);
  font-weight:700;
  font-size:1rem;
  color: var(--mist);
}
.page-products .pd-sub-desc{
  font-size:.84rem;
  line-height:1.65;
  color: var(--steel);
}
.page-products .pd-sub-radio:focus-visible ~ .pd-sub-list{
  outline: 2px solid var(--cyan);
  outline-offset: 4px;
}
.page-products #sub-live:checked ~ .pd-sub-list label[for="sub-live"],
.page-products #sub-match:checked ~ .pd-sub-list label[for="sub-match"],
.page-products #sub-daily:checked ~ .pd-sub-list label[for="sub-daily"]{
  border-color: var(--mint);
  background: rgba(123,232,176,.08);
}
.page-products #sub-live:checked ~ .pd-sub-list label[for="sub-live"] .pd-sub-dot,
.page-products #sub-match:checked ~ .pd-sub-list label[for="sub-match"] .pd-sub-dot,
.page-products #sub-daily:checked ~ .pd-sub-list label[for="sub-daily"] .pd-sub-dot{
  background: var(--mint);
  border-color: var(--mint);
  box-shadow: 0 0 0 4px rgba(123,232,176,.16);
}
.page-products .pd-sub-tip{
  margin: 14px 0 0;
  max-width: 36em;
  font-size:.82rem;
  line-height:1.7;
  color: var(--steel);
}

/* --- 收尾 --- */
.page-products .pd-next{
  margin-top: clamp(24px,4vw,48px);
  padding: clamp(36px,6vw,64px) 0;
  background:
    linear-gradient(115deg, rgba(59,46,143,.42), rgba(6,26,46,.2) 55%),
    linear-gradient(-15deg, rgba(122,31,61,.34), transparent 60%),
    var(--hull);
  border-top:1px solid var(--line);
}
.page-products .pd-next-inner{
  display:grid;
  grid-template-columns: minmax(0,1fr);
  gap: 24px;
  align-items:center;
}
.page-products .pd-next-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

/* --- 断点 --- */
@media (min-width: 760px){
  .page-products .pd-scale-track{ grid-template-columns: repeat(4, minmax(0,1fr)); }
  .page-products .pd-entries{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .page-products .pd-sub-list{ grid-template-columns: repeat(3, minmax(0,1fr)); }
}

@media (min-width: 880px){
  .page-products .pd-split{ grid-template-columns: minmax(0,1.1fr) minmax(0,.9fr); }
  .page-products .pd-split--even{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .page-products .pd-split--wide-left{ grid-template-columns: minmax(0,1.24fr) minmax(0,.76fr); }
  .page-products .pd-next-inner{
    grid-template-columns: minmax(0,1.2fr) auto;
    gap: 32px;
  }
  .page-products .pd-next-actions{ justify-content:flex-end; }
}

@media (min-width: 1080px){
  .page-products .pd-entries{
    grid-template-columns: repeat(4, minmax(0,1fr));
    align-items:end;
  }
  .page-products .pd-entry:nth-child(1){ min-height: 286px; }
  .page-products .pd-entry:nth-child(2){ min-height: 326px; }
  .page-products .pd-entry:nth-child(3){ min-height: 252px; }
  .page-products .pd-entry:nth-child(4){ min-height: 306px; }
  .page-products .pd-split--wide-left{ align-items:start; }
}

@media (max-width: 520px){
  .page-products .pd-facts{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .page-products .pd-spec-row{ grid-template-columns: minmax(0,1fr); }
  .page-products .pd-spec-val{ white-space:normal; }
  .page-products .pd-figcap{ max-width:100%; }
}

@media (prefers-reduced-motion: reduce){
  .page-products .pd-entry,
  .page-products .pd-entry::before,
  .page-products .pd-entry::after,
  .page-products .pd-step::after,
  .page-products .pd-mode-tab,
  .page-products .pd-sub-item,
  .page-products .pd-sub-dot{
    transition:none;
  }
  .page-products #mode-report:checked ~ .pd-mode-panels > .pd-mode-panel:nth-child(1),
  .page-products #mode-data:checked ~ .pd-mode-panels > .pd-mode-panel:nth-child(2),
  .page-products #mode-compare:checked ~ .pd-mode-panels > .pd-mode-panel:nth-child(3){
    animation:none;
  }
}
