/* ============================================================
   PAGE BUILDER pb-speak-research
   speaking.html + research.html only.
   Loaded right after fable.css. Never edits fable.css; every rule
   here is scoped to body.pg-speaking or body.pg-research so it can
   never leak onto a page this builder does not own. Per
   DMITRY-REDESIGN-2026-09/30-FINAL-DESIGN-SPEC.md section 2 + the
   section 6 orchestrator overrides (6.1 palette, 6.2 surfaces,
   6.3 illustrations). Zero em or en dashes anywhere, including in
   these comments.
   ============================================================ */

/* ============================================================
   SPEAKING.HTML
   ============================================================ */

/* ---- talk topics (folio 02), now navy: .row-light is additive to
   the row's own existing hover expand (spec 1.3). The dark text
   colors already come from fable.css's own dark-readiness pass
   (.sec-dark .speak__t / .speak__note / .speak__go); this file only
   adds the directional wash. ---- */
body.pg-speaking #speakTopics .speak__li{position:relative;}

/* ---- SHARED-FIX workaround, scoped to this page only: .ill .dr-c
   and .dr-g have a sec-dark/on-dark override for .dr and .dr-soft
   (fable.css ~1322-1323) but not for the crimson/gold accent paths,
   so the talk-topics heart+ECG mark's gold line goes near-invisible
   on the new navy ground. See SHARED FIXES NEEDED in the build
   report for the fable.css rule this really belongs in. ---- */
body.pg-speaking .sec-dark .ill .dr-g,body.pg-speaking .on-dark .ill .dr-g{stroke:var(--gold-soft);}
body.pg-speaking .sec-dark .ill .dr-c,body.pg-speaking .on-dark .ill .dr-c{stroke:var(--crimson-bright);}

/* ---- close CTA (renumbered folio 07), now navy: same shared gap,
   this time on .ecgdiv (used sitewide, never yet flipped dark). ---- */
body.pg-speaking .sec-dark .ecgdiv .g,body.pg-speaking .on-dark .ecgdiv .g{stroke:rgb(var(--tan-rgb) / .55);}
body.pg-speaking .sec-dark .ecgdiv .c,body.pg-speaking .on-dark .ecgdiv .c{stroke:var(--crimson-bright);}

/* ============================================================
   NEW SECTION, folio 05: the 88 percent chart
   Ring on a .plate.plate--chart (never glass, per the unanimous
   "keep a referring physician's chart legible on an opaque ground"
   rule). Crimson untreated arc draws first, then LVAD, then
   transplant, meeting with zero gap or overlap (verified: 88% +
   6% + 6% = 100%; 316.8deg + 21.6deg + 21.6deg = 360deg exactly).
   ============================================================ */
body.pg-speaking #access-gap .lead-stmt{max-width:32ch;}

body.pg-speaking .ppt-plate{
  margin-top:clamp(2.2rem,4.5vw,3.2rem);max-width:700px;
  display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;
  column-gap:clamp(1.8rem,4vw,3rem);row-gap:1.4rem;align-items:center;
  padding:clamp(2rem,4.5vw,2.6rem) clamp(1.8rem,4.5vw,2.6rem) clamp(2.1rem,4.5vw,2.7rem);
}
body.pg-speaking .ppt-pie__wrap{grid-column:1;grid-row:1;display:flex;flex-direction:column;align-items:center;gap:.85rem;}
body.pg-speaking .ppt-pie{width:min(210px,42vw);height:auto;overflow:visible;}
body.pg-speaking .ppt-pie__base{fill:none;stroke:var(--hair);stroke-width:10;}
body.pg-speaking .ppt-pie__untreated{fill:none;stroke:var(--crimson-bright);stroke-width:14;stroke-linecap:round;}
/* LVAD/transplant: 6.1 names --on-dark (near white) and a mid steel
   navy. The ring sits on the LIGHT .plate (never glass), so literal
   --on-dark (about 1:1 contrast on the plate's white fill) would be
   invisible; --gold/--gold-deep are the correct plate-legible reading
   of that instruction, since the orchestrator's own 6.1 remap already
   turned those two tokens INTO "a steel navy for hairlines and small
   type on light grounds" (fable.css :root comment, ~line 36). See
   SHARED FIXES NEEDED for the exact clarifying rule this deserves. */
body.pg-speaking .ppt-pie__lvad{fill:none;stroke:var(--gold);stroke-width:14;}
body.pg-speaking .ppt-pie__tx{fill:none;stroke:var(--gold-deep);stroke-width:14;}
body.pg-speaking .ppt-pie__num{font-family:var(--label);font-weight:700;font-size:2.3rem;fill:var(--ink);transform-box:fill-box;transform-origin:center;}
body.pg-speaking .ppt-pie__cap{font-family:var(--label);font-size:.72rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;fill:var(--ink-soft);}
body.pg-speaking .ppt-pie__arc{cursor:pointer;}
body.pg-speaking .ppt-pie__arc:focus-visible{outline:2px solid var(--crimson-bright);outline-offset:3px;border-radius:4px;}
body.pg-speaking .ppt-pie__figure{max-width:30ch;text-align:center;font-family:var(--label);font-size:.78rem;line-height:1.5;color:var(--ink-soft);min-height:2.6em;}

body.pg-speaking .ppt-pie__key{grid-column:2;grid-row:1;list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.6rem;font-family:var(--body);font-size:.95rem;color:var(--ink);}
body.pg-speaking .ppt-pie__key .k{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:.6rem;vertical-align:middle;}
body.pg-speaking .ppt-pie__key .k--lvad{background:var(--gold);}
body.pg-speaking .ppt-pie__key .k--tx{background:var(--gold-deep);}
body.pg-speaking .ppt-src{grid-column:1/-1;grid-row:2;margin:0;font-family:var(--label);font-size:.72rem;line-height:1.55;color:var(--ink-faint);border-top:1px solid var(--hair);padding-top:1.1rem;}

@media(max-width:640px){
  body.pg-speaking .ppt-plate{grid-template-columns:1fr;justify-items:center;text-align:center;}
  body.pg-speaking .ppt-pie__wrap{grid-column:1;grid-row:1;}
  body.pg-speaking .ppt-pie__key{grid-column:1;grid-row:2;align-items:center;text-align:left;}
  body.pg-speaking .ppt-src{grid-row:3;}
}

/* draw-on: the inline stroke-dashoffset attributes in the HTML are
   the SAFE resting values (12 / 94), so a no-JS load, or a load
   where this stylesheet fails, still shows the finished chart, never
   a blank ring. Only when .js is present do these rules pull the
   arcs back to fully hidden so the reveal has something to draw. */
html.js body.pg-speaking .ppt-pie__untreated{stroke-dashoffset:100;transition:stroke-dashoffset 1.6s var(--ease-snap) .2s;}
html.js body.pg-speaking .ppt-pie__lvad{stroke-dashoffset:100;transition:stroke-dashoffset .6s var(--ease-snap) 1.9s;}
html.js body.pg-speaking .ppt-pie__tx{stroke-dashoffset:100;transition:stroke-dashoffset .6s var(--ease-snap) 2.3s;}
html.js #access-gap.is-in .ppt-pie__untreated{stroke-dashoffset:12;}
html.js #access-gap.is-in .ppt-pie__lvad{stroke-dashoffset:94;}
html.js #access-gap.is-in .ppt-pie__tx{stroke-dashoffset:94;}
@media(prefers-reduced-motion:reduce){
  html.js body.pg-speaking .ppt-pie__untreated{stroke-dashoffset:12!important;transition:none!important;}
  html.js body.pg-speaking .ppt-pie__lvad,html.js body.pg-speaking .ppt-pie__tx{stroke-dashoffset:94!important;transition:none!important;}
}

/* ============================================================
   RESEARCH.HTML  (R9, 2026-10-06)
   REQUIREMENTS P1 (heroes fill the page, nothing cut off), P2 (no thin line
   card art), P3 (a box answers with its border only), P4 (the lens means
   something), P5 (text directly on photos, ink sampled by the runtime, no
   scrims), M1 (gradient accent words), M2 (buttons). Every rule is scoped to
   body.pg-research so speaking.html, which shares this file, is never touched.
   Zero em or en dashes anywhere, including these comments.
   ============================================================ */

/* ---------------------------------------------------------------
   HERO  (.rhero): a full-viewport stage on flat navy. The heart is sized by the
   stage height; the copy and the six names sit bottom left.
   --------------------------------------------------------------- */
body.pg-research .rhero{
  --rh-top:88px;
  --rh-pad:clamp(20px,3vh,36px);
  --rh-pad:clamp(20px,3svh,36px);
  --rh-cell:calc(100vh - var(--rh-top) - var(--rh-pad));
  --rh-cell:calc(100svh - var(--rh-top) - var(--rh-pad));
  --rh-under:2rem;
  position:relative;isolation:isolate;overflow-x:clip;
  display:flex;align-items:stretch;
  min-height:100vh;min-height:100svh;
  padding-top:var(--rh-top);
  background:var(--navy-ground);
  color:var(--paper);
}
body.pg-research .rhero .sec-inner{
  position:relative;z-index:2;display:flex;width:100%;max-width:none;
  padding-inline:var(--gutter);padding-block:0 var(--rh-pad);
}
body.pg-research .rhero .phero__title{
  font-size:clamp(2.6rem,5.3vw,6rem);line-height:1;max-width:none;margin-bottom:1.1rem;color:var(--paper);
  overflow-wrap:break-word;
}
body.pg-research .rhero .phero__deck{max-width:34ch;color:var(--on-dark);font-size:clamp(1.05rem,1.5vw,1.4rem);}

body.pg-research .rheart{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-areas:"intro stage" "lens stage";
  grid-template-rows:minmax(0,1fr) auto;
  align-items:start;
  column-gap:clamp(1.4rem,4vw,4.2rem);row-gap:clamp(.9rem,2.2svh,1.6rem);
  width:100%;min-height:var(--rh-cell);
}
body.pg-research .rheart__intro{grid-area:intro;align-self:end;min-width:0;}
body.pg-research .rheart__lens{grid-area:lens;align-self:start;min-width:0;max-width:34rem;margin-bottom:1.9rem;}   /* room for the credit line on the bottom edge */
body.pg-research .rheart__stage{grid-area:stage;align-self:end;min-width:0;display:flex;flex-direction:column;align-items:center;}
/* the credit rides the bottom edge of the hero, bottom left, on the hint's line */
body.pg-research .rheart__credit{
  position:absolute;left:0;bottom:0;margin:0;justify-content:flex-start;text-align:left;
  font-size:.78rem;line-height:1.4;color:rgb(244 247 251 / .62);
}
body.pg-research .rheart__credit a{color:inherit;}
/* motion-kit.js wraps every <b> in main with a key-phrase highlight wash, which is right
   for body copy and wrong for the heart's own labels, so it is switched off inside the heart */
