.page-products{
  --pd-line:rgba(199,154,59,.26);
  --pd-line-soft:rgba(246,231,193,.12);
  --pd-amber-soft:rgba(242,185,75,.1);
  --pd-cyan-soft:rgba(63,224,208,.12);
  overflow-x:clip;
  padding-bottom:clamp(3rem,7vw,6.5rem);
}

.page-products .gc-breadcrumb{
  margin:clamp(.75rem,2vw,1.5rem) 0 0;
  font-size:.82rem;
}

/* ---------- 首屏 ---------- */
.page-products .pd-hero{padding-top:clamp(1.25rem,4vw,2.75rem);}

.page-products .pd-hero__grid{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(1.25rem,3.5vw,2.75rem);
}

.page-products .pd-hero__title{
  font-family:var(--gc-font-display);
  font-size:clamp(2rem,7vw,4rem);
  line-height:1.06;
  letter-spacing:.01em;
  margin:.65rem 0 0;
  max-width:22ch;
}

.page-products .pd-hero__lede{
  margin:1.1rem 0 0;
  max-width:62ch;
  color:var(--gc-sand);
  font-size:clamp(1rem,1.4vw,1.1rem);
  line-height:1.85;
}

.page-products .pd-hero__actions{margin-top:1.6rem;}

.page-products .pd-hero__facts{
  padding:1.5rem;
  border-color:var(--pd-line);
  background:linear-gradient(160deg,var(--gc-card-2),var(--gc-card));
}

.page-products .pd-hero__facts .gc-card__num{
  font-size:clamp(1.6rem,3.4vw,2.2rem);
  color:var(--gc-amber);
  letter-spacing:.04em;
  margin:0;
}

.page-products .pd-hero__facts .gc-card__title{
  margin:.6rem 0 0;
  font-size:1.05rem;
  color:var(--gc-white);
}

.page-products .pd-hero__facts .gc-card__body{
  margin:.6rem 0 0;
  color:var(--gc-mist);
  line-height:1.8;
  font-size:.95rem;
}

/* ---------- 规模数据条 ---------- */
.page-products .pd-stats{
  list-style:none;
  margin:clamp(1.75rem,4vw,2.75rem) 0 0;
  padding:0;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;
  background:var(--pd-line);
  border:1px solid var(--pd-line);
  border-radius:var(--gc-radius);
  overflow:hidden;
}

.page-products .pd-stats__item{
  background:var(--gc-ink-2);
  padding:1rem 1.1rem;
  display:flex;
  flex-direction:column;
  gap:.35rem;
}

