.page-products{
  --p-blue-deep:#143753;
  --p-blue-mid:#1B4F72;
  --p-green:#1E8C5A;
  --p-gold:#D4A017;
  --p-ink:#111111;
  --p-grey-050:#F4F6F7;
  --p-grey-200:#E5E8E8;
  --p-grey-500:#7F8C8D;
  --p-white:#FFFFFF;
  --p-section-gap:4rem;
  --p-radius:14px;
  font-family:var(--font-body);
  line-height:1.75;
  color:var(--p-ink);
  background:var(--p-white);
  overflow-x:hidden;
}

.page-products .breadcrumb{
  margin:0;
  padding:1.5rem 0 .75rem;
  font-family:var(--font-mono);
  font-size:.75rem;
  letter-spacing:.04em;
  color:var(--p-grey-500);
}

/* ===== Hero ===== */
.page-products .p-solutions-hero{
  position:relative;
  background:linear-gradient(135deg,var(--p-ink) 0%,var(--p-blue-deep) 100%);
  color:var(--p-white);
  padding:var(--p-section-gap) 0;
  overflow:hidden;
}
.page-products .p-solutions-hero::before{
  content:"";
  position:absolute;
  top:-35%;
  right:-12%;
  width:min(520px,60vw);
  height:min(520px,60vw);
  background:rgba(30,140,90,.16);
  transform:rotate(18deg);
  clip-path:polygon(0 0,100% 0,100% 100%,0 82%);
}
.page-products .p-solutions-hero::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:100%;
  height:4px;
  background:var(--p-green);
}
.page-products .p-solutions-hero .section-label{
  color:var(--p-gold);
}
.page-products .p-solutions-hero h1{
  font-family:var(--font-head);
  font-weight:900;
  font-size:clamp(2rem,5vw,3.5rem);
  line-height:1.15;
  margin:1rem 0 1.25rem;
  color:var(--p-white);
}
.page-products .p-hero-sub{
  display:block;
  font-weight:700;
  font-size:clamp(1.1rem,2.4vw,1.5rem);
  color:var(--p-gold);
  margin-top:.4rem;
}
.page-products .p-hero-desc{
  max-width:34rem;
  font-size:1rem;
  color:rgba(255,255,255,.78);
  margin-bottom:1.75rem;
}
.page-products .p-hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:1rem;
  margin-bottom:2.25rem;
}
.page-products .p-solutions-hero .btn-ghost{
  border-color:rgba(255,255,255,.65);
  color:var(--p-white);
}
.page-products .p-hero-stats{
  display:flex;
  flex-wrap:wrap;
  gap:2rem;
  border-top:1px solid rgba(255,255,255,.2);
  padding-top:1.5rem;
}
.page-products .p-hero-stat{
  display:flex;
  flex-direction:column;
}
.page-products .p-hero-num{
  font-family:var(--font-mono);
  font-weight:700;
  font-size:1.35rem;
  color:var(--p-gold);
}
.page-products .p-hero-label{
  font-size:.8rem;
  color:rgba(255,255,255,.65);
  margin-top:.2rem;
}
.page-products .p-solutions-hero__grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:1fr;
  gap:2.5rem;
  align-items:center;
}
.page-products .p-solutions-hero__media{
  position:relative;
  aspect-ratio:16 / 10;
  overflow:hidden;
  clip-path:polygon(4% 0,100% 0,96% 100%,0 100%);
  background:var(--p-blue-mid);
}
.page-products .p-solutions-hero__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  filter:saturate(.92) contrast(1.05);
}

/* ===== Section heads ===== */
.page-products .p-section-head{
  margin-bottom:1.75rem;
}
.page-products .p-section-head h2{
  font-family:var(--font-head);
  font-weight:800;
  font-size:clamp(1.5rem,3.4vw,2.25rem);
  line-height:1.25;
  margin:.6rem 0 0;
}

