/* A portrait, an editorial reading column and one real drawing; shared type roles. */
.about-page { --about-gap:72px; }
.about-opening,.about-observation,.about-conversation-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--about-gap); align-items:center; }
.about-opening { padding-block:54px 76px; }
.about-intro { grid-column:2; }
.about-page h1 em,.about-page h2 em { color:var(--sage); }
.about-profession { margin-block:24px; }
.about-biography { max-width:490px; }
.about-portrait { grid-column:1; grid-row:1; margin:0; width:100%; max-width:500px; }
.about-portrait-frame { position:relative; }
.about-portrait-frame::after { content:''; position:absolute; inset:16px -16px -16px 16px; border:1px solid var(--coral); pointer-events:none; }
.about-portrait img { display:block; width:100%; aspect-ratio:5/6; object-fit:cover; object-position:72% center; }
.about-portrait figcaption { display:flex; justify-content:space-between; gap:16px; margin-top:34px; color:var(--muted); }
.about-observation { border-top:1px solid var(--line); padding-block:64px 70px; }
.about-reading .copy { margin-top:26px; max-width:470px; }
.about-drawing { min-width:0; }
.about-plan-sheet { margin:0; padding:20px 20px 0; background:#e5e9d9; }
.about-plan-sheet .picture-link { background:white; }
.about-plan-sheet img { display:block; width:100%; height:auto; }
.about-page .zoom-label { background:var(--coral); }
.about-plan-sheet figcaption { display:flex; justify-content:space-between; gap:20px; padding-block:16px; color:var(--muted); }
.about-plan-sheet figcaption>span:last-child { text-align:right; }
.about-drawing>.text-link { margin-top:24px; }
.about-conversation { padding-block:52px; border-top:1px solid var(--line); background:#e5e9d9; }
.about-conversation .copy { max-width:490px; }
.about-actions { display:flex; flex-wrap:wrap; align-items:center; gap:20px 28px; margin-top:24px; }
.about-actions .button { background:var(--ink); color:var(--paper); }
.about-actions .text-link { margin:0; }
.about-page main a:focus-visible { outline:2px solid var(--ink); outline-offset:5px; }
@media(max-width:1200px) {
  .about-page { --about-gap:48px; }
  .about-opening { padding-block:48px 62px; }
  .about-plan-sheet { padding:14px 14px 0; }
  .about-plan-sheet figcaption { flex-direction:column; gap:5px; }
  .about-plan-sheet figcaption>span:last-child { text-align:left; }
}
@media(max-width:800px) {
  .about-page { --about-gap:38px; }
  .about-opening,.about-observation,.about-conversation-grid { grid-template-columns:minmax(0,1fr); }
  .about-opening { padding-block:38px 54px; }
  .about-intro,.about-portrait { grid-column:auto; grid-row:auto; }
  .about-biography,.about-reading .copy,.about-conversation .copy { max-width:none; }
  .about-portrait { width:calc(100% - 16px); max-width:440px; }
  .about-portrait img { aspect-ratio:1/1; }
  .about-observation { padding-block:44px 48px; gap:30px; }
  .about-conversation { padding-block:44px; }
  .about-conversation-grid { gap:26px; }
}