/* Canonical image files are untouched. Each crop compensates for the
   different camera distance in the source portrait. Face height is about
   half of a 4:5 frame; the frame never stretches with chapter copy. */
img[src="assets/shiphrah.webp"]{--portrait-width:192%}
img[src="assets/puah.webp"]{--portrait-width:130%}
img[src="assets/jochebed.webp"]{--portrait-width:152%}
img[src="assets/moses-portrait.webp"]{--portrait-width:148%}
img[src="assets/reuel-portrait.png"]{--portrait-width:126%}
img[src="assets/zipporah-portrait.png"]{--portrait-width:123%}
.chapter-portrait{min-height:0;aspect-ratio:4 / 5;align-self:center;overflow:hidden}
.chapter-portrait>img,.connection-hero>img{position:absolute;inset:0 auto auto 50%;display:block;width:var(--portrait-width,100%);max-width:none;height:auto;object-fit:initial;object-position:initial;transform:translateX(-50%)}
.connection-hero{width:min(320px,100%);aspect-ratio:4 / 5;min-height:0;margin-inline:auto}
@media(max-width:380px){.chapter-portrait{width:min(240px,100%);margin-inline:auto}}

/* v38: separate badge from the crop; mobile badges occupy their own row. */
.chapter-visual{position:relative;align-self:center;min-width:0}
.chapter-visual>.chapter-badge{position:absolute;z-index:1;left:16px;top:16px;box-shadow:0 3px 15px #0005}
@media(max-width:760px){
 .chapter-visual{display:flex;flex-direction:column;align-items:center;gap:10px;padding-block:14px}
 .chapter-visual>.chapter-badge{position:static;flex:none;margin:0;max-width:calc(100% - 12px)}
 .chapter-visual>.chapter-portrait{width:100%;align-self:auto}
}
@media(max-width:380px){.chapter-visual{width:min(240px,100%);margin-inline:auto}}

img[src$="hebrew-laborer.png"]{--portrait-width:140%;}

img[src="assets/aaron-portrait.png"]{--portrait-width:140%}