/* ===== 方案概览 · 技能树 ===== */
.page-products .p-solutions-overview{
  padding:var(--p-section-gap) 0;
  background:var(--p-grey-050);
}
.page-products .p-tree{
  position:relative;
  margin-top:2.25rem;
}
.page-products .p-tree::before{
  content:"";
  position:absolute;
  left:4px;
  top:0;
  bottom:0;
  width:2px;
  background:linear-gradient(to bottom,var(--p-green),var(--p-blue-mid),var(--p-gold));
}
.page-products .p-tree-node{
  position:relative;
  background:var(--p-white);
  border:1px solid var(--p-grey-200);
  border-left:3px solid var(--p-green);
  margin:0 0 1.25rem 1.25rem;
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px));
  transition:border-color var(--transition),box-shadow var(--transition);
}
.page-products .p-tree-node[open]{
  border-left-color:var(--p-green);
  box-shadow:0 8px 24px rgba(30,140,90,.1);
}
.page-products .p-tree-node::after{
  content:"";
  position:absolute;
  left:-10px;
  top:26px;
  width:10px;
  height:10px;
  background:var(--p-green);
  border:2px solid var(--p-white);
  transform:rotate(45deg);
  z-index:2;
}
.page-products .p-tree-node__head{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:.75rem;
  cursor:pointer;
  list-style:none;
  padding:1.25rem 1.5rem;
}
.page-products .p-tree-node__head::-webkit-details-marker{
  display:none;
}
.page-products .p-tree-node__title{
  font-family:var(--font-head);
  font-weight:700;
  font-size:1.05rem;
  margin:0;
  flex:1;
  min-width:180px;
}
.page-products .p-tree-arrow{
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  border:1px solid var(--p-grey-200);
  color:var(--p-grey-500);
  font-family:var(--font-mono);
  font-size:.9rem;
  line-height:1;
  transition:transform var(--transition),background var(--transition);
}
.page-products .p-tree-arrow::before{
  content:"+";
}
.page-products .p-tree-node[open] .p-tree-arrow::before{
  content:"−";
}
.page-products .p-tree-arrow:hover{
  background:var(--p-gold-soft);
}
.page-products .p-tree-node__body{
  padding:0 1.5rem 1.5rem;
  border-left:1px solid transparent;
}
.page-products .p-tree-node__body p{
  font-size:.95rem;
  color:var(--p-grey-500);
  margin-bottom:.85rem;
  max-width:42rem;
}
.page-products .p-tree-link{
  display:inline-block;
  font-family:var(--font-mono);
  font-size:.8rem;
  font-weight:600;
  color:var(--p-green);
  text-decoration:none;
  border-bottom:1px solid var(--p-green);
  padding-bottom:2px;
  transition:color var(--transition),border-color var(--transition);
}
.page-products .p-tree-link:hover{
  color:var(--p-gold);
  border-color:var(--p-gold);
}

