/* Keep the review navigation visible while the page scrolls. */
body.visualjuju-page > header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--paper);
}

/* The current page marker must not underline or recolour the contact CTA. */
body.visualjuju-page nav .button,
body.visualjuju-page nav .button[aria-current="page"] {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--paper);
  text-decoration: none;
}

body.visualjuju-page nav .button:hover,
body.visualjuju-page nav .button:focus-visible {
  background: #363b2e;
}

/* Use one drawn icon at every breakpoint instead of a font-dependent glyph. */
body.visualjuju-page .vj-arrow-icon {
  display: inline-block;
  width: 1.15em;
  height: 1.15em;
  flex: none;
  vertical-align: -0.18em;
  stroke: currentColor;
}

body.visualjuju-page .button .vj-arrow-icon {
  vertical-align: middle;
}

body.visualjuju-page .card .poster::after {
  content: "";
  background-image: url("arrow-up-right.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 55%;
}

body.visualjuju-page .site-footer .affiliation {
  max-width: none;
  font-size: clamp(14px, 1.2vw, 18px);
  white-space: nowrap;
}

body.visualjuju-page .site-footer .affiliation a {
  display: inline-flex;
  align-items: baseline;
  gap: 0.2em;
  white-space: nowrap;
}

body.visualjuju-page .site-footer .affiliation .vj-arrow-icon {
  width: 0.95em;
  height: 0.95em;
  vertical-align: baseline;
}

@media (max-width: 380px) {
  body.visualjuju-page .site-footer .affiliation {
    white-space: normal;
  }
}