/* 解决方案页专属样式 */
.page-products{
  --products-ease:cubic-bezier(0.22,1,0.36,1);
  --products-card-grad:linear-gradient(135deg,rgba(19,26,58,0.92) 0%,rgba(27,35,64,0.72) 100%);
  position:relative;
}

.page-products .products-hero{
  position:relative;
  padding:clamp(36px,6vw,72px) 0 clamp(44px,6vw,80px);
  background:
    radial-gradient(circle at 84% 16%,rgba(155,77,255,0.2),transparent 34%),
    radial-gradient(circle at 8% 84%,rgba(255,106,0,0.16),transparent 32%),
    var(--c-deep);
}

.page-products .products-hero::before{
  content:"";
  position:absolute;
  top:-12%;
  right:-6%;
  width:46%;
  height:76%;
  background:linear-gradient(105deg,transparent 0 8%,rgba(255,106,0,0.16) 8% 22%,transparent 22% 30%,rgba(155,77,255,0.15) 30% 42%,transparent 42%);
  transform:skewX(-12deg);
  pointer-events:none;
}

.page-products .products-hero::after{
  content:"";
  position:absolute;
  left:-10%;
  bottom:0;
  width:70%;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--c-orange),var(--c-purple),var(--c-cyan),transparent);
  opacity:.7;
}

.page-products .products-hero__layout{
  display:grid;
  gap:clamp(26px,4vw,48px);
  align-items:end;
  position:relative;
  z-index:1;
}

.page-products .products-hero__copy{
  min-width:0;
}

.page-products .products-hero__eyebrow{
  margin:0 0 14px;
  color:var(--c-orange-bright);
  font-family:var(--font-body);
  font-weight:700;
  font-size:14px;
  letter-spacing:.16em;
}

.page-products .products-hero__heading{
  margin:0 0 20px;
  font-family:var(--font-headline);
  font-size:clamp(46px,8vw,92px);
  line-height:.96;
  letter-spacing:-.02em;
  color:var(--c-text);
}

.page-products .products-hero__heading-mark{
  display:block;
  margin-top:10px;
  font-size:.42em;
  color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.32);
}

.page-products .products-hero__lead{
  margin:0 0 22px;
  color:var(--c-text-dim);
  font-family:var(--font-body);
  font-size:17px;
  line-height:1.78;
  max-width:37em;
}

.page-products .products-hero__note{
  margin:0;
  color:rgba(0,255,170,.8);
  font-family:var(--font-mono);
  font-size:13px;
  letter-spacing:.04em;
}

.page-products .products-hero__stats{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}

.page-products .products-hero__stat{
  position:relative;
  min-height:130px;
  padding:22px 22px 18px;
  background:linear-gradient(135deg,rgba(27,35,64,.92),rgba(19,26,58,.74));
  border:1px solid rgba(255,255,255,.08);
  border-radius:var(--radius-card);
  box-shadow:var(--shadow-float);
  overflow:hidden;
}

.page-products .products-hero__stat::after{
  content:"";
  position:absolute;
  left:-18%;
  bottom:-46%;
  width:72%;
  height:82%;
  background:rgba(255,106,0,.12);
  transform:skewX(-16deg);
  pointer-events:none;
}

.page-products .products-hero__stat:nth-child(2)::after{
  background:rgba(155,77,255,.18);
}

.page-products .products-hero__stat:nth-child(3)::after{
  background:rgba(0,255,170,.09);
  left:auto;
  right:-18%;
}

.page-products .products-hero__stat:nth-child(4)::after{
  background:rgba(255,106,0,.08);
  left:auto;
  right:-12%;
}

.page-products .products-hero__stat-num{
  display:block;
  font-family:var(--font-mono);
  font-size:clamp(30px,4vw,48px);
  font-weight:700;
  line-height:1.1;
  margin:0 0 8px;
  color:var(--c-text);
}