/* ===== 版本选择 ===== */
.page-products .p-solutions-versions{
  padding:var(--p-section-gap) 0;
}
.page-products .p-versions-lead{
  color:var(--p-grey-500);
  max-width:44rem;
  margin-bottom:2rem;
}
.page-products .p-version-grid{
  row-gap:1.5rem;
  column-gap:1.5rem;
  margin-bottom:2.5rem;
}
.page-products .p-version-card{
  position:relative;
  padding:1.75rem;
  background:var(--p-white);
  border:1px solid var(--p-grey-200);
  transition:border-color var(--transition),box-shadow var(--transition),transform var(--transition);
}
.page-products .p-version-card::before{
  content:"";
  position:absolute;
  left:0;
  top:1rem;
  bottom:1rem;
  width:4px;
  background:var(--p-green);
}
.page-products .p-version-card:hover{
  border-color:var(--p-green);
  box-shadow:0 10px 30px rgba(30,140,90,.12);
  transform:translateY(-3px);
}
.page-products .p-version-top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:.75rem;
  margin-bottom:1rem;
}
.page-products .p-version-card h3{
  font-family:var(--font-head);
  font-weight:700;
  font-size:1.2rem;
  margin:.25rem 0 1rem;
}
.page-products .p-version-list{
  margin:0 0 1.25rem;
  padding:0;
  list-style:none;
}
.page-products .p-version-list li{
  position:relative;
  padding-left:1.1rem;
  font-size:.9rem;
  color:var(--p-ink-soft,#333);
  margin-bottom:.45rem;
}
.page-products .p-version-list li::before{
  content:"";
  position:absolute;
  left:0;
  top:.55em;
  width:5px;
  height:5px;
  background:var(--p-gold);
  transform:rotate(45deg);
}
.page-products .p-version-note{
  font-size:.8rem;
  color:var(--p-grey-500);
  border-top:1px dashed var(--p-grey-200);
  padding-top:.85rem;
  margin:0;
}
.page-products .p-version-figure{
  margin:0;
  text-align:center;
}
.page-products .p-version-figure img{
  max-width:100%;
  height:auto;
  border-radius:var(--p-radius);
  box-shadow:0 14px 40px rgba(17,17,17,.12);
}
.page-products .p-version-figure figcaption{
  margin-top:.75rem;
  color:var(--p-grey-500);
  font-size:.75rem;
}

/* ===== 下载指引 ===== */
.page-products .p-solutions-download{
  position:relative;
  padding:var(--p-section-gap) 0;
  background:linear-gradient(135deg,var(--p-ink) 0%,var(--p-blue-deep) 100%);
  color:var(--p-white);
  overflow:hidden;
}
.page-products .p-solutions-download::before{
  content:"";
  position:absolute;
  left:-8%;
  bottom:-15%;
  width:46vw;
  height:46vw;
  border:2px solid rgba(212,160,23,.25);
  transform:rotate(28deg);
  pointer-events:none;
}
.page-products .p-solutions-download .container{
  position:relative;
  z-index:1;
}
.page-products .p-solutions-download .section-label{
  color:var(--p-gold);
}
.page-products .p-solutions-download h2{
  font-family:var(--font-head);
  font-weight:800;
  font-size:clamp(1.5rem,3.4vw,2.25rem);
  color:var(--p-white);
  margin:.6rem 0 .5rem;
}
.page-products .p-download-lead{
  color:rgba(255,255,255,.7);
  max-width:36rem;
  margin-bottom:2.5rem;
}
.page-products .p-download-layout{
  display:grid;
  grid-template-columns:1fr;
  gap:2.5rem;
}
.page-products .p-download-steps{
  margin:0;
  padding:0;
  list-style:none;
  counter-reset:dlStep;
}
.page-products .p-download-step{
  counter-increment:dlStep;
  display:flex;
  align-items:flex-start;
  gap:1.1rem;
  padding:1.4rem 1.5rem;
  margin-bottom:.85rem;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);
  border-left:3px solid var(--p-green);
  transition:var(--transition);
}
.page-products .p-download-step:hover{
  background:rgba(30,140,90,.18);
  border-left-color:var(--p-gold);
  transform:translateX(6px);
}
.page-products .p-download-step .step-index{
  flex-shrink:0;
  font-family:var(--font-mono);
  font-weight:700;
  font-size:.9rem;
  color:var(--p-gold);
}
.page-products .p-download-step__body h3{
  font-family:var(--font-head);
  font-weight:700;
  font-size:1rem;
  color:var(--p-white);
  margin:0 0 .15rem;
}
.page-products .p-download-step__body p{
  font-size:.85rem;
  color:rgba(255,255,255,.65);
  margin:0;
}
.page-products .p-download-visual img{
  max-width:100%;
  height:auto;
  border-radius:var(--p-radius);
  box-shadow:0 18px 44px rgba(0,0,0,.35);
}
.page-products .p-download-note{
  margin-top:2.25rem;
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:.75rem;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);
  padding:1.1rem 1.4rem;
  font-size:.85rem;
}
.page-products .p-download-note p{
  margin:0;
  color:rgba(255,255,255,.75);
  flex:1;
  min-width:200px;
}
.page-products .p-download-link{
  font-family:var(--font-mono);
  font-size:.8rem;
  color:var(--p-gold);
  text-decoration:none;
  border-bottom:1px solid var(--p-gold);
  padding-bottom:1px;
}
.page-products .p-download-link:hover{
  color:var(--p-white);
  border-color:var(--p-white);
}

