.brand-introduction { width: min(1160px, calc(100% - 48px)); margin: 64px auto; grid-column: 1 / -1; color: inherit; }
.brand-introduction h2, .about-page h1, .about-page h2 { font-family: Georgia, 'Times New Roman', serif; font-weight: 400; letter-spacing: -.025em; }
.brand-introduction h2 { font-size: clamp(2rem, 4vw, 3.4rem); line-height: 1.12; margin: 0 0 24px; }
.brand-introduction p { max-width: 64ch; font: 1rem/1.7 system-ui, sans-serif; margin: 0 0 24px; }
.brand-introduction nav, .about-page nav { display: flex; flex-wrap: wrap; gap: 16px 28px; }
.brand-introduction a, .about-page a { color: inherit; text-underline-offset: .25em; }
.brand-introduction a:focus-visible, .about-page a:focus-visible, .about-page button:focus-visible { outline: 3px solid currentColor; outline-offset: 5px; }
.about-page { margin: 0; background: #fff; color: #191a1b; font: 1rem/1.7 system-ui, sans-serif; color-scheme: light; }
.about-page[data-theme="dark"] { background: #000; color: #f2f1ed; color-scheme: dark; }
.about-page header, .about-page main, .about-page footer { width: min(1160px, calc(100% - 48px)); margin-inline: auto; }
.about-page header { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 24px; padding-block: 32px; }
.about-page .brand { font: 500 32px/1 Georgia, serif; letter-spacing: -.045em; text-decoration: none; }
.about-page button { background: transparent; color: inherit; border: none; font: inherit; padding: 8px; cursor: pointer; }
.about-page h1 { font-size: clamp(3rem, 7vw, 6rem); line-height: 1.05; max-width: 14ch; margin: 48px 0 28px; }
.about-page .lead { max-width: 56ch; font-size: 1.2rem; }
.about-page section { margin-block: 64px; }
.about-page h2 { font-size: 2rem; line-height: 1.2; margin: 0 0 20px; }
.about-page p { max-width: 66ch; margin: 0 0 20px; }
.about-page .perspectives { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px 64px; }
.about-page .perspectives article { min-width: 0; }
.about-page .perspectives h3 { font: 400 1.5rem Georgia, serif; margin: 0 0 12px; }
.about-page footer { padding-block: 24px 48px; }
@media (max-width: 600px) { .brand-introduction { margin-block: 48px; } .about-page .perspectives { grid-template-columns: 1fr; gap: 32px; } .about-page header, .about-page main, .about-page footer, .brand-introduction { width: calc(100% - 36px); } }

/* Guides list and shared footer links on the simple pages. */
.about-page .guide-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 22px; max-width: 70ch; }
.about-page .guide-list li { line-height: 1.6; }
.about-page main ul { max-width: 70ch; line-height: 1.7; }
.about-page main p { max-width: 70ch; }
.about-page .site-links { padding-top: 8px; }