.page-products .products-hero__stat:nth-child(1) .products-hero__stat-num{
  color:var(--c-orange-bright);
}

.page-products .products-hero__stat:nth-child(4) .products-hero__stat-num{
  color:var(--c-cyan);
}

.page-products .products-hero__stat-label{
  font-size:13px;
  color:var(--c-text-dim);
  letter-spacing:.06em;
}

.page-products .products-hero__deco{
  position:absolute;
  top:16%;
  right:-46px;
  width:240px;
  height:480px;
  border-radius:24px;
  overflow:hidden;
  transform:rotate(7deg);
  box-shadow:var(--shadow-float);
  opacity:.52;
  display:none;
  z-index:0;
  pointer-events:none;
}

.page-products .products-hero__deco img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  filter:saturate(1.08) brightness(.92);
}

/* 功能卡片墙 */
.page-products .products-cluster{
  position:relative;
  padding-top:clamp(48px,7vw,88px);
}

.page-products .products-cluster__head{
  max-width:780px;
  margin-bottom:clamp(28px,4vw,48px);
}

.page-products .products-cluster__eyebrow{
  margin:0 0 12px;
  color:var(--c-purple);
  font-size:13px;
  font-weight:700;
  letter-spacing:.16em;
}

.page-products .products-cluster__title{
  margin:0 0 14px;
  font-family:var(--font-headline);
  font-size:clamp(28px,4.6vw,50px);
  line-height:1.1;
  color:var(--c-text);
}

.page-products .products-cluster__lead{
  margin:0;
  color:var(--c-text-dim);
  font-size:16px;
  line-height:1.72;
}

.page-products .products-grid{
  display:grid;
  gap:clamp(16px,2.4vw,28px);
  align-items:stretch;
}

.page-products .products-card{
  position:relative;
  min-width:0;
  overflow:hidden;
  border-radius:var(--radius-card);
  background:var(--products-card-grad);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 10px 32px rgba(0,0,0,.24);
  transition:transform var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast) var(--ease-out);
}

.page-products .products-card:hover{
  transform:translateY(-3px);
  box-shadow:var(--shadow-float);
}

.page-products .products-card::before{
  content:"";
  position:absolute;
  top:-1px;
  left:0;
  width:4px;
  height:76px;
  background:linear-gradient(to bottom,var(--c-orange),transparent);
  border-radius:0 0 4px 4px;
  z-index:2;
}

.page-products .products-card--web::before{
  height:54px;
  background:linear-gradient(to bottom,var(--c-purple),transparent);
}

.page-products .products-card--fave::before{
  height:54px;
  background:linear-gradient(to bottom,var(--c-cyan),transparent);
}

.page-products .products-card--shots::before{
  height:66px;
  background:linear-gradient(to bottom,var(--c-orange),var(--c-purple),transparent);
}

.page-products .products-card__inner{
  padding:clamp(22px,3vw,36px);
  height:100%;
  display:flex;
  flex-direction:column;
}

.page-products .products-card__inner--row{
  gap:20px;
}

.page-products .products-card__main{
  min-width:0;
}

.page-products .products-card__header{
  display:flex;
  flex-direction:column;
  gap:10px;
  align-items:flex-start;
}

.page-products .products-card__badge-wrap{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:2px;
}

.page-products .products-card__badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:46px;
  height:46px;
  border-radius:14px;
  color:var(--c-orange-bright);
  background:linear-gradient(135deg,rgba(255,106,0,.18),rgba(155,77,255,.12));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.07);
}

.page-products .products-card--web .products-card__badge{
  color:var(--c-purple);
}

.page-products .products-card--fave .products-card__badge{
  color:var(--c-cyan);
}

.page-products .products-card--shots .products-card__badge{
  color:var(--c-orange-bright);
}

.page-products .products-card__title{
  margin:6px 0 0;
  font-family:var(--font-headline);
  font-size:clamp(22px,3vw,30px);
  line-height:1.15;
  color:var(--c-text);
}

