/* Publications page — layout only.
   Loaded before styles.css / site.css (see research.qmd), so the
   shared stylesheets still win ties at equal specificity. */

/* Title and lead stack rather than sitting side by side. The two-column version
   needed `max-width:315px` on the H1 to force the title onto two
   lines; unconstrained it sets in one line at 64px inside the 968px text column,
   and only wraps once the viewport is too narrow to hold it. */
.rs-header{
  max-width:var(--max);margin:48px auto 0;padding:0 56px;
}
.rs-header .titles .page-title{margin:0;text-wrap:balance}
.rs-header .lead{
  font-family:'Cormorant Garamond',serif;font-size:24px;line-height:1.55;
  color:var(--ink-2);margin:16px 0 0;max-width:66ch;text-wrap:pretty;
}
.rs-header .lead em{color:var(--sage);font-style:italic}

.rs-block{max-width:var(--max);margin:80px auto 0;padding:0 56px}
.rs-block h2{
  font-family:'Cormorant Garamond',serif;font-weight:500;font-size:38px;
  margin:0 0 4px;color:var(--ink);
}
.rs-block .sub{
  font-family:'Inter',sans-serif;font-size:11px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--sage);margin-bottom:24px;font-weight:500;
}
/* Closes a list with the external profile holding the same record. .pub carries
   only a border-top, so the last row has no rule under it and the button does
   the closing itself. */
.rs-block .more{margin:28px 0 0}

.rs-cards{
  max-width:var(--max);margin:40px auto 0;padding:0 56px;
}
.rs-cards h2{
  font-family:'Cormorant Garamond',serif;font-weight:500;font-size:38px;
  margin:0 0 4px;color:var(--ink);
}
.rs-cards .sub{
  font-family:'Inter',sans-serif;font-size:11px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--sage);margin-bottom:28px;font-weight:500;
}
/* Same dark-mode treatment as the figures on the highlight pages themselves
   (see .rp-fig img in research-page.css) — these thumbnails are crops of those
   very figures, so they glare the same way. The filter goes on .thumb rather
   than on an img because the image is a background here, not an element. Scoped
   to .rs-cards so it does not reach the Lab demo cards, which share .card. */
:root[data-theme="dark"] .rs-cards .card .thumb{
  filter:brightness(.86) sepia(.10) saturate(.95);
}

.rs-review{
  position:relative;
  max-width:var(--max);margin:80px auto 0;padding:32px 56px 0;
  display:grid;grid-template-columns:1.6fr 1fr;gap:48px;align-items:start;
}
/* Drawn inside the padding instead of as the block's border-top. As a border it
   spanned the whole 1080px border-box, which made it 112px wider than every
   other rule on the page (.pub hairlines sit inside the same 56px) and pushed
   its right end under the section rail. Absolute rather than a ::before in flow,
   so it does not become a third grid item. */
.rs-review::before{
  content:"";position:absolute;top:0;left:56px;right:56px;
  height:1px;background:var(--rule);
}
.rs-review h2{
  font-family:'Cormorant Garamond',serif;font-weight:500;font-size:34px;
  margin:0 0 4px;color:var(--ink);
}
.rs-review .sub{
  font-family:'Inter',sans-serif;font-size:11px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--sage);margin-bottom:18px;font-weight:500;
}
.rs-review img.illu{display:block;margin:0 auto;max-width:200px;width:100%;height:auto}
.rs-review .illu-cap{
  text-align:center;font-family:'Cormorant Garamond',serif;font-style:italic;
  font-size:14px;color:var(--ink-3);margin-top:8px;
}

/* The section rail, its scroll-behavior and the `scroll-margin` on its `#sec-*`
   jump targets are all shared with Work and live in site.css. */

@media (max-width:900px){
  .rs-header,.rs-block,.rs-cards,.rs-review{padding-left:24px;padding-right:24px}
  .rs-header{margin-top:32px}
  .rs-header .lead{font-size:22px;margin-top:14px}
  .rs-block,.rs-cards,.rs-review{margin-top:48px}
  .rs-review{grid-template-columns:1fr;gap:24px}
  .rs-review::before{left:24px;right:24px}
}