/* ============================================================
   Products Series / 产品系列（products.html Section 3）
   ============================================================ */

.pd-series {
  position: relative;
  background: var(--color-white);
  padding: 110px 0 0;           /* 底部 0：水印绝对定位贴底（贴 CTA 上边） */
  overflow: hidden;
}

.pd-series__inner {
  max-width: 1540px;
  margin: 0 auto;
  padding: 0 var(--container-padding) 265px;   /* 底部留白给水印：卡片与水印间距 120px（265-145水印高） */
}

/* --- 标题 --- */
.pd-series__title {
  font-family: var(--font-primary);
  font-weight: 800;
  font-size: 76px;
  line-height: 90px;
  letter-spacing: -1.52px;
  text-align: center;
  color: var(--color-primary);
  margin: 0 0 90px;
}

/* --- 卡片网格 --- */
.pd-series__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 60px 40px;
}

/* 卡片：双态实现（与 index.html products__card 一致）
   initial 默认态（白底+图），hover 态透明淡入（#F2F6F5 底+图+绿圆图标） */
.pd-series__card {
  position: relative;
  display: block;                    /* a 标签需 block 才能应用高度 */
  text-decoration: none;
  height: 303px;
  border-radius: 8px;
  overflow: hidden;
  container-type: inline-size;
  cursor: pointer;
}

/* 默认态：#F7F8FA 底 + 各产品独立线稿图（Figma product#section pd-001~pd-008）
   背景色块保留，线稿图在 ::before 上（hover 时仅图片淡出） */
.pd-series__card-initial {
  position: absolute;
  inset: 0;
  background-color: #F7F8FA;
}

/* 线稿图：图片按设计稿节点约束：85x168 @ 卡片(344,102) → size 17.47%x55.38%、pos 85.64%/75.38% */
.pd-series__card-initial::before {
  content: "";
  position: absolute;
  inset: 0;
  background-repeat: no-repeat;
  background-size: 17.47% 55.38%;
  background-position: 85.64% 75.38%;
  transition: opacity var(--duration-base) var(--ease-standard);
}

.pd-series__card:nth-child(1) .pd-series__card-initial::before { background-image: url(../images/pd-001.png); }
.pd-series__card:nth-child(2) .pd-series__card-initial::before { background-image: url(../images/pd-002.png); }
.pd-series__card:nth-child(3) .pd-series__card-initial::before { background-image: url(../images/pd-003.png); }
.pd-series__card:nth-child(4) .pd-series__card-initial::before { background-image: url(../images/pd-004.png); }
.pd-series__card:nth-child(5) .pd-series__card-initial::before { background-image: url(../images/pd-005.png); }
.pd-series__card:nth-child(6) .pd-series__card-initial::before { background-image: url(../images/pd-006.png); }
.pd-series__card:nth-child(7) .pd-series__card-initial::before { background-image: url(../images/pd-007.png); }
.pd-series__card:nth-child(8) .pd-series__card-initial::before { background-image: url(../images/pd-008.png); }

/* hover 态：渐变底 + 各产品独立图 + 圆形图标，默认透明，hover 淡入
   渐变按设计稿 pd-001-hover：linear-gradient(-45deg, rgba(217,231,240,1), rgba(242,246,245,0)) */
.pd-series__card-hover {
  position: absolute;
  inset: 0;
  background: linear-gradient(-45deg, rgba(217, 231, 240, 1) 0%, rgba(242, 246, 245, 0) 100%);
  opacity: 0;
  transition: opacity var(--duration-base) var(--ease-standard);
}

.pd-series__card-hover-bg {
  position: absolute;
  inset: 0;
  background-repeat: no-repeat;
  /* hover 图按设计稿节点约束：100x200 @ 卡片(336,60) → size 20.55%x65.93%、pos 86.90%/58.06% */
  background-size: 20.55% 65.93%;
  background-position: 86.9% 58.06%;
}