body.pg-research .heart3d .mkx-strong__wash{display:none;}

/* the heart settles in (opacity and scale only), then the lens tour starts */
@media(prefers-reduced-motion:no-preference){
  body.pg-research .rhero .heart3d__plate{transition:opacity .9s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1);transform-origin:50% 62%;}
  .js body.pg-research .rhero:not(.is-in) .heart3d__plate{opacity:0;transform:scale(.95);}
}

@media(max-width:1100px) and (min-width:901px){
  body.pg-research .rhero .phero__title{font-size:clamp(2.4rem,5.1vw,3.4rem);}
}
@media(max-width:900px){
  body.pg-research .rhero{--rh-top:84px;min-height:100vh;min-height:100svh;}
  body.pg-research .rhero .sec-inner{padding-block:1.2rem 2.2rem;}
  body.pg-research .rheart{
    grid-template-columns:minmax(0,1fr);
    grid-template-areas:"intro" "stage" "lens";
    grid-template-rows:auto;
    row-gap:1.2rem;min-height:0;
  }
  body.pg-research .rheart__lens{margin-bottom:0;}
  body.pg-research .rheart__intro{align-self:start;}
  body.pg-research .rheart__lens{max-width:none;}
  body.pg-research .rhero .phero__deck{max-width:46ch;}
  body.pg-research .rheart__credit{position:static;margin:.6rem 0 0;justify-content:center;text-align:center;}
}

/* ---------------------------------------------------------------
   #research  (the record): his photo is the ground, the type sits directly on it.
   The runtime (fable.js, PHOTO SYSTEM) writes data-ink per block.
   --------------------------------------------------------------- */
/* the copy is anchored to the top left: the darkest part of the photo is the cabinet (and, lower down, the monitor), the lit wall
   band between them is where nothing is set */
body.pg-research #research{
  display:flex;align-items:flex-start;
  min-height:100vh;min-height:100svh;
  padding-top:clamp(6.5rem,13vh,9rem);padding-bottom:clamp(3rem,8vh,6rem);
}
body.pg-research #research .sec-inner{width:100%;max-width:none;padding-inline:var(--gutter);padding-block:0;}
body.pg-research #research .research__grid{display:block;}
body.pg-research #research .research__col{max-width:min(38vw,32rem);}
/* the numeral is solid ink, never the old pale pink gradient with a glow */
body.pg-research #research .research__big{
  font-size:clamp(5.5rem,10vw,9rem);font-weight:600;line-height:.86;letter-spacing:-.03em;
  color:#F4F7FB;-webkit-text-fill-color:#F4F7FB;background:none;-webkit-background-clip:border-box;background-clip:border-box;filter:none;
}
body.pg-research #research .research__big sup{color:#FF6B75;-webkit-text-fill-color:#FF6B75;display:inline-block;transform-origin:20% 80%;}
body.pg-research #research .research__big[data-ink="dark"]{-webkit-text-fill-color:#9C1B27;color:#9C1B27;}
body.pg-research #research .research__big[data-ink="dark"] sup{color:#9C1B27;-webkit-text-fill-color:#9C1B27;}
body.pg-research #research .research__label{
  max-width:none;text-wrap:balance;font-size:clamp(1.55rem,2.4vw,2.3rem);line-height:1.1;margin:.8rem 0 .9rem;
}
body.pg-research #research .research__body{max-width:38ch;font-weight:500;font-size:clamp(1.05rem,1.3vw,1.2rem);line-height:1.6;color:var(--on-dark);margin-bottom:1.3rem;}
body.pg-research #research .row-cta{display:flex;flex-wrap:wrap;gap:1rem;}
/* R10-RESEARCH: the R8 journal article stack, free standing on the monitor (no panel, no glow). illus-kit draws it in,
   opens its folded corner and blinks the lit point; the hover (top sheet lifts and turns, ribbon and point glow) is illus-kit.css */
body.pg-research #research .research__art{margin:1.6rem 0 0;width:170px;}
body.pg-research #research .research__art{margin:clamp(1.2rem,3svh,2rem) 0 0;width:clamp(140px,min(14vw,24svh),230px);}
body.pg-research #research .research__art .il-frame{width:100%;min-width:0;max-width:none;}
/* the plus pops when the count lands; the body and the button arrive together one beat after the heading */
@media(prefers-reduced-motion:no-preference){
  body.pg-research #research .research__big.rs-arm sup{opacity:0;transform:scale(.6);transition:opacity .32s ease,transform .32s var(--ease-snap);}
  body.pg-research #research .research__big.rs-arm.is-pop sup{opacity:1;transform:none;}
  .js body.pg-research #research:not(.is-in) .research__after{opacity:0;transform:translateY(14px);}
  body.pg-research #research.is-in .research__after{opacity:1;transform:none;transition:opacity .42s ease .24s,transform .42s var(--ease-snap) .24s;}
}
@media (max-width:900px),(max-aspect-ratio:1/1){
  body.pg-research #research{display:block;padding-top:0;padding-bottom:0;}
  body.pg-research #research .sec-inner{padding-top:2rem;padding-bottom:3rem;}
  body.pg-research #research .research__col{max-width:36rem;}
  body.pg-research #research .research__big{font-size:clamp(5.2rem,26vw,7.5rem);}
  body.pg-research #research .research__label{font-size:1.5rem;}
  body.pg-research #research .research__body{font-size:1rem;}
  body.pg-research #research .row-cta .k4-btn{max-width:340px;width:100%;justify-content:center;}
  body.pg-research #research .research__art{margin-top:1.8rem;width:clamp(170px,46vw,230px);}
}

/* ---------------------------------------------------------------
   #trials  (paper): a full-bleed cath lab band, then a sticky stage with the real
   medical plate of the group in view beside three plain paper boxes
   --------------------------------------------------------------- */
body.pg-research #trials{padding-top:clamp(4rem,8vw,6.5rem);padding-bottom:var(--sec-pad);background:var(--paper);overflow:visible;}
body.pg-research #trials .sec-inner{padding-block:0;}
body.pg-research #trials .lead-stmt{font-size:clamp(2.6rem,5.4vw,4.75rem);max-width:14ch;}
body.pg-research #trials .prose{margin-top:1.25rem;max-width:50ch;font-size:1.3rem;line-height:1.5;color:var(--ink-soft);}
body.pg-research #trials .trials__band{
  position:relative;margin:clamp(2.5rem,5vw,4rem) 0 0;width:100%;height:clamp(340px,56.25vw,78svh);overflow:hidden;
  background:var(--navy-ground);border-radius:0;
}
body.pg-research #trials .trials__band img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:42% 46%;display:block;
}
body.pg-research #trials .trials__cap{margin:.9rem 0 clamp(2.4rem,5vw,4rem);font:400 .9375rem/1.5 var(--body);color:var(--ink-soft);letter-spacing:0;text-transform:none;}
body.pg-research #trials .tl{
  display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(2rem,4vw,4rem);align-items:start;
}
body.pg-research #trials .tl__stage{
  position:sticky;top:96px;height:min(calc(100svh - 140px),600px);
  display:grid;grid-template-rows:minmax(0,1fr);grid-template-columns:minmax(0,1fr);
  background:var(--navy-ground);border-radius:var(--stage-r);overflow:hidden;
}
body.pg-research #trials .tl__fig{
  grid-area:1 / 1;position:relative;justify-self:center;align-self:start;margin-top:5%;
  height:70%;aspect-ratio:var(--ar);
  opacity:0;transform:translateY(10px);pointer-events:none;
  transition:opacity .4s var(--ease-snap),transform .4s var(--ease-snap);
}
body.pg-research #trials .tl__fig.is-on{opacity:1;transform:none;}
/* R10-RESEARCH: the crimson light the plate sits in (R8 rt-art__glow); it and the plate answer a hovered box (inside the stage, never the box) */
body.pg-research #trials .tl__fig::before{
  content:'';position:absolute;inset:-24% -42%;z-index:0;pointer-events:none;border-radius:50%;
  background:radial-gradient(closest-side at 50% 52%,rgb(226 58 70 / .46),rgb(226 58 70 / .2) 50%,transparent 100%);
  opacity:.85;transition:opacity .5s var(--ease-snap);
}
body.pg-research #trials .tl__fig img{z-index:1;}
@media(hover:hover) and (pointer:fine){
  body.pg-research #trials .tl:has(.rt-grp:hover) .tl__fig.is-on{transform:translateY(-3px) scale(1.05);}
  body.pg-research #trials .tl:has(.rt-grp:hover) .tl__fig.is-on::before{opacity:1;}
}
body.pg-research #trials .tl__fig img{
  position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;transform-origin:50% 56%;
  filter:drop-shadow(0 16px 24px rgb(0 0 0 / .5));
}
/* the amyloid scan: one coral band passes the thickened wall each time its plate arrives, clipped to the heart */
body.pg-research #trials .tl__scan{
  position:absolute;inset:0;z-index:2;overflow:hidden;pointer-events:none;
  -webkit-mask:url(../images/med/amy-section.webp) center / contain no-repeat;mask:url(../images/med/amy-section.webp) center / contain no-repeat;
}
body.pg-research #trials .tl__scan i{
  position:absolute;left:0;right:0;top:-34%;height:34%;
  background:linear-gradient(180deg,transparent 0%,rgb(255 196 150 / .62) 52%,transparent 100%);
}
@media(prefers-reduced-motion:no-preference){
  /* R8 pace: the scan keeps sweeping the thickened wall while the amyloid plate is in view and the stage is on screen */
  body.pg-research #trials .tl__fig[data-art="amy"] .tl__scan i{animation:rtScan 3.4s ease-in-out infinite;animation-play-state:paused;}
  body.pg-research #trials .tl__stage.is-live .tl__fig.is-on[data-art="amy"] .tl__scan i{animation-play-state:running;}
  /* the lub-dub at R8 pace (1.7s), only on the plate in view and only while the stage is on screen */
  body.pg-research #trials .tl__fig[data-art="mcs"] img,body.pg-research #trials .tl__fig[data-art="hf"] img{animation:rtBeat 1.7s ease-in-out infinite;animation-play-state:paused;}
  body.pg-research #trials .tl__stage.is-live .tl__fig.is-on[data-art="mcs"] img,
  body.pg-research #trials .tl__stage.is-live .tl__fig.is-on[data-art="hf"] img{animation-play-state:running;}
}
@keyframes rtBeat{
  0%,100%{transform:scale(1);}
  12%{transform:scale(1.045);}
  22%{transform:scale(1.008);}
  34%{transform:scale(1.032);}
  52%{transform:scale(1);}
}
@keyframes rtScan{0%{transform:translateY(0);}100%{transform:translateY(400%);}}
body.pg-research #trials .tl__stage .rt-credit{
  position:absolute;left:1.2rem;right:1.2rem;bottom:.9rem;margin:0;font:400 .8125rem/1.5 var(--body);color:var(--on-dark-soft);
}
body.pg-research #trials .rt-credit a{color:inherit;text-decoration:underline;text-underline-offset:2px;}
body.pg-research #trials .rt-credit--m{display:none;}

