/* Claude polish pass on v4 (layout + graphics only; copy, structure, reader unchanged). */

/* Rhythm */
.chapter-inner{padding-top:104px;padding-bottom:104px;column-gap:48px}
.chapter-1 .chapter-inner,.chapter-4 .chapter-inner{align-items:center}
.chapter-1 h2,.chapter-4 h2{font-size:3.4rem}
.narrative{font-size:1.06rem;line-height:1.7}

/* Lessons: big type, no heavy box. One accent bar, a small label. */
.lesson,.chapter-2 .lesson,.chapter-3 .lesson{background:none;color:inherit;border:0;border-left:4px solid #007c58;border-radius:0;padding:4px 0 4px 26px;margin-top:40px;max-width:680px}
.lesson span{display:block;font-size:.66rem;font-weight:750;letter-spacing:.14em;text-transform:uppercase;color:#007c58;margin-bottom:10px}
.lesson strong{display:block;font-size:2.15rem;line-height:1.18;letter-spacing:-.035em;font-weight:750;color:#112026}
.chapter-3 .lesson{border-left-color:#59e6ac}
.chapter-3 .lesson span{color:#59e6ac}
.chapter-3 .lesson strong{font-size:2.9rem;color:#fff;max-width:760px}
.chapter-2 .lesson{margin:40px auto 0;border-left:0;border-top:4px solid #007c58;padding:22px 0 0;max-width:640px}
.chapter-5 .lesson{margin-top:0}

/* Read links: one quiet, consistent outline button on a single line. */
.read{flex-direction:row;align-items:center;gap:14px;background:#112026;color:#fff;border:1.5px solid #112026;border-radius:999px;padding:12px 22px;min-height:48px;margin-top:40px;font-size:.95rem}
.read span{margin:0;color:#d2e9df;font-size:.85rem;font-weight:500}
.read:hover,.read:focus-visible{background:#fff;color:#112026;border-color:#112026}
.read:hover span,.read:focus-visible span{color:#526068}
.chapter-3 .read{background:#112026;color:#fff;border-color:#59e6ac}
.chapter-3 .read span{color:#d2e9df}
.chapter-3 .read:hover,.chapter-3 .read:focus-visible{background:#fff;color:#112026;border-color:#fff}
.chapter-3 .read:hover span,.chapter-3 .read:focus-visible span{color:#526068}

/* Concept diagrams: unboxed, larger, captioned quietly. */
.chapter-1 .concept,.chapter-4 .concept{background:none;border:0;padding:0;border-radius:0}
.concept-label{display:none}
.concept svg{stroke-width:2.25;max-height:none}
.chapter-1 .concept svg,.chapter-4 .concept svg{width:100%;height:auto;max-width:460px;display:block;margin:0 auto}
.chapter-1 .concept figcaption,.chapter-4 .concept figcaption{text-align:center;font-size:.85rem;font-weight:600;color:#526068;margin-top:18px}
.decision-labels{flex-direction:row;justify-content:center;gap:10px;margin:22px 0 0;flex-wrap:wrap}
.decision-labels span{border:1px solid #c9d8d0;border-radius:999px;padding:6px 14px;font-size:.8rem;background:#fff}

/* Ch2 operation frame: lighter card, clearer hierarchy. */
.operation-frame{border:0;background:#fff;box-shadow:0 1px 2px rgba(17,32,38,.06),0 12px 32px rgba(17,32,38,.06);padding:30px 28px;max-width:640px}
.artifact{border-color:#112026;padding:12px 34px}
.artifact strong{font-size:1.05rem}
.operation-label{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:#007c58;font-weight:750;margin:24px 0 12px}
.operation-frame li{font-size:.85rem;padding:8px 14px;border-radius:999px;background:#eef4f1;border:1px solid #c9d8d0}

/* Ch3: incident panels and acceptance strip scaled up to match the lesson. */
.incident-pair{gap:20px;margin:44px 0 36px}
.incident-pair>div{background:#133630;border-top:0;border-radius:10px;padding:28px 30px}
.incident-pair span{color:#59e6ac}
.incident-pair p{font-size:1.45rem;line-height:1.35}
.acceptance{gap:18px;margin:8px 0 8px}
.acceptance strong{font-size:1.05rem;padding:14px 26px}
.acceptance-gate{font-size:.8rem;padding:10px 18px;border:1px dashed #87ae9d;border-radius:999px;color:#b8d3c9}
.chapter-3 .narrative{font-size:1.1rem;margin-top:28px;max-width:640px}

/* Ch5 handoff chain: uniform chips. */
.handoff{gap:18px;margin:48px 0 44px}
.handoff span{border-radius:999px;min-height:48px;font-size:.85rem}
.handoff span+span:before{width:18px}
.chapter-5 .continuation-summary{gap:56px;align-items:center}

/* Diagram footnote: folded into the bottom of chapter 5, not a stray strip. */
.diagram-footnote{background:#eef4f1;max-width:none;padding:0 0 40px}
.diagram-footnote p{max-width:1200px;margin:0 auto;padding-left:calc(7.1% + 133px);font-size:.72rem;color:#7a8e88}

/* Close + bio */
.close{padding:112px 0}
.close h2{font-size:3.4rem;letter-spacing:-.04em}
.bio{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);column-gap:72px;padding-top:96px;padding-bottom:96px;align-items:start}
.bio>p:nth-of-type(1){grid-column:1;grid-row:1;margin:0}
.bio>h2{grid-column:1;grid-row:2;margin:14px 0 0;font-size:2.4rem}
.bio>p:nth-of-type(2){grid-column:2;grid-row:1/3;margin:0}
.bio>p:nth-of-type(3){grid-column:2;grid-row:3;margin:16px 0 0}
.bio p:not(.eyebrow){font-size:1.06rem;line-height:1.7;color:#34474d;max-width:680px}

@media(max-width:950px){
  .chapter-inner{padding-top:80px;padding-bottom:80px}
  .diagram-footnote p{padding-left:calc(25px + 92px)}
}
@media(max-width:650px){
  .chapter-inner,.chapter-2 .chapter-inner,.chapter-3 .chapter-inner,.chapter-5 .chapter-inner{padding:56px 25px 56px 48px}
  .chapter-1 h2,.chapter-4 h2{font-size:2.3rem}
  .lesson,.chapter-2 .lesson{margin-top:30px;padding-left:18px}
  .chapter-2 .lesson{border-top:0;border-left:4px solid #007c58;padding-top:4px}
  .lesson strong{font-size:1.6rem}
  .chapter-3 .lesson strong{font-size:2rem}
  .incident-pair p{font-size:1.2rem}
  .acceptance-gate{border-radius:0;border:0;border-left:1px dashed #87ae9d;border-right:1px dashed #87ae9d;margin:0 auto;width:60%}
  .read{width:100%;justify-content:space-between}
  .handoff span{min-height:44px}
  .diagram-footnote p{padding:0 25px 0 48px}
  .close{padding:64px 0}.close h2{font-size:2.4rem}
  .bio{grid-template-columns:minmax(0,1fr);padding-top:64px;padding-bottom:64px}
  .bio>p:nth-of-type(1),.bio>h2,.bio>p:nth-of-type(2),.bio>p:nth-of-type(3){grid-column:1;grid-row:auto}
  .bio>p:nth-of-type(2){margin-top:18px}
}
.read span{white-space:nowrap;flex-shrink:0}
@media(max-width:650px){.read{border-radius:14px;padding:12px 18px}}

/* Review correction: keep the timeline in its own gutter, clear of every numeral. */
@media(min-width:651px){
  .chapter-inner{padding-left:clamp(25px,7.1vw,90.88px);padding-right:clamp(25px,7.1vw,90.88px)}
  .chapter-inner:before{left:calc(clamp(25px,7.1vw,90.88px) - 18px)}
  .number:before{left:-23px}
}

/* Council10-derived artwork: the homepage ring, interpreted for five essays. */
.close-heading{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:56px;align-items:center}
.close-title h2{margin-bottom:0;max-width:700px}
.story-qm-art{width:260px;justify-self:end}
.story-qm-art svg{display:block;width:100%;height:auto}
@media(max-width:950px){.close-heading{grid-template-columns:minmax(0,1fr) 200px;gap:32px}.story-qm-art{width:200px}}
@media(max-width:650px){.close-heading{grid-template-columns:minmax(0,1fr);gap:28px}.story-qm-art{width:190px;justify-self:center}}
