/* ---------------------------------------------------------------
   Syndicate rebuild — corrections over the inherited theme.
   Each rule maps to a numbered item on Christian's punch list.
   --------------------------------------------------------------- */

/* 1 — the symposium intro rendered larger than the contributions.
      Both now sit at the body size so the page reads as one piece. */
#symposium-intro .symposium-description,
#symposium-intro .symposium-description p,
#symposium-intro .entry-content p {
  font-size: 1rem;
  line-height: 1.9;
}

/* 2 — the epigraph was marked up as <h3><em>, i.e. a heading, which is
      why it was enormous. Treated as a pull quote instead. */
.commentary-body > h3:first-child,
.commentary-body > h3:first-child + h3,
.commentary-body > .epigraph {
  font-size: 1.0625rem;
  line-height: 1.6;
  font-style: italic;
  font-weight: 400;
  color: #3a3a3a;
  margin: 0 0 .6rem;
  padding-left: 1.1rem;
  border-left: 3px solid #c9c2b6;
  max-width: 34rem;
}
.commentary-body > h3:first-child em,
.commentary-body > h3:first-child + h3 em { font-style: italic; font-weight: 400; }
.commentary-body > h5 { /* the attribution line under an epigraph */
  font-size: .9375rem; font-weight: 400; font-style: normal;
  color: #6b6b6b; margin: 0 0 1.8rem; padding-left: 1.1rem;
}

/* 4 — the quote marks around a contribution title were floating.
      Generated marks removed; real marks sit inline on the baseline. */
.commentary-title::before, .commentary-title::after,

/* 3 — the sidebar was a wall of identical "Reply by X" lines.
      Grouped under the contribution, exchange summarised, names not repeated. */

/* 5 + 6 — the footnote popup opened empty and left a stray numbered box.
      Replaced with a self-contained implementation; the source list is
      kept in the page for printing and for readers without JS. */
