/* Natural-ratio main maps, with a thumbnail rail instead of empty side space. */
.case-gallery{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(240px,1fr);gap:0 20px;align-items:start}
.case-subheading{grid-column:1/-1}
.screenshot-stage{min-width:0}
.stage-image{width:100%;background:#122428;line-height:0}
.stage-image img{display:block;width:100%;height:auto;max-height:none;aspect-ratio:auto;object-fit:contain;background:transparent}
.stage-image>span{line-height:1.3}
.screenshot-thumbs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:0}
.screenshot-thumbs button{padding:5px;overflow:hidden}
.screenshot-thumbs img{display:block;width:100%;height:auto;aspect-ratio:1.6;object-fit:cover;object-position:center;background:transparent}
.screenshot-thumbs span{padding:6px 7px;font-size:9px;line-height:1.5}
.stage-caption{padding-bottom:0}
/* Match the visible case-study card edges, including its border treatment. */
#tentang.about{width:calc(100% - 2*var(--page-gutter));max-width:calc(var(--page-width) - 2*var(--page-gutter));padding:30px 25px;border:1px solid var(--line);border-radius:5px;margin-inline:auto;margin-bottom:25px}
@media(max-width:900px){.case-gallery{grid-template-columns:minmax(0,1fr) 155px;gap:0 14px}.screenshot-thumbs img{height:64px;aspect-ratio:auto}.screenshot-thumbs span{font-size:8px;padding:5px}.screenshot-thumbs{grid-template-columns:minmax(0,1fr);gap:7px}}
@media(max-width:650px){.case-gallery{display:block}.stage-image img{width:100%;height:auto;max-height:none;aspect-ratio:auto}.stage-caption{padding-bottom:12px}.screenshot-thumbs{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.screenshot-thumbs img{width:100%;height:auto;aspect-ratio:1.65;object-fit:cover}.screenshot-thumbs span{font-size:8px;padding:6px}.case-subheading{margin-bottom:12px}#tentang.about{padding:24px 16px;margin-bottom:18px}}