/* Company introduction page extras.
   Reuses dzpc tokens. Do not edit dzpc.css for these layouts. */

.dzpc-about {
  --dzpc-about-bronze: #a87e52;
  --dzpc-about-bronze-deep: #97713f
}

/* Centered hero: dzpc-hero is left-copy / right-media */
.dzpc-about-hero.dzpc-hero .dzpc-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0
}

.dzpc-about .dzpc-reveal {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .7s var(--dzpc-ease), transform .7s var(--dzpc-ease);
  transition-delay: var(--reveal-delay, 0ms);
  will-change: opacity, transform
}

.dzpc-about .dzpc-reveal.is-in {
  opacity: 1;
  transform: none
}

.dzpc-about-hero .dzpc-hero__copy {
  max-width: none
}

.dzpc-about-hero .dzpc-hero__title {
  font-size: clamp(36px, 4.4vw, 56px);
  line-height: 1.26;
  letter-spacing: -.02em
}

.dzpc-about-hero .dzpc-hero__lead {
  margin-left: auto;
  margin-right: auto;
  max-width: 620px
}

.dzpc-about-hero .dzpc-hero__art {
  --reveal-delay: 140ms;
  max-width: 880px;
  margin-top: 52px
}

.dzpc-about-hero .dzpc-media {
  width: 100%
}

/* 我们是谁 */
.dzpc-about-intro {
  max-width: 760px;
  margin: 28px auto 0
}

.dzpc-about-intro p {
  margin: 0 0 18px;
  font-size: 16px;
  line-height: 1.8;
  color: var(--dzpc-muted)
}

.dzpc-about-intro p:last-child {
  margin-bottom: 0
}

/* 文化照片卡 */
.dzpc-about-culture {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
  margin-top: var(--dzpc-space-7)
}

.dzpc-about-culture__card {
  position: relative;
  border-radius: var(--dzpc-r-lg);
  overflow: hidden;
  aspect-ratio: 4 / 3.6;
  box-shadow: var(--dzpc-shadow-soft)
}

.dzpc-about-culture__card img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover
}

.dzpc-about-culture__card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(19, 21, 62, .38) 0%, rgba(19, 21, 62, .52) 48%, rgba(19, 21, 62, .92) 100%)
}

.dzpc-about-culture__body {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  padding: 24px 26px 26px;
  text-align: left
}

.dzpc-about-culture__label {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin: 0 0 9px;
  font-size: 15.5px;
  font-weight: 700;
  color: #b9d6fc;
  letter-spacing: .08em
}

.dzpc-about-culture__label span {
  font-size: 12px;
  font-weight: 600;
  color: rgba(255, 255, 255, .78);
  letter-spacing: .16em
}

.dzpc-about-culture__value {
  margin: 0;
  font-size: clamp(16px, 1.42vw, 21px);
  font-weight: 700;
  color: #fff;
  line-height: 1.4;
  white-space: nowrap
}

/* 发展历程 */
.dzpc-about-journey {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 28px;
  position: relative;
  margin: var(--dzpc-space-7) 0 0;
  padding: 0
}

.dzpc-about-journey::before {
  content: "";
  position: absolute;
  left: 8px;
  right: 8px;
  top: 66px;
  height: 2px;
  background: linear-gradient(90deg, var(--dzpc-navy) 0%, var(--dzpc-about-bronze) 50%, var(--dzpc-navy) 100%);
  opacity: .22
}

.dzpc-about-journey__item {
  position: relative;
  padding-top: 96px
}

.dzpc-about-journey__year {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  margin: 0;
  padding: 9px 22px;
  border-radius: 9px;
  color: #fff;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: .02em;
  background: var(--dzpc-navy)
}

.dzpc-about-journey__year--bronze {
  background: var(--dzpc-about-bronze)
}

.dzpc-about-journey__dot {
  position: absolute;
  top: 60px;
  left: 26px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--dzpc-navy);
  border: 3px solid #fff;
  box-shadow: 0 0 0 2px #d8e6f6
}

.dzpc-about-journey__dot--bronze {
  background: var(--dzpc-about-bronze)
}