body.pg-research #trials .rt{display:flex;flex-direction:column;gap:1.1rem;min-width:0;}
body.pg-research #trials .rt-grp{
  position:relative;display:block;
  padding:clamp(1.4rem,2.4vw,2.1rem);border-radius:var(--box-r);
  background:#fff;border:1px solid var(--line-light);box-shadow:none;color:var(--ink);
}
body.pg-research #trials .rt-grp.is-active{outline:var(--mkx-ring-w) solid var(--mkx-ring);outline-offset:0;}
body.pg-research #trials .rt-k{
  display:block;margin:0 0 1.1rem;font:800 clamp(1.5rem,2.3vw,2rem)/1.1 var(--display);letter-spacing:-.01em;text-transform:none;color:var(--ink);
}
body.pg-research #trials .rt-grp ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1.4rem;}
body.pg-research #trials .rt-grp li{display:flex;flex-direction:column;gap:.3rem;}
body.pg-research #trials .trial-hd{display:flex;align-items:baseline;gap:.6rem;}
body.pg-research #trials .trial-hd b{font-family:var(--display);font-weight:800;font-size:1.15rem;color:var(--ink);letter-spacing:-.005em;}
body.pg-research #trials .trial-role{
  margin-left:auto;padding:0;background:none;border-radius:0;
  font:600 .875rem/1 var(--body);letter-spacing:0;text-transform:none;color:var(--ink-soft);
}
body.pg-research #trials .trial-role--lead{color:var(--crimson);}
body.pg-research #trials .trial-d{font:400 1rem/1.5 var(--body);color:var(--ink-soft);}
@media(max-width:900px){
  body.pg-research #trials .tl{grid-template-columns:minmax(0,1fr);gap:1.4rem;}
  body.pg-research #trials .tl__stage{
    top:88px;height:34svh;z-index:2;border-radius:0;
    margin-inline:calc(var(--gutter) * -1);background:#0C1833;
  }
  body.pg-research #trials .tl__fig{height:82%;margin-top:3%;}
  body.pg-research #trials .tl__stage .rt-credit{display:none;}
  body.pg-research #trials .rt-credit--m{display:block;margin:.4rem 0 0;font:400 .8125rem/1.5 var(--body);color:var(--ink-soft);}
}
@media(max-width:640px){
  body.pg-research #trials .trials__band{height:min(120vw,62svh);}
  body.pg-research #trials .trials__band img{object-position:42% 50%;}
  body.pg-research #trials .prose{margin-top:1rem;font-size:1.1rem;}
}

/* ---------------------------------------------------------------
   #publications  (navy): a clean ledger, the heading on the left, papers by year on the right
   --------------------------------------------------------------- */
body.pg-research #publications{background:var(--navy-ground);padding-block:var(--sec-pad);}
body.pg-research #publications .sec-inner{padding-block:0;}
body.pg-research #publications .pub-grid{
  display:grid;grid-template-columns:minmax(0,.42fr) minmax(0,.58fr);gap:clamp(2rem,5vw,5rem);align-items:start;
}
body.pg-research #publications .pub-grid__head{position:sticky;top:112px;}
body.pg-research #publications .lead-stmt{font-size:clamp(2.8rem,5.2vw,5rem);line-height:.98;max-width:none;text-wrap:balance;}
body.pg-research #publications .pub-grp + .pub-grp{margin-top:1.8rem;}
body.pg-research #publications .pub-y{
  margin:0 0 .5rem;font:800 clamp(2rem,3.4vw,2.8rem)/1 var(--display);letter-spacing:-.02em;color:#FF6B75;
  background:none;-webkit-text-fill-color:#FF6B75;
}
body.pg-research #publications .pubs{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.35rem;}
body.pg-research #publications .pubs li{display:block;padding:0;border:0;margin:0;}
body.pg-research #publications .pub-row{
  display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"t m" "j m";column-gap:1rem;align-items:center;
  padding:.8rem 1rem;margin-inline:-1rem;border-radius:14px;background:none;box-shadow:none;border:0;
  text-decoration:none;color:inherit;overflow:visible;
}
body.pg-research #publications .pub-row .pub-t{grid-area:t;}
body.pg-research #publications .pub-row .pub-j{grid-area:j;}
/* R10-RESEARCH: the R8 document mark; its hover (turn, glow) is illus-kit.css .il-host, the host is the row */
body.pg-research #publications .pub-row__mark{grid-area:m;width:30px;height:30px;margin-top:18px;overflow:visible;flex:none;}
body.pg-research #publications .pub-t{display:block;font:500 1.1rem/1.4 var(--body);color:#F4F7FB;max-width:62ch;letter-spacing:0;}
body.pg-research #publications .pub-arr{display:inline-block;margin-left:.28em;color:#FF6B75;font-weight:600;transition:transform .35s var(--ease-snap);}
@media(hover:hover) and (pointer:fine){
  body.pg-research #publications .pub-row:hover .pub-arr{transform:translate(2px,-2px);}
}
body.pg-research #publications .pub-row:focus-visible .pub-arr{transform:translate(2px,-2px);}
body.pg-research #publications .pub-j{display:block;margin-top:.3rem;font:400 .95rem/1.4 var(--body);letter-spacing:0;color:rgb(244 247 251 / .82);}
body.pg-research #publications .row-cta{margin:2rem 0 0;}
@media(max-width:900px){
  body.pg-research #publications .pub-grid{grid-template-columns:minmax(0,1fr);gap:1.6rem;}
  body.pg-research #publications .pub-grid__head{position:static;}
  body.pg-research #publications .pub-row{margin-inline:-.6rem;padding-inline:.6rem;}
}
@media(max-width:620px){
  body.pg-research #publications .pub-row__mark{width:24px;height:24px;}
}

/* ---------------------------------------------------------------
   #questions  (paper, half-bleed photo right): four plain rows, not boxes
   --------------------------------------------------------------- */
body.pg-research #questions{background:var(--paper);color:var(--ink);}
body.pg-research #questions .hsplit__copy{
  align-self:center;
  padding-block:var(--sec-pad);
  padding-left:max(var(--gutter),calc((100vw - var(--max)) / 2 + var(--gutter)));
  padding-right:clamp(1.5rem,3vw,3rem);
}
body.pg-research #questions .lead-stmt{max-width:none;}
body.pg-research #questions .rq{list-style:none;margin:clamp(2.4rem,4vw,3.4rem) 0 0;padding:0;}
body.pg-research #questions .rq li{display:grid;grid-template-columns:4.2rem minmax(0,1fr);column-gap:1.2rem;align-items:start;}
body.pg-research #questions .rq li + li{margin-top:clamp(1.6rem,2.6vw,2.4rem);}
body.pg-research #questions .rq__n{font:800 clamp(2.4rem,3.4vw,3.2rem)/1 var(--display);letter-spacing:-.02em;color:#A5202A;font-variant-numeric:tabular-nums;}
body.pg-research #questions .rq__t{margin:0;font:800 clamp(1.3rem,1.15rem + .7vw,1.75rem)/1.2 var(--display);letter-spacing:-.01em;color:var(--ink);--rl-floor:.3;}
body.pg-research #questions .rq__note{margin:.5rem 0 0;font:400 1.05rem/1.6 var(--body);color:var(--ink-soft);max-width:44ch;}
/* R10-RESEARCH: the R8 area row grammar on a plain row: the number lights, the words step right. No ring, no wash (the rows are not boxes) */
body.pg-research #questions .rq li .rq__n{transition:color .3s ease;}
body.pg-research #questions .rq li .rq__b{transition:transform .45s var(--ease-snap);}
@media(hover:hover) and (pointer:fine){
  body.pg-research #questions .rq li:hover .rq__n{color:#E23A46;}
  body.pg-research #questions .rq li:hover .rq__b{transform:translateX(4px);}
}
/* phones and portrait: the heading, then the photo as a whole 4/5 block, then the four rows */
@media (max-width:900px),(max-aspect-ratio:1/1){
  body.pg-research #questions{display:flex;flex-direction:column;}
  body.pg-research #questions .hsplit__copy{display:contents;}
  body.pg-research #questions .lead-stmt{order:1;padding:clamp(3rem,10vw,4.5rem) var(--gutter) 1.6rem;}
  body.pg-research #questions .hsplit__ph{order:2;}
  body.pg-research #questions .rq{order:3;margin:2rem 0 0;padding:0 var(--gutter) 3.4rem;}
  body.pg-research #questions .rq li{grid-template-columns:2.6rem minmax(0,1fr);column-gap:1rem;}
  body.pg-research #questions .rq__t{font-size:1.25rem;}
}

/* ---------------------------------------------------------------
   #areas  (the photo stage carries only the heading) and #areasList (navy)
   --------------------------------------------------------------- */
