/* Reading templates use a real article column; absent navigation never reserves a slot. */
.depth-article .reading-layout { grid-template-columns:minmax(0,1fr); max-width:1180px; margin-inline:auto; }
.depth-article .reading-layout.has-section-navigation { grid-template-columns:210px minmax(0,1fr); gap:48px; }
.reading-layout:not(.has-section-navigation) > .reading-copy { width:min(100%,850px); margin-inline:auto; }
.reading-copy.appended-depth { max-width:850px; margin-inline:auto; }
.page-hero.no-photo { margin-inline:auto; }
.page-hero .reading-parish-photo img { height:auto; max-height:440px; object-fit:contain; background:#eeeae2; }
.section-navigation details { border-top:1px solid var(--line); }
.section-navigation details > summary { cursor:pointer; padding:13px 0; font:600 12px/1.6 var(--sans); color:var(--gold-dark); }
.section-navigation details nav { padding-bottom:10px; }
.section-navigation details a { font-size:12px; padding:11px 0; }
.reading-steps { list-style:none; counter-reset:steps; padding:0; margin:24px 0 30px; }
.reading-steps li { position:relative; counter-increment:steps; padding:15px 18px 15px 56px; border-bottom:1px solid var(--line); background:#f5f2e9; font:400 15px/1.8 var(--serif); }
.reading-steps li::before { content:counter(steps,decimal-leading-zero); position:absolute; left:17px; top:17px; font:600 12px/1.5 var(--sans); color:var(--gold-dark); }
.reading-facts { margin:25px 0; border-block:1px solid var(--line); }
.reading-facts > div { display:grid; grid-template-columns:150px minmax(0,1fr); gap:22px; padding:18px 0; }
.reading-facts dt { color:var(--gold-dark); font:600 12px/1.6 var(--sans); }
.reading-facts dd { margin:0; font:400 14px/1.8 var(--sans); }
.reading-table-wrap { margin:25px 0 30px; overflow-x:auto; }
.reading-table { width:100%; border-collapse:collapse; font:400 14px/1.8 var(--serif); }
.reading-table th { text-align:left; background:#eae4d5; font:600 11px/1.6 var(--sans); }
.reading-table td,.reading-table th { padding:15px 18px; border-bottom:1px solid var(--line); vertical-align:top; }
.reading-table td:first-child { width:31%; font-weight:600; }
.reading-table tbody tr:nth-child(even) { background:#f5f2e9; }
.reading-section-links { display:flex; flex-wrap:wrap; gap:10px 24px; padding:10px 0 20px; }
.reading-section-links a { color:var(--gold-dark); font:600 12px/1.7 var(--sans); text-decoration:underline; text-underline-offset:4px; }
.reading-icon-gallery { padding:16px 0 24px; scroll-margin-top:24px; }
.reading-icon-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px 20px; }
.reading-icon-card { display:block; background:#f3efe5; padding:13px; border:1px solid #e4dac5; }
.reading-icon-card > div { display:flex; align-items:center; justify-content:center; height:245px; background:#e8e1d1; }
.reading-icon-card img { width:100%; height:100%; padding:10px; object-fit:contain; }
.reading-icon-card h3 { font:400 23px/1.2 var(--display); margin:17px 3px 8px; }
.reading-copy .reading-icon-card p { font:400 11px/1.8 var(--sans); margin:0 3px 15px; color:#626c67; }
.reading-icon-card > span { display:block; margin:0 3px 4px; color:var(--gold-dark); font:500 10px/1.6 var(--sans); }
.reading-icon-card:hover { background:#eae3d3; border-color:#b89a58; }
.reading-copy a.reading-icon-card,.reading-copy .reading-next a { text-decoration:none; }
.reading-copy a.reading-icon-card:hover h3,.reading-copy .reading-next a:hover h3 { text-decoration:underline; text-underline-offset:4px; }
.reading-icon-credits { margin-top:20px; color:#626c67; font:400 11px/1.8 var(--sans); }
.reading-icon-credits summary { cursor:pointer; color:var(--gold-dark); }
.reading-icon-credits a { text-decoration:underline; text-underline-offset:3px; }
.reading-next { border-top:1px solid var(--line); margin-top:45px; padding-top:30px; }
.reading-next > div { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:16px; }
.reading-next > div > a { padding:22px; border:1px solid var(--line); background:#f4f0e7; display:flex; flex-direction:column; }
.reading-next h3 { font:400 25px/1.25 var(--display); margin:0 0 14px; }
.reading-copy .reading-next p { font:400 12px/1.8 var(--sans); color:#626c67; margin:0 0 18px; }
.reading-next span { color:var(--gold-dark); font:600 11px/1.6 var(--sans); margin-top:auto; }
.reading-next a:hover { border-color:var(--gold); background:#ece5d6; }
.reading-figure img { height:auto; max-height:460px; object-fit:contain; }
.reading-image-open { position:relative; display:block; width:100%; padding:0; color:var(--ink); text-align:left; }
.reading-image-open > span { position:absolute; bottom:10px; right:10px; background:#fcfbf7ed; padding:8px 12px; font:500 10px/1.5 var(--sans); border:1px solid #d7cba9; }
.reading-image-dialog { width:min(1050px,94vw); max-width:none; max-height:94vh; padding:22px; background:var(--paper); color:var(--ink); border:1px solid var(--gold); }
.reading-image-dialog::backdrop { background:#15212ce8; }
.reading-image-dialog > div { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:16px; }
.reading-image-dialog h2 { font:400 25px/1.3 var(--display); margin:0; }
.reading-image-dialog button { min-width:44px; min-height:44px; border:1px solid var(--line); font:400 24px/1 var(--sans); }
.reading-image-dialog > img { width:auto; max-width:100%; max-height:72vh; object-fit:contain; margin:auto; }
.reading-image-dialog > p { font:400 11px/1.8 var(--sans); margin:14px 0 0; }
@media (max-width:1000px) { .reading-icon-cards { gap:18px 14px; } .reading-icon-card > div { height:200px; } }
@media (max-width:900px) {
  .depth-article .reading-layout.has-section-navigation { grid-template-columns:minmax(0,1fr); gap:0; }
  .section-navigation details { border-bottom:1px solid var(--line); }
  .section-navigation details nav { display:flex; flex-wrap:wrap; gap:0 20px; }
  .section-navigation details a { border:0; padding-block:8px; }
}
@media (max-width:600px) {
  .reading-icon-cards { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 12px; }
  .reading-icon-card { padding:9px; }
  .reading-icon-card > div { height:190px; }
  .reading-icon-card h3 { font-size:22px; }
  .reading-facts > div { grid-template-columns:1fr; gap:8px; }
  .reading-table th,.reading-table td { padding:12px 10px; font-size:12px; }
  .reading-table td:first-child { width:34%; }
  .reading-next > div { grid-template-columns:1fr; }
  .reading-steps li { padding-right:14px; font-size:14px; }
  .reading-image-dialog { padding:15px; }
  .reading-image-dialog h2 { font-size:21px; }
}
@media (max-width:360px) { .reading-icon-card > div { height:150px; } .reading-icon-card h3 { font-size:20px; } }
