.page-products{
  --dl-cut:14px;
  --dl-gap:clamp(1rem,2.4vw,1.6rem);
  --dl-pad:clamp(1.05rem,3vw,1.8rem);
  background:var(--ink-deep);
  color:var(--ivory);
  padding-bottom:clamp(3rem,7vw,5.5rem);
  overflow-x:clip;
}
.page-products img{
  display:block;
  max-width:100%;
  height:auto;
}
.page-products figure{
  margin:0;
}
.page-products .display{
  font-family:var(--font-display);
  color:var(--ivory);
}
.page-products .crumbs{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.45rem;
  padding-top:clamp(1rem,3vw,1.6rem);
  font-family:var(--font-mono);
  font-size:.72rem;
  letter-spacing:.08em;
  color:rgba(242,232,216,.6);
}
.page-products .crumbs a{
  color:var(--brass-bright);
  text-decoration:none;
}
.page-products .crumbs a:hover{
  text-decoration:underline;
}

/* ---------- 首屏 ---------- */
.page-products .dl-hero{
  display:grid;
  gap:clamp(1.4rem,4vw,2.6rem);
  padding:clamp(1.2rem,4vw,2.2rem) 0 clamp(2rem,5vw,3.4rem);
  border-bottom:1px solid var(--line-soft);
}
.page-products .dl-hero__title{
  margin:.8rem 0 0;
  font-size:clamp(1.85rem,6.4vw,3.4rem);
  line-height:1.16;
  letter-spacing:.005em;
}
.page-products .dl-hero__title::before{
  content:"";
  display:block;
  width:58px;
  height:3px;
  margin-bottom:1rem;
  background:linear-gradient(90deg,var(--brass),var(--brass-bright));
}
.page-products .dl-hero__lead{
  margin:1.05rem 0 0;
  max-width:58ch;
  font-size:clamp(.98rem,.94rem + .28vw,1.08rem);
  line-height:1.85;
  color:rgba(242,232,216,.82);
}
.page-products .dl-metrics{
  list-style:none;
  margin:clamp(1.3rem,3vw,2rem) 0 0;
  padding:0;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.8rem;
}
.page-products .dl-metrics__item{
  display:flex;
  flex-direction:column;
  gap:.25rem;
  padding:.8rem .9rem;
  background:linear-gradient(160deg,rgba(17,59,58,.88),rgba(11,31,42,.55));
  border-left:2px solid var(--brass);
  clip-path:polygon(0 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%);
}
.page-products .dl-metrics__num{
  font-family:var(--font-mono);
  font-size:1.55rem;
  font-weight:700;
  line-height:1.1;
  color:var(--brass-bright);
}
.page-products .dl-metrics__label{
  font-size:.76rem;
  letter-spacing:.04em;
  color:rgba(242,232,216,.72);
}
.page-products .dl-hero__actions{
  display:flex;
  flex-wrap:wrap;
  gap:.7rem;
  margin-top:clamp(1.2rem,3vw,1.8rem);
}
.page-products .dl-hero__figure{
  align-self:start;
  background:var(--ink-deeper);
  border:1px solid var(--line);
  clip-path:polygon(0 0,100% 0,100% calc(100% - 22px),calc(100% - 22px) 100%,0 100%);
}
.page-products .dl-hero__figure img{
  width:100%;
  object-fit:cover;
}
.page-products .dl-hero__figcap{
  padding:.7rem .95rem;
  border-top:1px solid var(--line-soft);
  font-family:var(--font-mono);
  font-size:.71rem;
  line-height:1.6;
  letter-spacing:.03em;
  color:rgba(242,232,216,.64);
}

/* ---------- 章节通用 ---------- */
.page-products .section{
  padding:clamp(2.2rem,5vw,3.6rem) 0 0;
}
.page-products .dl-h2{
  margin:.55rem 0 0;
  font-size:clamp(1.5rem,4.3vw,2.35rem);
  line-height:1.22;
}
.page-products .dl-intro{
  margin:.9rem 0 0;
  max-width:66ch;
  font-size:.96rem;
  line-height:1.85;
  color:rgba(242,232,216,.78);
}

