/* /unser-team. The shortest page on the site by design: a photograph of a crew
   working, two paragraphs, one way in. Two sections were removed rather than
   restyled -- see the comment in content/unser-team.md. */

.wr-team-body {
  padding-block: clamp(var(--space-8), 13vh, 8rem);
}

/* Quiet opener, so the statement under it lands. Not an eyebrow label -- a
   real sentence, just set small. */
.wr-team-body__line {
  font-size: var(--text-base);
  color: var(--color-ink-faint);
}

/* The one large thing on the page after the hero. Two short sentences with a
   turn in the middle, which is the whole company history and reads better at
   size than it does as the opening of a paragraph. */
.wr-team-body__statement {
  margin-block-start: var(--space-4);
  max-inline-size: 20ch;
  font-size: clamp(2rem, 1.2rem + 3vw, 3.5rem);
  font-weight: var(--weight-bold);
  line-height: 1.06;
  letter-spacing: var(--tracking-tight);
  text-wrap: balance;
  color: var(--color-ink);
}

/* Five cells, not five words in a row of prose. Each gets a rule above it and
   room around it, so the set reads as a count as well as a list. */
.wr-team-body__disciplines {
  display: grid;
  gap: 0 var(--space-6);
  margin-block-start: clamp(var(--space-7), 7vh, var(--space-9));
  border-block-end: 1px solid var(--color-border);
}

.wr-team-body__disciplines > li {
  padding-block: var(--space-4);
  border-block-start: 1px solid var(--color-border);
  font-size: var(--text-lg);
  font-weight: var(--weight-medium);
  color: var(--color-ink);
}

.wr-team-body__closing {
  margin-block-start: var(--space-7);
  max-inline-size: 34ch;
  margin-inline-start: auto;
  text-align: right;
  font-size: var(--text-md);
  line-height: var(--leading-normal);
  color: var(--color-ink-soft);
}

@media (min-width: 48rem) {
  .wr-team-body__disciplines {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  /* On one row every cell needs its own rule above, not just the first. */
  .wr-team-body__disciplines > li {
    border-block-start: 1px solid var(--color-border);
  }
}