/* PARK-78: History pages (about/history/*): captioned figures, sources, timeline. Loaded only on those pages. */
.prose figure.photo { margin: 1.4rem 0; }
.prose figure.photo figcaption { font-size: .86rem; color: var(--ink-2); margin-top: .45rem; line-height: 1.45; }
.prose figure.photo.right { float: right; width: min(40%, 300px); margin: .3rem 0 1rem 1.6rem; }
.prose figure.photo.right img { width: 100%; border-radius: 6px; }
.prose h2, .prose h3 { clear: both; }
.prose blockquote.pull { clear: both; }
@media (max-width: 640px) {
  .prose figure.photo.right { float: none; width: auto; max-width: 280px; margin: 1.2rem auto; }
  .prose figure.photo.right.clip { max-width: 340px; }
}
.prose .sources { font-size: .93rem; color: var(--ink-2); border-top: 1px solid var(--line); margin-top: 2.4rem; padding-top: .6rem; clear: both; }
.prose .sources h2 { font-size: 1.2rem; margin-top: .8rem; }
.prose .sources li { margin-bottom: .35rem; overflow-wrap: anywhere; }
.facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; margin: 1.4rem 0 1.8rem; padding: 0; list-style: none; }
.facts li { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: .8rem 1rem; }
.facts strong { display: block; font-family: var(--serif); font-size: 1.5rem; color: var(--red-ink); line-height: 1.1; }
.facts span { font-size: .92rem; color: var(--ink-2); }
@media (max-width: 760px) { .facts { grid-template-columns: minmax(0, 1fr); } }
.tradition { border-left: 4px solid var(--gold); padding: .2rem 0 .2rem 1rem; color: var(--ink-2); font-style: italic; }
/* timeline */
.tl-dot { display: inline-block; width: .8em; height: .8em; border-radius: 50%; vertical-align: -.05em; margin-right: .35em; }
.tl-dot.parish { background: var(--red); }
.tl-dot.anglican { background: var(--navy-3); box-shadow: inset 0 0 0 2px var(--gold); }
.tl-filter { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1.4rem 0 .6rem; }
html.js .tl-filter[hidden] { display: none; }
.tl-btn { font: inherit; font-size: .95rem; padding: .45rem .95rem; border-radius: 999px; border: 2px solid var(--line); background: var(--card); color: var(--ink); cursor: pointer; }
.tl-btn[aria-pressed="true"] { border-color: var(--navy-3); background: var(--navy); color: #fff; }
.tl-key { margin: .4rem 0 1.2rem; }
.timeline { list-style: none; margin: 0 0 2rem; padding: 0 0 0 1.6rem; position: relative; }
.timeline::before { content: ""; position: absolute; left: .45rem; top: .4rem; bottom: .4rem; width: 2px; background: var(--line); }
.tl-item { position: relative; margin: 0 0 1.1rem; padding: .7rem 1rem .75rem; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); min-width: 0; }
.tl-item::before { content: ""; position: absolute; left: -1.55rem; top: 1rem; width: .95rem; height: .95rem; border-radius: 50%; border: 2px solid var(--paper); }
.tl-parish::before { background: var(--red); }
.tl-anglican::before { background: var(--navy-3); box-shadow: 0 0 0 2px var(--gold); }
.tl-parish { border-left: 4px solid var(--red); }
.tl-anglican { border-left: 4px solid var(--navy-3); }
.tl-when { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: .2rem .7rem; }
.tl-year { font-family: var(--serif); font-weight: 700; font-size: 1.15rem; }
.tl-track { font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: var(--ink-2); }
.tl-title { font-size: 1.08rem; margin: .15rem 0 .2rem; }
.tl-text { margin: 0; font-size: .97rem; }
@media (prefers-color-scheme: dark) { .tl-anglican::before, .tl-dot.anglican { background: #8f89e8; } .tl-anglican { border-left-color: #8f89e8; } }
@media print { .tl-filter { display: none !important; } .tl-item { break-inside: avoid; } }
/* at a glance, contents, pull quotes, side stories, key people, read next, diagrams */
.glance { background: var(--paper-2); border: 1px solid var(--line); border-top: 4px solid var(--gold); border-radius: var(--radius); padding: 1rem 1.2rem .4rem; margin: 0 0 1.6rem; }
.glance h2 { margin: 0 0 .5rem; font-size: 1.15rem; }
.glance ul { padding-left: 1.1rem; }
.glance li { margin-bottom: .3rem; }
.toc-box { border: 1px solid var(--line); border-radius: var(--radius); padding: .8rem 1.1rem .3rem; margin: 0 0 1.6rem; background: var(--card); }
.toc-box h2 { font-size: 1rem; margin: 0 0 .4rem; font-family: var(--sans); text-transform: uppercase; letter-spacing: .07em; color: var(--ink-2); }
.toc-box ol { columns: 2; column-gap: 2rem; padding-left: 1.2rem; margin-bottom: .6rem; }
.toc-box li { break-inside: avoid; margin-bottom: .25rem; }
@media (max-width: 640px) { .toc-box ol { columns: 1; } }
.prose blockquote.pull { margin: 1.8rem 0; padding: 1rem 1.3rem; border: 0; border-left: 5px solid var(--red); background: var(--paper-2); border-radius: 0 var(--radius) var(--radius) 0; font-family: var(--serif); font-size: 1.22rem; line-height: 1.45; font-style: normal; color: var(--ink); }
.prose blockquote.pull p { margin: 0 0 .5rem; }
.prose blockquote.pull cite, .prose blockquote.pull .cite { display: block; font-family: var(--sans); font-size: .88rem; font-style: normal; color: var(--ink-2); }
.prose aside.sidebar { float: right; width: min(42%, 340px); margin: .3rem 0 1.2rem 1.6rem; padding: 1rem 1.1rem .3rem; background: var(--card); border: 1px solid var(--line); border-top: 4px solid var(--navy-3); border-radius: var(--radius); font-size: .95rem; box-shadow: var(--shadow); }
.prose aside.sidebar h3 { margin: 0 0 .5rem; font-size: 1.1rem; }
.prose aside.sidebar figure.photo { margin: 0 0 .7rem; }
@media (max-width: 760px) { .prose aside.sidebar { float: none; width: auto; margin: 1.4rem 0; } }
.key-people { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .9rem; margin: 1.2rem 0 1.8rem; clear: both; }
.key-people.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1000px) { .key-people { grid-template-columns: repeat(2, minmax(0, 1fr)); } .key-people.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { .key-people, .key-people.cols-3 { grid-template-columns: minmax(0, 1fr); } }
.kp { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; min-width: 0; font-size: .93rem; }
.kp figure.photo { margin: 0; }
.kp figure.photo img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: center 20%; border-radius: 0; }
.kp p { margin: .55rem .85rem .7rem; }
.kp p strong { font-family: var(--serif); font-size: 1.05rem; }
@media (max-width: 640px) { .kp { display: grid; grid-template-columns: 96px minmax(0, 1fr); align-items: start; } .kp figure.photo img { aspect-ratio: 1; height: 100%; } }
.read-next { clear: both; margin-top: 2.6rem; border-top: 1px solid var(--line); padding-top: .4rem; }
.read-next h2 { font-size: 1.2rem; }
.rn-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem; }
@media (max-width: 560px) { .rn-grid { grid-template-columns: minmax(0, 1fr); } }
.rn-card { display: grid; grid-template-columns: 96px minmax(0, 1fr); align-items: center; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; text-decoration: none; color: var(--ink); box-shadow: var(--shadow); min-height: 84px; }
.rn-card:hover { border-color: var(--gold); }
.rn-card.next { text-align: left; }
.rn-img img { width: 96px; height: 84px; object-fit: cover; }
.rn-body { padding: .5rem .9rem; }
.rn-body small { display: block; text-transform: uppercase; letter-spacing: .07em; font-size: .74rem; }
.rn-body strong { font-family: var(--serif); font-size: 1.05rem; color: var(--link); }
figure.diagram { margin: 1.8rem 0; padding: 1rem; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); clear: both; }
figure.diagram svg { width: 100%; height: auto; display: block; color: var(--ink); }
figure.diagram figcaption { font-size: .88rem; color: var(--ink-2); margin-top: .6rem; }
.diagram .d-rome { fill: #b83a39; } .diagram .d-cant { fill: #cfa436; } .diagram .d-gen { fill: #3a3680; }
.diagram .d-line { stroke: var(--line); } .diagram .d-ink { fill: currentColor; } .diagram .d-soft { fill: var(--ink-2); }
.diagram .d-box { fill: var(--paper-2); stroke: var(--line); }
@media (prefers-color-scheme: dark) { .diagram .d-gen { fill: #8f89e8; } }
.tl-item { display: grid; grid-template-columns: minmax(0, 1fr); }
.tl-item:has(.tl-thumb-wrap) { grid-template-columns: 112px minmax(0, 1fr); column-gap: 1rem; }
.tl-thumb-wrap { grid-row: span 3; }
.tl-thumb { width: 112px; height: 112px; object-fit: cover; border-radius: 6px; }
@media (max-width: 560px) { .tl-item:has(.tl-thumb-wrap) { grid-template-columns: 72px minmax(0, 1fr); column-gap: .75rem; } .tl-thumb { width: 72px; height: 72px; } }
.history-cards .card-img img { aspect-ratio: 16 / 10; object-fit: cover; }
.fig-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem; margin: 1.4rem 0; clear: both; }
.fig-row.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.fig-row figure.photo { margin: 0; min-width: 0; }
.fig-row figure.photo img { aspect-ratio: 4 / 3; object-fit: cover; max-height: none; }
.fig-row.tall figure.photo img { aspect-ratio: 3 / 4; }
@media (max-width: 640px) { .fig-row, .fig-row.cols-3 { grid-template-columns: minmax(0, 1fr); } .fig-row figure.photo img, .fig-row.tall figure.photo img { aspect-ratio: auto; } }
.prose figure.photo.wide img { max-height: none; }
.prose figure.photo.clip img { object-fit: contain; background: #fff; max-height: 640px; }
.rector-table td:first-child { white-space: nowrap; }
@media (max-width: 640px) {
  figure.diagram { overflow-x: auto; -webkit-overflow-scrolling: touch; padding: .8rem; }
  figure.diagram svg { min-width: 600px; }
  figure.diagram figcaption { position: sticky; left: 0; max-width: calc(100vw - 64px); }
  figure.diagram figcaption::after { content: " Swipe sideways to see the whole diagram."; }
}
