/* The business journal uses an in-motion brand scene, not a packshot. */
.journal-entry figure>img.asset-city-running,.story-card figure>img.asset-city-running{object-position:50% 12%}
.editorial-image>img.asset-city-running{height:auto;max-height:none;aspect-ratio:auto;object-fit:contain}
.journal-interactive{padding-top:8px;position:relative}
.journal-interactive .journal-entry figure{box-shadow:none;transform:none}
/* The active number and arrow show selection without adding a bottom image stripe. */
.journal-interactive .journal-entry .entry-num{transition:background .25s,color .25s}
.journal-interactive .journal-entry.is-selected .entry-num{background:#111;color:#fff}
.journal-interactive .journal-entry .text-link .arrow{transition:transform .25s}
.journal-interactive .journal-entry.is-selected .text-link .arrow{transform:translate(3px,-3px)}
.journal-pagination{--journal-progress:0;position:relative;display:flex;align-items:center;gap:24px;margin-top:6px;padding-top:12px;border-top:1px solid #dedede}
.journal-pagination:before{content:'';position:absolute;top:-1px;left:0;right:0;height:2px;background:#111;transform:scaleX(var(--journal-progress));transform-origin:left;transition:transform .12s linear}
.journal-position{flex:none;font:500 11px/1.5 Inter,Arial,sans-serif;font-variant-numeric:tabular-nums}
.journal-choices{display:flex;gap:5px;justify-content:flex-end;flex:1;min-width:0}
.journal-choices button{position:relative;flex:0 1 44px;min-width:0;height:44px;border:0;background:transparent;color:#888;font:500 11px/1 Inter,Arial,sans-serif;cursor:pointer;transition:color .2s,background .2s}
.journal-choices button[aria-pressed="true"]{background:#111;color:#fff}
.journal-choices button:hover:not([aria-pressed="true"]){background:#eee;color:#111}
.journal-choices button:focus-visible{outline:2px solid #111;outline-offset:3px}
.journal-interactive.is-dragging{scroll-snap-type:none;scroll-behavior:auto;cursor:grabbing;user-select:none}
.journal-interactive.is-dragging .journal-entry{cursor:grabbing}
@media(hover:hover) and (pointer:fine){.journal-interactive,.journal-interactive .journal-entry{cursor:grab}}
@media(max-width:760px){
 .journal-pagination{gap:12px}
 .journal-position{font-size:10px}
 .journal-choices{gap:3px}
 .journal-choices button{flex:1}
}
@media(prefers-reduced-motion:reduce){
 .journal-interactive .journal-entry figure,.journal-interactive .journal-entry .entry-num,.journal-interactive .journal-entry .text-link .arrow,.journal-pagination:before,.journal-choices button{transition:none!important}
 .journal-interactive .journal-entry.is-selected figure,.journal-interactive .journal-entry.is-selected .text-link .arrow{transform:none}
}
