:root {
  --page-footer-font: var(--font-body);
  --page-footer-size: 12px;
  --page-footer-spacing: .02em;
  --home-section-font: var(--font-section-title);
  --home-section-size: var(--section-title-font-size);
  --home-section-spacing: var(--section-title-letter-spacing);
  --photography-title-font: var(--font-page-title);
  --photography-title-size: 64px;
  --photography-title-spacing: .04em;
  --photography-copy-font: var(--font-copy);
  --photography-copy-size: var(--copy-font-size);
  --photography-copy-spacing: var(--copy-letter-spacing);
  --design-title-font: var(--font-page-title);
  --design-title-size: 64px;
  --design-title-spacing: .04em;
  --design-copy-font: var(--font-copy);
  --design-copy-size: var(--copy-font-size);
  --design-copy-spacing: var(--copy-letter-spacing);
  --design-project-title-font: var(--font-copy);
  --design-project-title-size: 38px;
  --design-project-title-spacing: 0em;
  --about-kicker-font: var(--font-navigation);
  --about-kicker-size: 11px;
  --about-kicker-spacing: .14em;
  --about-cn-font: var(--font-copy);
  --about-cn-size: 36px;
  --about-cn-spacing: 0em;
  --about-en-font: var(--font-copy);
  --about-en-size: 19px;
  --about-en-spacing: 0em;
  --about-details-font: var(--font-copy);
  --about-details-size: 18px;
  --about-details-spacing: 0em;
}

.footer-copyright {
  font-family: var(--page-footer-font) !important;
  font-size: var(--page-footer-size) !important;
  letter-spacing: var(--page-footer-spacing) !important;
}

body[data-page="home"] .section-heading h2 {
  font-family: var(--home-section-font);
  font-size: var(--home-section-size);
  letter-spacing: var(--home-section-spacing);
}

.managed-page-header {
  padding: clamp(46px, 6vw, 86px) var(--page-edge) clamp(22px, 3vw, 42px);
  border-bottom: 1px solid var(--line);
}
.managed-page-header p {
  margin: 0 0 13px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.4;
  text-transform: uppercase;
}
.managed-page-header h1 {
  margin: 0;
  max-width: 1100px;
  font-weight: 400;
  line-height: 1.02;
}
body[data-page="photography"] .managed-page-header p,
body[data-page="photography"] .managed-page-header h1 {
  font-family: var(--photography-title-font);
  letter-spacing: var(--photography-title-spacing);
}
body[data-page="photography"] .managed-page-header h1 { font-size: min(var(--photography-title-size), 8vw); }
body[data-page="photography"] .work-meta {
  font-family: var(--photography-copy-font);
  font-size: var(--photography-copy-size);
  letter-spacing: var(--photography-copy-spacing);
}
body[data-page="design"] .managed-page-header p,
body[data-page="design"] .managed-page-header h1 {
  font-family: var(--design-title-font);
  letter-spacing: var(--design-title-spacing);
}
body[data-page="design"] .managed-page-header h1 { font-size: min(var(--design-title-size), 8vw); }
body[data-page="design"] .work-meta,
body[data-page="design"] .project-viewer-info {
  font-family: var(--design-copy-font);
  font-size: var(--design-copy-size);
  letter-spacing: var(--design-copy-spacing);
}
body[data-page="design"] .project-viewer-year {
  font-family: var(--design-copy-font);
  font-size: max(10px, calc(var(--design-copy-size) * .66));
  letter-spacing: var(--design-copy-spacing);
}
body[data-page="design"] .project-viewer-header h2 {
  font-family: var(--design-project-title-font) !important;
  font-size: min(var(--design-project-title-size), 6vw) !important;
  letter-spacing: var(--design-project-title-spacing) !important;
}

body[data-page="about"] .about-kicker {
  font-family: var(--about-kicker-font);
  font-size: var(--about-kicker-size);
  letter-spacing: var(--about-kicker-spacing);
}
body[data-page="about"] .about-cn {
  font-family: var(--about-cn-font) !important;
  font-size: min(var(--about-cn-size), 7vw) !important;
  letter-spacing: var(--about-cn-spacing) !important;
}
body[data-page="about"] .about-en {
  font-family: var(--about-en-font) !important;
  font-size: min(var(--about-en-size), 5vw) !important;
  letter-spacing: var(--about-en-spacing) !important;
}
body[data-page="about"] .about-details {
  font-family: var(--about-details-font) !important;
  font-size: var(--about-details-size) !important;
  letter-spacing: var(--about-details-spacing) !important;
}

.site-logo,
.site-nav,
.section-heading,
.work-meta,
.managed-page-header,
.about-page,
.site-footer {
  font-synthesis: none;
}

@media (max-width: 820px) {
  .managed-page-header { padding-top: 38px; }
  body[data-page="photography"] .managed-page-header h1 { font-size: min(var(--photography-title-size), 12vw); }
  body[data-page="design"] .managed-page-header h1 { font-size: min(var(--design-title-size), 12vw); }
  body[data-page="design"] .project-viewer-header h2 { font-size: min(var(--design-project-title-size), 8vw) !important; }
  .footer-copyright { font-size: min(var(--page-footer-size), 12px) !important; }
}