/* Brand mark. The template pins its logo box to a 150x60 ratio and letterboxes
   anything else inside it; the Ricky wordmark is far wider than that, so it
   would be drawn at a third of the available height. Let it keep its own
   proportions and fill the bar instead. */
header img[src$="logo.svg"],
aside img[src$="logo.svg"] {
  aspect-ratio: auto;
  width: auto;
  max-width: 100%;
  height: 2.25rem;
  max-height: 2.25rem;
}
/* The mobile menu caps its logo link at 8rem wide. A wide wordmark hits that
   cap and then shrinks in height to keep its ratio, so it reads as tiny next
   to the buttons under it. Give the link room and size the mark directly. */
aside a[href="/"] { max-width: 11rem; max-height: none; }
aside img[src$="logo.svg"] { height: 1.7rem; max-height: 1.7rem; }
@media (max-width: 768px) {
  header img[src$="logo.svg"] { height: 1.9rem; max-height: 1.9rem; }
}

/* The tile grid sits in its own <section> so it keeps the template's spacing,
   but `section:not(:last-child)` then draws a separator underneath it. That
   line lands hard against whatever heading follows and reads as a stray
   border, so drop it for this wrapper only. */
.games-block {
  border-bottom: 0 !important;
  padding-bottom: 0;
}