/* Research archive: original Vision Design artwork in a compact, contained grid. */
.story-research-archive {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: 30% minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr) minmax(0, 1.04fr);
  column-gap: clamp(16px, 2vw, 28px);
  row-gap: 16px;
  width: 100%;
  max-width: 680px;
  height: min(560px, 68svh);
  min-width: 0;
  margin: 0 auto;
  padding: 6px 8px;
  box-sizing: border-box;
  color: #f0f2f1;
}
/* A painted, feathered field lets the archival strip blend into the journal
   without introducing a rectangular card or obscuring the full-page saddle. */
.story-research-archive::before {
  content: "";
  position: absolute;
  inset: -24px -32px;
  z-index: -1;
  border-radius: 38px;
  background: #101b1df2;
  filter: blur(28px);
  pointer-events: none;
}
.story-research-archive .story-research-archive__label {
  grid-column: 1 / -1;
  margin: 0;
  font-family: inherit;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: #e0e4e1;
}
.story-research-archive .story-research-archive__figure {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  min-width: 0;
  min-height: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  box-sizing: border-box;
}
.story-research-archive .story-research-archive__figure img {
  display: block;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center;
  border-radius: 0;
  -webkit-mask-image: none;
  mask-image: none;
}
.story-research-archive .story-research-archive__figure .story-research-archive__caption {
  display: block;
  margin: 9px 0 0;
  padding: 0;
  font-family: inherit;
  font-size: 10px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: .06em;
  text-transform: uppercase;
  text-align: left;
  color: #dce1dc;
  opacity: 1;
}
.story-research-archive .story-research-archive__book {
  padding: 5px 5px 6px;
  background: #25251f;
  transform: rotate(-3deg);
  box-shadow: 0 12px 30px #0005;
}
.story-research-archive .story-research-archive__book .story-research-archive__caption {
  margin-top: 6px;
  padding: 0 3px;
  color: #e1dacc;
}
.story-research-archive .story-research-archive__saddle img {
  filter: drop-shadow(0 0 12px #dde7db0b);
}
.story-research-archive .story-research-archive__saddle .story-research-archive__caption {
  text-align: center;
}
.story-research-archive .story-research-archive__study {
  grid-column: 1 / -1;
  padding-top: 4px;
  mix-blend-mode: screen;
}
.story-research-archive .story-research-archive__study img {
  filter: grayscale(1) invert(1);
  mix-blend-mode: screen;
  opacity: .9;
}
@media (max-width: 800px) {
  .story-research-archive {
    height: auto;
    max-height: none;
    grid-template-columns: 31% minmax(0, 1fr);
    grid-template-rows: auto auto auto;
    column-gap: 14px;
    row-gap: 18px;
    padding: 6px;
  }
  .story-research-archive::before {
    inset: -18px -20px;
    filter: blur(20px);
  }
  .story-research-archive .story-research-archive__figure {
    height: auto;
    grid-template-rows: auto auto;
  }
  .story-research-archive .story-research-archive__figure img {
    height: auto;
    max-height: none;
    align-self: center;
  }
  .story-research-archive .story-research-archive__saddle {
    align-self: center;
  }
  .story-research-archive .story-research-archive__figure .story-research-archive__caption {
    font-size: 10px;
    letter-spacing: .025em;
  }
}
/* Keep the archive and its introductory copy together on a phone screen. */
@media(max-width:760px){
 .story-research-archive{height:clamp(260px,35svh,300px);grid-template-rows:auto minmax(0,1fr) minmax(0,1fr);row-gap:10px}
 .story-research-archive .story-research-archive__figure{height:100%;grid-template-rows:minmax(0,1fr) auto}
 .story-research-archive .story-research-archive__figure img{height:100%;max-height:100%}
 .story-research-archive .story-research-archive__saddle{align-self:stretch}
 .story-research-archive .story-research-archive__figure .story-research-archive__caption{margin-top:5px}
}
/* Open research composition: the page gradient supplies contrast, not cards. */
.story-page #the-question .story-research-archive{isolation:auto;max-width:none;padding:0;background:none}
.story-page #the-question .story-research-archive::before{content:none}
.story-page #the-question .story-research-archive__book{padding:0;background:none;box-shadow:none;transform:rotate(-3deg)}
.story-page #the-question .story-research-archive__study{mix-blend-mode:screen;background:none}
.story-page #the-question .story-research-archive__study img{filter:grayscale(1) invert(1) contrast(1.6);mix-blend-mode:screen;opacity:1}
.story-page #the-question .story-research-archive__saddle{mix-blend-mode:screen;background:none}
.story-page #the-question>.story-scene__veil{background:linear-gradient(270deg,rgba(11,20,24,.97) 0%,rgba(11,20,24,.85) 22%,rgba(11,20,24,.52) 47%,rgba(11,20,24,.12) 73%,transparent 100%),linear-gradient(90deg,rgba(11,20,24,.5),rgba(11,20,24,.22) 45%,transparent 65%)}
@media(min-width:761px){
 .story-page #the-question .story-research-archive{width:112%;height:clamp(370px,calc(100svh - 228px),620px);grid-template-columns:32% minmax(0,1fr);column-gap:clamp(30px,3vw,58px);row-gap:22px;margin:0;justify-self:start}
 .story-page #the-question .story-research-archive__saddle{transform:translateY(-8px)}
 .story-page #the-question .story-research-archive__study{width:94%;justify-self:end}
}
@media(max-width:760px){
 .story-page #the-question .story-research-archive{width:100%;column-gap:20px;row-gap:12px;height:clamp(280px,35svh,300px)}
 .story-page #the-question>.story-scene__veil{background:linear-gradient(270deg,rgba(11,20,24,.85),rgba(11,20,24,.3) 78%),linear-gradient(0deg,rgba(11,20,24,.65),transparent 60%)}
}

.story-page #the-question .story-research-archive__study{mix-blend-mode:normal}
.story-page #the-question .story-research-archive__study img{filter:url(#research-paper-to-alpha);mix-blend-mode:normal;opacity:1}

/* Two image rows after removing the book and saddle labels. */
.story-page #the-question .story-research-archive{grid-template-rows:minmax(0,1fr) minmax(0,1.04fr)}
.story-page #the-question :is(.story-research-archive__book,.story-research-archive__saddle){grid-template-rows:minmax(0,1fr)}
