.accountability {
  .categories {
    .categories--header {
      border-bottom: 1px solid $medium-gray;
      padding-bottom: 1rem;
      margin-bottom: 1rem;
      
      .icon--arrow-bottom {
        fill: lighten($dark-gray, 50);
      }
      
      span {
        text-transform: uppercase;
        font-size: 1.15rem;
        color: lighten($dark-gray, 50);
      }
    }
    
    .categories--group {
      margin-bottom: 2rem;
      
      @include breakpoint(medium) {
        display: flex;
        margin-bottom: 4rem;
      }
      
      .category--title {
        background: $white;
        padding: 1.5rem 2rem;
        min-height: 9rem;
        
        @include breakpoint(medium) {
          height: calc(100% - 1.875rem);
        }
        
        p {
          font-weight: 600;
          margin-bottom: 0.75rem;
        }

        .progress {
          margin-bottom: 0.5rem;
        }
        .progress-info {
          position: relative;
          margin-bottom: 1.5rem;
          
          .progress-figure {
            display: inline-block;
          }
          .category--count {
            position: absolute;
            right: 0;
            top: 0.5rem;
            color: lighten($dark-gray, 50);
          }
        }
      }
      
      .card__link {
        .category--line {
          background: $light-gray-dark;
          border-radius: 4px;
          min-height: 9rem;
          padding: 1rem;
          margin-bottom: 1.875rem;
          position: relative;
          
          strong {
            font-weight: 600;
            color: $secondary;
          }
          
          .progress-figure {
            position: absolute;
            bottom: 1rem;
          }
          .category--count {
            color: lighten($dark-gray, 50);
            position: absolute;
            right: 1rem;
            bottom: 1rem;
            font-size: 80%;
          }
        }
        &:hover {
          .category--count {
            color: lighten($dark-gray, 50);
          }
          strong {
            color: scale-color($anchor-color, $lightness: -14%);
          }
        }
      }
    }

    .category--elements.active {
      display: block !important;
      
      .medium-4:first-child {
        margin-top: 1rem;
      }
    }
    
    .progress-figure {
      color: lighten($dark-gray, 50);
    }
  }
}