/* ============================================================
   Our research — /research/
   Light hero → evidence base (split) → published & presented (tint) → programme (dark band)
   → partners + leads → take part (tint) → CTA.
   Reuses the shared .block / .section-head / .grid / .btn set; only page-specific surfaces here.
   Data: src/_data/research.json (evidence, presentations, studies).
   ============================================================ */

/* ---- Hero (light) — mirrors .ab-hero ---- */
.rs-hero { position:relative; overflow:hidden; padding:150px 0 var(--space-3xl);
  background:linear-gradient(180deg, var(--brand-50) 0%, #fff 72%); }
.rs-hero h1 { letter-spacing:-.02em; color:var(--color-secondary); max-width:15em; }
.rs-hero h1 .hl { color:var(--color-primary); }

/* ---- Evidence base (split): copy left, cited domains right ---- */
.rs-why { display:grid; grid-template-columns:1.15fr 1fr; gap:var(--space-xl); align-items:center; }
.rs-why-copy h2 { color:var(--color-secondary); }
.rs-why-copy > p { font-size:var(--text-md); line-height:var(--line-relaxed); color:var(--color-ink-soft); margin:var(--space-s) 0 0; max-width:36em; }
.rs-pillars { display:grid; gap:var(--space-s); }
.rs-pillar { background:var(--brand-25); border-radius:var(--radius-lg); padding:var(--space-m) var(--space-l); box-shadow:var(--shadow-xs); }
.rs-pillar h3 { margin:0 0 var(--space-3xs); font-size:var(--text-md); color:var(--color-secondary); }
.rs-pillar p { margin:0; font-size:var(--text-sm); color:var(--color-ink-soft); line-height:var(--line-relaxed); }

/* ---- Published & presented: media left, citation right (one row per item) ---- */
.rs-papers { display:grid; gap:var(--space-2xl); }
.rs-paper { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); gap:var(--space-xl); align-items:center; }
.rs-paper-media { position:relative; display:block; border-radius:var(--radius-lg); overflow:hidden; background:#fff;
  border:1px solid var(--color-border-soft); box-shadow:var(--shadow-md); }
a.rs-paper-media { transition:transform .18s var(--ease), box-shadow .18s var(--ease); }
a.rs-paper-media:hover { transform:translateY(-3px); }
.rs-paper-media img { display:block; width:100%; height:auto; }
/* Conference lockups have no poster art, so they sit centred in a fixed-ratio tile instead. */
.rs-paper-media.is-logo { display:flex; align-items:center; justify-content:center; aspect-ratio:4 / 3; padding:var(--space-2xl); box-shadow:var(--shadow-xs); }
.rs-paper-media.is-logo img { width:auto; max-width:100%; max-height:100%; object-fit:contain; }
/* Marks that are light-on-transparent (Compass) need a dark ground or they vanish. */
.rs-paper-media.on-dark { background:var(--color-secondary); border-color:transparent; }
.rs-paper-flag { position:absolute; top:var(--space-s); left:var(--space-s); font-size:var(--text-xs); font-weight:var(--weight-extrabold);
  letter-spacing:.08em; text-transform:uppercase; color:#fff; background:var(--color-secondary); border-radius:var(--radius-full); padding:var(--space-3xs) var(--space-xs); }
.rs-tag { display:inline-block; font-size:var(--text-xs); font-weight:var(--weight-extrabold); letter-spacing:.08em; text-transform:uppercase;
  color:#fff; background:linear-gradient(150deg,var(--color-accent),var(--color-primary)); border-radius:var(--radius-full); padding:var(--space-3xs) var(--space-xs); }
.rs-paper-body h3 { color:var(--color-secondary); font-size:var(--text-xl); letter-spacing:-.01em; margin:var(--space-s) 0 var(--space-xs); line-height:var(--line-normal); }
.rs-paper-authors { margin:0; font-weight:var(--weight-semibold); color:var(--color-ink); }
.rs-paper-aff { margin:var(--space-3xs) 0 0; font-size:var(--text-sm); color:var(--color-ink-soft); }
.rs-paper-venue, .rs-paper-where { display:flex; align-items:center; gap:var(--space-2xs); margin:var(--space-s) 0 0; font-weight:var(--weight-bold); color:var(--color-primary); }
.rs-paper-where { margin-top:var(--space-3xs); font-weight:var(--weight-regular); font-size:var(--text-sm); color:var(--color-ink-soft); }
.rs-paper-venue svg, .rs-paper-where svg { width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:2; flex:none; }
.rs-paper-summary { margin:var(--space-s) 0 0; font-size:var(--text-md); line-height:var(--line-relaxed); color:var(--color-ink-soft); }

/* ---- Programme (dark band) ---- */
.rs-studies { background:var(--grad-deep); color:#fff; position:relative; overflow:hidden; }
.rs-studies h2 { color:#fff; }
.rs-studies .section-head p { color:rgba(255,255,255,.82); }
.rs-studies .eyebrow.on-dark { color:var(--brand-200); }
.rs-grid { position:relative; z-index:1; }
.rs-study { display:flex; flex-direction:column; align-items:flex-start; gap:var(--space-xs); padding:var(--space-l);
  border-radius:var(--radius-lg); background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); }
.rs-study h3 { margin:0; color:#fff; font-size:var(--text-lg); letter-spacing:-.01em; }
.rs-study p { margin:0; color:rgba(255,255,255,.82); font-size:var(--text-md); line-height:var(--line-relaxed); }

/* ---- Partners + leads ---- */
.rs-people { display:grid; grid-template-columns:1.1fr 1fr; gap:var(--space-xl); align-items:center; }
/* No named leads → the partners card is the whole row, centred, not stranded in the left half. */
.rs-people.rs-people-solo { grid-template-columns:minmax(0,760px); justify-content:center; }
.rs-people.rs-people-solo .rs-partners-row { grid-template-columns:repeat(4, auto); justify-content:center; }
@media (max-width:820px) { .rs-people.rs-people-solo .rs-partners-row { grid-template-columns:1fr 1fr; } }
.rs-partners { background:var(--brand-25); border-radius:var(--radius-lg); padding:var(--space-l); text-align:center; box-shadow:var(--shadow-xs); }
.rs-partners-lead { margin:0 0 var(--space-l); font-size:var(--text-sm); font-weight:var(--weight-bold); letter-spacing:.06em; text-transform:uppercase; color:var(--color-ink-soft); }
/* Four lockups of very different proportions, so each gets an equal tile and is contained in it. */
.rs-partners-row { display:grid; grid-template-columns:1fr 1fr; gap:var(--space-l) var(--space-m); align-items:center; justify-items:center; }
.rs-partner { display:flex; align-items:center; justify-content:center; height:72px; width:100%; }
.rs-partner img { max-height:72px; max-width:100%; width:auto; height:auto; object-fit:contain; }
.rs-leads { display:grid; gap:var(--space-s); }
.rs-lead { display:grid; grid-template-columns:auto 1fr; gap:var(--space-m); align-items:center; margin:0;
  background:var(--brand-25); border-radius:var(--radius-lg); padding:var(--space-m) var(--space-l); box-shadow:var(--shadow-xs); }
.rs-lead-av { width:64px; height:64px; border-radius:var(--radius-full); flex:none; overflow:hidden; display:flex; align-items:center; justify-content:center;
  background:var(--grad-chip); color:#fff; font-weight:var(--weight-extrabold); font-size:var(--text-md); letter-spacing:.02em; }
.rs-lead-av img { width:100%; height:100%; object-fit:cover; display:block; }
.rs-lead .name { display:block; font-weight:var(--weight-extrabold); color:var(--color-secondary); font-size:var(--text-md); }
.rs-lead .role { display:block; margin-top:var(--space-3xs); font-size:var(--text-sm); color:var(--color-ink-soft); }

/* ---- Take part ---- */
.rs-join { display:grid; grid-template-columns:1.25fr 1fr; gap:var(--space-xl); align-items:center; }
.rs-join-copy h2 { color:var(--color-secondary); }
.rs-join-copy > p { font-size:var(--text-md); line-height:var(--line-relaxed); color:var(--color-ink-soft); margin:var(--space-s) 0 var(--space-m); max-width:34em; }
.rs-join-list { list-style:none; margin:0; padding:0; display:grid; gap:var(--space-s); }
.rs-join-list li { display:grid; gap:var(--space-3xs); background:#fff; border-radius:var(--radius-lg); padding:var(--space-m) var(--space-l); box-shadow:var(--shadow-xs); }
.rs-join-list strong { color:var(--color-secondary); }
.rs-join-list span { font-size:var(--text-sm); color:var(--color-ink-soft); line-height:var(--line-normal); }

/* ---- Reveal timing: these blocks are tall, so finish the fade as they enter (see about.css) ---- */
@supports (animation-timeline: view()) {
  .reveal { animation-range: entry 0% entry 35%; }
  .reveal.d1 { animation-range: entry 5% entry 40%; }
  .reveal.d2 { animation-range: entry 10% entry 45%; }
  .reveal.d3 { animation-range: entry 15% entry 50%; }
}

/* ---- Responsive ---- */
@media (max-width:920px){
  .rs-why, .rs-people, .rs-join, .rs-paper { grid-template-columns:1fr; gap:var(--space-l); }
  .rs-paper-media.is-logo { aspect-ratio:16 / 7; padding:var(--space-xl); }
}
@media (max-width:680px){
  .rs-hero { padding-top:122px; }
  .rs-partners-row img { height:44px; }
}
