.lean-intro { max-width: 76rem; margin: 0 auto 2rem; }
.lean-intro p { max-width: 66rem; }
.lean-comparison { max-width: 90rem; margin: 0 auto; padding: 0 1.5rem 4rem; }
.lean-pair { margin: 0 0 3.5rem; padding-top: 2rem; border-top: 1px solid rgba(255,255,255,.13); }
.lean-pair h2 { margin: 0 0 .55rem; }
.lean-pair > p { max-width: 70rem; margin: 0 0 1.5rem; }
.lean-pair-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.3rem; align-items: start; }
/* Columns in proportion to the two captures' pixel widths, so both show the text at one size and stand at one height (2026-09-26). */
.lean-pair-grid.lean-pair-proportional { grid-template-columns: minmax(0, 1654fr) minmax(0, 1122fr); align-items: stretch; }   /* the two cards one height, whatever their captions */
.lean-shot { min-width: 0; margin: 0; overflow: hidden; border: 1px solid rgba(180,190,255,.23); border-radius: 1rem; background: rgba(9,14,31,.72); }
.lean-shot .lean-shot-label { display: block; padding: .85rem 1rem; font-weight: 700; color: var(--accent-soft, #c8b6ff); }
.lean-shot a { display: block; }
.lean-shot img { width: 100%; height: auto; display: block; }
.lean-shot figcaption { padding: .9rem 1rem 1.1rem; font-size: .94rem; line-height: 1.5; }
.lean-shot figcaption a { display: inline; }
.lean-observation { margin: 1.15rem 0 0; padding: 1rem 1.2rem; border-left: 3px solid var(--accent-soft, #bba7ff); background: rgba(150,130,255,.08); }
.lean-note { max-width: 76rem; margin: 0 auto 4rem; padding: 1.3rem 1.5rem; border-top: 1px solid rgba(255,255,255,.13); }
.lean-wide-shot { max-width: 72rem; margin: 1.4rem 0; }
@media (max-width: 800px) { .lean-pair-grid, .lean-pair-grid.lean-pair-proportional { grid-template-columns: 1fr; } .lean-comparison { padding: 0 1rem 3rem; } }