.fn-ref { font-size: .72em; vertical-align: super; line-height: 0;
          padding: .12em .42em; margin-left: .15em; border-radius: 1em;
          background: #e8e3d9; color: #3a3a3a; text-decoration: none; cursor: pointer; }
.fn-ref:hover { background: #d8d1c4; }
.fn-pop { position: absolute; z-index: 60; max-width: 26rem; background: #fff;
          border: 1px solid #d8d1c4; border-radius: 6px; padding: .85rem 1rem;
          box-shadow: 0 6px 24px rgba(0,0,0,.14); font-size: .9375rem; line-height: 1.55; }
.fn-pop p { margin: 0 0 .5rem; } .fn-pop p:last-child { margin: 0; }
.fn-pop .fn-close { position: absolute; top: .15rem; right: .25rem; cursor: pointer;
                    color: #8a8a8a; font-size: 1.15rem; line-height: 1;
                    background: none; border: 0; padding: .35rem .5rem; }
.fn-pop .fn-close:hover, .fn-pop .fn-close:focus-visible { color: #222; }
.fn-pop .fn-pop-body { padding-right: 1.1rem; }
.footnotes { margin-top: 2.5rem; padding-top: 1rem; border-top: 1px solid #e3ded5; font-size: .875rem; }
.footnotes ol { padding-left: 1.2rem; } .footnotes li { margin-bottom: .5rem; }


/* --------------------------------------------------------------------
   Measured against the live site and set explicitly, because the grid
   and font rules the theme relies on do not reach this markup.
   -------------------------------------------------------------------- */
#symposium-intro { max-width: 1100px; margin-left: auto; margin-right: auto; }
/* The 759px column comes from the theme once #commentary-wrap is nested inside
   .et_pb_column_2_3, as it is on the original. Forcing a width and auto-margins
   here centred it in the full viewport instead, which is what pushed the
   commentary titles off-axis from the body column. */
@media (max-width: 820px) { .commentary-block .row, .commentary-block .col-sm-8 { width: 100%; padding: 0 1.25rem; } }

.commentary-body, .response-content,
#symposium-intro .symposium-intro {
  font-family: "Crimson Text", Georgia, serif;
  font-size: 20px; line-height: 34px;
}
.commentary-body p, .response-content p { margin: 0 0 1.1rem; }

/* the visible title is .post-title; .commentary-title is hidden by the theme */
.commentary-block .post-title, .response-block .post-title {
  display: block; text-align: center; font-size: 29px; line-height: 1.25;
  margin: .2rem 0 1.2rem; font-family: "Work Sans", system-ui, sans-serif; font-weight: 700;
}
.response-block .post-title { font-size: 23px; }
.commentary-block .intro-author, .response-block .intro-author {
  display: block; text-align: center; font-size: 15px;
  font-family: "Work Sans", system-ui, sans-serif; margin: 0 0 .2rem;
}
.commentary-block .symposium-info, .response-block .symposium-info { text-align: center; }
/* The original leaves .author-thumb inline and lets the centred text block
   centre it; forcing display:block stretched the span to the column width. */
.author-thumb img { width: 75px; height: 75px; border-radius: 50%; object-fit: cover; }

/* --- measured against the live original, 2026-10-30 --- */
/* symposium h1 renders 40px/40px on the original; a generic .post-title rule
   in the inlined theme CSS was knocking it down to 30px here. */
.symposium-info h1.post-title { font-size: 40px; line-height: 40px; }

/* --- in-content typography, measured against the original 2026-11-01 ---
   Divi emits per-page dynamic CSS (et-divi-dynamic-<post-id>.css) and the
   static build ships one page's cache for all 344, so headings inside
   commentary bodies fell back to a lighter, smaller default. Pin them. */
/* Section headings inside a contribution were 34px against the contribution
   title's 29px, so a sub-heading outranked the thing it sits under. Step them
   below the title: 29 (title) > 21 (section) > 18 (sub-section) > 16 (body). */
.commentary-body h2, .response-content h2 { font-size: 21px; line-height: 28px; font-weight: 700; }
.commentary-body h3, .response-content h3 { font-size: 18px; line-height: 26px; font-weight: 700; }
.commentary-body h4, .response-content h4 { font-size: 16px; line-height: 26px; font-weight: 700; }
.commentary-body h2, .response-content h2,
.commentary-body h3, .response-content h3 { margin-top: 1.4rem; }
.commentary-body p,  .response-content p  { margin-bottom: 0; }

/* Punch-list item 1, properly this time. The intro renders at 20px while
   commentary and response paragraphs render at 16px — true on the original
   too. Christian wants the introduction to read at body-copy size. */
.symposium-intro, .symposium-intro p { font-size: 16px; line-height: 34px; }


/* --- round 5, 2026-11-02 --- */
/* Lists inside contributions render 20px/26px on the original, which reads as
   a different, larger typeface next to 16px body copy. Match the body, as the
   symposium intro now does. */
.commentary-body ol, .commentary-body ul,
.response-content ol, .response-content ul,
.commentary-body li, .response-content li { font-size: 16px; line-height: 34px; }
/* paragraphs in this design carry margin-bottom:0 and let line-height do the
   spacing, so lists match -- otherwise they add dead space at the block end */
.commentary-body ol, .commentary-body ul,
.response-content ol, .response-content ul { padding-left: 2.2rem; margin: 0; }
.commentary-body li, .response-content li { margin-bottom: .35rem; }

/* The original leaves 60px of padding plus a 40px margin below the last line of
   a contribution, which reads as dead space rather than breathing room. */
/* The theme sets this with !important at .single-symposium specificity, so
   matching it is the only way to win: padding:30px 30px 60px!important */
.single-symposium .commentary-block,
.single-symposium .response-block { padding-bottom: 28px !important; }


/* Reading text was #666 on an #f8f7f4 ground -- legible but washed out. Darker
   without going to black, so the type carries. Headings stay #333 and lead on
   size and weight. */
.commentary-body, .commentary-body p, .commentary-body li,
.response-content, .response-content p, .response-content li,
.symposium-intro, .symposium-intro p,
.commentary-body blockquote, .response-content blockquote { color: #3a3a3a; }

/* Progressive reveal — only ever active when reveal.js has marked the cards */
.symposium.reveal-pending { opacity: 0; transform: translateY(10px); }
.symposium.reveal-in {
  opacity: 1; transform: none;
  transition: opacity .45s ease-out, transform .45s ease-out;
}
@media (prefers-reduced-motion: reduce) {
  .symposium.reveal-pending, .symposium.reveal-in { opacity: 1; transform: none; transition: none; }
}

/* --- unplaced responses (archive for contributions whose parent is gone) --- */
.archive-note { margin: 0 0 1.6rem; padding: .75rem 1rem; border-left: 3px solid #c0552f;
                background: rgba(199,206,199,.22); }
.archive-note p { margin: 0; font-size: 15px; line-height: 26px; color: #4a4a4a; font-style: italic; }
/* the theme drop-caps the first paragraph of a contribution; not this one */
.commentary-body .archive-note p::first-letter,
.response-content .archive-note p::first-letter,
.archive-note p::first-letter { font-size: 15px !important; float: none !important;
                                line-height: 26px !important; font-weight: inherit !important; }
.sidebar-nav .intro-box { background: rgba(199,206,199,.5); border-radius: 10px 10px 0 0;
                          padding: .9rem 1.2rem .2rem; }
.sidebar-nav .archive-link { background: rgba(199,206,199,.5); border-radius: 0 0 10px 10px;
                             margin: 0; padding: .2rem 1.2rem 1rem; }
.archive-link a { font-size: 15px; }

.unplaced-lead { font-size: 16px; line-height: 34px; color: #3a3a3a; margin: 0 0 1.6rem; }
.unplaced-lead::first-letter { font-size: inherit; float: none; }
.unplaced-list { list-style: none; margin: 0 0 2rem; padding: 0; }
.unplaced-list li { border-bottom: 1px solid #e3ded5; list-style: none; }
.unplaced-list li::marker { content: none; }
.unplaced-list li:last-child { border-bottom: 0; }
.unplaced-list > li > a { display: grid; grid-template-columns: 56px 1fr auto; align-items: center;
                   gap: 0 1rem; padding: .85rem .25rem; text-decoration: none; }
.unplaced-list .author-thumb img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; }
.unplaced-list .unplaced-author { grid-column: 2; font-family: "Work Sans", sans-serif;
                                  font-size: 12px; letter-spacing: .04em; text-transform: uppercase;
                                  color: #6b6b6b; }
.unplaced-list .unplaced-title { grid-column: 2; font-size: 17px; line-height: 24px; color: #333; }
.unplaced-list .unplaced-date { grid-column: 3; grid-row: 1 / span 2; font-size: 13px; color: #8a8a8a;
                                font-variant-numeric: tabular-nums; }
.unplaced-list > li > a:hover .unplaced-title { text-decoration: underline; }
@media (max-width: 640px) {
  .unplaced-list > li > a { grid-template-columns: 44px 1fr; }
  .unplaced-list .unplaced-date { grid-column: 2; grid-row: auto; }
}
.unplaced-list li { display: block; }
.unplaced-list .unplaced-likely { display: block; width: 100%; box-sizing: border-box;
                                  padding: 0 .25rem .85rem 4.5rem; margin-top: -.55rem;
                                  font-size: 13px; line-height: 20px; color: #6b6b6b;
                                  white-space: normal; }
.unplaced-list .unplaced-likely a { color: #6b6b6b; text-decoration: underline; }

/* Cover-only cards carry no card chrome -- on the full-list pages the covers sit
   straight on the page, and the channel backlist/forthcoming rows should match
   rather than float a small cover inside a large white box. */
/* Only the 3-up channel grid needs this. The non-small grid (the forthcoming
   row and the full-list pages) already lays covers out correctly -- stripping
   its padding collapsed the forthcoming covers into each other. */
.s-symposia.small .symposium.cover-only {
  background: none; box-shadow: none; border: 0; padding: 0; min-height: 0;
}
/* Only the 3-up channel grid needs the cover sized to its cell. The full-list
   and forthcoming rows are sized by the theme already -- forcing width there
   stretched each cover to the full row. */
.s-symposia.small .symposium.cover-only > a,
.s-symposia.small .symposium.cover-only .symposium-thumb-container,
.s-symposia.small .symposium.cover-only .symposium-thumb {
  display: block; width: 100%; max-width: 100%; margin: 0; padding: 0; float: none;
}
.s-symposia.small .symposium.cover-only .symposium-thumb img {
  width: 100%; height: auto; display: block;
}

/* Backlist covers are intentionally a compact catalogue grid everywhere they
   appear (home, full backlist, and channel pages). Keep the same proportions
   as the forthcoming row while allowing the grid to breathe responsively. */
.s-symposia.small .symposium.cover-only {
  box-sizing: border-box;
  display: inline-block;
  vertical-align: top;
  width: calc(20% - 1px);
  padding: 10px;
}
.s-symposia.small .symposium.cover-only .symposium-thumb img {
  height: auto !important;
  max-width: 100%;
  object-fit: contain;
}
@media (max-width: 900px) {
  .s-symposia.small .symposium.cover-only { width: calc(25% - 1px); }
}
@media (max-width: 640px) {
  .s-symposia.small .symposium.cover-only { width: calc(50% - 1px); }
}

/* Symposium cards: keep the shared card close to its actual content.  The
   theme's three-column rule gives the text a large empty flex track and the
   default intro-author rule draws a detached rust line above the card. */
.s-symposia .symposium {
  box-sizing: border-box;
  display: inline-flex;
  flex-direction: row;
  width: fit-content !important;
  max-width: 100%;
  flex: 0 1 auto !important;
  gap: 14px;
  padding: 12px !important;
  align-items: flex-start;
}
.s-symposia .symposium .symposium-thumb-container {
  width: 160px !important;
  flex: 0 0 160px;
  margin: 0 !important;
}
.s-symposia .symposium .symposium-info-container {
  width: 360px !important;
  flex: 0 1 360px;
  margin: 0 !important;
  padding: 0 !important;
}
.s-symposia .symposium .symposium-info {
  margin: 0 !important;
  padding: 0 !important;
}
.s-symposia .symposium .symposium-info .intro-author {
  display: flex;
  align-items: baseline;
  gap: .45rem;
  margin: 8px 0 0 !important;
  padding: 0 !important;
  line-height: 1.2;
}
.s-symposia .symposium .symposium-info .intro-author .post-date {
  font-size: 0 !important;
  white-space: nowrap;
}
.s-symposia .symposium .symposium-info .intro-author .post-date::after {
  display: inline-block;
  content: 'CONVENED BY' !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  color: #777 !important;
  background: transparent !important;
  border: 0 !important;
  font: 600 10px/1.2 "Work Sans", "Open Sans", sans-serif !important;
  letter-spacing: .04em;
}
.s-symposia .symposium .symposium-info .intro-author .intro-author-name,
.s-symposia .symposium .symposium-info .intro-author .intro-author-name a {
  margin: 0 !important;
  font: 600 11px/1.2 "Work Sans", "Open Sans", sans-serif !important;
}
.s-symposia .symposium .symposium-info .intro-author::after {
  display: none !important;
  content: none !important;
  border: 0 !important;
}
.s-symposia .symposium .panelist-list a {
  display: block;
  margin: 0 0 4px !important;
}
.s-symposia .symposium .panelist {
  line-height: 1.1;
}
.s-symposia .symposium .panelist .author-thumb img {
  width: 28px;
  height: 28px;
  margin-right: 7px;
}
@media (max-width: 767px) {
  .s-symposia .symposium {
    flex-direction: column;
    width: 100% !important;
    gap: 12px;
    padding: 10px !important;
  }
  .s-symposia .symposium .symposium-thumb-container {
    width: 110px !important;
    flex-basis: 110px;
  }
  .s-symposia .symposium .symposium-info-container {
    width: auto !important;
    flex: 1 1 auto;
    min-width: 0;
  }
}

/* The same card is used as the intro on each symposium page, where it is not
   wrapped in .s-symposia. Keep the treatment identical there. */
#symposium-intro .symposium {
  box-sizing: border-box;
  display: flex;
  width: fit-content !important;
  max-width: 100%;
  gap: 14px;
  padding: 12px !important;
  align-items: flex-start;
}
#symposium-intro .symposium .symposium-thumb-container {
  width: 160px !important;
  flex: 0 0 160px;
  margin: 0 !important;
}
#symposium-intro .symposium .symposium-info-container {
  width: 360px !important;
  flex: 0 1 360px;
  margin: 0 !important;
  padding: 0 !important;
}
#symposium-intro .symposium .symposium-info {
  margin: 0 !important;
  padding: 0 !important;
}
#symposium-intro .symposium .intro-author {
  display: flex;
  align-items: baseline;
  gap: .45rem;
  margin: 8px 0 0 !important;
  padding: 0 !important;
  line-height: 1.2;
}
#symposium-intro .symposium .intro-author .post-date {
  font-size: 0 !important;
  white-space: nowrap;
}
#symposium-intro .symposium .intro-author .post-date::after {
  display: inline-block;
  content: 'CONVENED BY' !important;
  margin: 0 !important;
  color: #777 !important;
  background: transparent !important;
  border: 0 !important;
  font: 600 10px/1.2 "Work Sans", "Open Sans", sans-serif !important;
  letter-spacing: .04em;
}
#symposium-intro .symposium .intro-author .intro-author-name,
#symposium-intro .symposium .intro-author .intro-author-name a {
  margin: 0 !important;
  font: 600 11px/1.2 "Work Sans", "Open Sans", sans-serif !important;
}
#symposium-intro .symposium .intro-author::after {
  display: none !important;
  content: none !important;
  border: 0 !important;
}
/* No detached rule belongs beneath a convener line, including cards rendered
   outside the two listing wrappers above. */
.symposium-info .intro-author::after {
  display: none !important;
  content: none !important;
  border: 0 !important;
}
@media (max-width: 767px) {
  #symposium-intro .symposium {
    width: 100% !important;
    gap: 12px;
    padding: 10px !important;
  }
  #symposium-intro .symposium .symposium-thumb-container {
    width: 110px !important;
    flex-basis: 110px;
  }
  #symposium-intro .symposium .symposium-info-container {
    width: auto !important;
    flex: 1 1 auto;
    min-width: 0;
  }
}