/* ===== 适配记录 ===== */
.page-products .p-solutions-adaptation{
  padding:var(--p-section-gap) 0;
  background:var(--p-grey-050);
}
.page-products .p-adaptation-lead{
  color:var(--p-grey-500);
  max-width:44rem;
  margin-bottom:2.25rem;
}
.page-products .p-adaptation-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:1.5rem;
  margin-bottom:2.5rem;
}
.page-products .p-adaptation-card{
  background:var(--p-white);
  border:1px solid var(--p-grey-200);
  border-top:3px solid var(--p-blue-mid);
  padding:1.6rem 1.8rem;
  transition:var(--transition);
}
.page-products .p-adaptation-card:hover{
  border-top-color:var(--p-green);
  box-shadow:0 10px 28px rgba(27,79,114,.1);
}
.page-products .p-adaptation-card .meta-index{
  display:inline-block;
  background:var(--p-gold-soft);
  color:var(--p-gold);
  font-size:.72rem;
  font-family:var(--font-mono);
  font-weight:600;
  padding:.2rem .5rem;
  margin-bottom:.8rem;
  border-left:2px solid var(--p-gold);
}
.page-products .p-adaptation-card h3{
  font-family:var(--font-head);
  font-weight:700;
  font-size:1.15rem;
  margin:0 0 .5rem;
}
.page-products .p-adaptation-card p{
  font-size:.9rem;
  color:var(--p-grey-500);
  margin:0;
}
.page-products .p-adaptation-media{
  display:grid;
  grid-template-columns:1fr;
  gap:1.5rem;
  margin-bottom:2rem;
}
.page-products .p-adaptation-media figure{
  margin:0;
}
.page-products .p-adaptation-media img{
  max-width:100%;
  height:auto;
  border-radius:var(--p-radius);
  box-shadow:0 10px 28px rgba(17,17,17,.08);
}
.page-products .p-adaptation-cta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:1rem;
}
.page-products .p-adaptation-cta .meta-index{
  color:var(--p-grey-500);
}

/* ===== 帮助辅助区 ===== */
.page-products .p-solutions-assist{
  padding:var(--p-section-gap) 0;
  background:var(--p-white);
}
.page-products .p-assist-panel{
  display:flex;
  flex-direction:column;
  gap:1.5rem;
  justify-content:space-between;
  align-items:flex-start;
  padding:2.5rem;
  background:var(--p-blue-deep);
  color:var(--p-white);
  box-shadow:0 20px 50px rgba(27,79,114,.18);
}
.page-products .p-assist-panel .section-label{
  color:var(--p-gold);
}
.page-products .p-assist-panel h2{
  font-family:var(--font-head);
  font-weight:800;
  font-size:clamp(1.4rem,3vw,2rem);
  margin:.5rem 0 .75rem;
}
.page-products .p-assist-panel p{
  color:rgba(255,255,255,.75);
  max-width:38rem;
  margin:0;
}
.page-products .p-assist-actions{
  display:flex;
  flex-wrap:wrap;
  gap:1rem;
}
.page-products .p-assist-panel .btn-ghost{
  border-color:rgba(255,255,255,.7);
  color:var(--p-white);
}
.page-products .p-assist-panel .btn-ghost:hover{
  background:rgba(255,255,255,.12);
}

/* ===== 响应式增强 ===== */
@media (min-width:768px){
  .page-products .p-solutions-hero__grid{
    grid-template-columns:5fr 7fr;
    gap:3rem;
  }
  .page-products .p-hero-stats{
    gap:3rem;
  }
  .page-products .p-version-card{
    padding:2rem;
  }
  .page-products .p-download-layout{
    grid-template-columns:1fr 1fr;
    align-items:center;
  }
  .page-products .p-adaptation-grid{
    grid-template-columns:repeat(3,1fr);
  }
  .page-products .p-adaptation-media{
    grid-template-columns:1fr 1fr;
    align-items:center;
  }
  .page-products .p-assist-panel{
    flex-direction:row;
    align-items:center;
    padding:3rem;
  }
}

@media (min-width:1024px){
  .page-products .p-tree{
    margin-top:2.5rem;
  }
  .page-products .p-tree-node{
    display:grid;
    grid-template-columns:minmax(240px,320px) 1fr;
    column-gap:2rem;
    margin-left:1.5rem;
  }
  .page-products .p-tree-node__head{
    grid-column:1;
    padding:1.4rem 1.5rem;
  }
  .page-products .p-tree-node__body{
    grid-column:2;
    padding:1.4rem 1.5rem 1.4rem 0;
    border-left:1px solid var(--p-grey-200);
    padding-left:2rem;
  }
  .page-products .p-version-grid{
    grid-template-columns:repeat(2,1fr);
  }
  .page-products .p-download-head{
    max-width:50%;
  }
  .page-products .p-download-note{
    flex-wrap:nowrap;
  }
}

.page-products {
  --p-gold-soft: transparent;
  --p-ink-soft: var(--ink-soft);
}
