.main-content .module,
.module {
  @extend %card;

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    &:first-child {
      margin-top: $sp-4;
    }
  }

  >dl {
    border-bottom: $border $border-color;
    border-top: $border $border-color;
    display: grid;
    grid-template-columns: max-content 1fr;
    margin: $sp-2 (-$sp-4);

    &:first-child {
      margin-top: 0;
    }

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

    @include mq(lg) {
      grid-template-columns: 1fr 7fr;
    }

    %module-item {
      margin: 0;
      padding: $sp-2;

      @include mq(sm) {
        padding: $sp-2 $sp-4;
      }
    }

    >dt {
      @extend %module-item;
      border-top: $border $border-color;
      font-weight: normal;
      text-align: right;

      +dd {
        border-top: $border $border-color;
      }

      &:first-child {
        border-top: none;

        +dd {
          border-top: none;
        }
      }

      &::after {
        content: ":";
      }
    }

    >dd {
      @extend %module-item;

      +dd {
        padding-top: 0;
      }

      ol, ul, dl {
        margin: 0;
      }

      dl {
        display: flex;
        flex-direction: column;

        @include mq(sm) {
          flex-direction: row;
        }

        dt {
          flex: 0 0 62.5%;
          font-weight: normal;
          margin: 0;
        }

        dd {
          margin: 0;
        }
      }
    }
  }
}