/* ---------- 区间矩阵 ---------- */
.page-products .dl-matrix__grid{
  display:grid;
  gap:var(--dl-gap);
  margin-top:clamp(1.4rem,3vw,2rem);
}
.page-products .dl-scale{
  list-style:none;
  margin:0;
  padding:0 0 0 1.3rem;
  border-left:2px solid var(--line);
  display:grid;
  gap:1rem;
  align-content:start;
  font-family:var(--font-mono);
  font-size:.76rem;
  letter-spacing:.05em;
  color:rgba(242,232,216,.74);
}
.page-products .dl-scale__item{
  position:relative;
}
.page-products .dl-scale__item::before{
  content:"";
  position:absolute;
  left:-1.66rem;
  top:.42em;
  width:.86rem;
  height:2px;
  background:var(--brass);
}
.page-products .dl-scale__code{
  margin-right:.45rem;
  color:var(--brass-bright);
}
.page-products .dl-rows{
  display:grid;
  gap:.7rem;
  align-content:start;
}
.page-products .dl-stage{
  border:1px solid var(--line-soft);
  background:linear-gradient(155deg,rgba(17,59,58,.6),rgba(7,22,32,.9));
  clip-path:polygon(0 0,calc(100% - var(--dl-cut)) 0,100% var(--dl-cut),100% 100%,0 100%);
}
.page-products .dl-stage[open]{
  background:linear-gradient(155deg,rgba(17,59,58,.86),rgba(7,22,32,.96));
  border-color:var(--line);
}
.page-products .dl-stage__sum{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:.65rem;
  padding:.9rem 1rem;
  cursor:pointer;
  list-style:none;
}
.page-products .dl-stage__sum::-webkit-details-marker{
  display:none;
}
.page-products .dl-stage__code{
  padding:.15rem .42rem;
  background:var(--brass);
  color:var(--ink-deep);
  font-family:var(--font-mono);
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.05em;
}
.page-products .dl-stage__name{
  font-size:.94rem;
  line-height:1.45;
  color:var(--ivory);
}
.page-products .dl-stage__state{
  white-space:nowrap;
}
.page-products .dl-stage__body{
  padding:0 1rem 1.1rem;
}
.page-products .dl-stage__body > p{
  margin:0 0 .9rem;
  font-size:.9rem;
  line-height:1.8;
  color:rgba(242,232,216,.8);
}
.page-products .dl-stage__facts{
  display:grid;
  gap:.55rem;
  margin:0 0 .9rem;
}
.page-products .dl-stage__fact{
  display:grid;
  grid-template-columns:4.8rem 1fr;
  gap:.5rem;
  padding-top:.5rem;
  border-top:1px dashed var(--line-soft);
}
.page-products .dl-stage__key{
  font-family:var(--font-mono);
  font-size:.71rem;
  letter-spacing:.06em;
  color:var(--brass-bright);
}
.page-products .dl-stage__val{
  margin:0;
  font-size:.84rem;
  line-height:1.65;
  color:rgba(242,232,216,.86);
}
.page-products .dl-stage__links{
  display:flex;
  flex-wrap:wrap;
  gap:.4rem 1.1rem;
  margin:0;
  font-size:.82rem;
}
.page-products .dl-stage__links a{
  color:var(--brass-bright);
  text-decoration:none;
  border-bottom:1px solid transparent;
}
.page-products .dl-stage__links a:hover{
  border-bottom-color:var(--brass);
}

/* ---------- 下载前清单 ---------- */
.page-products .dl-checks__list{
  list-style:none;
  margin:clamp(1.4rem,3vw,2rem) 0 0;
  padding:0;
  border-top:1px solid var(--line-soft);
  border-bottom:1px solid var(--line-soft);
  background:var(--line-soft);
  display:grid;
  gap:1px;
}
.page-products .dl-checks__item{
  display:grid;
  grid-template-columns:2.6rem 1fr;
  gap:.2rem .9rem;
  padding:1.05rem .9rem;
  background:var(--ink-deep);
}
.page-products .dl-checks__num{
  grid-row:1;
  font-family:var(--font-mono);
  font-size:.92rem;
  padding-top:.15rem;
  padding-right:.6rem;
  border-right:1px solid var(--line);
  color:var(--brass);
}
.page-products .dl-checks__body{
  grid-column:2;
  min-width:0;
}
.page-products .dl-checks__title{
  margin:0;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.55rem;
  font-size:1rem;
  line-height:1.5;
  color:var(--ivory);
}
.page-products .dl-checks__text{
  margin:.35rem 0 0;
  font-size:.88rem;
  line-height:1.78;
  color:rgba(242,232,216,.76);
}

