/* The header lockup, identical on /buy, /license/resend, /terms and /privacy:
   same place on the page, same 18px height, same hover animation, no colour
   change on hover. The home page keeps its own larger lockup. */
.page-header {
  max-width: 1019px;
  width: 100%;
  margin: 0 auto;
  padding: 28px 32px 0;
  display: flex;
  justify-content: flex-end;
}
.page-logo {
  display: flex;
  align-items: center;
  gap: 5px;
  text-decoration: none;
  /* It is a link, but nothing about it should read as one. */
  color: inherit;
}
/* Fixed box: its size never depends on which child is visible, so swapping the
   static SVG for the Lottie causes no reflow. */
.logo-icon-wrap {
  position: relative;
  width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.logo-icon-wrap img { width: 18px; height: 18px; display: block; }
.logo-wordmark { height: 18px; width: auto; display: block; }
/* The Lottie sits on top of the static mark; absolute, so it never shifts anything. */
.logo-lottie { position: absolute; inset: 0; width: 100%; height: 100%; }
.logo-lottie svg { display: block; background: none; }
[data-logo-anim].is-animated > img { visibility: hidden; }

@media (max-width: 820px) {
  .page-header { padding: 20px 24px 0; }
}