@use '../../global/scss/tools' as nsw;

.nsw-content-block {
  &__title {
    font-weight: var(--nsw-font-bold);
    text-wrap: pretty;
    
    @include nsw.font-size('lg');
  }

  &__copy {
    text-wrap: pretty;
  }

  &__list {
    padding: 0;
    list-style-type: none;

    li {
      margin: 0;
      padding: nsw.rem(8px) 0 nsw.rem(8px) nsw.rem(14px);
      position: relative;

      &::before {
        content: '';
        position: absolute;
        width: nsw.rem(4px);
        height: nsw.rem(4px);
        border-radius: 100%;
        background-color: var(--nsw-text-dark);
        top: nsw.rem(18px);
        left: 0;
      
        .nsw-section--invert & {    
          background-color: var(--nsw-text-light);
        }
      }
    }
  }

  &__link {
    margin-top: nsw.rem(16px);
  }

  &__image {
    max-height: nsw.rem(200px);
    margin-bottom: nsw.rem(24px);

    img {
      width: 100%;
      height: nsw.rem(200px);
      object-fit: cover;      
    }
  }

  &__pictogram,
  &__icon {
    margin-bottom: nsw.rem(12px);
  }

  &__pictogram {
    width: nsw.rem(48px);
    height: nsw.rem(48px);

    > svg {
      box-sizing: border-box;
      display: block;
      width: 100%;
      height: 100%;
      padding: nsw.rem(3px);
    }
  }
}