.cards-grid {
  margin: 40px 0 50px;
  --gap: 40px;
  display: flex;
  flex-wrap: wrap;
  gap: var(--gap);
  justify-content: center;
}
.cards-grid > div {
  flex: 0 0 calc((100% - (3 * var(--gap))) / 4);
  box-sizing: border-box;
}
.cards-grid .cta {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: center;
  gap: 20px;
  border-radius: 20px;
  border: solid 1px;
  padding: 45px 15px 25px;
  min-width: 290px;
}
.cards-grid .cta .label {
  position: absolute;
  top: 0;
  color: #fff;
  background: #d5644c;
  padding: 8px 10px;
  border-radius: 0 0 10px 10px
}
.cards-grid .cta.orange .label {
  color: #d5644c;
  background: #fff;
}
.cards-grid .cta h2 {
  color: #fff;
  text-align: center;
  font-family: "Open Sans";
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  margin: 0;
}
.cards-grid .cta p {
  margin: 0;
}
.cards-grid .cta .btn-layout {
  text-align: center;
  color: #D5644C;
  background: #fff;
  border: solid 2px transparent;
}
.cards-grid .cta .btn-layout:hover,
.cards-grid .cta .btn-layout:focus {
  border: 2px solid #000;
}
.cards-grid.custom > div {
  flex: 0 0 calc((100% - (2 * var(--gap))) / 3);
}
.cards-grid.custom > div {
  background: #fff;
  border-color: #fff;
  color: #000;
  justify-content: start;
  align-items: start;
  text-align: left;
  padding: 25px 50px;
}
.cards-grid.custom > div h2 {
  color: var(--blue, #3D405B);
  font-family: "Open Sans";
  font-size: 30px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-align: left;
}
.cards-grid.custom > div h3 {
  color: var(--orange, #D5644C);
  text-align: center;
  font-family: "Open Sans";
  font-size: 30px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-align: left;
}
.cards-grid.custom > div h3 small {
  color: var(--orange, #D5644C);
  text-align: center;
  font-family: "Open Sans";
  font-size: 16px;
  font-style: italic;
  font-weight: 400;
  line-height: normal;
  vertical-align: middle;
}
.cards-grid.custom > div > div p {
  margin: 0 0 5px;
}
.cards-grid.custom .cta .btn-layout {
  text-align: center;
  color: #fff;
  background: #D5644C;
  border: solid 2px transparent;
}
.cards-grid.custom .cta .btn-layout:hover,
.cards-grid.custom .cta .btn-layout:focus {
  border: 2px solid #000;
}


.right-column.bottom p,
.right-column.bottom ul {
  margin: 0 0 10px
}
@media (min-width: 801px) {
  .right-column.custom,
  .right-column.bottom {
    gap: 40px
  }
  .right-column.custom .left {
      width: 60%;
  }
  .right-column.custom .right {
      width: calc(40% - 40px);
  }
  .right-column.bottom .left {
      width: calc(50% - 20px);
  }
  .right-column.bottom .right {
      width: calc(50% - 20px);
  }
}

.green-bg {
  padding: 50px 0;
  text-align: center;
  color:#fff;
  background:#729B86;
}
.green-bg h2 {
  color:#fff;
}
.green-bg .container > h2 + p {
  max-width: 839px;
  margin: 0 auto;
  font-size: 18px;
}
.green-bg .container > h2 + p a { color: #D5644C }

.blue-bg {
  padding: 50px 0;
  margin: 0 0 50px;
  text-align: center;
  color:#fff;
  background:#3D405B;
}
.blue-bg h2 {
  color:#fff;
}
.blue-bg .container > h2 + p {
  max-width: 839px;
  margin: 0 auto;
  font-size: 18px;
}
.blue-bg .container > h2 + p a { color: #D5644C }


.cyan { color:#33999E; }
.green { color:#729B86; }
.orange {color: #fff;background: #D5644C;}
.blue {color: #fff;background: #3D405B;}