body.pg-research #areas .lead-stmt{font-size:clamp(2.2rem,4.2vw,4rem);line-height:1.02;max-width:none;margin:0;}
body.pg-research #areasList{background:#0C1833;padding:clamp(72px,9vw,128px) 0;}
body.pg-research #areasList .sec-inner{max-width:none;padding-inline:var(--gutter);padding-block:0;}
body.pg-research #areasList .ra-grid{
  display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,5vw,5rem);align-items:start;
}
body.pg-research #areasList .ra-list{list-style:none;margin:0;padding:0;}
body.pg-research #areasList .ra-list li{margin:0;padding:0;border:0;}
body.pg-research #areasList .ra-row{
  display:grid;grid-template-columns:2.6rem minmax(0,1fr) auto;align-items:center;gap:.75rem;
  width:calc(100% + 1.8rem);min-height:64px;margin:0 -.9rem;padding:.4rem .9rem;border:0;border-radius:10px;background:none;text-align:left;
  font:600 clamp(1.35rem,2.1vw,1.9rem)/1.15 var(--display);letter-spacing:-.01em;color:#F4F7FB;cursor:default;
}
body.pg-research #areasList .ra-row--lens{cursor:pointer;-webkit-tap-highlight-color:transparent;}
body.pg-research #areasList .ra-row__n{font:600 .8rem/1 var(--label);letter-spacing:.04em;color:rgb(244 247 251 / .55);}
body.pg-research #areasList .ra-row--lens .ra-row__n{color:#FF6B75;}
body.pg-research #areasList .ra-row__t{min-width:0;}
body.pg-research #areasList .ra-row__go{display:inline-flex;align-items:center;gap:.35rem;font:600 .95rem/1 var(--body);letter-spacing:0;text-transform:none;color:#FF6B75;white-space:nowrap;}
body.pg-research #areasList .ra-row__go i{font-style:normal;font-size:1rem;line-height:1;}
/* R10-RESEARCH: R8 row motion, inside the row only (the box rule keeps the row itself to its ring) */
body.pg-research #areasList .ra-row__n{transition:color .3s ease;}
body.pg-research #areasList .ra-row__t{transition:transform .45s var(--ease-snap);}
body.pg-research #areasList .ra-row__go i{display:inline-block;transition:transform .35s var(--ease-snap);}
@media(hover:hover) and (pointer:fine){
  body.pg-research #areasList .ra-row:hover .ra-row__n{color:#FF6B75;}
  body.pg-research #areasList .ra-row:hover .ra-row__t{transform:translateX(4px);}
  body.pg-research #areasList .ra-row--lens:hover .ra-row__go{text-decoration:underline;text-underline-offset:3px;}
  body.pg-research #areasList .ra-row--lens:hover .ra-row__go i{transform:translateY(-3px);}
}
body.pg-research #areasList .ra-row--lens:focus-visible .ra-row__t{transform:translateX(4px);}
body.pg-research #areasList .ra-row--lens:focus-visible .ra-row__go{text-decoration:underline;text-underline-offset:3px;}
body.pg-research #areasList .ra-row--lens:focus-visible .ra-row__go i{transform:translateY(-3px);}
/* the preview: the same heart the lens shows, outside at rest, the lit inside for the row in view */
body.pg-research #areasList .ra-prev{
  position:sticky;top:112px;margin:0;aspect-ratio:4 / 5;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);overflow:hidden;
  border:1px solid var(--line-dark);border-radius:var(--box-r);background:rgb(244 247 251 / .03);
}
body.pg-research #areasList .ra-prev__base,body.pg-research #areasList .ra-prev__in{
  grid-area:1 / 1;display:block;height:92%;aspect-ratio:980 / 1427;width:auto;position:relative;justify-self:center;align-self:center;
  transition:opacity .2s ease;
}
body.pg-research #areasList .ra-prev__in{opacity:0;}
body.pg-research #areasList .ra-prev__in img{position:absolute;left:0;top:0;width:100%;height:100%;display:block;}
body.pg-research #areasList .ra-prev__ov{opacity:0;transition:opacity .2s ease;}
body.pg-research #areasList .ra-prev[data-key] .ra-prev__base{opacity:0;}
body.pg-research #areasList .ra-prev[data-key] .ra-prev__in{opacity:1;}
body.pg-research #areasList .ra-prev[data-key="adv-hf"] .ra-prev__ov[data-key="adv-hf"],
body.pg-research #areasList .ra-prev[data-key="transplant"] .ra-prev__ov[data-key="transplant"],
body.pg-research #areasList .ra-prev[data-key="mcs"] .ra-prev__ov[data-key="mcs"],
body.pg-research #areasList .ra-prev[data-key="amyloid"] .ra-prev__ov[data-key="amyloid"],
body.pg-research #areasList .ra-prev[data-key="coronary"] .ra-prev__ov[data-key="coronary"]{opacity:1;}
@media(max-width:900px){
  body.pg-research #areasList{padding:clamp(48px,12vw,72px) 0;}
  body.pg-research #areasList .ra-grid{grid-template-columns:minmax(0,1fr);}
  body.pg-research #areasList .ra-prev{display:none;}
  body.pg-research #areasList .ra-row{min-height:56px;}
}

/* ---------------------------------------------------------------
   #collaborate  (navy): the region the collaboration text names, drawn from real
   US Census shapes. The neighbouring states are whole shapes that run on past
   the picture (the svg is overflow:visible), so no state is cut by a straight line.
   --------------------------------------------------------------- */
