/* ============================================================
   About-R&D — From Material Innovation to Industrial Application
   Figma: #596:34422 (1920×1200, 页面 y960 白底)
   分子图 @(1280,77) 504×781 / 标题 @(208,207) / 描述 @(208,417)
   玻璃板 @(454,623) 1643×470：六边形尖角 clip + blur 7.5 + rgba(62,168,217,0.9)
     尖角：上下边左右缩 8.5%，左右尖点 50% 高度
   统计 3 组 @ (720,756)/(1198,759)/(1547,759)：icon 65 + 数字 56/60 + 标签 32
   全部坐标按 1920 基准换算 vw/百分比，min(vw,px) 封顶
   ============================================================ */

.ard-platform {
  position: relative;
  height: 1200px;
  overflow: hidden;
  background: var(--color-white);
}

/* 面包屑 @ (54, 59)——同 about.html 做法 */
.ard-platform__crumb {
  position: absolute;
  top: 40px;
  left: 54px;
  display: flex;
  align-items: center;
  gap: 20px;
  z-index: 3;
}

.ard-platform__crumb img {
  height: clamp(16px, 1.042vw, 1.25rem);
  width: auto;
}

.ard-platform__crumb .ard-platform__crumb-arrow {
  height: clamp(12px, 0.729vw, 0.875rem);
}

.ard-platform__crumb-link {
  font-family: var(--font-primary);
  font-size: clamp(0.875rem, 0.9375vw, 1.125rem);
  font-weight: 300;
  line-height: 1.6;
  letter-spacing: -0.36px;
  color: var(--color-primary);
  text-decoration: none;
  position: relative;
  transition: color var(--duration-base) var(--ease-standard);
}

/* 触控目标扩展至 ≥44px */
.ard-platform__crumb-link::before {
  content: "";
  position: absolute;
  inset: -14px;
}

.ard-platform__crumb-link:hover {
  color: var(--color-primary-dark);
}

.ard-platform__crumb-link:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

/* 右上分子图 @ (1280, 77) 504×781，不透明度 30%，下半被玻璃板覆盖 */
.ard-platform__mol {
  position: absolute;
  left: 66.67%;          /* 1280/1920 */
  top: 6.42%;            /* 77/1200 */
  width: 26.25%;         /* 504/1920 */
  aspect-ratio: 504 / 781;
  object-fit: cover;
  opacity: 0.3;
}

/* 左列标题描述 */
.ard-platform__copy {
  position: absolute;
  left: 10.83%;          /* 208/1920 */
  top: 17.25%;           /* 207/1200 */
  width: 53.54%;         /* 1028/1920（描述 max-width 基准） */
  z-index: 1;
}

.ard-platform__title {
  font-size: clamp(1.75rem, 3.9583vw, 4.75rem);
  font-weight: 600;
  line-height: 1.18;
  letter-spacing: -0.02em;
  color: var(--color-primary);
  margin: 0 0 30px;
}

.ard-platform__desc {
  width: 100%;           /* 1028 */
  font-size: 32px;  /* PC 端固定 32px（仅调整 PC，移动端 ≤768 仍用下方 clamp） */
  line-height: 1.5;
  letter-spacing: -0.02em;
  font-weight: 300;
  color: var(--color-text-secondary);
  opacity: 0.7;
  margin: 0;
}

/* 玻璃板 @ (454, 623) 1643×470——六边形尖角（上下边缩 8.5%，左右尖 50%）
   图本身清晰无模糊（设计稿 backdropFilter 不作用于图），蓝色遮罩 rgba(62,168,217,0.9) 叠加 */
.ard-platform__stage {
  position: absolute;
  left: 23.65%;          /* 454/1920 */
  top: 51.92%;           /* 623/1200 */
  width: 85.57%;         /* 1643/1920 */
  aspect-ratio: 1643 / 470;
  background: rgba(62, 168, 217, 0.9);
  clip-path: polygon(8.5% 0%, 91.5% 0%, 100% 50%, 91.5% 100%, 8.5% 100%, 0% 50%);
}

