.block-content--type-curated-content-list {
  @extend %vertical-spacing;

  &.bg-gradient-lightblue {
    @extend %vertical-spacing-padding;
    margin-top: 4rem;
    padding-top: 0;
    background: linear-gradient(180deg, $white 0.07%, $lightblue 66.95%);

    @include breakpoint($desktop) {
      margin-top: 8rem;
    }
  }

  &.bg-lightblue {
    @extend %vertical-spacing-padding;
    background: $lightblue;
  }

  &.bg-darkblue {
    @extend %vertical-spacing-padding;
    background: $darkblue;
  }

  > .block-content__content {
    @extend .grid-container;


    > .field--name-field-heading {
      @extend h2;
      @extend h2.underlined;
    }

    > .field--name-field-body {
      @extend .usa-prose;
      margin-bottom: $row-spacing;
      max-width: 72rem;
    }

    .field--name-field-referenced-content,
    .field--name-field-media-teasers,
    .field--name-field-custom-teasers {
      > .field__items {
        @extend .grid-row;
        @extend .grid-gap-4;
        margin-top: -4rem;

        @include breakpoint($desktop) {
          @include grid-gap(5);
        }

        > *,
        > *:last-child {
          @extend .usa-card;
          margin-top: 4rem;
          margin-bottom: 0;

          @include breakpoint($tablet) {
            @include grid-col(6);
          }

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

      &.field--count-3 {
        > .field__items > * {
          @include breakpoint($desktop) {
            @include grid-col(4);
          }
        }
      }

      &.field--count-4 {
        > .field__items > * {
          @include breakpoint($desktop) {
            @include grid-col(3);
          }
        }
      }
    }

    .field--name-field-publication-teasers {
      > .field__items {
        @extend .grid-row;
        @extend .grid-gap-4;
        margin-top: -4rem;

        @include breakpoint($desktop) {
          @include grid-gap(5);
        }

        > * {
          margin-top: 4rem;
          margin-bottom: 0;

          @include breakpoint($tablet) {
            @include grid-col(4);
          }

          @include breakpoint($desktop) {
            width: 20%;
          }

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

    > .field--name-field-link {
      margin-top: $row-spacing;

      a {
        @extend .usa-button;
      }
    }
  }
}