.dzpc-about-journey__card {
  border-radius: var(--dzpc-r-lg);
  padding: 28px 26px 30px;
  color: #fff;
  height: 100%;
  background: linear-gradient(160deg, #1c2048, var(--dzpc-navy))
}

.dzpc-about-journey__card--bronze {
  background: linear-gradient(160deg, #b08a5c, var(--dzpc-about-bronze-deep))
}

.dzpc-about-journey__card h3 {
  margin: 0 0 12px;
  font-size: 19px;
  font-weight: 700;
  line-height: 1.4;
  color: #fff
}

.dzpc-about-journey__card p {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.8;
  opacity: .88
}

/* 5 项荣誉：stat-grid 只到 4 列 */
.dzpc-about-honors .dzpc-title span {
  color: var(--dzpc-brand)
}

.dzpc-about-honors-stats.dzpc-stats {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 20px;
  border: 0;
  background: transparent;
  overflow: visible;
  text-align: center
}

.dzpc-about-honors-stats .dzpc-stat {
  padding: 8px 6px;
  border: 0
}

.dzpc-about-honors-stats .dzpc-stat__value {
  font-size: clamp(32px, 3.2vw, 48px);
  white-space: nowrap
}

.dzpc-about-honors-stats .dzpc-stat__label {
  font-size: 15px;
  line-height: 1.6
}

.dzpc-about-honors-stats .dzpc-stat__note {
  font-size: 12.5px
}

/* 管理团队 */
.dzpc-about-team {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  max-width: 720px;
  margin: var(--dzpc-space-7) auto 0
}

.dzpc-about-leader {
  min-width: 0
}

.dzpc-about-leader__photo {
  position: relative;
  z-index: 0;
  aspect-ratio: 1 / 1;
  width: 100%;
  margin-bottom: 20px;
  border-radius: var(--dzpc-r-lg);
  background:
    radial-gradient(300px 260px at 50% 32%, rgba(var(--dzpc-brand-rgb), .12), transparent 70%),
    linear-gradient(170deg, #f2f4f7, #e6eaf0)
}

.dzpc-about-leader__photo::after {
  content: "";
  position: absolute;
  right: -10px;
  top: -10px;
  width: 64px;
  height: 64px;
  border-radius: var(--dzpc-r-lg);
  background: linear-gradient(135deg, var(--dzpc-brand), var(--dzpc-brand-bright));
  z-index: -1
}

.dzpc-about-leader__photo img {
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  border-radius: var(--dzpc-r-lg)
}

.dzpc-about-leader__name {
  margin: 0 0 6px;
  font-size: 20px;
  font-weight: 700;
  color: var(--dzpc-ink)
}

.dzpc-about-leader__role {
  margin: 0 0 14px;
  font-size: 14px;
  color: var(--dzpc-muted)
}

.dzpc-about-bio-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  font-size: 15px;
  font-weight: 700;
  color: var(--dzpc-navy);
  cursor: pointer
}

.dzpc-about-bio-btn .dzpc-icon {
  width: 16px;
  height: 16px;
  color: currentColor;
  transition: transform .25s var(--dzpc-ease)
}

.dzpc-about-bio-btn:hover {
  color: var(--dzpc-brand)
}

.dzpc-about-bio-btn:hover .dzpc-icon {
  transform: translateX(4px)
}

/* 简介弹窗 */
.dzpc-about-bio {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px
}

.dzpc-about-bio-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(19, 21, 62, .55);
  backdrop-filter: blur(4px)
}

.dzpc-about-bio-dialog {
  position: relative;
  width: 100%;
  max-width: 620px;
  padding: 42px 46px;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 30px 80px rgba(19, 21, 62, .28)
}

.dzpc-about-bio-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid var(--dzpc-line);
  background: #fff;
  font-size: 20px;
  line-height: 1;
  color: var(--dzpc-muted);
  cursor: pointer
}

.dzpc-about-bio-close:hover {
  color: var(--dzpc-brand);
  border-color: var(--dzpc-brand)
}

.dzpc-about-bio-head {
  display: flex;
  gap: 22px;
  align-items: center;
  margin-bottom: 24px
}

.dzpc-about-bio-photo {
  width: 92px;
  height: 92px;
  border-radius: 18px;
  flex-shrink: 0;
  overflow: hidden;
  background: linear-gradient(170deg, var(--dzpc-tint), #e3eefb)
}

.dzpc-about-bio-photo img {
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover
}

.dzpc-about-bio-head h3 {
  margin: 0 0 8px;
  font-size: 26px;
  font-weight: 700;
  color: var(--dzpc-ink)
}

.dzpc-about-bio-body p {
  margin: 0;
  font-size: 15px;
  color: var(--dzpc-muted);
  line-height: 1.85
}

body.dzpc-about-bio-open {
  overflow: hidden
}

/* 全球地图：不要走 16:9 cover */
.dzpc-about-global .dzpc-split__copy .dzpc-title {
  max-width: none;
  text-align: left;
  margin: 0
}

.dzpc-about-global .dzpc-split__copy p {
  margin: 20px 0 0;
  font-size: 16px;
  line-height: 1.8;
  color: var(--dzpc-muted)
}

.dzpc-about-global .dzpc-split__art {
  --reveal-delay: 120ms
}

.dzpc-about-map {
  width: 100%;
  height: auto;
  display: block
}

/* FAQ：右侧固定加减号，避免默认三角开合时把标题挤动 */
.dzpc-about-faq.dzpc-faq {
  --dzpc-about-faq-icon: 20px;
  --dzpc-about-faq-gap: 40px;
  max-width: 760px;
  margin-top: var(--dzpc-space-7);
  border-top: 0
}

.dzpc-about-faq .dzpc-faq__item {
  border-bottom: 0;
  border-top: 1px solid var(--dzpc-line)
}

.dzpc-about-faq .dzpc-faq__item:last-child {
  border-bottom: 1px solid var(--dzpc-line)
}

.dzpc-about-faq .dzpc-faq__item summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--dzpc-about-faq-icon);
  column-gap: var(--dzpc-about-faq-gap);
  align-items: center;
  padding: 22px 0;
  list-style: none
}

