.lead {
  font-size: var(--font-size-lead);
  margin-top: 0;
}

p {
  margin-top: 0.25em;
  margin-bottom: 0.25em;
  &:first-child {
    margin-top: 0;
  }

  &:last-child {
    margin-bottom: 0;
  }
}

ul.list-style--none {
  padding-left: 0;
  margin-top: 0;
  li {
    list-style: none;

    display: flex;
    flex-direction: row;
    justify-content: left;
    align-items: center;

    &:before {
      content: ' ';

      display: inline-block;
      float: left;

      width: 0.5em;
      height: 0.5em;
      margin-right: 0.5em;

      border-radius: 100%;
      background-color: var(--black);
    }
  }
}

ul.list--cards {
  display: flex;
  flex-direction: column;

  padding-left: 0;

  @media(min-width: 992px) {

  }

  li {
    list-style: none;
  }
}

ul.list--vertical {
  grid-column: 1/5;
  grid-row: 7;

  display: grid;
  grid-template-columns: repeat(1, 1fr);
  grid-gap: calc(var(--gutter-width));

  @media(min-width: 1200px) {
    grid-column: 1/8;
    grid-row: 7;

    grid-template-columns: repeat(3, 1fr);
  }

  li {
    display: flex;
    flex-direction: column;
    align-items: start;

    col-span: 1;

    :global(h4) {
      margin-bottom: 0;

      font-weight: 500;
    }
  }
}

.uppercase {
  text-transform: uppercase;
}

.small {
  font-size: var(--font-size-small);
}

strong {
  font-family: var(--font-family-medium);
  font-weight: 500;
}

.intro--text__spacer {
  display: none;

  @media(min-width: 1366px) {
    display: inline-block;
    width: 35%;
  }
}

textarea {
  min-height: 7em;
  padding: calc(var(--gutter-width) / 2);

  border-top: none;
  border-right: none;
  border-bottom: 1px solid var(--grey-medium-dark);
  border-left: none;

  background: transparent;
  background-color: transparent;

  color: var(--white);
  font-family: var(--font-family-base);
  font-size: var(--font-size-h4);
  font-weight: 300;

  &:focus, :focus-visible, :focus-within {
    outline: none;
    appearance: none;
    border-color: var(--primary);

    background: transparent;
    background-color: transparent;
  }
}

input {
  padding: calc(var(--gutter-width) / 2);

  border-top: none;
  border-right: none;
  border-bottom: 1px solid var(--grey-medium-dark);
  border-left: none;

  background: transparent;
  background-color: transparent;

  color: var(--white);
  font-family: var(--font-family-base);
  font-size: var(--font-size-h4);
  font-weight: 300;

  &:focus, :focus-visible, :focus-within {
    outline: none;
    appearance: none;
    border-color: var(--primary);

    background: transparent;
    background-color: transparent;
  }
}