/* runAtlas case study (big five marketing group) as an article: the header (title, facts) over the lead painting; the body on paper in one
   reading column, the results, the diagram and the steps wider; the close as before. Type roles and tokens only. */
.cs-open.open--words{min-height:0;padding-bottom:0}
.cs-lead-w{margin-top:clamp(40px,4.6vw,64px)}
.cs-lead{margin:0;position:relative;aspect-ratio:2 / 1;overflow:hidden;border-radius:6px;background:#1a1d1a}
.cs-lead img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 55%}   /* the home card's photograph (practice-study-1, 17 Oct) */
/* the body: one paper page */
.cs-results,.cs-sit,.cs-value{background:var(--paper);color:var(--ink)}
.cs-results{margin-top:clamp(56px,6vw,96px);padding-top:clamp(72px,7vw,112px)}
.cs-results,.cs-sit,.cs-built,.cs-value{padding-bottom:clamp(40px,4.4vw,64px)}
.cs-sit,.cs-built,.cs-value{padding-top:clamp(40px,4.4vw,64px)}
.cs-value{padding-bottom:clamp(88px,9vw,136px)}
.cs-results .h2,.cs-sit .h2,.cs-built .h2,.cs-value .h2{color:var(--ink)}
/* the reading column (720 px, centred) and the wider figures (1040 px): the results, the diagram and the steps */
.cs-results .wrap,.cs-built .wrap,.cs-value .wrap{max-width:calc(1040px + var(--m) * 2)}
.cs-sit .wrap.cs-col{max-width:calc(720px + var(--m) * 2)}
.cs-results .h2,.cs-value .h2,.cs-built .cs-col,.cs-note{max-width:720px;margin-left:auto;margin-right:auto}
.cs-results .h2,.cs-value .h2{margin-bottom:clamp(28px,3vw,40px)}
.cs-col .lede{color:var(--ink2)}
.cs-th,.cs-r{grid-template-columns:3fr 5fr 4fr}
/* the results on paper: the figures large, the first in vermilion */
.cs-th{border-bottom-color:rgba(14,15,15,.24);color:var(--ink2)}
.cs-r{border-bottom-color:var(--iline)}
.cs-fig{color:var(--ink)}
.cs-res{color:var(--ink)}
.cs-r:first-child .cs-res{color:var(--verm)}
.cs-how{color:var(--ink2)}
.cs-note{color:var(--ink2)}
/* how the value was established, on the same paper */
.cs-three li{border-top-color:var(--iline)}
.cs-three h3{color:var(--ink)}
.cs-three p{color:var(--ink2)}
@media (max-width:760px){
  .cs-lead{aspect-ratio:4 / 3;border-radius:0}
  .cs-lead img{object-position:56% 50%}
  .cs-lead-w{padding:0}
  .cs-th,.cs-r{grid-template-columns:1fr}
}