.page-products .products-card__lead{
  margin:0 0 18px;
  color:var(--c-text-dim);
  font-size:15px;
  line-height:1.74;
}

.page-products .products-card__bigbody{
  display:grid;
  gap:clamp(20px,3vw,32px);
  margin-top:auto;
  align-items:center;
}

.page-products .products-phone{
  position:relative;
  width:min(220px,100%);
  margin:0 auto;
}

.page-products .products-phone::before{
  content:"";
  display:block;
  padding-top:200%;
  border-radius:24px;
  background:linear-gradient(160deg,#2c3760,#141a38 62%);
  box-shadow:0 24px 54px rgba(0,0,0,.45),inset 0 0 0 1px rgba(255,255,255,.08);
}

.page-products .products-phone__screen{
  position:absolute;
  inset:12px;
  overflow:hidden;
  border-radius:16px;
  background:#0b1026;
}

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

.page-products .products-cats__title{
  margin:0 0 14px;
  font-family:var(--font-headline);
  font-size:16px;
  color:var(--c-text);
  letter-spacing:.02em;
}

.page-products .products-cats__list{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  list-style:none;
  margin:0 0 16px;
  padding:0;
}

.page-products .products-cats__item{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:9px 16px;
  border-radius:999px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.1);
  font-size:14px;
  font-weight:600;
  color:var(--c-text);
  transition:border-color var(--dur-fast) var(--products-ease),transform var(--dur-fast) var(--products-ease);
}

.page-products .products-cats__item:hover{
  transform:translateY(-2px);
}

.page-products .products-cats__dot{
  width:8px;
  height:8px;
  border-radius:5px;
  background:currentColor;
  flex:0 0 auto;
}

.page-products .products-cats__item:nth-child(1){
  border-color:rgba(255,138,0,.46);
}

.page-products .products-cats__item:nth-child(1) .products-cats__dot{
  background:var(--c-orange-bright);
}

.page-products .products-cats__item:nth-child(2){
  border-color:rgba(255,106,0,.48);
}

.page-products .products-cats__item:nth-child(2) .products-cats__dot{
  background:var(--c-orange);
}

.page-products .products-cats__item:nth-child(3){
  border-color:rgba(155,77,255,.52);
}

.page-products .products-cats__item:nth-child(3) .products-cats__dot{
  background:var(--c-purple);
}

.page-products .products-cats__item:nth-child(4){
  border-color:rgba(0,255,170,.42);
}

.page-products .products-cats__item:nth-child(4) .products-cats__dot{
  background:var(--c-cyan);
}

.page-products .products-cats__item:nth-child(5){
  border-color:rgba(255,255,255,.3);
}

.page-products .products-cats__item:nth-child(5) .products-cats__dot{
  background:var(--c-text);
}

.page-products .products-cats__item:nth-child(6){
  border-color:rgba(155,77,255,.4);
}

.page-products .products-cats__item:nth-child(6) .products-cats__dot{
  background:#c78aff;
}

.page-products .products-cats__more{
  display:inline-flex;
  align-items:center;
  font-size:13px;
  font-weight:700;
  color:var(--c-text-dim);
  letter-spacing:.04em;
}

.page-products .products-cats__meta{
  margin:14px 0 0;
  color:var(--c-text-dim);
  font-size:13px;
  line-height:1.66;
  border-top:1px dashed rgba(255,255,255,.12);
  padding-top:14px;
}

/* Web 检索区 */
.page-products .products-search{
  margin:20px 0 18px;
  padding:16px;
  border-radius:var(--radius-panel);
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
}

.page-products .products-search__bar{
  display:flex;
  align-items:center;
  gap:10px;
  padding:11px 14px;
  background:rgba(11,16,38,.72);
  border-radius:12px;
  color:var(--c-text-dim);
  font-size:14px;
  border:1px solid rgba(155,77,255,.36);
  box-shadow:0 0 18px rgba(155,77,255,.1);
}

