/* Page-specific refinements for portfolio archives and About. */

body[data-page="photography"] .archive-section,
body[data-page="design"] .archive-section {
  padding-top: 24px;
}

.about-page {
  min-height: auto;
  padding: clamp(84px, 9vw, 138px) var(--page-edge) 96px;
  text-align: left;
}

.about-kicker {
  margin: 0 0 clamp(34px, 4vw, 60px);
}

.about-copy {
  width: min(920px, 100%);
  display: grid;
  gap: 26px;
}

.about-page .about-cn {
  max-width: 780px;
  margin: 0;
  font-family: var(--font-copy);
  font-size: clamp(22px, 2.25vw, 36px);
  line-height: 1.62;
  letter-spacing: var(--copy-letter-spacing);
}

.about-page .about-en {
  max-width: 850px;
  margin: 0;
  font-family: var(--font-copy);
  font-size: clamp(15px, 1.2vw, 19px);
  font-weight: 400;
  line-height: 1.72;
  letter-spacing: var(--copy-letter-spacing);
  color: var(--muted);
}

.about-details {
  width: min(780px, 100%);
  margin: clamp(72px, 9vw, 126px) 0 0;
}

@media (max-width: 820px) {
  body[data-page="photography"] .archive-section,
  body[data-page="design"] .archive-section {
    padding-top: 16px;
  }

  .about-page {
    padding-top: 68px;
    padding-bottom: 72px;
  }

  .about-kicker {
    margin-bottom: 30px;
  }

  .about-copy {
    gap: 20px;
  }

  .about-page .about-cn {
    font-size: clamp(20px, 5.6vw, 28px);
    line-height: 1.58;
  }

  .about-page .about-en {
    font-size: 15px;
    line-height: 1.7;
  }

  .about-details {
    margin-top: 64px;
  }
}