.wp-block-maxdecisions-business-solutions {
  background-color: var(--dark-grey);
  margin-bottom: 96px;
	overflow: hidden;

  .wrapper {
    padding: 96px 0px 112px 0px;
  }

  .business-solutions__title-wrapper {
    .block-title {
			font-size: 34px;
			color: #1c1c1f;
			font-weight: 700;
			line-height: 43px;
      color: #80868d;
      width: 667px;
      margin: 0 auto;
      text-align: center;
      margin-bottom: 74px;

      @media only screen and (max-width: 1024px) {
        width: 100%;
        margin-bottom: 70px;
      }
      span:last-child {
        margin-left: 8px;
        position: relative;

        a {
					transition: all .3s ease-out;
    			text-decoration: none;
          color: var(--white);
        }

				a:hover {
					color: var(--blue);
				}
      }

			span:last-child::after {
				content: "";
				position: absolute;
				top: 47%;
				right: -18px;
				mask-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB3aWR0aD0iOHB4IiBoZWlnaHQ9IjEycHgiIHZpZXdCb3g9IjAgMCA4IDEyIiB2ZXJzaW9uPSIxLjEiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIGlkPSJHcm91cCI+CiAgICA8cGF0aCBkPSJNMCAxLjQxNDIxTDEuNDE0MjEgMEw3LjEyNTk2IDUuNzExNzRMMS40MTQyMSAxMS40MjM1TDEuNzc2MzZlLTE1IDEwLjAwOTNMNC4yOTc1MyA1LjcxMTc0TDAgMS40MTQyMVoiIGlkPSLwn46oLUljb24tU3R5bGUiIGZpbGw9IiMwMzBGMUMiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc3Ryb2tlPSJub25lIiAvPgogIDwvZz4KPC9zdmc+);
				width: 7px;
				height: 14px;
				mask-repeat: no-repeat;
				background-color: var(--white);
			}

			span:last-child:hover::after {
				background-color: var(--blue);
			}
    }
  }

  .business-solutions__wrapper {
    display: flex;
    position: relative;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;

		.swiper-solution {
			overflow: visible;
      width: 100vw;
			margin-left: auto;
			margin-right: auto;
			position: relative;
			list-style: none;
			padding: 0;
			z-index: 1;
			display: block;

			> :not(:last-child) {
				margin-right: 20px;
			}

			> :first-child {
				margin-left: 10px;

				@media only screen and (min-width: 1024px) {
					margin-left: 50px;
				}

				@media only screen and (min-width: 1280px) {
					margin-left: 0;
				}
			}

			.swiper-slide {
				outline: none;
				max-width: 265px;
				width: 100%;
				display: flex !important;
				flex-direction: column !important;

				@media only screen and (min-width: 1024px) {
					position: relative;
					transition: box-shadow 0.3s ease-in-out;
					position: relative;
					background-color: var(--white);
					border-radius: 20px;
					transition: all 0.2s linear;
				}
			}
    }

		swiper-container::part(wrapper) {
			@media only screen and (min-width: 1024px) {
				display: flex;
				position: relative;
				align-items: center;
				justify-content: center;
				flex-direction: row;
			}
		}

		swiper-container::part(pagination) {
			display: flex;
			align-items: center;
			justify-content: center;
			bottom: -50px;
			width: 100% !important;
		}

		swiper-container::part(bullet) {
			width: 10px;
			height: 10px;
			background-color: #606871;
			color: #dbe1ff;
			margin-right: 14px !important;
		}

		swiper-container::part(bullet-active) {
			background-color: #edf0ff;
			color: #edf0ff;
			width: 10px;
			height: 10px;
			margin-right: 14px !important;
		}

		swiper-container::part(container) {
			overflow: visible;
		}

		.link {
			font-size: 12px;
			font-weight: 700;
			letter-spacing: 1px;
			color: #1c1c1f;
			z-index: 99;
			transition: 0.4s ease-in-out;
			display: flex;
			align-items: center;
      pointer-events: none;
      position: absolute;
      right: 37px;
      bottom: 37px;
    }

		.link::after {
			content: "";
			-webkit-mask-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB3aWR0aD0iMjRweCIgaGVpZ2h0PSIyNHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHZlcnNpb249IjEuMSIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPGcgaWQ9InN2ZyI+CiAgICA8ZyBpZD0iQXJyb3dzYXJyb3dfcmlnaHQiPgogICAgICA8cGF0aCBkPSJNMCAwTDI0IDBMMjQgMjRMMCAyNEwwIDBMMCAwWiIgaWQ9IkJveC0yNHB0IiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHN0cm9rZT0ibm9uZSIgLz4KICAgICAgPHBhdGggZD0iTTE4LjE3NCAxMC45OUwxMi41ODggNS4zOTk5TDE0LjAwMyAzLjk4OTk5TDIyLjAxNCAxMkwxNC4wMDMgMjAuMDA5OUwxMi41ODggMTguNkwxOC4xOTggMTIuOTlMMi4wMDkgMTIuOTlMMi4wMDkgMTAuOTlMMTguMTc0IDEwLjk5TDE4LjE3NCAxMC45OVoiIGlkPSLwn46oLUljb24tU3R5bGUiIGZpbGw9IiMxQzFDMUYiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc3Ryb2tlPSJub25lIiAvPgogICAgPC9nPgogIDwvZz4KPC9zdmc+);
			mask-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB3aWR0aD0iMjRweCIgaGVpZ2h0PSIyNHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHZlcnNpb249IjEuMSIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPGcgaWQ9InN2ZyI+CiAgICA8ZyBpZD0iQXJyb3dzYXJyb3dfcmlnaHQiPgogICAgICA8cGF0aCBkPSJNMCAwTDI0IDBMMjQgMjRMMCAyNEwwIDBMMCAwWiIgaWQ9IkJveC0yNHB0IiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHN0cm9rZT0ibm9uZSIgLz4KICAgICAgPHBhdGggZD0iTTE4LjE3NCAxMC45OUwxMi41ODggNS4zOTk5TDE0LjAwMyAzLjk4OTk5TDIyLjAxNCAxMkwxNC4wMDMgMjAuMDA5OUwxMi41ODggMTguNkwxOC4xOTggMTIuOTlMMi4wMDkgMTIuOTlMMi4wMDkgMTAuOTlMMTguMTc0IDEwLjk5TDE4LjE3NCAxMC45OVoiIGlkPSLwn46oLUljb24tU3R5bGUiIGZpbGw9IiMxQzFDMUYiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc3Ryb2tlPSJub25lIiAvPgogICAgPC9nPgogIDwvZz4KPC9zdmc+);
			background-color: #1c1c1f;
			-webkit-mask-repeat: no-repeat;
			mask-repeat: no-repeat;
			width: 24px;
			height: 23px;
			transition: .4s ease-in-out;
			margin-bottom: -2px;
			margin-left: 6px;
		}


    @media screen and (max-width: 1024px) {
      padding-left: 20px;
    }
  }

  .solutions-card {
    margin-top: auto !important;
    display: flex;
    flex-direction: column;
    flex: 1 0 auto;
    min-height: 382px;
		height: auto;
		width: auto;

    @media only screen and (max-width: 1024px) {
      position: relative;
      transition: box-shadow 0.3s ease-in-out;
      max-width: 264px;
      background-color: var(--white);
      border-radius: 20px;
      transition: all 0.2s linear;
      margin: 0;
    }

    .solutions-card-content {
      margin-bottom: 36px;
      max-width: 200px;
      padding: 50px 0px 0px 24px;

      @media only screen and (max-width: 1029px) {
        max-width: 100%;
        padding-right: 44px;
      }

      @media only screen and (max-width: 1024px) {
        max-width: 100%;
      }

      .title {
				font-size: 24px;
				line-height: 1.2;
				font-weight: 700;
        margin-bottom: 8px;
        width: 200px;
      }

      .solution-subtitle {
        font-size: 18px;
        line-height: 24px;
        font-weight: 500;
        margin-bottom: 24px;

				@media only screen and (max-width: 768px) {
					font-size: 16px;
					line-height: 24px;
				}
      }

      .excerpt {
        margin-bottom: 0;
      }
    }

    .card__footer {
      display: flex;
      justify-content: flex-end;
      margin-right: 67px;
      margin-top: auto;
      @media only screen and (max-width: 1024px) {
        margin-bottom: 33px;
      }

      .card--link {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
      }
    }

  }

	.solutions-card:hover {
		.excerpt {
			color: white;
			opacity: 0.75;
		}

		.link::after {
			background-color: var(--white);
		}
	}

	.solutions-card:last-of-type {
		@media only screen and (max-width: 1024px) {
			margin-bottom: 0;
		}
	}

  .swiper-slide:hover:nth-child(n) {
    @media only screen and (min-width: 1024px) {
      background-color: var(--teal);
      color: var(--white);
    }
  }

  .swiper-slide:hover:nth-of-type(2n) {
    @media only screen and (min-width: 1024px) {
      background-color: var(--orange);
      color: var(--white);
    }
  }

  .swiper-slide:hover:nth-of-type(3n) {
    @media only screen and (min-width: 1024px) {
      background-color: var(--pink);
      color: var(--white);
    }
  }

  .swiper-slide:hover:nth-of-type(4n) {
    @media only screen and (min-width: 1024px) {
      background-color: var(--red);
      color: var(--white);
    }
  }

  .count-1 .solutions-card:hover {
    @media only screen and (max-width: 1024px) {
      background-color: var(--teal);
      color: var(--white);
    }
  }
  .count-2 .solutions-card:hover {
    @media only screen and (max-width: 1024px) {
      background-color: var(--orange);
      color: var(--white);
    }
  }
  .count-3 .solutions-card:hover {
    @media only screen and (max-width: 1024px) {
      background-color: var(--pink);
      color: var(--white);
    }
  }
  .count-4 .solutions-card:hover {
    @media only screen and (max-width: 1024px) {
      background-color: var(--red);
      color: var(--white);
    }
  }
  .count-5 .solutions-card:hover {
    @media only screen and (max-width: 1024px) {
      background-color: var(--red);
      color: var(--white);
    }
  }
}