.fourp label {
  font-size: 0.875rem;
  margin-bottom: 0.25rem;
}

.fourp textarea,
.fourp fieldset div {
  width: 100%;
  padding: 0.5rem;
  min-height: 10rem;
  border-radius: 0.25rem;
}

.fourp textarea {
  border: 1px solid var(--dark-950);
}

.fourp fieldset div {
  background: #eee;
  white-space: pre-line;
}

form.fourp .inputs {
  display: grid;
  gap: 1rem;
  margin-bottom: 1rem;
}

@media (min-width: 744px) {
  form.fourp .inputs {
    grid-template-columns: calc(50% - 0.5rem) calc(50% - 0.5rem);
  }

  form.fourp .inputs div:nth-of-type(1) {
    grid-column: 1;
    grid-row: 1;
  }

  form.fourp .inputs div:nth-of-type(2) {
    grid-column: 2;
    grid-row: 1;
  }

  form.fourp .inputs div:nth-of-type(3) {
    grid-column: 1;
    grid-row: 2;
  }

  form.fourp .inputs div:nth-of-type(4) {
    grid-column: 2;
    grid-row: 2;
  }

  form.fourp .inputs div:nth-of-type(5) {
    grid-column: 1 / 3;
    grid-row: 3;
  }
}