/* ============================================================
   about.css — 居中头部 + 人物卡 + 计数器三联
   ============================================================ */

.about { padding: 140px 0 80px; background: var(--white); }
.about h2 { max-width: 24ch; }

.about__figure {
  position: relative;
  width: min(520px, 100%);
  margin: 72px auto 0;
}
.about__portrait {
  width: 100%;
  border-radius: var(--radius-card);
  object-fit: cover;
}
.about__watermark {
  position: absolute;
  top: -34px;
  right: -110px;
  width: 165px;
}
.about__pill {
  position: absolute;
  left: 50%;
  bottom: 26px;
  translate: -50%;
  white-space: nowrap;
  padding: 18px 34px;
  background: var(--white);
  border-radius: var(--radius-pill);
  box-shadow: 0 18px 44px rgb(3 0 40 / .16);
  font-size: var(--body-lg);
  color: var(--ink);
}

.about__counters {
  display: grid;
  grid-template-columns: repeat(3, auto);
  justify-content: space-between;
  gap: 40px;
  margin-top: 90px;
}
.about__counters dt {
  font-family: var(--font-numeric);
  font-weight: 500;
  font-size: clamp(56px, 6.3vw, 90px);
  line-height: 1;
  letter-spacing: -0.05em;
  color: #000;
}
.about__counters dd {
  margin-top: 16px;
  font-size: var(--body-lg);
  color: var(--navy);
}

@media (max-width: 809px) {
  .about { padding: 90px 0 70px; }
  .about__watermark { right: -8px; top: -22px; width: 110px; }
  .about__pill { white-space: normal; width: max(76%, 240px); text-align: center; padding: 14px 22px; }
  .about__counters { grid-template-columns: 1fr; justify-items: center; text-align: center; margin-top: 70px; }
}
