/* Jennifer's comparison keeps two independent groups above the response. */
#why .relationship-work{grid-template-columns:1fr;gap:40px}
#why .signals-intro h2{max-width:26ch}
#why .signals-intro p{max-width:60ch;margin-top:20px}
#why .signal-groups{display:grid;grid-template-columns:1fr 1fr;gap:28px}
#why .signal-row{padding:28px 32px;border:1px solid var(--rule);background:var(--paper)}
#why .signal-row h3{margin-bottom:20px;font-size:23px}
#why .signal-row ul{display:block;list-style:disc;padding-left:20px;margin:0}
#why .signal-row li{padding:0 0 0 4px;margin:0 0 12px;font-size:17px}
#why .signal-row li:last-child{margin-bottom:0}
#why .signal-row li:before{content:none}
#why .signal-row li::marker{color:var(--green-700);font-size:.75em}
#why .help-row{grid-column:1/-1;padding:28px 32px;border:1px solid var(--rule);background:var(--paper)}
#why .help-row ul{columns:2;column-gap:56px}
#why .help-row li{break-inside:avoid}
/* Planning topics read as a calm list of subjects, without decorative dots. */
#bridge .planning-topics{columns:auto;display:grid;grid-template-columns:1fr 1fr;gap:0 28px;align-content:start}
#bridge .planning-topics li{margin:0;padding:12px 0;border-top:1px solid #577366;line-height:1.5}
#bridge .planning-topics li:before{content:none}
/* Static horizontal process follows the four-node line and return arc in Pascal's video. */
#how .method-layout{display:block}
#how .method-intro{position:static}
#how .method-intro p{max-width:66ch;margin-top:16px}
#how .method-intro .text-link{margin-top:12px}
.method-overview{margin:24px 0 0}
.method-line{display:block;width:100%;height:auto;max-height:208px;color:var(--green-700);overflow:visible}
.method-line path{stroke:currentColor;stroke-width:1.5;fill:none;vector-effect:non-scaling-stroke}
.method-line circle{fill:var(--green-900)}
.method-line .method-ring{fill:none;stroke:currentColor;stroke-width:1;vector-effect:non-scaling-stroke}
.method-labels{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));list-style:none;padding:0;margin:0;text-align:center}
.method-labels span{display:block;font-size:14px;color:var(--green-700);margin:0 0 12px}
.method-labels h3{font-size:clamp(17px,3vw,40px);font-weight:400;line-height:1.2;letter-spacing:-.02em}
.method-overview figcaption{margin-top:44px;text-align:center;font-size:17px;color:var(--muted)}
@media(max-width:650px){
 #why .signal-groups{grid-template-columns:1fr;gap:20px}
 #why .signal-row{padding:24px}
 #why .signal-row h3{font-size:22px}
 #why .help-row{padding:24px}
 #why .help-row ul{columns:auto}
 #bridge .planning-topics{grid-template-columns:1fr}
 .method-overview{margin-top:40px}
 .method-labels span{font-size:12px;margin-bottom:8px}
 .method-overview figcaption{font-size:15px;margin-top:28px;max-width:28ch;margin-inline:auto}
}

/* November 10: give practical planning the same readable card treatment. */
#bridge .planning-work{display:block;border-top:0;padding:0 0 56px}
#bridge .planning-work>div{max-width:70ch;margin-bottom:24px}
#bridge .planning-work .pretext{max-width:65ch}
#bridge .planning-topics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
#bridge .planning-topics li{display:flex;align-items:center;min-height:96px;margin:0;padding:22px 24px;border:1px solid #739080;background:#203c2b;color:#f4f7f1;font-size:17px}
@media(max-width:850px){#bridge .planning-topics{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:550px){#bridge .planning-topics{grid-template-columns:1fr}#bridge .planning-topics li{min-height:80px;padding:20px}}
