/* Finish real navigation affordances without shifting the reading layout. */
a:focus-visible,button:focus-visible{outline:2px solid var(--brass-deep);outline-offset:4px}
.related a .t{display:block;transition:transform .28s cubic-bezier(.22,1,.36,1),color .2s ease}
.related a:hover{padding-left:0;background:transparent}
.related a:focus-visible{color:var(--brass-deep)}
/* The existing linked home matter rows use a bottom rule rather than a left stripe. */
#matters .row::before{display:none}
#matters .row::after{content:"";position:absolute;left:14px;right:14px;bottom:0;height:1px;background:var(--brass);transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.22,1,.36,1);pointer-events:none}
#matters .row:focus-within::after{transform:scaleX(1)}
@media(hover:hover) and (pointer:fine){
 .related a:hover .t{transform:translateX(4px)}
 #matters .row:hover::after{transform:scaleX(1)}
}
@media(prefers-reduced-motion:reduce){
 .related a .t,.related a:hover .t{transition:none;transform:none}
 #matters .row::after{transition:none}
}
.brand-anchor{background:var(--paper);padding:0}
.brand-anchor .brand-shot{display:block;width:100%;max-width:1600px;margin:0 auto;height:auto;aspect-ratio:16/8;object-fit:cover;object-position:50% 40%}
@media (max-width:860px){.brand-anchor .brand-shot{aspect-ratio:4/3}}