/* ---------- 步骤 ---------- */
.page-products .dl-route{
  display:block;
  width:100%;
  height:auto;
  margin:clamp(1.2rem,3vw,1.8rem) 0 0;
}
.page-products .dl-steps__grid{
  display:grid;
  gap:var(--dl-gap);
  margin-top:var(--dl-gap);
}
.page-products .dl-steps__main{
  display:grid;
  gap:.7rem;
  align-content:start;
  min-width:0;
}
.page-products .dl-steps__figure{
  margin-bottom:.2rem;
}
.page-products .dl-step{
  border-left:2px solid var(--brass);
  background:rgba(17,59,58,.34);
}
.page-products .dl-step[open]{
  background:rgba(17,59,58,.55);
}
.page-products .dl-step__sum{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:.8rem;
  align-items:baseline;
  padding:.85rem 1rem;
  cursor:pointer;
  list-style:none;
}
.page-products .dl-step__sum::-webkit-details-marker{
  display:none;
}
.page-products .dl-step__num{
  padding:.1rem .4rem;
  background:var(--brass-bright);
  color:var(--ink-deep);
  font-family:var(--font-mono);
  font-size:.75rem;
  font-weight:700;
}
.page-products .dl-step__title{
  font-size:.96rem;
  line-height:1.5;
  color:var(--ivory);
}
.page-products .dl-step__body{
  padding:0 1rem 1rem;
}
.page-products .dl-step__body p{
  margin:0;
  font-size:.89rem;
  line-height:1.8;
  color:rgba(242,232,216,.8);
}
.page-products .dl-steps__side{
  display:grid;
  gap:var(--dl-gap);
  align-content:start;
  min-width:0;
}
.page-products .dl-steps__panel{
  padding:var(--dl-pad);
  border:1px solid var(--line-soft);
  background:linear-gradient(170deg,rgba(110,46,62,.38),rgba(11,31,42,.92));
}
.page-products .dl-steps__panel h3{
  margin:0 0 .75rem;
  font-family:var(--font-display);
  font-size:1.06rem;
  color:var(--brass-bright);
}
.page-products .dl-steps__panel ul{
  margin:0;
  padding-left:1.1rem;
  display:grid;
  gap:.5rem;
  font-size:.87rem;
  line-height:1.7;
  color:rgba(242,232,216,.82);
}

/* ---------- 收藏方式 ---------- */
.page-products .dl-save__grid{
  display:grid;
  gap:var(--dl-gap);
  margin-top:clamp(1.4rem,3vw,2rem);
}
.page-products .dl-save__card{
  display:grid;
  gap:.55rem;
  padding:var(--dl-pad);
  border-top:2px solid var(--brass);
  background:linear-gradient(160deg,rgba(17,59,58,.72),rgba(7,22,32,.94));
  clip-path:polygon(0 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%);
}
.page-products .dl-save__card-num{
  font-family:var(--font-mono);
  font-size:.72rem;
  letter-spacing:.13em;
  color:var(--brass-bright);
}
.page-products .dl-save__card-title{
  margin:0;
  font-family:var(--font-display);
  font-size:1.12rem;
  color:var(--ivory);
}
.page-products .dl-save__card-text{
  margin:0;
  font-size:.89rem;
  line-height:1.8;
  color:rgba(242,232,216,.8);
}
.page-products .dl-save__card-who{
  margin:0;
  padding-top:.55rem;
  border-top:1px dashed var(--line-soft);
  font-family:var(--font-mono);
  font-size:.73rem;
  letter-spacing:.03em;
  color:var(--mint);
}
.page-products .dl-save__figure{
  margin-top:var(--dl-gap);
  max-width:540px;
  border:1px solid var(--line);
  background:var(--ink-deeper);
  clip-path:polygon(0 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%);
}
.page-products .dl-support{
  display:grid;
  gap:.8rem;
  margin-top:var(--dl-gap);
  padding:var(--dl-pad);
  border-left:3px solid var(--brass);
  background:linear-gradient(120deg,rgba(110,46,62,.42),rgba(17,59,58,.5));
}
.page-products .dl-support__title{
  margin:0;
  font-family:var(--font-display);
  font-size:1.14rem;
  color:var(--ivory);
}
.page-products .dl-support__text{
  margin:0;
  max-width:60ch;
  font-size:.9rem;
  line-height:1.82;
  color:rgba(242,232,216,.85);
}
.page-products .dl-support .btn{
  justify-self:start;
}

