.page-products{
  --p-block:clamp(34px,6vw,76px);
  --p-line-soft:1px solid var(--line-c);
  overflow-x:clip;
}

.page-products .breadcrumb{margin-bottom:clamp(16px,3vw,30px);}

.page-products .page-head__title{max-width:16em;}
.page-products .page-head__lead{max-width:46em;}

/* 01 总览 */
.page-products .p-overview{position:relative;overflow:hidden;}
.page-products .p-overview::after{
  content:"";
  position:absolute;
  right:-14%;
  bottom:-46%;
  width:min(560px,70vw);
  aspect-ratio:1;
  background:radial-gradient(circle at center,rgba(30,91,255,.38),rgba(30,91,255,0) 64%);
  pointer-events:none;
}
.page-products .p-overview .wrap{position:relative;z-index:1;}
.page-products .p-overview__fig{margin:clamp(20px,3vw,34px) 0;}
.page-products .p-overview__fig img{
  display:block;
  width:100%;
  height:auto;
  border:1px solid var(--line-ink);
  background:var(--ink-2);
}

.page-products .p-matrix{display:grid;border-top:1px solid var(--line-ink);}
.page-products .p-matrix__col{
  padding:20px 0 22px;
  border-bottom:1px solid var(--line-ink);
}
.page-products .p-matrix__head{display:flex;flex-direction:column;gap:6px;}
.page-products .p-mark{display:block;width:44px;height:44px;margin-bottom:10px;}
.page-products .p-matrix__idx{
  font-size:12px;
  letter-spacing:.16em;
  color:var(--cyan);
}
.page-products .p-matrix__name{
  margin:0;
  font-size:clamp(22px,3vw,26px);
  font-weight:800;
  letter-spacing:-.01em;
}
.page-products .p-matrix__who{
  margin:0;
  font-size:14px;
  line-height:1.7;
  opacity:.72;
}
.page-products .p-matrix__rows{
  list-style:none;
  margin:14px 0 0;
  padding:0;
}
.page-products .p-matrix__rows li{
  display:flex;
  gap:12px;
  align-items:baseline;
  padding:9px 0;
  border-top:1px solid var(--line-ink);
  font-size:15px;
}
.page-products .p-matrix__rows .mono{
  font-size:11px;
  letter-spacing:.12em;
  color:var(--orange);
}

/* 产品线分区 */
.page-products .p-line__grid{
  display:grid;
  gap:clamp(20px,3vw,34px);
  align-items:start;
  margin-top:clamp(18px,3vw,28px);
}
.page-products .p-line__text p{
  margin:0 0 16px;
  font-size:16px;
  line-height:1.85;
}
.page-products .p-stat{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:6px 14px;
  margin:20px 0 0;
  padding-top:16px;
  border-top:1px solid var(--line-c);
}
.page-products .p-stat__num{
  font-size:clamp(28px,5vw,42px);
  font-weight:900;
  letter-spacing:-.035em;
  line-height:1.1;
  color:var(--blue);
}
.page-products .p-stat__txt{
  flex:1 1 15em;
  font-size:14px;
  line-height:1.75;
  opacity:.82;
}
.page-products .p-line__media{margin:0;}
.page-products .p-line__media img{
  display:block;
  width:100%;
  height:auto;
  border:1px solid var(--line-c);
  background:var(--paper-2);
}
.page-products .p-line__media figcaption{
  margin-top:10px;
  font-family:var(--font-mono);
  font-size:12px;
  line-height:1.6;
  opacity:.68;
}

.page-products .p-mods{
  display:grid;
  gap:12px;
  margin-top:clamp(22px,4vw,40px);
}
.page-products .p-mod{
  border:1px solid var(--line-c);
  padding:16px 16px 18px;
  transition:border-color .2s var(--ease),background-color .2s var(--ease);
}
.page-products .p-mod:hover,
.page-products .p-mod:focus-within{border-color:var(--blue);}
.page-products .p-mod__num{
  margin:0 0 8px;
  font-size:11px;
  letter-spacing:.16em;
  color:var(--clay);
}
.page-products .p-mod__title{
  margin:0 0 8px;
  font-size:18px;
  font-weight:800;
  letter-spacing:-.01em;
}
.page-products .p-mod__text{
  margin:0;
  font-size:14px;
  line-height:1.78;
  opacity:.85;
}