.page-products .pd-stats__num{
  font-size:clamp(1.4rem,3vw,1.9rem);
  line-height:1;
  background:var(--gc-grad-gold);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.page-products .pd-stats__label{
  font-size:.82rem;
  color:var(--gc-mist);
  letter-spacing:.02em;
}

/* ---------- 锚点索引 ---------- */
.page-products .pd-jump{
  margin-top:clamp(1.25rem,3vw,2rem);
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
}

.page-products .pd-jump__link{
  font-family:var(--gc-font-mono);
  font-size:.78rem;
  letter-spacing:.03em;
  text-decoration:none;
  color:var(--gc-sand);
  padding:.5rem .85rem;
  border:1px solid var(--pd-line);
  border-radius:999px;
  background:rgba(255,255,255,.02);
  transition:border-color .25s var(--gc-ease),color .25s var(--gc-ease),background .25s var(--gc-ease);
}

.page-products .pd-jump__link:hover,
.page-products .pd-jump__link:focus-visible{
  border-color:var(--gc-amber);
  color:var(--gc-white);
  background:var(--pd-amber-soft);
}

/* ---------- 图片框 ---------- */
.page-products .pd-figure{margin:clamp(1.5rem,4vw,2.5rem) 0;}

.page-products .pd-media{
  border:1px solid var(--pd-line);
  border-radius:var(--gc-radius);
  background:var(--gc-card);
  overflow:hidden;
  box-shadow:var(--gc-shadow-soft);
}

.page-products .pd-media--wide{aspect-ratio:14 / 9;}
.page-products .pd-media--mid{aspect-ratio:10 / 7;}
.page-products .pd-media--card{aspect-ratio:3 / 2;}
.page-products .pd-media--index{aspect-ratio:3 / 2;}
.page-products .pd-media--path{aspect-ratio:5 / 3;}

.page-products .pd-media img{
  display:block;
  width:100%;
  height:100%;
  max-width:100%;
  object-fit:cover;
}

/* ---------- 玩法主题簇 ---------- */
.page-products .pd-cluster-grid{
  margin-top:clamp(1.5rem,4vw,2.5rem);
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(.9rem,2vw,1.25rem);
}

.page-products .pd-cluster{
  padding:1.4rem;
  border-color:var(--pd-line-soft);
  background:linear-gradient(155deg,var(--gc-card-2),var(--gc-card));
  transition:border-color .3s var(--gc-ease),box-shadow .3s var(--gc-ease);
}

.page-products .pd-cluster:hover,
.page-products .pd-cluster:focus-within{
  border-color:var(--pd-line);
  box-shadow:var(--gc-shadow-gold);
}

.page-products .pd-cluster__num{
  margin:0;
  font-size:.76rem;
  letter-spacing:.08em;
  color:var(--gc-copper);
  text-transform:uppercase;
}

.page-products .pd-cluster__name{
  margin:.5rem 0 0;
  font-family:var(--gc-font-display);
  font-size:clamp(1.35rem,2.6vw,1.6rem);
  color:var(--gc-white);
  letter-spacing:.02em;
}

.page-products .pd-cluster__body{
  margin:.6rem 0 0;
  color:var(--gc-mist);
  line-height:1.8;
  font-size:.95rem;
}

.page-products .pd-cluster__meter{
  margin-top:1rem;
  height:4px;
  border-radius:999px;
  background:rgba(246,231,193,.12);
  overflow:hidden;
}

.page-products .pd-cluster__meter i{
  display:block;
  height:100%;
  border-radius:999px;
  background:var(--gc-grad-gold);
}

.page-products .pd-cluster:nth-child(1) .pd-cluster__meter i{width:78%;}
.page-products .pd-cluster:nth-child(2) .pd-cluster__meter i{width:89%;}
.page-products .pd-cluster:nth-child(3) .pd-cluster__meter i{width:67%;}
.page-products .pd-cluster:nth-child(4) .pd-cluster__meter i{width:100%;}
.page-products .pd-cluster:nth-child(5) .pd-cluster__meter i{width:78%;}
.page-products .pd-cluster:nth-child(6) .pd-cluster__meter i{width:67%;}

/* ---------- 表格 ---------- */
.page-products .pd-tablewrap{
  margin-top:clamp(1.25rem,3vw,2rem);
  border:1px solid var(--pd-line);
  border-radius:var(--gc-radius);
  background:var(--gc-card);
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}

.page-products .pd-table{
  width:100%;
  min-width:46rem;
  border-collapse:collapse;
  font-size:.93rem;
  color:var(--gc-sand);
}

.page-products .pd-table thead th{
  position:sticky;
  top:0;
  z-index:1;
  text-align:left;
  font-family:var(--gc-font-mono);
  font-size:.76rem;
  letter-spacing:.08em;
  font-weight:500;
  color:var(--gc-amber);
  background:var(--gc-ink-2);
  padding:.9rem 1rem;
  border-bottom:1px solid var(--pd-line);
  white-space:nowrap;
}

.page-products .pd-table tbody th{
  text-align:left;
  font-weight:600;
  color:var(--gc-white);
  padding:.85rem 1rem;
  border-bottom:1px solid var(--pd-line-soft);
  white-space:nowrap;
}

.page-products .pd-table tbody td{
  padding:.85rem 1rem;
  border-bottom:1px solid var(--pd-line-soft);
  color:var(--gc-mist);
  white-space:nowrap;
}

.page-products .pd-table tbody tr:last-child th,
.page-products .pd-table tbody tr:last-child td{border-bottom:0;}

.page-products .pd-table tbody tr{
  transition:background .22s var(--gc-ease);
}

.page-products .pd-table tbody tr:hover,
.page-products .pd-table tbody tr:focus-within{
  background:var(--pd-amber-soft);
}

.page-products .pd-table tbody tr:hover th,
.page-products .pd-table tbody tr:focus-within th{
  color:var(--gc-amber);
}

.page-products .pd-table--versions tbody tr:first-child th{
  color:var(--gc-amber);
}

.page-products .pd-table--versions tbody tr:first-child{
  background:linear-gradient(90deg,rgba(63,224,208,.08),transparent 60%);
}

.page-products .pd-note{
  margin-top:clamp(1rem,2.5vw,1.5rem);
  line-height:1.85;
  font-size:.92rem;
}

.page-products .pd-note a{
  color:var(--gc-amber);
  text-decoration:none;
  border-bottom:1px solid var(--pd-line);
}

.page-products .pd-note a:hover,
.page-products .pd-note a:focus-visible{
  border-bottom-color:var(--gc-amber);
}

/* ---------- 账户推荐 ---------- */
.page-products .pd-account-grid{
  margin-top:clamp(1.25rem,3vw,2rem);
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(.9rem,2vw,1.25rem);
}

.page-products .pd-account{
  padding:1.5rem;
  border-color:var(--pd-line-soft);
  background:linear-gradient(165deg,var(--gc-card-2),var(--gc-card));
}

.page-products .pd-account__tag{
  margin:0;
  display:inline-block;
  font-size:.74rem;
  letter-spacing:.1em;
  color:var(--gc-cyan);
  border:1px solid var(--pd-cyan-soft);
  border-radius:999px;
  padding:.3rem .7rem;
}

.page-products .pd-account__title{
  margin:.9rem 0 0;
  font-family:var(--gc-font-display);
  font-size:clamp(1.2rem,2.4vw,1.4rem);
  color:var(--gc-white);
}

.page-products .pd-account__body{
  margin:.6rem 0 0;
  color:var(--gc-mist);
  line-height:1.85;
  font-size:.95rem;
}

.page-products .pd-account__path{
  margin:1rem 0 0;
  padding-top:.85rem;
  border-top:1px dashed var(--pd-line-soft);
  font-size:.85rem;
  color:var(--gc-sand);
  line-height:1.7;
}

.page-products .pd-account__path .gc-mono{
  color:var(--gc-amber);
  margin-right:.5rem;
  font-size:.78rem;
  letter-spacing:.06em;
}

/* ---------- 版本索引：功能分类标签 ---------- */
.page-products .pd-subhead{
  margin:clamp(1.75rem,4vw,2.5rem) 0 0;
  font-family:var(--gc-font-display);
  font-size:clamp(1.15rem,2.4vw,1.35rem);
  color:var(--gc-white);
}

.page-products .pd-tags{
  list-style:none;
  margin:1rem 0 0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
}

.page-products .pd-tag{
  font-family:var(--gc-font-mono);
  font-size:.76rem;
  letter-spacing:.02em;
  color:var(--gc-mist);
  padding:.4rem .75rem;
  border:1px solid var(--pd-line-soft);
  border-radius:8px;
  background:rgba(255,255,255,.02);
  transition:color .22s var(--gc-ease),border-color .22s var(--gc-ease);
}

.page-products .pd-tag:hover{
  color:var(--gc-sand);
  border-color:var(--pd-line);
}

/* ---------- 体验路径 ---------- */
.page-products .pd-steps{
  list-style:none;
  margin:clamp(1.25rem,3vw,2rem) 0 0;
  padding:0;
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(.9rem,2vw,1.25rem);
  counter-reset:none;
}

.page-products .pd-step{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:1rem;
  padding:1.25rem 1.35rem;
  border:1px solid var(--pd-line-soft);
  border-left:2px solid var(--gc-copper);
  border-radius:var(--gc-radius);
  background:linear-gradient(120deg,var(--gc-card-2),var(--gc-card));
  transition:border-left-color .3s var(--gc-ease),box-shadow .3s var(--gc-ease);
}

.page-products .pd-step:hover{
  border-left-color:var(--gc-amber);
  box-shadow:var(--gc-shadow-soft);
}

.page-products .pd-step__num{
  font-size:1.05rem;
  color:var(--gc-amber);
  letter-spacing:.08em;
  line-height:1.9;
}

.page-products .pd-step__title{
  margin:0;
  font-family:var(--gc-font-display);
  font-size:1.2rem;
  color:var(--gc-white);
}

.page-products .pd-step__body p{
  margin:.55rem 0 0;
  color:var(--gc-mist);
  line-height:1.85;
  font-size:.95rem;
}

.page-products .pd-step__body .gc-btn{margin-top:1rem;}

.page-products .pd-outro{
  margin-top:clamp(1.5rem,4vw,2.5rem);
  padding:clamp(1.4rem,3.5vw,2.2rem);
  border:1px solid var(--pd-line);
  border-radius:var(--gc-radius-lg);
  background:var(--gc-grad-sheen),var(--gc-ink-2);
  display:flex;
  flex-direction:column;
  gap:1.25rem;
  align-items:flex-start;
}

.page-products .pd-outro__text{
  margin:0;
  max-width:62ch;
  color:var(--gc-sand);
  line-height:1.9;
  font-size:1rem;
}

.page-products .pd-outro__text a{
  color:var(--gc-amber);
  text-decoration:none;
  border-bottom:1px solid var(--pd-line);
}

.page-products .pd-outro__text a:hover,
.page-products .pd-outro__text a:focus-visible{border-bottom-color:var(--gc-amber);}

/* ---------- 响应式 ---------- */
@media (min-width:720px){
  .page-products .pd-stats{grid-template-columns:repeat(3,minmax(0,1fr));}
  .page-products .pd-cluster-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .page-products .pd-account-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .page-products .pd-account:nth-child(3){grid-column:1 / -1;}
  .page-products .pd-outro{flex-direction:row;align-items:center;justify-content:space-between;}
}

@media (min-width:1040px){
  .page-products .pd-hero__grid{
    grid-template-columns:minmax(0,1.35fr) minmax(0,.85fr);
    align-items:end;
  }
  .page-products .pd-stats{grid-template-columns:repeat(6,minmax(0,1fr));}
  .page-products .pd-cluster-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
  .page-products .pd-cluster:nth-child(2),
  .page-products .pd-cluster:nth-child(5){transform:translateY(22px);}
  .page-products .pd-account-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
  .page-products .pd-account:nth-child(3){grid-column:auto;}
  .page-products .pd-account:nth-child(2){transform:translateY(20px);}
  .page-products .pd-steps{grid-template-columns:repeat(2,minmax(0,1fr));}
}

@media (prefers-reduced-motion:reduce){
  .page-products .pd-cluster:nth-child(2),
  .page-products .pd-cluster:nth-child(5),
  .page-products .pd-account:nth-child(2){transform:none;}
  .page-products .pd-cluster,
  .page-products .pd-step,
  .page-products .pd-jump__link{transition:none;}
}
