.promotions {
  padding-top: 60px;
  padding-bottom: 60px;

  .container {
    padding-left: var(--sideGap);
    padding-right: var(--sideGap);
    --container-width: inherit;
    max-width: none !important;
  }

  .promotions-wrap {
    display: flex;
    --promo-border-color: #a8abae;

    &.themeopt4 {
      --promo-border-color: #eeeef1;
    }

    .promotions-aside-wrap {
      border-color: var(--promo-border-color);

      .promotion-card {
        &:first-child:not(:only-child) {
          /*border-color: var(--promo-border-color);*/
          border-bottom: 1px solid var(--promo-border-color);
        }
      }
    }


    h2 {
      font-size: 36px;
      font-style: normal;
      font-weight: 600;
      line-height: 125%;
    }

    a.btn {
      &::after {
        content: '';
        display: inline-block;
        vertical-align: middle;
        width: 20px;
        height: 10px;
        margin-left: 4px;
        background-image: url('/wp-content/themes/assent-wp/assets/images/webistry/arrow-up-right-white.svg');
        background-size: cover;
        background-position: 50%;
        transform: translate(0, 0);
        transition: transform 0.25s linear;
      }

      &.-white::after {
        background-image: url('/wp-content/themes/assent-wp/assets/images/webistry/arrow-up-right.svg');
      }

      &:hover::after {
        transform: translate(2px, -2px);
      }
    }

    &.themeopt1, &.themeopt2, &.themeopt3 {
      .promotions-main-wrap {
        color: #fff;

        h2,
        .promotions-content {
          color: #fff;
        }
      }
    }

    &.themeopt1 .promotions-main-wrap {
      background: linear-gradient(90deg, #215273 0%, #813679 141.34%);
    }

    &.themeopt2 .promotions-main-wrap {
      background: linear-gradient(118deg, #163548 6.95%, #215274 40.97%, #00a398 90.17%
      );
    }

    &.themeopt3 .promotions-main-wrap {
      background: #343a40;
    }

    &.themeopt4 .promotions-main-wrap {
      background: #f5f5f7;

      .promotions-content {
        color: #343a40;
      }
    }

    .promotions-main-wrap {
      flex: 2;
      display: flex;
      align-items: center;

      .promotions-content {
        .eyebrow-image,
        .eyebrow-text {
          border-radius: 3px;
          border: 1px solid rgba(0, 0, 0, 0.09);
          background: rgba(255, 255, 255, 0.88);
          padding: 4px 8px;
          width: fit-content;
          margin-bottom: 24px;
        }

        .eyebrow-text {
          color: #000;
        }
      }

      .promotions-image {
        z-index: 10;

      }
    }
  }


  .promotions-aside-wrap {
    flex: 1;
    display: flex;

    .promotion-card {
      flex: 1;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      padding: 20px 32px;

      .eyebrow-text, .eyebrow-image {
        border-radius: 3px;
        border: 1px solid #b9b9b9;
        background: rgba(255, 255, 255, 0.88);
        width: fit-content;
        padding: 5px 8px;
        margin-bottom: 12px;
      }

      .eyebrow-text {
        color: #0f132e;
        font-size: 15px;
        font-style: normal;
        font-weight: 500;
        line-height: 16px;
      }

      h3 {
        color: #343a40;
        font-size: 24px;
        font-style: normal;
        font-weight: 600;
        line-height: 125%;
      }

      a.promo-arrow {
        color: #4d758f;
        font-size: 18px;
        font-style: normal;
        font-weight: 600;
        line-height: 1.5;
        text-decoration: none;

        &::after {
          content: '';
          display: inline-block;
          vertical-align: middle;
          width: 20px;
          height: 10px;
          margin-left: 4px;
          background-image: url('/wp-content/themes/assent-wp/assets/images/webistry/arrow-up-right.svg');
          background-size: cover;
          background-position: 50%;
          transform: translate(0, 0);
          transition: transform 0.25s linear;
        }

        &:hover::after {
          transform: translate(2px, -2px);
        }
      }
    }
  }


}

@media (max-width: 600px) {
  /*.promotions-aside-wrap {*/
  /*  flex-direction: column;*/
  /*  border-right: 1px solid var(--promo-border-color);*/
  /*  border-bottom: 1px solid var(--promo-border-color);*/
  /*  border-left: 1px solid var(--promo-border-color);*/
  /*  border-radius: 0 0 20px 20px;*/
  /* */
  /*}*/
}


/*@media (min-width: 601px) and (max-width: 990px) {*/
/*  .promotions-aside-wrap {*/
/*    flex-direction: column;*/
/*    border-right: 1px solid var(--promo-border-color);*/
/*    border-bottom: 1px solid var(--promo-border-color);*/
/*    border-left: 1px solid var(--promo-border-color);*/
/*    border-radius: 0 0 20px 20px;*/

/*    .promotion-card {*/
/*      &:first-child:not(:only-child) {*/
/*        !*border-right: 1px solid var(--promo-border-color);*!*/
/*      }*/
/*    }*/
/*  }*/
/*}*/


@media (max-width: 990px) {
  .promotions-image .lg {
    display: none;
  }

  .promotions-image .sm {
    display: block;
  }

  .promotions-wrap {
    flex-direction: column;

    a.btn {
      margin-top: 12px;
    }
  }

  .promotions-main-wrap {
    border-radius: 20px 20px 0 0;
    flex-direction: column;
    padding: 40px 32px 0 32px;

    & .promotions-image {
      img {
        max-width: 100%;
        margin-top: 35px;
      }
    }

    .promotions-content {
      text-align: center;

      .eyebrow-image, .eyebrow-text {
        margin-left: auto;
        margin-right: auto;
      }
    }


  }

  .promotions-aside-wrap {
    flex-direction: column;
    border: 1px solid var(--promo-border-color);
    border: 1px solid var(--promo-border-color);
    border-radius: 0 0 20px 20px;


  }
}


@media (min-width: 991px) {
  .promotions-image .sm {
    display: none;
  }

  .promotions-wrap {
    a.btn {
      margin-top: 40px;
    }
  }
  .promotions-aside-wrap {
    flex-direction: column;
    border-right: 1px solid var(--promo-border-color);
    border-bottom: 1px solid var(--promo-border-color);
    border-top: 1px solid var(--promo-border-color);
    border-radius: 0 20px 20px 0;

    /*.promotion-card {*/
    /*  &:first-child:not(:only-child) {*/
    /*    border-bottom: 1px solid var(--promo-border-color);*/
    /*  }*/
    /*}*/
  }

  .promotions-main-wrap {
    border-radius: 20px 0 0 20px;
    padding: 20px 32px;
    position: relative;

    &::before {
      content: '';
      position: absolute;
      inset: 0 0 0 auto;
      width: 400px;
      background: no-repeat 60px -16px;
    }

    & .promotions-image {
      img {
        max-width: 286px;
      }
    }
  }

  .themeopt1, .themeopt2, .themeopt3 {
    .promotions-main-wrap::before {
      background-image: url('/wp-content/themes/assent-wp/assets/images/white-triangles.svg');
    }
  }

  .themeopt4 {
    .promotions-main-wrap::before {
      background-image: url('/wp-content/themes/assent-wp/assets/images/grey-triangles.svg');
    }
  }
}