/* 05 方案 */
.page-products .p-plans{
  display:grid;
  gap:24px;
  margin-top:clamp(20px,3vw,32px);
}
.page-products .p-plan{
  border-top:3px solid var(--clay);
  padding-top:16px;
}
.page-products .p-plan--pro{border-top-color:var(--orange);}
.page-products .p-plan__name{
  margin:0 0 6px;
  font-size:clamp(22px,3vw,26px);
  font-weight:800;
}
.page-products .p-plan__fit{
  margin:0 0 14px;
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.08em;
  color:var(--cyan);
}
.page-products .p-plan ul{list-style:none;margin:0;padding:0;}
.page-products .p-plan li{
  padding:11px 0;
  border-top:1px solid var(--line-ink);
  font-size:15px;
  line-height:1.75;
}
.page-products .p-path{
  list-style:none;
  margin:clamp(24px,4vw,40px) 0 0;
  padding:0;
  display:grid;
  gap:0;
}
.page-products .p-path li{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:12px;
  align-items:baseline;
  padding:12px 0;
  border-top:1px solid var(--line-ink);
  font-size:15px;
  line-height:1.7;
}
.page-products .p-path .mono{font-size:11px;letter-spacing:.12em;color:var(--cyan);}
.page-products .p-path-note{
  margin:22px 0 0;
  font-size:14px;
  line-height:1.75;
  opacity:.8;
}

/* 06 资料库 */
.page-products .p-filterbar{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px 12px;
  margin:18px 0 0;
}
.page-products .p-filterbar__label{
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:.16em;
  opacity:.65;
}
.page-products .p-docs{
  margin-top:clamp(18px,3vw,28px);
  border-top:1px solid var(--line-c);
}
.page-products .p-docs .index-row{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:2px 14px;
  padding:13px 2px;
  border-bottom:1px solid var(--line-c);
}
.page-products .p-docs .index-row__num{
  font-family:var(--font-mono);
  font-size:13px;
  letter-spacing:.04em;
  color:var(--clay);
}
.page-products .p-docs .index-row__title{
  font-size:16px;
  font-weight:700;
  line-height:1.5;
}
.page-products .p-docs .index-row__meta{
  grid-column:2;
  font-family:var(--font-mono);
  font-size:11.5px;
  line-height:1.7;
  opacity:.68;
}

/* 07 三步下载 */
.page-products .p-runway{
  display:block;
  width:100%;
  height:auto;
  margin:clamp(18px,3vw,30px) 0 6px;
}
.page-products .p-steps{margin-top:6px;}
.page-products .p-steps .acc__item{border-top:1px solid var(--line-ink);}
.page-products .p-steps .acc__item:last-child{border-bottom:1px solid var(--line-ink);}
.page-products .p-steps .acc__btn{
  display:flex;
  align-items:center;
  gap:14px;
  width:100%;
  padding:16px 0;
  background:none;
  border:0;
  color:inherit;
  font:inherit;
  text-align:left;
  cursor:pointer;
}
.page-products .p-steps .acc__btn:hover .acc__label{color:var(--cyan);}
.page-products .p-steps .acc__btn:focus-visible{
  outline:2px solid var(--cyan);
  outline-offset:3px;
}
.page-products .p-steps .acc__step{
  flex:none;
  font-size:11px;
  letter-spacing:.12em;
  color:var(--cyan);
}
.page-products .p-steps .acc__label{
  flex:1;
  font-size:clamp(16px,2.4vw,19px);
  font-weight:800;
  letter-spacing:-.01em;
  transition:color .18s var(--ease);
}
.page-products .p-steps .acc__body{
  padding:0 0 18px 0;
  font-size:15px;
  line-height:1.8;
  max-width:62em;
  opacity:.88;
}
.page-products .p-steps .acc__body .tag{margin-right:6px;}
.page-products .p-log-title{
  margin:clamp(28px,4vw,44px) 0 0;
  font-size:14px;
  font-weight:800;
  letter-spacing:.06em;
}
.page-products .p-log{
  list-style:none;
  margin:12px 0 0;
  padding:0;
  border-top:1px solid var(--line-ink);
}
.page-products .p-log li{
  display:grid;
  grid-template-columns:34px 1fr;
  gap:12px;
  padding:10px 0;
  border-bottom:1px solid var(--line-ink);
  font-size:14px;
  line-height:1.7;
}
.page-products .p-log .mono{
  font-size:11px;
  letter-spacing:.1em;
  color:var(--cyan);
  opacity:.85;
  padding-top:2px;
}
.page-products .p-log-note{
  margin:18px 0 0;
  font-size:14px;
  line-height:1.75;
  opacity:.8;
}