.ard-platform__stage-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.35;         /* 半透明叠加，蓝底透出（无 blur，图保持清晰） */
}

/* 统计 3 组（绝对定位相对玻璃板） */
.ard-platform__stats {
  position: absolute;
  inset: 0;
}

.ard-platform__stat {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.ard-platform__stat--1 {
  left: 16.19%;          /* (720-454)/1643 */
  top: 28.3%;            /* (756-623)/470 */
  width: 12.66%;         /* 208/1643 */
}

.ard-platform__stat--2 {
  left: 45.28%;          /* (1198-454)/1643 */
  top: 28.94%;           /* (759-623)/470 */
  width: 6.7%;           /* 110/1643 */
}

.ard-platform__stat--3 {
  left: 66.52%;          /* (1547-454)/1643 */
  top: 28.94%;
  width: 12.6%;          /* 207/1643 */
}

.ard-platform__stat-icon {
  width: min(65px, 3.385vw);
  aspect-ratio: 1 / 1;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: min(30px, 1.563vw);   /* icon 底→数字 30px */
}

.ard-platform__stat-icon img {
  width: 100%;
  height: 100%;
  display: block;
}

.ard-platform__stat-num {
  font-size: min(3.5rem, 2.917vw);
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -0.05em;
  color: var(--color-white);
  white-space: nowrap;
  margin: 0 0 min(10px, 0.521vw);      /* 数字底→标签 10px */
}

.ard-platform__stat-label {
  font-size: min(2rem, 1.667vw);
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -0.05em;
  color: var(--color-white);
  white-space: nowrap;
}

/* ---------- responsive ---------- */

@media (max-width: 1440px) {
  .ard-platform {
    height: auto;
    padding: 120px var(--container-padding) 0;
  }
  .ard-platform__mol {
    display: none;
  }
  .ard-platform__copy {
    position: static;
    width: 100%;          /* 覆盖 PC 53.54%，避免移动端内容被限制在半宽内 */
  }
  .ard-platform__title {
    font-size: clamp(1.5rem, 0.65vw + 1.35rem, 2.5rem);
    line-height: 1.18;
  }
  .ard-platform__desc {
    max-width: 100%;
  }
  .ard-platform__stage {
    position: relative;
    left: auto;
    top: auto;
    width: 100%;
    aspect-ratio: auto;
    height: 420px;
    margin: 60px 0;
  }
  .ard-platform__stat-num {
    font-size: clamp(1.5rem, 0.65vw + 1.35rem, 2.5rem);
  }
  .ard-platform__stat-label {
    font-size: clamp(1rem, 0.32vw + 0.92rem, 1.5rem);
  }
}

@media (max-width: 768px) {
  .ard-platform {
    padding: 80px var(--container-padding) 0;
  }
  .ard-platform__crumb {
    top: 24px;
    left: var(--container-padding);
  }
  .ard-platform__title {
    font-size: clamp(1.5rem, 0.81vw + 1.31rem, 2.75rem);
    line-height: 1.18;
    text-align: center;
  }
  .ard-platform__desc {
    font-size: clamp(0.9375rem, 0.08vw + 0.92rem, 1.0625rem);
    text-align: center;              /* 移动端灰色描述左右居中 */
  }
  .ard-platform__stage {
    height: 300px;
    margin: 40px 0;
    clip-path: none;               /* 移动端六边形 → 长方形圆角 */
    border-radius: var(--radius-md);
    overflow: hidden;
  }
  .ard-platform__stat-icon {
    width: 44px;
    margin-bottom: 14px;
  }
  .ard-platform__stat-num {
    font-size: clamp(1rem, 0.4vw + 0.91rem, 1.625rem);
    line-height: 1.5;
  }
  .ard-platform__stat-label {
    font-size: clamp(0.9375rem, 0.08vw + 0.92rem, 1.0625rem);
    line-height: 1.5;
  }
}

@media (max-width: 576px) {
  .ard-platform__title {
    font-size: clamp(1.625rem, 8vw, 2.25rem);
    line-height: 1.18;
  }
}