/* Autobots page only: the page head gains the Autobot mark beside the headline. */
body[data-page="autobots"] .page-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 30%);
  column-gap: clamp(40px, 6vw, 110px);
}
body[data-page="autobots"] .page-head > * {
  grid-column: 1;
}
body[data-page="autobots"] .page-head > .autobot-mark {
  grid-column: 2;
  grid-row: 1 / span 5;
  align-self: center;
}
.autobot-mark {
  margin: 0;
  color: var(--muted);
}
.autobot-mark svg {
  display: block;
  width: 100%;
  max-width: 400px;
  height: auto;
  margin-inline: auto;
}
.autobot-mark .autobot-guides {
  opacity: 0.55;
}
@media (max-width: 760px) {
  body[data-page="autobots"] .page-head {
    grid-template-columns: minmax(0, 1fr);
  }
  body[data-page="autobots"] .page-head > .autobot-mark {
    grid-column: 1;
    grid-row: auto;
    order: 1;
    margin-top: 30px;
  }
  body[data-page="autobots"] .page-head > :not(.page-kicker, h1, .autobot-mark) {
    order: 2;
  }
  .autobot-mark svg {
    max-width: 220px;
    margin-inline: 0;
  }
  .autobot-mark .art-folio {
    text-align: left;
  }
}