/* 08 反馈 */
.page-products .p-fbk{
  display:grid;
  gap:10px;
  margin-top:clamp(18px,3vw,28px);
}
.page-products .p-fbk__item{
  border:1px solid var(--line-c);
  border-left:3px solid var(--clay);
  padding:14px 16px;
  font-size:15px;
  line-height:1.72;
}
.page-products .p-fbk-note{
  margin:18px 0 0;
  font-size:15px;
  line-height:1.8;
  max-width:56em;
}
.page-products .p-cta{
  margin-top:clamp(22px,4vw,38px);
  background:var(--ink);
  color:var(--t-ink);
  padding:clamp(22px,4vw,36px);
  display:grid;
  gap:18px;
  align-items:center;
}
.page-products .p-cta__title{
  margin:0;
  font-size:clamp(19px,3vw,25px);
  font-weight:800;
  letter-spacing:-.01em;
  line-height:1.35;
}
.page-products .p-cta__text{
  margin:8px 0 0;
  font-size:15px;
  line-height:1.75;
  opacity:.86;
  max-width:46ch;
}
.page-products .p-cta .btn{justify-self:start;}
.page-products .p-fbk-links{
  margin:20px 0 0;
  font-size:14px;
  line-height:1.8;
  opacity:.85;
}

@media (min-width:640px){
  .page-products .p-mods{grid-template-columns:repeat(2,1fr);}
  .page-products .p-fbk{grid-template-columns:repeat(2,1fr);}
  .page-products .p-cta{grid-template-columns:1fr auto;}
}

@media (min-width:900px){
  .page-products .p-matrix{
    grid-template-columns:repeat(3,minmax(0,1fr));
    border-bottom:1px solid var(--line-ink);
  }
  .page-products .p-matrix__col{
    padding:26px 26px 30px;
    border-bottom:0;
    border-left:1px solid var(--line-ink);
  }
  .page-products .p-matrix__col:first-child{border-left:0;padding-left:0;}
  .page-products .p-matrix__col:last-child{padding-right:0;}

  .page-products .p-line__grid{grid-template-columns:minmax(0,7fr) minmax(0,5fr);}
  .page-products .p-line--reverse .p-line__grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);}
  .page-products .p-line--reverse .p-line__text{order:2;}
  .page-products .p-line--reverse .p-line__media{order:1;}

  .page-products .p-plans{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px;}
  .page-products .p-path{grid-template-columns:repeat(5,minmax(0,1fr));gap:0;}
  .page-products .p-path li{
    grid-template-columns:1fr;
    gap:8px;
    border-top:0;
    border-left:1px solid var(--line-ink);
    padding:2px 14px 0 16px;
  }
  .page-products .p-path li:first-child{border-left:0;padding-left:0;}
}

@media (min-width:1080px){
  .page-products .p-mods{grid-template-columns:repeat(4,minmax(0,1fr));}
  .page-products .p-fbk{grid-template-columns:repeat(4,minmax(0,1fr));}
  .page-products .p-docs .index-row{grid-template-columns:76px 1fr;gap:2px 18px;}
  .page-products .p-steps .acc__body{padding-left:0;}
}

@media (prefers-reduced-motion:reduce){
  .page-products .p-mod,
  .page-products .p-steps .acc__label{transition:none;}
}
<<<END>>>