.pd-series__card:nth-child(1) .pd-series__card-hover-bg { background-image: url(../images/pd-001-hover.png); }
.pd-series__card:nth-child(2) .pd-series__card-hover-bg { background-image: url(../images/pd-002-hover.png); }
.pd-series__card:nth-child(3) .pd-series__card-hover-bg { background-image: url(../images/pd-003-hover.png); }
.pd-series__card:nth-child(4) .pd-series__card-hover-bg { background-image: url(../images/pd-004-hover.png); }
.pd-series__card:nth-child(5) .pd-series__card-hover-bg { background-image: url(../images/pd-005-hover.png); }
.pd-series__card:nth-child(6) .pd-series__card-hover-bg { background-image: url(../images/pd-006-hover.png); }
.pd-series__card:nth-child(7) .pd-series__card-hover-bg { background-image: url(../images/pd-007-hover.png); }
.pd-series__card:nth-child(8) .pd-series__card-hover-bg { background-image: url(../images/pd-008-hover.png); }

.pd-series__card:hover .pd-series__card-hover {
  opacity: 1;
}

.pd-series__card:hover .pd-series__card-initial::before {
  opacity: 0;
}

/* 圆形图标（hover 态右下角，绿色圆 + 白点，随 hover 容器淡入） */
.pd-series__circle-icon {
  display: flex;
  position: absolute;
  top: 71.3%;
  left: calc(76.5% + 30px);
  width: clamp(26px, 8.78cqw, 43px);
  height: clamp(26px, 8.78cqw, 43px);
  border-radius: 50%;
  background: var(--color-secondary);
  align-items: center;
  justify-content: center;
}

.pd-series__circle-dot {
  width: clamp(5px, 1.63cqw, 8px);
  height: clamp(5px, 1.63cqw, 8px);
  border-radius: 50%;
  background: var(--color-white);
}

/* 卡片文字（始终可见） */
.pd-series__card-num {
  position: absolute;
  top: 9.33%;
  left: 5.51%;
  z-index: 2;
  font-family: var(--font-primary);
  font-size: clamp(20px, 6.53cqw, 32px);
  font-weight: 800;
  line-height: 1;
  color: #D9E7F0;
  margin: 0;
}

.pd-series__card-text {
  position: absolute;
  top: 55%;
  left: 5.51%;
  width: 50.2%;
  z-index: 2;
}

.pd-series__card-title {
  font-family: var(--font-primary);
  font-size: clamp(15px, 4.49cqw, 22px);
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: #333333;
  margin: 0;
}

.pd-series__card-desc {
  font-family: var(--font-primary);
  font-size: clamp(11px, 2.86cqw, 14px);
  font-weight: 400;
  line-height: 1.4;
  color: #666666;
  margin: 6px 0 0;
}

/* --- 底部 WELL-T 水印装饰（贴浏览器左边、贴 CTA 上边） --- */
.pd-series__deco {
  position: absolute;
  left: 0;                       /* 绝对贴浏览器左边 */
  bottom: 0;                     /* 贴区块底 = 贴下方浅蓝色块上边 */
  margin: 0;
  pointer-events: none;
}

.pd-series__deco img {
  display: block;
  width: 940px;
  max-width: 100%;
  height: auto;
}

/* ==================== 响应式 ==================== */
@media (max-width: 1200px) {
  .pd-series {
    padding: 80px 0 100px;
  }

  .pd-series__title {
    font-size: 56px;
    line-height: 68px;
    letter-spacing: -1.12px;
    margin-bottom: 64px;
  }

  .pd-series__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .pd-series {
    padding: 60px 0 72px;
  }

  .pd-series__title {
    font-size: 40px;
    line-height: 50px;
    letter-spacing: -0.8px;
    margin-bottom: 40px;
  }

  .pd-series__grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .pd-series__card {
    height: 280px;
  }

  .pd-series__inner {
    padding-bottom: 140px;
  }
}

/* ==================== 无障碍降级 ==================== */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}