/* September 15 layout: retain the existing type and page color system. */
.about-page { align-content:start; --about-section-gap:3rem; }
.about-photo { width:60%; margin:0 auto var(--about-section-gap); }
.about-photo img { display:block; width:100%; height:auto; }
.about-copy { color:var(--page-color); text-align:center; }
.about-contact { margin-top:var(--about-section-gap); }
.about-contact p + p { margin-top:1.5em; }
.about-copy .about-contact a { display:inline; width:auto; padding:0; margin:0; border:0; text-decoration:underline; text-decoration-color:var(--page-underline-color); text-underline-offset:.08em; text-decoration-thickness:.1em; }
@media (max-width:919px) {
    .about-photo { width:100%; }
    header nav p { padding-inline:0; }
}

header nav { width:max-content; max-width:100%; min-width:0; font-size:20px; line-height:1.1; gap:.6em; }
header nav p { padding:0; }
@media (max-width:600px) {
    header nav { font-size:clamp(14px,calc((100vw - 16px) / 17.6),20px); width:calc(100vw - 16px); max-width:none; flex-shrink:0; }
    header nav p { padding-inline:0; }
}

@media (min-width:920px) {
    header nav { font-size:36px; gap:clamp(12px,calc((100vw - 590px) / 4),90px); }
    header nav p { padding-inline:0; }
}

/* Use the original body underline weight for text and links. */
a, .text-container .underline { text-decoration-thickness:.1em; }
header nav { border-bottom-width:.1em; }
header nav a.active { border-top-width:.1em; }
/* Match the image-to-copy and copy-to-contact spacing. */
@media (min-width:920px) { .about-page { --about-section-gap:6rem; } }