/* Pieces more than one page needs.

   css/pages/README.md: if two pages need the same rule it belongs in a shared
   file, not copied into both. These four were each declared in three or four
   page stylesheets before being lifted here. */

/* The small line naming a section. Not an eyebrow label above every heading --
   it is used where a section genuinely needs naming and nowhere else. */
.wr-label {
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  color: var(--color-ink-faint);
}

/* A section set off from the one above it by a hairline. */
.wr-band {
  padding-block: clamp(var(--space-8), 12vh, 8rem);
  border-block-start: 1px solid var(--color-border);
}

/* A row in a ruled list: name on the left, detail on the right once there is
   room for two columns. Shared by the services, the routes into the company
   and the ways of contacting it, all of which are the same shape. */
.wr-row {
  padding-block: clamp(var(--space-6), 4vh, var(--space-8));
  border-block-start: 1px solid var(--color-border);
}

.wr-row:last-child {
  border-block-end: 1px solid var(--color-border);
}

@media (min-width: 48rem) {
  .wr-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 26rem);
    gap: var(--space-6);
    align-items: baseline;
  }
}

/* The closing call: one line, one link under a green rule. */
.wr-cta__line {
  font-size: var(--text-2xl);
  font-weight: var(--weight-bold);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  text-wrap: balance;
  color: var(--color-ink);
}

.wr-cta__link {
  display: inline-block;
  margin-block-start: var(--space-6);
  font-size: var(--text-lg);
  font-weight: var(--weight-medium);
  color: var(--color-accent-text);
  text-decoration: none;
  border-block-end: 2px solid var(--color-accent);
  padding-block-end: var(--space-2);
  transition:
    color var(--motion-fast) var(--ease),
    border-color var(--motion-fast) var(--ease);
}

.wr-cta__link:hover {
  color: var(--color-ink);
  border-color: var(--color-ink);
}