.page-products .products-search__bar svg{
  flex:0 0 auto;
  color:var(--c-purple);
}

.page-products .products-search__results{
  list-style:none;
  margin:12px 0 0;
  padding:0;
  display:grid;
  gap:8px;
}

.page-products .products-search__results li{
  display:grid;
  grid-template-columns:1fr auto;
  gap:4px 10px;
  padding:10px 4px;
  border-bottom:1px solid rgba(255,255,255,.06);
}

.page-products .products-search__results li strong{
  font-size:13px;
  color:var(--c-text);
}

.page-products .products-search__results li span{
  font-size:12px;
  color:var(--c-text-dim);
}

.page-products .products-search__results li em{
  grid-column:1 / -1;
  font-style:normal;
  font-size:11px;
  color:var(--c-cyan);
  letter-spacing:.04em;
}

/* 卡片通用媒体 */
.page-products .products-card__media{
  position:relative;
  overflow:hidden;
  border-radius:var(--radius-panel);
  border:1px solid rgba(255,255,255,.08);
  margin:16px 0 0;
}

.page-products .products-card__media img{
  display:block;
  width:100%;
  max-width:100%;
  height:auto;
  object-fit:cover;
  transition:transform .5s var(--products-ease);
}

.page-products .products-card:hover .products-card__media img{
  transform:scale(1.03);
}

/* 关注与收藏 */
.page-products .products-fave{
  margin:22px 0 0;
}

.page-products .products-fave__demo{
  display:grid;
  gap:10px;
}

.page-products .products-fave__row{
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px 14px;
  border-radius:12px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.07);
}

.page-products .products-fave__icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:26px;
  height:26px;
  border-radius:8px;
  background:rgba(0,255,170,.14);
  color:var(--c-cyan);
  font-size:16px;
  flex:0 0 auto;
}

.page-products .products-fave__row strong{
  display:block;
  color:var(--c-text);
  font-size:13px;
}

.page-products .products-fave__row em{
  display:block;
  font-style:normal;
  color:var(--c-text-dim);
  font-size:12px;
}

.page-products .products-fave__btn{
  margin-top:14px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 16px;
  border-radius:999px;
  border:1px solid rgba(0,255,170,.5);
  background:rgba(0,255,170,.12);
  color:var(--c-cyan);
  font-family:var(--font-body);
  font-size:14px;
  font-weight:700;
  cursor:pointer;
  transition:transform var(--dur-fast) var(--products-ease),box-shadow var(--dur-fast) var(--products-ease);
}

.page-products .products-fave__btn:hover,
.page-products .products-fave__btn:focus-visible{
  transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(0,255,170,.2);
  outline:none;
}

.page-products .products-fave__btn:active{
  transform:translateY(0);
}

/* 射门统计 */
.page-products .products-rounds{
  margin-top:26px;
  display:flex;
  align-items:center;
  gap:20px;
}

.page-products .products-rounds__number{
  font-family:var(--font-mono);
  font-size:64px;
  line-height:.9;
  font-weight:700;
  color:var(--c-orange-bright);
  text-shadow:0 0 36px rgba(255,106,0,.42);
  flex:0 0 auto;
}

.page-products .products-rounds__meta{
  flex:1;
  min-width:0;
}

.page-products .products-rounds__meta strong{
  display:block;
  font-size:20px;
  color:var(--c-text);
  margin:0 0 4px;
}

.page-products .products-rounds__meta > span{
  color:var(--c-text-dim);
  font-size:13px;
  letter-spacing:.04em;
}

.page-products .products-rounds__track{
  margin-top:14px;
  height:8px;
  border-radius:8px;
  background:rgba(255,255,255,.08);
  position:relative;
  overflow:hidden;
}

