/* R28 / Rhythm of text. The booklet, classroom and evidence have distinct
   reading structures. Images remain uncropped and directly enlargeable. */
.reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter{padding-block:clamp(48px,6svh,68px);row-gap:32px}
.reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter>.reading-booklet-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:28px 6vw;align-items:start}
.reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .reading-booklet-heading h2{max-width:24ch}
.reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .reading-booklet-context{padding-top:3px;max-width:60ch}
.reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .reading-booklet-context>p{font-size:16px;line-height:1.6;margin:0;max-width:none;color:var(--ink);text-wrap:pretty}
.reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .reading-booklet-context>.reading-booklet-text{font-size:15px;line-height:1.55;margin-top:12px;color:var(--muted)}
.reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .reading-booklet-text em{font-style:normal;color:var(--blue)}
.reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .reading-booklet-text>span[lang]{margin-left:6px}
.reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .reading-booklet-text>span:last-child{display:block;margin-top:2px}
.reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .reading-design-core{gap:32px}
.reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .booklet-collection{max-width:100%;gap:clamp(16px,2vw,28px)}
.reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .booklet-intentions{gap:30px 6vw;padding:28px 32px;background:#eef4fc}
.reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .booklet-intention h3{font-size:16px;margin-bottom:18px}
.reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .booklet-intention-route{font-size:clamp(24px,2vw,30px);line-height:1.3;gap:10px 16px}
.reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .booklet-intention-note{margin-top:16px;font-size:16px;line-height:1.6;max-width:48ch;text-wrap:pretty}

.reader-page.portfolio-page.project-reading .portfolio-main #classroom.reading-classroom-spread{padding-block:clamp(48px,6svh,68px);row-gap:32px}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom.reading-classroom-spread>.classroom-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:clamp(40px,7vw,104px);row-gap:36px;align-items:start}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-observation{display:grid;gap:24px;min-width:0}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-study-meta{display:flex;align-items:center;justify-content:space-between;gap:20px;min-width:0}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-cohort{display:flex;align-items:center;gap:14px;margin:0;flex-shrink:0}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-cohort>strong{font-size:44px;line-height:1;color:var(--blue);font-weight:450;font-variant-numeric:tabular-nums;letter-spacing:-.04em}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-cohort>span{font-size:15px;line-height:1.5;color:var(--ink)}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-school{font-size:15px;line-height:1.5;margin:0;max-width:27ch;color:var(--muted);text-wrap:pretty}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-observation-photo{width:100%;max-width:none;margin:0;padding:0;background:transparent;border:0;border-radius:0;box-shadow:none}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-observation-photo .image-button{display:block;width:100%;height:auto;max-height:none;margin:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-observation-photo img{display:block;width:100%;height:clamp(220px,32svh,300px);max-height:none;object-fit:contain;object-position:left center;border:0;border-radius:0;box-shadow:none}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-sequence{display:grid;grid-template-columns:minmax(0,1fr);gap:0;align-self:stretch;align-content:center;margin:0;padding:0;list-style:none;min-width:0}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-sequence>li{position:relative;margin:0;padding:24px 0 24px 34px;min-width:0;border:0;border-left:2px solid #d6e2f4;background:transparent;border-radius:0}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-sequence>li:first-child{padding-top:0}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-sequence>li:last-child{padding-bottom:0}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-sequence>li::before{content:"";position:absolute;left:-5px;top:38px;width:8px;height:8px;border-radius:50%;background:var(--blue)}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-sequence>li:first-child::before{top:14px}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-sequence>li:nth-child(2)::before{background:var(--pink)}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-stage-title{display:flex;align-items:baseline;gap:18px;margin:0 0 10px}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-stage-number{font-size:15px;line-height:1.5;color:var(--blue);font-variant-numeric:tabular-nums}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-stage-title h3{margin:0;font-size:26px;line-height:1.25;color:var(--ink);font-weight:450;letter-spacing:-.025em}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-sequence>li>p{margin:0 0 0 37px;max-width:38ch;font-size:16px;line-height:1.6;color:var(--ink);text-wrap:pretty}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-research-process{grid-column:1/-1;display:grid;grid-template-columns:160px minmax(0,1fr);gap:24px 32px;padding:28px 32px;margin:0;background:#eef4fc;border:0;border-radius:0;min-width:0}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-research-process>h3{font-size:16px;line-height:1.5;font-weight:500;color:var(--blue);margin:0;max-width:none}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-research-record{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin:0;padding:0;min-width:0}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-research-record>div{margin:0;padding:0;min-width:0}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-research-record dt{font-size:16px;line-height:1.5;color:var(--blue);font-weight:500;margin:0 0 10px}
.reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-research-record dd{font-size:15px;line-height:1.6;margin:0;max-width:34ch;color:var(--ink);text-wrap:pretty}
.reader-page.portfolio-page.project-reading .portfolio-main #outcomes.r24-outcomes-chapter .reading-evidence-voices{display:grid;gap:30px;padding:0;background:transparent;border:0;box-shadow:none}
.reader-page.portfolio-page.project-reading .portfolio-main #outcomes.r24-outcomes-chapter .reading-evidence-voices .research-observation:first-child::before{content:none}
.reader-page.portfolio-page.project-reading .portfolio-main #outcomes.r24-outcomes-chapter .reading-evidence-voices .research-observation>.eyebrow{margin-bottom:14px}
.reader-page.portfolio-page.project-reading .portfolio-main #outcomes.r24-outcomes-chapter .reading-evidence-voices .research-scope{margin:0;padding-top:10px}

@media(max-width:1000px){
 .reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter>.reading-booklet-heading{column-gap:32px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom.reading-classroom-spread>.classroom-layout{column-gap:36px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-research-process{grid-template-columns:minmax(0,1fr);gap:20px;padding:26px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-study-meta{flex-wrap:wrap;justify-content:flex-start;gap:16px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-stage-title h3{font-size:24px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-sequence>li{padding-left:26px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-sequence>li>p{margin-left:0}
}
@media(max-width:760px){
 .reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter{row-gap:30px;padding-block:44px}
 .reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter>.reading-booklet-heading{grid-template-columns:minmax(0,1fr);gap:22px}
 .reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .reading-booklet-context{padding-top:0}
 .reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .reading-design-core{gap:30px}
 .reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .booklet-intentions{grid-template-columns:minmax(0,1fr);gap:30px;padding:28px 24px}
 .reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .booklet-intention+.booklet-intention{padding-top:28px;border-top:1px solid #d5e1f3}
 .reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .booklet-intention h3{margin-bottom:16px}
 .reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .booklet-intention-route{font-size:26px;gap:10px 14px}
 .reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .booklet-intention-note{margin-top:14px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom.reading-classroom-spread{padding-block:44px;row-gap:30px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom.reading-classroom-spread>.classroom-layout{grid-template-columns:minmax(0,1fr);gap:36px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-observation{gap:24px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-study-meta{flex-wrap:nowrap;justify-content:space-between;gap:16px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-school{max-width:24ch}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-observation-photo img{height:auto;max-height:380px;object-position:left center}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-sequence{margin:0 0 0 4px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-sequence>li{padding:24px 0 24px 26px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-stage-title{gap:16px;margin-bottom:10px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-sequence>li>p{max-width:42ch}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-research-process{gap:26px;padding:26px 24px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-research-record{grid-template-columns:minmax(0,1fr);gap:26px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-research-record dd{max-width:48ch}
 .reader-page.portfolio-page.project-reading .portfolio-main #outcomes.r24-outcomes-chapter .reading-evidence-voices{gap:30px}
}
@media(max-width:380px){
 .reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .booklet-intentions{padding:26px 18px}
 .reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .booklet-intention-route{font-size:23px;gap:10px}
 .reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .booklet-intention-route>svg{flex-basis:24px;width:24px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-cohort{gap:10px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-school{max-width:17ch}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-research-process{padding-inline:20px}
}
@media screen and (min-width:901px) and (max-height:680px){
 .reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter{padding-block:28px;row-gap:24px}
 .reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter>.reading-booklet-heading{gap:24px 4vw}
 .reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .reading-booklet-heading h2{font-size:28px}
 .reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .reading-booklet-context>p{font-size:15px;line-height:1.55}
 .reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .reading-booklet-context>.reading-booklet-text{margin-top:8px}
 .reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .reading-design-core{gap:24px}
 .reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .booklet-collection{max-width:calc(clamp(135px,calc(var(--reading-viewport-height) - 465px),185px) * 5.62 + 60px);gap:20px}
 .reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .booklet-intentions{padding:22px 26px;column-gap:4vw}
 .reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .booklet-intention h3{margin-bottom:12px}
 .reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .booklet-intention-route{font-size:24px}
 .reader-page.portfolio-page.project-reading .portfolio-main #design.r24-booklet-chapter .booklet-intention-note{margin-top:12px;font-size:15px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom.reading-classroom-spread{padding-block:28px;row-gap:24px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom.reading-classroom-spread>.classroom-layout{gap:28px 5vw}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-observation{gap:18px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-observation-photo img{height:190px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-cohort>strong{font-size:38px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-sequence>li{padding-block:14px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-sequence>li:first-child{padding-top:0}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-sequence>li:last-child{padding-bottom:0}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-sequence>li::before{top:28px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-sequence>li:first-child::before{top:14px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-stage-title{margin-bottom:7px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-stage-title h3{font-size:24px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-sequence>li>p{font-size:15px;line-height:1.55}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-research-process{grid-template-columns:minmax(0,1fr);gap:14px;padding:20px 26px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-research-record{gap:24px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-research-record dt{margin-bottom:7px}
}
@media print{
 .reader-page.portfolio-page.project-reading .portfolio-main :is(#design.r24-booklet-chapter,#classroom.reading-classroom-spread){padding-block:28px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom.reading-classroom-spread>.classroom-layout{grid-template-columns:minmax(0,1fr);gap:28px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-observation-photo img{height:auto;max-height:280px}
 .reader-page.portfolio-page.project-reading .portfolio-main #classroom .classroom-sequence>li{break-inside:avoid}
}