body.pg-research #collaborate{border-radius:0;background:var(--navy-ground);}
body.pg-research #collaborate .sec-inner{max-width:none;padding-inline:var(--gutter);padding-block:clamp(4.5rem,8vw,7.5rem);}
body.pg-research #collaborate .close-split{
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(1.5rem,3vw,3rem);align-items:center;
  min-height:min(72svh,680px);
}
body.pg-research #collaborate .lead-stmt{font-size:clamp(2.6rem,5.2vw,4.6rem);max-width:none;}
body.pg-research .collab__copy{position:relative;z-index:2;max-width:520px;min-width:0;}
body.pg-research .collab__copy .flip__body{margin-top:1.1rem;font-size:1.25rem;line-height:1.5;color:rgb(244 247 251 / .92);max-width:36ch;}
body.pg-research .flipband .row-cta{display:flex;flex-wrap:wrap;align-items:center;gap:1.1rem 1.8rem;margin-top:1.8rem;}
body.pg-research .flipband .k4-btn--text,body.pg-research .sec-dark .k4-btn--text,body.pg-research .on-dark .k4-btn--text{color:var(--crimson-glow);}
body.pg-research .collab__map{position:relative;width:clamp(480px,52vw,840px);min-width:0;justify-self:end;}
body.pg-research .rc-map{position:relative;width:100%;aspect-ratio:248 / 174;}
body.pg-research .rc-map__svg{display:block;width:100%;height:100%;overflow:visible;}
body.pg-research .rc-map__ctx,body.pg-research .rc-map__ctxdots{pointer-events:none;}
body.pg-research .rc-map__st--far{fill:rgb(244 247 251 / .02);stroke:rgb(244 247 251 / .06);}
body.pg-research .rc-map__st{stroke-linejoin:round;}
body.pg-research .rc-map__st--ctx{fill:rgb(244 247 251 / .045);stroke:rgb(244 247 251 / .16);stroke-width:.6;}
body.pg-research .rc-map__ctxdots{fill:none;stroke:rgb(244 247 251 / .2);stroke-width:2;stroke-linecap:round;}
/* R10-RESEARCH: R8 map rendering, translucent crimson states, soft pink dots, small labels, small glowing Memphis point, soft edges */
body.pg-research .rc-map__st--hot{fill:url(#rcHot);stroke:#FF6B75;stroke-width:.8;cursor:default;transform-box:fill-box;transform-origin:center;transition:fill .35s ease,stroke-width .35s ease,transform .5s var(--ease-snap);}
body.pg-research .rc-map__ol{fill:none;stroke:#FF6B75;stroke-width:.8;pointer-events:none;}
body.pg-research .rc-map__dots path{fill:none;stroke:#FFC2C6;stroke-opacity:1;stroke-width:2.3;stroke-linecap:round;pointer-events:none;}
body.pg-research .rc-map__pin{fill:#fff;stroke:#E23A46;stroke-width:1.2;}
body.pg-research .rc-map__pulse{fill:rgb(255 107 117 / .35);stroke:none;transform-box:fill-box;transform-origin:center;}
body.pg-research .rc-map__ring{fill:none;stroke:rgb(255 107 117 / .8);stroke-width:.7;transform-box:fill-box;transform-origin:center;opacity:0;}
body.pg-research .rc-map__lbl{
  position:absolute;transform:translate(-50%,-50%);font:700 clamp(9px,.85vw,11px)/1 var(--label);letter-spacing:.14em;text-transform:uppercase;
  color:rgb(244 247 251 / .92);white-space:nowrap;pointer-events:none;
  text-shadow:0 0 2px rgb(12 24 51 / .95),0 0 6px rgb(12 24 51 / .9),0 0 10px rgb(12 24 51 / .8);
}
body.pg-research .rc-map__lbl--city{transform:translate(0,-50%);letter-spacing:.12em;}
/* a word of the caption and its state answer each other: the state outlines, the word underlines */
body.pg-research .rc-cap{margin:1rem 0 0;font:400 clamp(.95rem,1.1vw,1rem)/1.5 var(--body);color:rgb(244 247 251 / .75);max-width:46ch;}
body.pg-research .rc-word{
  font:inherit;color:inherit;background:none;border:0;padding:0;margin:0;cursor:pointer;
  text-decoration:underline;text-decoration-color:rgb(244 247 251 / .4);text-underline-offset:3px;text-decoration-thickness:1px;
}
body.pg-research .collab__map[data-hl="Tennessee"] .rc-word[data-state="Tennessee"],
body.pg-research .collab__map[data-hl="Arkansas"] .rc-word[data-state="Arkansas"],
body.pg-research .collab__map[data-hl="Mississippi"] .rc-word[data-state="Mississippi"]{text-decoration-color:#FF6B75;text-decoration-thickness:2px;}
body.pg-research .collab__map[data-hl="Tennessee"] .rc-map__st--hot[data-state="Tennessee"],
body.pg-research .collab__map[data-hl="Arkansas"] .rc-map__st--hot[data-state="Arkansas"],
body.pg-research .collab__map[data-hl="Mississippi"] .rc-map__st--hot[data-state="Mississippi"]{fill:rgb(255 107 117 / .5);stroke-width:1.3;transform:scale(1.012);}
@media(hover:hover) and (pointer:fine){
  body.pg-research .rc-map__st--hot:hover{fill:rgb(255 107 117 / .5);stroke-width:1.3;transform:scale(1.012);}
}
body.pg-research .rc-word:focus-visible{outline:2px solid #FF6B75;outline-offset:3px;border-radius:2px;}
/* arrival, in an order that means something: the pin first, one ring expands from it across the three
   states, each outline draws as the ring passes, the dots light outward from Memphis, the names last.
   Armed by pg-speak-research.js only, so with scripts off the finished map shows. */
@keyframes rcRing{0%{transform:scale(.2);opacity:.9;}100%{transform:scale(17);opacity:0;}}
@keyframes rcDraw{from{stroke-dashoffset:1;}to{stroke-dashoffset:0;}}
@keyframes rcPulse{0%{transform:scale(.55);opacity:.9;}80%,100%{transform:scale(3);opacity:0;}}
body.pg-research .rc-map--arm .rc-map__hub{opacity:0;}
body.pg-research .rc-map--arm .rc-map__st--hot{opacity:0;}
body.pg-research .rc-map--arm .rc-map__ol{stroke-dasharray:1;stroke-dashoffset:1;}
body.pg-research .rc-map--arm .rc-map__dots path{opacity:0;}
body.pg-research .rc-map--arm .rc-map__lbl{opacity:0;}
body.pg-research .rc-map--arm.is-in .rc-map__hub{opacity:1;transition:opacity .3s ease;}
body.pg-research .rc-map--arm.is-in .rc-map__ring{animation:rcRing 1.2s cubic-bezier(.2,.7,.2,1) .1s 1 both;}
body.pg-research .rc-map--arm.is-in .rc-map__st--hot{opacity:1;transition:opacity .5s ease calc(.25s + var(--i) * .16s),stroke .2s ease,stroke-width .2s ease;}
body.pg-research .rc-map--arm.is-in .rc-map__ol{animation:rcDraw .9s ease calc(.2s + var(--i) * .16s) 1 both;}
body.pg-research .rc-map--arm.is-in .rc-map__dots path{opacity:1;transition:opacity .5s ease calc(.45s + var(--d,0ms));}
body.pg-research .rc-map--arm.is-in .rc-map__lbl{opacity:1;transition:opacity .5s ease 1.2s;}
body.pg-research .rc-map.is-live .rc-map__pulse{animation:rcPulse 2.6s var(--ease-soft,cubic-bezier(.4,0,.15,1)) infinite;}
@media(max-width:1100px){
  body.pg-research .collab__map{width:clamp(440px,54vw,600px);}
}
@media(max-width:560px){
  body.pg-research .rc-map__lbl{font-size:8.5px;letter-spacing:.1em;}
}
@media(max-width:820px){
  body.pg-research #collaborate .close-split{display:flex;flex-direction:column;align-items:stretch;gap:0;min-height:0;}
  body.pg-research .collab__copy{display:contents;}
  body.pg-research #collaborate .lead-stmt{order:1;}
  body.pg-research .collab__copy .flip__body{order:2;}
  body.pg-research .collab__map{order:3;width:100vw;margin:1.4rem calc(var(--gutter) * -1) 0;justify-self:auto;}
  body.pg-research .rc-cap{padding-inline:var(--gutter);}
  body.pg-research .flipband .row-cta{order:4;margin-top:1.6rem;flex-direction:column;align-items:stretch;}
  body.pg-research .flipband .row-cta .k4-btn--primary{min-height:52px;justify-content:center;}
}

/* ---------------------------------------------------------------
   R10-RESEARCH: ARRIVAL. [data-arrive] items (year numerals, paper rows, trial boxes, question rows, area rows) rise 26px and
   fade in as each one is reached; items that arrive together cascade 65ms apart (R8 motion-kit stagger, R8 data-rise).
   pg-speak-research.js arms it by adding html.rs-arrive, so with no JS, no IntersectionObserver or reduced motion nothing
   is ever hidden. The attribute is removed when the item has landed, so a box keeps its own hover transition afterwards.
   --------------------------------------------------------------- */
@media(prefers-reduced-motion:no-preference){
  html.rs-arrive [data-arrive]:not(.is-arrived){opacity:0;transform:translate3d(0,26px,0);}
  html.rs-arrive [data-arrive].is-arrived{opacity:1;transform:none;transition:opacity .6s var(--ease-soft),transform .75s var(--ease-snap);transition-delay:calc(var(--k,0) * 65ms);}
}
@media print{html.rs-arrive [data-arrive]{opacity:1 !important;transform:none !important;}}

/* ---------------------------------------------------------------
   reduced motion: a finished, still page
   --------------------------------------------------------------- */
@media(prefers-reduced-motion:reduce){
  body.pg-research .tl__fig{transition:none;}
  body.pg-research .tl__fig img{animation:none;}
  body.pg-research .tl__scan{display:none;}
  body.pg-research .rc-map.is-live .rc-map__pulse{animation:none;}
  body.pg-research .rheart .heart3d__caption.is-swap .heart3d__caption-k,
  body.pg-research .rheart .heart3d__caption.is-swap .heart3d__caption-p{animation:none;}
}

/* S3-HEADINGS:BEGIN */
/* ---------------------------------------------------------------
   S3 HEADING SCALE (research, below the #top hero). Dev: "increase the size of the headings everywhere to fit comfortably
   and so that its easily readible, not like we are rationing the space". Section h2 about 72px at 1200 (38px at 390),
   card and item titles about 31px at 1200, display line-height about 1.02. The R9 text order, photos and crops are
   untouched; only sizes (and the widths that let the larger words fit) change. Everything is scoped to body.pg-research
   because speaking.html loads this file too. The #top hero rules above are not touched.
   --------------------------------------------------------------- */
body.pg-research{
  --s3-h2:clamp(2.6rem,6vw,5.75rem);
  --s3-h3:clamp(1.6rem,2.6vw,2.25rem);
}

/* the record: the numeral and the sentence both grow; the column widens to the calm cabinet and wall left of his face.
   The body line must keep landing on the dark wall above the bright top of the monitor (about half way down the photo), so
   on landscape screens the section is made at least as tall as the stack needs (the photo scales with it, nothing is cut:
   his face stays right of the text at every width). Phones and portrait keep the stacked layout below. */
body.pg-research #research .research__col{max-width:min(44vw,44rem);}
body.pg-research #research .research__big{font-size:clamp(5.5rem,10.4vw,9.4rem);}
body.pg-research #research .research__label{font-size:clamp(1.9rem,3.4vw,3.5rem);line-height:1.06;margin:1rem 0 1.1rem;}
@media (min-width:901px) and (min-aspect-ratio:1/1){
  body.pg-research #research{padding-top:clamp(6.5rem,9vh,7.5rem);min-height:max(100svh,calc(39.4vw + 370px));}
}
@media (max-width:900px),(max-aspect-ratio:1/1){
  body.pg-research #research .research__col{max-width:44rem;}
  body.pg-research #research .research__big{font-size:clamp(5.2rem,30vw,9rem);}
  body.pg-research #research .research__label{font-size:clamp(2rem,8.8vw,3.6rem);margin:.9rem 0 1rem;}
}

/* trials: the heading holds two lines (the accent word on the second), the group titles grow with it */
body.pg-research #trials .lead-stmt{font-size:var(--s3-h2);line-height:1.02;max-width:10em;}
body.pg-research #trials .rt-k{font-size:var(--s3-h3);line-height:1.1;text-wrap:balance;}
body.pg-research #trials .trial-hd b{font-size:clamp(1.2rem,1.9vw,1.5rem);}

/* publications: the heading column is .42fr, "publications." fits it at every width (checked 901 to 1920) */
body.pg-research #publications .lead-stmt{font-size:clamp(2.8rem,6vw,5.75rem);line-height:1.02;}

/* questions: the heading and the four row titles */
body.pg-research #questions .lead-stmt{font-size:clamp(2.4rem,5.6vw,5.4rem);line-height:1.04;text-wrap:balance;}
body.pg-research #questions .rq__t{font-size:clamp(1.4rem,2.6vw,2.25rem);line-height:1.15;text-wrap:balance;}
@media (max-width:900px),(max-aspect-ratio:1/1){
  body.pg-research #questions .lead-stmt{font-size:clamp(2.4rem,6vw,3.6rem);}
}

/* areas: the heading sits on the dark monitor bank; the region is the bank itself and the type fills it (two lines) */
@media(min-width:901px){
  body.pg-research #areas .lead-stmt{font-size:clamp(2.4rem,5.1vw,6.25rem);line-height:1;}
}
@media (max-width:900px),(max-aspect-ratio:1/1){
  body.pg-research #areas .lead-stmt{font-size:clamp(2.5rem,11vw,4.2rem);}
}
/* a portrait screen wider than 900px (a tablet held upright) shows the portrait crop, where the monitor-bank region does not
   exist: the copy flows at the top like on a phone instead of being placed by the landscape region */
@media (min-width:901px) and (max-aspect-ratio:1/1){
  html.photo-ink body.pg-research #areas .phero__copy[data-photo-region]{
    position:static;left:auto;top:auto;width:auto;height:auto;display:block;
    max-width:min(var(--photo-copy-w,46rem),100%);margin-left:auto;
  }
}

/* the area list: row titles are item titles */
body.pg-research #areasList .ra-row{font-size:clamp(1.5rem,2.4vw,2.1rem);}
body.pg-research #areasList .ra-row__t{text-wrap:balance;}
@media(max-width:560px){
  body.pg-research #areasList .ra-row{grid-template-columns:2.2rem minmax(0,1fr);row-gap:.35rem;}
  body.pg-research #areasList .ra-row__n{grid-column:1;grid-row:1;}
  body.pg-research #areasList .ra-row__t{grid-column:2;grid-row:1;}
  body.pg-research #areasList .ra-row__go{grid-column:2;grid-row:2;justify-self:start;}
}

/* collaborate: the copy column is the grid track left of the map; the heading is sized from that column (container units),
   so the longest word "collaboration." always fits it. vw fallback first for engines without container queries. */
body.pg-research #collaborate .lead-stmt{font-size:var(--s3-h2);line-height:1.02;}
@media(min-width:821px){
  body.pg-research #collaborate .lead-stmt{font-size:clamp(2.6rem,5.6vw,5.75rem);}
  @supports (container-type:inline-size){
    body.pg-research .collab__copy{container-type:inline-size;}
    body.pg-research #collaborate .lead-stmt{font-size:clamp(2.6rem,16.6cqi,5.75rem);}
  }
}
/* S3-HEADINGS:END */
/* S3-TOP:BEGIN */
/* ---------------------------------------------------------------
   S3 HEADING SCALE, the #top hero (the heart and its lens). Dev: "increase the size of the headings everywhere to fit
   comfortably and so that its easily readible". The headline grows as far as the hero allows while the hero still fits one
   screen. On desktop its size is the smallest of: 7.2vw, 7.25rem, what its column holds (container units: "cardiovascular"
   alone on a line, or "Advancing cardiovascular" on one line) and the height left once the deck, the names and the caption
   are set (--rh-b). Of the two line and the three line setting it takes the larger type. The room comes from the names list
   (32 px rows on a fine pointer, 44 px on touch) and a shorter gap above the credit line. The caption title is an item
   title (about 29 px at 1200). Phones keep the stacked layout (44 px at 390). Scoped to body.pg-research #top because
   speaking.html loads this file too; the ID also outranks heart3d.css, which loads after this file. Browsers without
   container units or svh keep the headline rules above.
   --------------------------------------------------------------- */
@media (min-width:901px){
  body.pg-research #top{--rh-row:32px;--rh-deck:clamp(1.05rem,1.5vw,1.4rem);--rh-cap:6.6rem;--rh-lmb:1.25rem;--rh-h1mb:1.1rem;}
  body.pg-research #top .heart3d__areas{margin:0 0 .75rem;}
  body.pg-research #top .heart3d__area{min-height:var(--rh-row);padding-top:.2rem;padding-bottom:.2rem;}
  body.pg-research #top .rheart__lens{margin-bottom:var(--rh-lmb);}
  body.pg-research #top .heart3d__caption-k{font-size:clamp(1.6rem,2.4vw,2.1rem);}
}
@media (min-width:901px) and (pointer:coarse){
  body.pg-research #top{--rh-row:44px;}
}
/* short laptops: heart3d.css sets the deck to 1rem, the caption space to 5.4rem and the headline gap to .8rem */
@media (min-width:901px) and (max-height:780px){
  body.pg-research #top{--rh-deck:1rem;--rh-cap:5.4rem;--rh-lmb:1.5rem;--rh-h1mb:.8rem;}
  body.pg-research #top .heart3d__caption-k{font-size:1.6rem;}
}
/* a portrait screen wider than 900px (a tablet held upright): a heart sized by the height left the copy a 50 px column, so the
   headline and the deck run across the top and the names sit beside a heart sized by the width */
@media (min-width:901px) and (max-aspect-ratio:1/1){
  body.pg-research #top .rheart{grid-template-areas:"intro intro" "lens stage";grid-template-rows:auto auto;align-content:center;}
  body.pg-research #top .rheart__intro{align-self:start;}
  body.pg-research #top .rheart__lens{align-self:center;}
  body.pg-research #top .rheart .heart3d__stage{height:min(calc(var(--rh-cell) - var(--rh-under) - 18rem),calc((100vw - 2 * var(--gutter)) * .7));}
}
@supports (container-type:inline-size) and (height:1svh){
  @media (min-width:901px){
    body.pg-research #top .rheart__intro{container-type:inline-size;}
    body.pg-research #top{
      --rh-b:calc(100svh - var(--rh-top) - var(--rh-pad) - 16px - 3 * var(--rh-deck) - clamp(.9rem,2.2svh,1.6rem) - 6 * var(--rh-row) - .75rem - var(--rh-cap) - var(--rh-lmb) - var(--rh-h1mb));
    }
    body.pg-research #top .phero__title{
      font-size:max(2.25rem,min(7.25rem,7.2vw,max(min(8.9cqi,var(--rh-b) / 2),min(15.1cqi,var(--rh-b) / 3))));
    }
  }
  @media (min-width:901px) and (max-aspect-ratio:1/1){
    body.pg-research #top .phero__title{font-size:min(7.25rem,8.9cqi);}
  }
}
@media (max-width:900px){
  body.pg-research #top .phero__title{font-size:clamp(2.6rem,11.3vw,4.5rem);}
}
/* S3-TOP:END */
/* T1-RECORD-ART:BEGIN */
/* ---------------------------------------------------------------
   T1, Dev: "move this illustration to the middle of the computer screen in the background iamge".
   From 901px on a landscape screen the journal article stack sits on the monitor screen of the photo. The figure is a
   direct child of #research .sec-inner (its offsetParent) and carries data-photo-region="0.1650 0.5921 0.1091 0.2158"
   (fractions of the full frame: 66 percent of the screen height, on the screen's vertical middle, nudged right of the
   laptop lid that stands in front of the monitor). fable.js turns that into --pr-x/--pr-y/--pr-w/--pr-h under the
   current cover crop and fable.css section 6 positions it. The svg fills the box exactly (the same 220:272 aspect):
   no panel, no glow, no scrim, no border. illus-kit still draws it in, opens the corner, blinks the point and answers
   hover. Phones and portrait (the stacked frame, where the monitor is about 80px tall) and no JS keep it in the flow.
   Three adjustments keep it centred and clear of the text:
   1. The section is a little taller than S3 made it (the photo scales with it; --t1-sh, never less than S3's height),
      so from 1080px the Google Scholar button ends at least 16px above the box. Narrower, his head comes too close to
      the text column for that: the extra height eases off to none at 1000px (no jump while resizing) and
      pg-speak-research.js lowers the box by what is still missing (--t1-dy; --t1-k shrinks it only when it would
      otherwise run off the bottom of the screen, which happens only from 901 to about 930px).
   2. Below about 1300px the cover crop cuts off the left of the monitor: the box then moves right until it is centred
      on the part of the screen that is actually visible (never left of the region, which keeps it clear of the laptop).
      In region units (w = --pr-w) the screen starts 1.0018w left of the region and ends 1.748w right of its left edge,
      so the left edge centred on the visible screen is (max(0, x - 1.0018w) + x + .748w) / 2.
   3. The photo under it drifts (fable.css bgphoto-drift: scale 1 to 1.04, 20s, around --drift-origin 70% 50% of the
      section). The drawing runs the same animation, started by the same is-live class in the same frame, scaled around
      that same point (in its own coordinates: the section's 70% 50% minus its own place; --t1-sh is the section height,
      the top padding is S3's), so it stays printed on the screen instead of the monitor sliding under it.
   --------------------------------------------------------------- */
@media (min-width:901px) and (min-aspect-ratio:1001/1000){
  body.pg-research #research{--t1-sh:max(100svh,calc(39.4vw + 370px),calc(36vw + 460px - .7 * max(0px,1080px - 100vw)));min-height:var(--t1-sh);}
  html.photo-ink body.pg-research #research .research__art[data-photo-region]{
    --t1-k:1;--t1-dy:0px;
    --t1-l:calc(max(var(--pr-x),calc((max(0px,var(--pr-x) - 1.0018 * var(--pr-w)) + var(--pr-x) + .748 * var(--pr-w)) / 2)) + var(--pr-w) * (1 - var(--t1-k)) / 2);
    --t1-t:calc(var(--pr-y) + var(--t1-dy));
    left:var(--t1-l);top:var(--t1-t);width:calc(var(--pr-w) * var(--t1-k));height:calc(var(--pr-h) * var(--t1-k));
    margin:0;padding:0;display:block;background:none;border:0;box-shadow:none;filter:none;
  }
  html.photo-ink body.pg-research #research .research__art[data-photo-region] :is(.il-frame,.il){width:100%;height:100%;}
}
@media (min-width:901px) and (min-aspect-ratio:1001/1000) and (prefers-reduced-motion:no-preference){
  html.photo-ink body.pg-research #research .bgphoto.is-live ~ .sec-inner .research__art[data-photo-region]{
    transform-origin:calc(70vw - var(--t1-l)) calc(var(--t1-sh) / 2 - clamp(6.5rem,9vh,7.5rem) - var(--t1-t));
    animation:bgphoto-drift 20s ease-in-out infinite alternate;
  }
  html.tab-hidden body.pg-research #research .research__art{animation-play-state:paused;}
}
/* a portrait screen wider than 900px shows the stacked portrait frame: the drawing stays in the flow under the button */
@media (min-width:901px) and (max-aspect-ratio:1/1){
  html.photo-ink body.pg-research #research .research__art[data-photo-region]{position:static;left:auto;top:auto;height:auto;display:block;}
}
/* T1-RECORD-ART:END */
/* T5-PUBS-ZOOM:BEGIN */
/* ---------------------------------------------------------------
   T5, Dev: "make this a scroll animation such that it starts at like 2020 and as i scroll, the 2020 expands like its
   coming out of the screen into my face and then the next year shows up and along with that the information etc".
   #publications reads 2020, 2022, 2025 in the markup. pg-speak-research.js adds .t5-zoom (never with reduced motion or
   no JS, and only when the longest chapter fits the stage), sets --t5-nav (the fixed nav's height) and --t5-len (the
   pinned scroll, in screens) and drives every transform and opacity below from the scroll position. The grid's last row
   is the scroll track; the stage (the list, and on landscape the heading beside it) sticks under the nav for the whole
   track. The three year chapters share one cell of the stage, one on screen at a time. Dev, round 2: "it doesnt come
   directly to the face but goes a bit to the left, small on the right and as it becomes bigger it moves to the left,
   like walking through a hallway". So each chapter has a vanishing point just off the right edge, level with its numeral;
   the script writes it as every element's transform-origin and scales around it: the numeral grows from small on the
   right into its spot, holds, then keeps growing and travels left until it is past the left edge. The section clips
   it at the screen edges (overflow-x clip keeps the sticky stage working).
   Landscape from 901px: the heading and the year index on the left. Phones and portrait: the heading scrolls by above,
   the stage is the list alone. No scrim, glow or box behind the numeral.
   --------------------------------------------------------------- */
body.pg-research #publications .pub-idx{display:none;}
body.pg-research #publications.t5-zoom{
  --t5-stage:calc(100svh - var(--t5-nav,92px));
  overflow-x:clip;
}
body.pg-research #publications.t5-zoom .pub-grid{
  grid-template-rows:calc(var(--t5-stage) + var(--t5-len,3.5) * 100svh);align-items:start;
}
body.pg-research #publications.t5-zoom .pub-grid__head{
  position:sticky;top:var(--t5-nav,92px);height:var(--t5-stage);z-index:3;
  display:flex;flex-direction:column;justify-content:center;
}
body.pg-research #publications.t5-zoom .pub-grid__list{
  position:sticky;top:var(--t5-nav,92px);height:var(--t5-stage);
  display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto auto minmax(0,1fr);
}
body.pg-research #publications.t5-zoom .pub-grp{
  grid-area:2 / 1;align-self:center;position:relative;z-index:1;
  display:flex;flex-direction:column;align-items:flex-start;pointer-events:none;
}
body.pg-research #publications.t5-zoom .pub-grp + .pub-grp{margin-top:0;}
body.pg-research #publications.t5-zoom .pub-grp.is-out{z-index:2;}
body.pg-research #publications.t5-zoom .pub-grp.is-on .pubs,
body.pg-research #publications.t5-zoom .row-cta.is-on{pointer-events:auto;}
/* the numeral: the star of its chapter, sized by the width and the height so the longest chapter still fits */
body.pg-research #publications.t5-zoom .pub-y{
  margin:0 0 clamp(.5rem,2.2svh,1.5rem);margin-left:-.04em;padding-right:.08em;
  font-size:clamp(5rem,min(17vw,24svh),17.5rem);line-height:.84;letter-spacing:-.045em;
  background-image:linear-gradient(100deg,#C0343C 0%,#E23A46 28%,#FF6B75 58%,#FF8F6B 78%,#E23A46 100%);
  -webkit-background-clip:text;background-clip:text;color:#E23A46;-webkit-text-fill-color:transparent;
  transform-origin:150% 50%;will-change:transform,opacity;pointer-events:none;
}
body.pg-research #publications.t5-zoom .pubs{align-self:stretch;}
body.pg-research #publications.t5-zoom .pubs li{transform-origin:130% 0;will-change:transform,opacity;}
body.pg-research #publications.t5-zoom .row-cta{grid-area:3 / 1;margin:clamp(1rem,3svh,2rem) 0 0;transform-origin:130% 0;will-change:transform,opacity;pointer-events:none;}
/* the year index under the heading: which year is on the stage; a year takes you to its chapter */
body.pg-research #publications.t5-zoom .pub-idx{display:flex;flex-wrap:wrap;gap:.25rem 1.6rem;margin:clamp(1.4rem,4svh,2.6rem) 0 0;}
body.pg-research #publications .pub-idx button{
  min-height:44px;padding:.5rem 0;border:0;background:none;cursor:pointer;
  font:700 clamp(1.05rem,1.3vw,1.25rem)/1 var(--display);letter-spacing:.02em;font-variant-numeric:tabular-nums;
  color:rgb(244 247 251 / .62);transition:color .35s var(--ease-soft),transform .45s var(--ease-snap);
}
body.pg-research #publications .pub-idx button[aria-current="true"]{color:#FF6B75;transform:scale(1.18);}
@media(hover:hover) and (pointer:fine){
  body.pg-research #publications .pub-idx button:hover{color:#F4F7FB;}
  body.pg-research #publications .pub-idx button[aria-current="true"]:hover{color:#FF8F6B;}
}
/* phones, tablets and any portrait screen: the heading scrolls by above, the stage is the list alone */
@media (max-width:900px),(max-aspect-ratio:1/1){
  body.pg-research #publications.t5-zoom .pub-grid{
    grid-template-columns:minmax(0,1fr);row-gap:clamp(1rem,4vw,2rem);
    grid-template-rows:auto calc(var(--t5-stage) + var(--t5-len,3.5) * 100svh);
  }
  body.pg-research #publications.t5-zoom .pub-grid__head{position:static;height:auto;display:block;}
  body.pg-research #publications.t5-zoom .pub-idx{display:none;}
  body.pg-research #publications.t5-zoom .pub-y{font-size:clamp(4.5rem,min(30vw,14svh),10rem);}
  body.pg-research #publications.t5-zoom .row-cta{margin-top:clamp(.8rem,2.4svh,1.6rem);}
}
/* T5-PUBS-ZOOM:END */
/* ALT-GROUNDS:BEGIN */
/* ---------------------------------------------------------------
   Dev 2026-10-07: "make alternating sections light and dark so that the paper cut design is smooth". #collaborate turns
   LIGHT (sec-paper k4-sec--light, the flipband class is gone, so none of the shared navy band rules reach it): navy ink,
   the deep crimson ramp on the accent word (kit), deep crimson text button (kit), and the Mid-South map recoloured for paper:
   the neighbouring states in navy hairlines, the three states in a translucent crimson wash with a crimson outline, deep
   crimson dots, navy labels with no halo (Dev: no shadows or glows behind text). Never coral on light.
   --------------------------------------------------------------- */
