.slo-tools {
  margin-top: 60px;
  display: grid;
  grid-template-areas:
    "col1 col1 col1 col2 col2 col2"
    "col3 col3 col4 col4 col5 col5"
    "col6 col6 col6 col8 col8 col8";
  grid-template-columns: repeat(6,1fr);
  gap: 20px;
}
.slo-tools .tool__link:first-child {
  grid-area: col1;
}
.slo-tools .tool__link:nth-child(2) {
  grid-area: col2;
}
.slo-tools .tool__link:nth-child(3) {
  grid-area: col3;
}
.slo-tools .tool__link:nth-child(4) {
  grid-area: col4;
}
.slo-tools .tool__link:nth-child(5) {
  grid-area: col5;
}
.slo-tools .tool__link:nth-child(6) {
  grid-area: col6;
}
.slo-tools .tool__link:nth-child(7) {
  grid-area: col7;
}
.slo-tools .tool__card {
  grid-area: col8;
}

.tool__card {
  background-color: #544FFF;
  border-radius: 20px;
  padding: 30px;
  color: #fff;
  height: 100%;
  transition: all 0.2s;
}
.tool__image {
  max-height: 49px;
  max-width: 110px !important;
}

.tool__name {
  font-size: 26px;
  margin-top: 15px;
  margin-bottom: 20px;
}

.tool__description, .tool__description > p {
  font-size: 16px;
  line-height: 26px;
}

.tool__description a {
  color: #fff;
  text-decoration: underline;
  transition: all 0.2s;
}

.tool__description a:hover {
  background-color: #fff;
  color: #544FFF;
  text-decoration: none;
  transition: all 0.2s;
}

.tool__link {
  display: block;
}

.tool__link:hover .tool__card {
  background-color: #3E3AA9;
  transition: all 0.2s;
}

.tool__image_wrapper {
  display: flex;
  justify-content: space-between;
  min-height: 49px;
}

@media screen and (max-width: 767px) {
  .slo-tools {
    grid-template-columns: repeat(2,1fr);
    grid-template-areas:
      "col1 col2"
      "col3 col4"
      "col5 col6"
      "col8 col8";
  }
}
@media screen and (max-width: 480px) {
  .slo-tools {
    grid-template-columns: auto;
    grid-template-areas:
      "col1"
      "col2"
      "col3"
      "col4"
      "col5"
      "col6"
      "col7"
      "col8";
  }
  }
}