.page-products .products-rounds__fill{
  position:absolute;
  left:0;
  top:0;
  height:100%;
  width:100%;
  border-radius:8px;
  background:linear-gradient(90deg,var(--c-orange),var(--c-purple),var(--c-cyan));
}

/* 跨版本对照 */
.page-products .products-compare{
  margin-top:clamp(56px,8vw,96px);
  padding:clamp(40px,6vw,72px) 0;
  position:relative;
  background:
    radial-gradient(circle at 8% 20%,rgba(155,77,255,.14),transparent 30%),
    radial-gradient(circle at 90% 80%,rgba(255,106,0,.1),transparent 32%),
    var(--c-deep);
}

.page-products .products-compare::before{
  content:"";
  position:absolute;
  inset:0;
  background:repeating-linear-gradient(-45deg,rgba(255,255,255,.015) 0 8px,transparent 8px 16px);
  pointer-events:none;
}

.page-products .products-compare__head{
  max-width:700px;
  margin-bottom:clamp(28px,4vw,48px);
  position:relative;
  z-index:1;
}

.page-products .products-compare__eyebrow{
  margin:0 0 12px;
  color:var(--c-cyan);
  font-size:13px;
  font-weight:700;
  letter-spacing:.16em;
}

.page-products .products-compare__title{
  font-family:var(--font-headline);
  font-size:clamp(28px,4.4vw,48px);
  line-height:1.12;
  margin:0 0 14px;
  color:var(--c-text);
}

.page-products .products-compare__lead{
  color:var(--c-text-dim);
  font-size:15px;
  line-height:1.72;
  margin:0;
}

.page-products .products-compare__stage{
  display:grid;
  gap:18px;
  position:relative;
  z-index:1;
}

.page-products .products-compare__panel{
  padding:clamp(24px,3vw,36px);
  border-radius:var(--radius-card);
  background:linear-gradient(135deg,rgba(27,35,64,.92),rgba(19,26,58,.78));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:var(--shadow-float);
}

.page-products .products-compare__label{
  display:inline-flex;
  padding:5px 12px;
  border-radius:999px;
  background:rgba(155,77,255,.18);
  color:#d7b3ff;
  font-size:12px;
  font-weight:700;
  letter-spacing:.08em;
  margin-bottom:14px;
}

.page-products .products-compare__panel--mobile .products-compare__label{
  background:rgba(0,255,170,.12);
  color:var(--c-cyan);
}

.page-products .products-compare__panel h3{
  margin:0 0 10px;
  font-family:var(--font-headline);
  font-size:22px;
  color:var(--c-text);
}

.page-products .products-compare__panel p{
  margin:0 0 16px;
  color:var(--c-text-dim);
  font-size:14px;
  line-height:1.72;
}

.page-products .products-compare__panel ul{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:9px;
}

.page-products .products-compare__panel li{
  position:relative;
  padding-left:20px;
  color:rgba(245,247,250,.85);
  font-size:14px;
  line-height:1.5;
}

.page-products .products-compare__panel li::before{
  content:"";
  position:absolute;
  left:2px;
  top:8px;
  width:8px;
  height:8px;
  border-radius:4px;
  background:linear-gradient(135deg,var(--c-orange),var(--c-purple));
}

.page-products .products-compare__panel--mobile li::before{
  background:linear-gradient(135deg,var(--c-cyan),var(--c-purple));
}

.page-products .products-compare__sync{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:18px 10px;
}

.page-products .products-compare__line{
  position:relative;
  width:100%;
  max-width:120px;
  height:2px;
  background:linear-gradient(90deg,rgba(255,106,0,.6),rgba(155,77,255,.6),rgba(0,255,170,.6));
}

.page-products .products-compare__line::before,
.page-products .products-compare__line::after{
  content:"";
  position:absolute;
  top:-4px;
  width:10px;
  height:10px;
  border-radius:5px;
}

.page-products .products-compare__line::before{
  left:-2px;
  background:var(--c-orange);
  box-shadow:0 0 14px rgba(255,106,0,.5);
}