body.pg-research #collaborate{background:#F4F7FB;color:#0B1B33;}
body.pg-research #collaborate .lead-stmt{color:#0B1B33;}
body.pg-research #collaborate .collab__copy .flip__body{color:rgb(11 27 51 / .8);}
body.pg-research #collaborate .row-cta{display:flex;flex-wrap:wrap;align-items:center;gap:1.1rem 1.8rem;margin-top:1.8rem;}
body.pg-research #collaborate .rc-map__st--far{fill:rgb(11 27 51 / .025);stroke:rgb(11 27 51 / .08);}
body.pg-research #collaborate .rc-map__st--ctx{fill:rgb(11 27 51 / .025);stroke:rgb(11 27 51 / .2);}
body.pg-research #collaborate .rc-map__ctxdots{stroke:rgb(11 27 51 / .17);}
body.pg-research #collaborate .rc-map__st--hot{stroke:#C9303D;}
body.pg-research #collaborate .rc-map__ol{stroke:#C9303D;}
body.pg-research #collaborate .rc-map__dots path{stroke:#C9303D;stroke-opacity:.62;}
body.pg-research #collaborate .rc-map__pin{fill:#fff;stroke:#C9303D;stroke-width:1.4;}
body.pg-research #collaborate .rc-map__pulse{fill:rgb(201 48 61 / .3);}
body.pg-research #collaborate .rc-map__ring{stroke:rgb(201 48 61 / .75);}
body.pg-research #collaborate .rc-map__lbl{color:#0B1B33;text-shadow:none;}
body.pg-research #collaborate .rc-map__lbl--city{color:#9C1B27;}
body.pg-research #collaborate .rc-cap{color:rgb(11 27 51 / .74);}
body.pg-research #collaborate .rc-word{text-decoration-color:rgb(11 27 51 / .35);}
body.pg-research #collaborate .collab__map[data-hl="Tennessee"] .rc-word[data-state="Tennessee"],
body.pg-research #collaborate .collab__map[data-hl="Arkansas"] .rc-word[data-state="Arkansas"],
body.pg-research #collaborate .collab__map[data-hl="Mississippi"] .rc-word[data-state="Mississippi"]{text-decoration-color:#C9303D;}
body.pg-research #collaborate .collab__map[data-hl="Tennessee"] .rc-map__st--hot[data-state="Tennessee"],
body.pg-research #collaborate .collab__map[data-hl="Arkansas"] .rc-map__st--hot[data-state="Arkansas"],
body.pg-research #collaborate .collab__map[data-hl="Mississippi"] .rc-map__st--hot[data-state="Mississippi"]{fill:rgb(201 48 61 / .5);}
@media(hover:hover) and (pointer:fine){
  body.pg-research #collaborate .rc-map__st--hot:hover{fill:rgb(201 48 61 / .5);}
}
body.pg-research #collaborate .rc-word:focus-visible{outline-color:#9C1B27;}
@media(max-width:820px){
  body.pg-research #collaborate .row-cta{order:4;margin-top:1.6rem;flex-direction:column;align-items:stretch;}
  body.pg-research #collaborate .row-cta .k4-btn--primary{min-height:52px;justify-content:center;}
}
/* ALT-GROUNDS:END */
/* PASS1-RESEARCH:BEGIN */
/* ---------------------------------------------------------------
   100x pass 1. (1) The eleven areas are ONE torn navy index sheet (the paper engine tears the list, data-paper="on"),
   the rows sit on it as lines, divided by a torn fibre line (a seamless 560px tear tile used as a mask, offset per row so
   no two tears repeat side by side). Eleven separate slips stacked rim to rim read as one jittery white scribble; one
   sheet reads calm. The rows keep their own answer (the number lights, the words step right, the arrow lifts); the lens
   rows keep their keyboard ring. (2) Paper slips that stack get a real gap (the papers of a year). (3) Phones: the sticky
   plate stage sits inside the gutters, so it is a torn navy sheet like on desktop instead of a straight edged band.
   --------------------------------------------------------------- */
