.about-standalone { margin: 0; background: var(--theme-standalone); color: var(--theme-text); }
.about-page, .about-content, .about-content * { box-sizing: border-box; }
.about-page { max-width: 1160px; min-height: 100svh; margin: auto; padding: 32px 5%; display: flex; flex-direction: column; }
.about-page main { flex: 1; display: flex; align-items: center; }
.about-page a:focus-visible { outline: 2px solid var(--theme-accent); outline-offset: 6px; }
.about-content { width: 100%; padding: 58px 0 16px; color: var(--theme-text); }
.about-content p { margin: 0; }
.about-dialog .about-content { padding-top: 24px; }
.about-layout { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 48px; }
.about-copy { max-width: 36ch; font-size: 13px; line-height: 1.85; color: var(--theme-copy-text); }
.about-art { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: center; gap: 12px; min-height: 240px; margin: 0; min-width: 0; }
.about-art img { display: block; width: 100%; height: auto; filter: brightness(.65) saturate(2); }
/* One continuous leap: same scale, with the middle frame at the arc's peak. */
.about-art img:first-child, .about-art img:last-child { translate: 0 15%; }
.about-art img:nth-child(2) { translate: 0 -35%; }
html[data-theme="dark"] .about-art img { filter: none; }
.about-contact { margin-top: 24px; }
.about-contact copy-email { margin-inline-start: -8px; color: var(--theme-accent); }
@media (max-width: 740px) {
  .about-page { padding: 23px 7%; }
  .about-content { padding-top: 30px; }
  .about-layout { grid-template-columns: 1fr; gap: 24px; }
  .about-art { min-height: 160px; gap: 8px; }
  .about-copy { max-width: none; }
}