/* ---------- 安装之后 ---------- */
.page-products .dl-after__grid{
  margin-top:clamp(1.4rem,3vw,2rem);
}
.page-products .dl-after__panel{
  padding:var(--dl-pad);
  border-top:1px solid var(--line);
  background:rgba(17,59,58,.45);
}
.page-products .dl-after__panel h3{
  margin:0 0 .8rem;
  font-family:var(--font-display);
  font-size:1.14rem;
  color:var(--ivory);
}
.page-products .dl-after__list{
  margin:0 0 1rem;
  padding-left:1.2rem;
  display:grid;
  gap:.6rem;
  font-size:.89rem;
  line-height:1.78;
  color:rgba(242,232,216,.82);
}
.page-products .dl-after__panel p{
  margin:0;
  font-size:.87rem;
}
.page-products .dl-after__panel a{
  color:var(--brass-bright);
}
.page-products .dl-after__note{
  display:grid;
  gap:.7rem;
  align-content:start;
  padding:var(--dl-pad);
  background:linear-gradient(165deg,rgba(7,22,32,.92),rgba(17,59,58,.52));
}
.page-products .dl-after__note p{
  margin:0;
  font-size:.89rem;
  line-height:1.8;
  color:rgba(242,232,216,.82);
}
.page-products .dl-after__note a{
  color:var(--brass-bright);
}

/* ---------- 客服 ---------- */
.page-products .dl-help__grid{
  display:grid;
  gap:var(--dl-gap);
  margin-top:clamp(1.4rem,3vw,2rem);
}
.page-products .dl-contact{
  margin:0;
  display:grid;
  gap:.85rem;
  padding:var(--dl-pad);
  border:1px solid var(--line);
  background:linear-gradient(160deg,rgba(17,59,58,.78),rgba(7,22,32,.96));
  clip-path:polygon(0 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%);
}
.page-products .dl-contact__row{
  display:grid;
  gap:.25rem;
  padding-bottom:.75rem;
  border-bottom:1px dashed var(--line-soft);
}
.page-products .dl-contact__row:last-child{
  padding-bottom:0;
  border-bottom:0;
}
.page-products .dl-contact__key{
  font-family:var(--font-mono);
  font-size:.71rem;
  letter-spacing:.1em;
  color:var(--brass-bright);
}
.page-products .dl-contact__val{
  margin:0;
  font-size:.94rem;
  line-height:1.65;
  color:var(--ivory);
  word-break:break-word;
}
.page-products .dl-help__figure{
  align-self:start;
}

/* ---------- 响应式 ---------- */
@media (min-width:640px){
  .page-products .dl-metrics{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
  .page-products .dl-save__grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .page-products .dl-checks__item{
    grid-template-columns:3.4rem 1fr;
    padding:1.15rem 1.1rem;
  }
}

@media (min-width:900px){
  .page-products .dl-hero{
    grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
    align-items:start;
  }
  .page-products .dl-matrix__grid{
    grid-template-columns:minmax(0,.26fr) minmax(0,1fr);
    gap:clamp(1.4rem,3vw,2.4rem);
  }
  .page-products .dl-steps__grid{
    grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);
    gap:clamp(1.4rem,3vw,2.2rem);
  }
  .page-products .dl-help__grid{
    grid-template-columns:minmax(0,1fr) minmax(0,.7fr);
    align-items:start;
  }
  .page-products .dl-hero__figure{
    margin-top:.4rem;
  }
}

@media (min-width:1180px){
  .page-products .dl-hero__title{
    font-size:clamp(2.6rem,4.2vw,3.5rem);
  }
  .page-products .dl-save__figure{
    max-width:600px;
  }
}

@media (prefers-reduced-motion:reduce){
  .page-products *{
    transition:none !important;
    animation:none !important;
  }
}