body.pg-research #areasList .ra-list{padding:clamp(.5rem,1vw,.9rem) clamp(1.1rem,2.4vw,2.2rem);}
body.pg-research #areasList .ra-list li{position:relative;}
body.pg-research #areasList .ra-row{width:100%;margin:0;padding:.55rem 0;min-height:70px;border-radius:0;}
body.pg-research #areasList .ra-list li + li::before{
  content:'';position:absolute;left:0;right:0;top:-3.5px;height:7px;pointer-events:none;background:rgb(244 247 251 / .22);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='560' height='7' viewBox='0 0 560 7'%3E%3Cpath d='M0 3.3 L4 3.3 L8 3.6 L12 3.3 L16 3.1 L20 3.3 L24 3.5 L28 3.5 L32 3.5 L36 3.4 L40 3.1 L44 3.0 L48 2.9 L52 2.7 L56 2.7 L60 2.3 L64 2.4 L68 2.6 L72 2.5 L76 2.8 L80 2.8 L84 2.4 L88 2.2 L92 2.4 L96 2.3 L100 2.3 L104 2.7 L108 2.4 L112 2.2 L116 2.6 L120 2.6 L124 2.8 L128 3.0 L132 3.0 L136 2.8 L140 2.7 L144 2.6 L148 2.5 L152 2.3 L156 1.9 L160 1.8 L164 1.9 L168 1.8 L172 2.4 L176 2.6 L180 2.2 L184 2.3 L188 2.4 L192 2.4 L196 2.7 L200 3.1 L204 3.0 L208 2.9 L212 3.2 L216 3.2 L220 3.5 L224 3.9 L228 3.9 L232 4.0 L236 4.0 L240 3.9 L244 4.0 L248 3.8 L252 3.4 L256 3.3 L260 3.2 L264 3.1 L268 3.5 L272 3.7 L276 3.3 L280 3.4 L284 3.4 L288 3.0 L292 3.3 L296 3.4 L300 3.1 L304 2.9 L308 2.8 L312 2.7 L316 2.6 L320 2.9 L324 2.8 L328 2.9 L332 3.0 L336 2.9 L340 3.2 L344 3.0 L348 2.8 L352 2.7 L356 2.3 L360 2.2 L364 2.6 L368 2.7 L372 2.5 L376 2.5 L380 2.5 L384 2.0 L388 2.3 L392 2.4 L396 2.1 L400 2.1 L404 1.8 L408 1.7 L412 1.7 L416 1.9 L420 2.1 L424 2.2 L428 2.4 L432 2.7 L436 3.1 L440 3.3 L444 3.2 L448 3.4 L452 3.0 L456 2.9 L460 3.3 L464 3.3 L468 3.3 L472 3.4 L476 3.2 L480 2.9 L484 3.1 L488 3.3 L492 3.1 L496 3.1 L500 2.9 L504 2.6 L508 2.7 L512 2.6 L516 2.7 L520 2.8 L524 2.7 L528 3.1 L532 3.4 L536 3.6 L540 3.7 L544 3.8 L548 3.4 L552 3.1 L556 3.5 L560 3.3 L560 5.0 L556 4.9 L552 4.9 L548 5.0 L544 5.1 L540 4.8 L536 4.8 L532 4.6 L528 4.1 L524 4.3 L520 4.5 L516 4.2 L512 4.3 L508 4.2 L504 4.0 L500 4.2 L496 4.7 L492 4.8 L488 4.7 L484 4.8 L480 4.3 L476 4.2 L472 4.2 L468 4.0 L464 4.1 L460 3.8 L456 3.8 L452 4.0 L448 4.0 L444 4.0 L440 4.1 L436 3.9 L432 3.4 L428 3.6 L424 3.7 L420 3.3 L416 3.5 L412 3.3 L408 2.8 L404 3.0 L400 3.3 L396 3.4 L392 3.6 L388 3.7 L384 3.6 L380 3.5 L376 3.7 L372 3.6 L368 3.8 L364 3.8 L360 3.8 L356 4.2 L352 4.3 L348 4.6 L344 4.9 L340 4.7 L336 4.5 L332 4.7 L328 4.7 L324 4.5 L320 4.6 L316 4.4 L312 3.7 L308 3.7 L304 3.8 L300 3.8 L296 4.2 L292 4.3 L288 4.2 L284 4.2 L280 4.3 L276 4.4 L272 4.4 L268 4.4 L264 4.3 L260 4.5 L256 4.6 L252 4.7 L248 5.2 L244 4.9 L240 4.8 L236 5.0 L232 4.9 L228 4.9 L224 5.0 L220 4.7 L216 4.2 L212 4.0 L208 4.0 L204 3.8 L200 4.2 L196 4.2 L192 4.1 L188 4.2 L184 4.1 L180 4.2 L176 4.1 L172 3.8 L168 3.7 L164 3.6 L160 3.5 L156 3.6 L152 4.0 L148 3.8 L144 3.6 L140 3.9 L136 3.8 L132 3.9 L128 4.4 L124 4.2 L120 3.9 L116 3.7 L112 3.6 L108 3.5 L104 3.6 L100 3.8 L96 3.6 L92 3.7 L88 3.6 L84 3.7 L80 3.8 L76 3.4 L72 3.4 L68 3.3 L64 3.0 L60 3.3 L56 3.6 L52 3.5 L48 3.6 L44 3.9 L40 3.9 L36 4.2 L32 5.0 L28 5.0 L24 5.0 L20 5.1 L16 4.8 L12 4.8 L8 4.9 L4 5.0 L0 5.0Z'/%3E%3C/svg%3E") 0 0 / 560px 7px repeat-x;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='560' height='7' viewBox='0 0 560 7'%3E%3Cpath d='M0 3.3 L4 3.3 L8 3.6 L12 3.3 L16 3.1 L20 3.3 L24 3.5 L28 3.5 L32 3.5 L36 3.4 L40 3.1 L44 3.0 L48 2.9 L52 2.7 L56 2.7 L60 2.3 L64 2.4 L68 2.6 L72 2.5 L76 2.8 L80 2.8 L84 2.4 L88 2.2 L92 2.4 L96 2.3 L100 2.3 L104 2.7 L108 2.4 L112 2.2 L116 2.6 L120 2.6 L124 2.8 L128 3.0 L132 3.0 L136 2.8 L140 2.7 L144 2.6 L148 2.5 L152 2.3 L156 1.9 L160 1.8 L164 1.9 L168 1.8 L172 2.4 L176 2.6 L180 2.2 L184 2.3 L188 2.4 L192 2.4 L196 2.7 L200 3.1 L204 3.0 L208 2.9 L212 3.2 L216 3.2 L220 3.5 L224 3.9 L228 3.9 L232 4.0 L236 4.0 L240 3.9 L244 4.0 L248 3.8 L252 3.4 L256 3.3 L260 3.2 L264 3.1 L268 3.5 L272 3.7 L276 3.3 L280 3.4 L284 3.4 L288 3.0 L292 3.3 L296 3.4 L300 3.1 L304 2.9 L308 2.8 L312 2.7 L316 2.6 L320 2.9 L324 2.8 L328 2.9 L332 3.0 L336 2.9 L340 3.2 L344 3.0 L348 2.8 L352 2.7 L356 2.3 L360 2.2 L364 2.6 L368 2.7 L372 2.5 L376 2.5 L380 2.5 L384 2.0 L388 2.3 L392 2.4 L396 2.1 L400 2.1 L404 1.8 L408 1.7 L412 1.7 L416 1.9 L420 2.1 L424 2.2 L428 2.4 L432 2.7 L436 3.1 L440 3.3 L444 3.2 L448 3.4 L452 3.0 L456 2.9 L460 3.3 L464 3.3 L468 3.3 L472 3.4 L476 3.2 L480 2.9 L484 3.1 L488 3.3 L492 3.1 L496 3.1 L500 2.9 L504 2.6 L508 2.7 L512 2.6 L516 2.7 L520 2.8 L524 2.7 L528 3.1 L532 3.4 L536 3.6 L540 3.7 L544 3.8 L548 3.4 L552 3.1 L556 3.5 L560 3.3 L560 5.0 L556 4.9 L552 4.9 L548 5.0 L544 5.1 L540 4.8 L536 4.8 L532 4.6 L528 4.1 L524 4.3 L520 4.5 L516 4.2 L512 4.3 L508 4.2 L504 4.0 L500 4.2 L496 4.7 L492 4.8 L488 4.7 L484 4.8 L480 4.3 L476 4.2 L472 4.2 L468 4.0 L464 4.1 L460 3.8 L456 3.8 L452 4.0 L448 4.0 L444 4.0 L440 4.1 L436 3.9 L432 3.4 L428 3.6 L424 3.7 L420 3.3 L416 3.5 L412 3.3 L408 2.8 L404 3.0 L400 3.3 L396 3.4 L392 3.6 L388 3.7 L384 3.6 L380 3.5 L376 3.7 L372 3.6 L368 3.8 L364 3.8 L360 3.8 L356 4.2 L352 4.3 L348 4.6 L344 4.9 L340 4.7 L336 4.5 L332 4.7 L328 4.7 L324 4.5 L320 4.6 L316 4.4 L312 3.7 L308 3.7 L304 3.8 L300 3.8 L296 4.2 L292 4.3 L288 4.2 L284 4.2 L280 4.3 L276 4.4 L272 4.4 L268 4.4 L264 4.3 L260 4.5 L256 4.6 L252 4.7 L248 5.2 L244 4.9 L240 4.8 L236 5.0 L232 4.9 L228 4.9 L224 5.0 L220 4.7 L216 4.2 L212 4.0 L208 4.0 L204 3.8 L200 4.2 L196 4.2 L192 4.1 L188 4.2 L184 4.1 L180 4.2 L176 4.1 L172 3.8 L168 3.7 L164 3.6 L160 3.5 L156 3.6 L152 4.0 L148 3.8 L144 3.6 L140 3.9 L136 3.8 L132 3.9 L128 4.4 L124 4.2 L120 3.9 L116 3.7 L112 3.6 L108 3.5 L104 3.6 L100 3.8 L96 3.6 L92 3.7 L88 3.6 L84 3.7 L80 3.8 L76 3.4 L72 3.4 L68 3.3 L64 3.0 L60 3.3 L56 3.6 L52 3.5 L48 3.6 L44 3.9 L40 3.9 L36 4.2 L32 5.0 L28 5.0 L24 5.0 L20 5.1 L16 4.8 L12 4.8 L8 4.9 L4 5.0 L0 5.0Z'/%3E%3C/svg%3E") 0 0 / 560px 7px repeat-x;
}
body.pg-research #areasList .ra-list li:nth-child(3n)::before{-webkit-mask-position:-190px 0;mask-position:-190px 0;}
body.pg-research #areasList .ra-list li:nth-child(3n+1)::before{-webkit-mask-position:-371px 0;mask-position:-371px 0;}
body.pg-research #areasList .ra-row--lens:focus-visible{outline:2px solid #FF6B75;outline-offset:3px;border-radius:6px;}
body.pg-research #publications .pubs{gap:1.4rem;}
/* the trial group whose plate is on the stage keeps the crimson torn rim (the paper engine reads a crimson border as the hot rim;
   the old outline ring is switched off on paper) */
body.pg-research #trials .rt-grp.is-active{border-color:#E23A46;}
@media(max-width:900px){
  body.pg-research #trials .tl__stage{margin-inline:auto;width:min(100%,88vw);border-radius:var(--stage-r);}
}
/* PASS1-RESEARCH:END */