.dzpc-about-faq .dzpc-faq__item summary::-webkit-details-marker,
.dzpc-about-faq .dzpc-faq__item summary::marker {
  display: none;
  content: none
}

.dzpc-about-faq__q {
  min-width: 0;
  text-align: left
}

.dzpc-about-faq__toggle {
  position: relative;
  width: var(--dzpc-about-faq-icon);
  height: var(--dzpc-about-faq-icon);
  justify-self: end
}

.dzpc-about-faq__toggle::before,
.dzpc-about-faq__toggle::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  background: var(--dzpc-brand);
  border-radius: 1px;
  transform: translate(-50%, -50%)
}

.dzpc-about-faq__toggle::before {
  width: 12px;
  height: 1.5px
}

.dzpc-about-faq__toggle::after {
  width: 1.5px;
  height: 12px;
  transition: transform .25s var(--dzpc-ease), opacity .25s var(--dzpc-ease)
}

.dzpc-about-faq .dzpc-faq__item[open] .dzpc-about-faq__toggle::after {
  transform: translate(-50%, -50%) rotate(90deg);
  opacity: 0
}

.dzpc-about-faq .dzpc-faq__answer {
  max-width: none;
  padding: 0 calc(var(--dzpc-about-faq-icon) + var(--dzpc-about-faq-gap)) 22px 0
}

.dzpc-about-faq .dzpc-faq__answer p {
  max-width: none
}

/* 公司大事件 */
.dzpc-about-events {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
  margin-top: var(--dzpc-space-7)
}

.dzpc-about-event {
  display: block;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--dzpc-line);
  border-radius: var(--dzpc-r-lg);
  text-decoration: none;
  color: inherit;
  transition: transform .35s var(--dzpc-ease), box-shadow .35s var(--dzpc-ease)
}

.dzpc-about-event:hover {
  transform: translateY(-4px);
  box-shadow: var(--dzpc-shadow-soft);
  text-decoration: none;
  color: inherit
}

.dzpc-about-event__cover {
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: var(--dzpc-tint)
}

.dzpc-about-event__cover img {
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  transition: transform .5s var(--dzpc-ease)
}

.dzpc-about-event:hover .dzpc-about-event__cover img {
  transform: scale(1.04)
}

.dzpc-about-event__body {
  padding: 22px 24px 26px
}

.dzpc-about-event__body h3 {
  margin: 0 0 14px;
  min-height: 50px;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.55;
  color: var(--dzpc-ink)
}

.dzpc-about-event__body time {
  font-size: 13px;
  color: var(--dzpc-placeholder)
}

@media (max-width: 1080px) {
  .dzpc-about-honors-stats.dzpc-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 48px 20px
  }

  .dzpc-about-journey {
    grid-template-columns: 1fr 1fr;
    gap: 32px 28px
  }

  .dzpc-about-journey::before {
    display: none
  }
}

@media (max-width: 900px) {
  .dzpc-about-hero.dzpc-hero .dzpc-wrap {
    display: flex;
    flex-direction: column;
    gap: 0
  }

  .dzpc-about-hero .dzpc-hero__art {
    margin-top: 36px
  }

  .dzpc-about-team {
    grid-template-columns: 1fr;
    max-width: 380px
  }

  .dzpc-about-culture {
    grid-template-columns: 1fr;
    max-width: 520px;
    margin-left: auto;
    margin-right: auto
  }

  .dzpc-about-culture__card {
    aspect-ratio: 4 / 3
  }

  .dzpc-about-culture__value {
    white-space: normal
  }

  .dzpc-about-events {
    grid-template-columns: 1fr;
    max-width: 560px;
    margin-left: auto;
    margin-right: auto
  }
}

@media (max-width: 640px) {
  .dzpc-about-honors-stats.dzpc-stats {
    grid-template-columns: 1fr 1fr;
    gap: 36px 16px
  }

  .dzpc-about-honors-stats .dzpc-stat__value {
    font-size: clamp(28px, 7.4vw, 38px)
  }

  .dzpc-about-journey {
    grid-template-columns: 1fr
  }

  .dzpc-about-hero .dzpc-hero__art {
    margin-top: 32px
  }

  .dzpc-about-faq.dzpc-faq {
    --dzpc-about-faq-gap: 24px
  }

  .dzpc-about-bio-dialog {
    padding: 30px 24px
  }

  .dzpc-about-bio-head {
    flex-direction: column;
    align-items: flex-start
  }
}

@media (prefers-reduced-motion: reduce) {
  .dzpc-about .dzpc-reveal {
    opacity: 1;
    transform: none;
    transition: none
  }

  .dzpc-about-faq__toggle::after,
  .dzpc-about-bio-btn .dzpc-icon,
  .dzpc-about-event,
  .dzpc-about-event__cover img {
    transition: none
  }

  .dzpc-about-event:hover,
  .dzpc-about-event:hover .dzpc-about-event__cover img {
    transform: none
  }
}