.page-products .products-compare__line::after{
  right:-2px;
  background:var(--c-cyan);
  box-shadow:0 0 14px rgba(0,255,170,.5);
}

.page-products .products-compare__orb{
  width:46px;
  height:46px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(155,77,255,.42),rgba(255,106,0,.2));
  box-shadow:0 0 24px rgba(155,77,255,.5);
  animation:products-pulse 2.4s var(--ease-in-out) infinite;
}

.page-products .products-compare__caption{
  font-family:var(--font-mono);
  font-size:12px;
  color:var(--c-text-dim);
  letter-spacing:.1em;
}

@keyframes products-pulse{
  0%,100%{opacity:.72;transform:scale(.94);}
  50%{opacity:1;transform:scale(1.08);}
}

/* 底部行动区 */
.page-products .products-cta{
  padding:clamp(48px,7vw,80px) 0;
}

.page-products .products-cta__inner{
  position:relative;
  overflow:hidden;
  border-radius:28px;
  padding:clamp(30px,5vw,56px);
  background:linear-gradient(120deg,rgba(155,77,255,.2),rgba(255,106,0,.15) 70%);
  border:1px solid rgba(255,255,255,.1);
}

.page-products .products-cta__inner::before{
  content:"";
  position:absolute;
  right:-6%;
  top:-14%;
  width:42%;
  height:120%;
  background:linear-gradient(115deg,transparent,rgba(0,255,170,.1),transparent);
  transform:skewX(-18deg);
  pointer-events:none;
}

.page-products .products-cta__eyebrow{
  position:relative;
  margin:0 0 8px;
  color:var(--c-cyan);
  font-size:13px;
  font-weight:700;
  letter-spacing:.12em;
}

.page-products .products-cta__title{
  position:relative;
  margin:0 0 12px;
  font-family:var(--font-headline);
  font-size:clamp(26px,4vw,42px);
  color:var(--c-text);
}

.page-products .products-cta__lead{
  position:relative;
  margin:0 0 26px;
  color:var(--c-text-dim);
  font-size:15px;
  line-height:1.72;
  max-width:46em;
}

.page-products .products-cta__actions{
  position:relative;
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

.page-products .products-cta .btn--primary{
  background:linear-gradient(135deg,var(--c-orange),#ff5200);
  border-color:transparent;
  color:#fff;
}

/* 响应式 */
@media (min-width:500px){
  .page-products .products-card__bigbody{
    grid-template-columns:minmax(220px,.8fr) 1fr;
  }
}

@media (min-width:820px){
  .page-products .products-compare__stage{
    grid-template-columns:1fr auto 1fr;
    align-items:center;
  }

  .page-products .products-compare__sync{
    flex-direction:column;
    padding:0 10px;
  }

  .page-products .products-compare__orb{
    display:none;
  }
}

@media (min-width:900px){
  .page-products .products-grid{
    grid-template-columns:repeat(12,minmax(0,1fr));
  }

  .page-products .products-card--mobile{
    grid-column:1 / 8;
    grid-row:1 / 3;
  }

  .page-products .products-card--web{
    grid-column:8 / 13;
    grid-row:1;
  }

  .page-products .products-card--fave{
    grid-column:8 / 13;
    grid-row:2;
  }

  .page-products .products-card--shots{
    grid-column:1 / 13;
    grid-row:3;
  }

  .page-products .products-card--shots .products-card__inner--row{
    display:grid;
    grid-template-columns:1.1fr .9fr;
    align-items:center;
    gap:36px;
  }

  .page-products .products-card--shots .products-card__media{
    margin:0;
  }
}

@media (min-width:960px){
  .page-products .products-hero__layout{
    grid-template-columns:1.15fr .85fr;
  }
}

@media (min-width:1280px){
  .page-products .products-hero__deco{
    display:block;
  }
}
