/** Shopify CDN: Minification failed

Line 16:0 Unexpected "$"
Line 16:13 Unexpected "{"
Line 16:23 Expected ":"
Line 16:36 Unexpected ";"
Line 17:15 Unexpected "{"
Line 17:25 Expected ":"
Line 17:45 Unexpected ";"
Line 18:15 Unexpected "{"
Line 18:25 Expected ":"
Line 18:41 Unexpected ";"
... and 9 more hidden warnings

**/
$body-font: {{ settings.body-font }};
$body-weight: {{ settings.body-font-weight }};
$header-font: {{ settings.heading-font }};
$header-weight: {{ settings.heading-font-weight }};
$button-font: {{ settings.primary-button-font }};
$button-weight: {{ settings.primary-button-font-weight }};

$background-light: #fafafa;
$background-semi-light: #fcfcfc;
$grey-rule: #979797;
$grey: #f3f5f8;
$ekm-green: #c3d939;
$error-color: #e13333;
$success-color: #5bef6b;
$black: #000;
$white: #fff;
$light-grey: #eeeeee;
$very-light-grey: #fafafa;
$dark-color: #4c4c4c;
$blue: #178cf9;
$dark-blue: #182231;

$desktop-breakpoint: 1300px;
$tablet-breakpoint: 400px;

.CostScalabilitySection {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100vw;
}

.CostScalabilitySection__group {
  width: 335px;
  height: 482px;
  background-color: $white;
  padding: 24px 25px 32px 24px;
  margin-bottom: 37px;
  border-radius: 2px;
  display: flex;
  flex-direction: column-reverse;
  box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.1), 0 4px 10px 0 rgba(0, 0, 0, 0.05), 0 1px 8px 0 rgba(0, 0, 0, 0.1);
  justify-content: flex-end;

  @media screen and (min-width: 1300px) {
    flex-direction: row;
    background-color: transparent;
    width: 1300px;
    padding: 0;
    box-shadow: none;
    height: auto; 
    margin-bottom: 0
  }
}

.CostScalabilitySection__group--reverse {
  @media screen and (min-width: 1300px) {
    flex-direction: row-reverse;
  }
}

.CostScalabilitySection__group--margin-bottom {
  @media screen and (min-width: 1300px) {
    margin-bottom: 48px;
  }
}

.PushThreeCard {
  text-align: left;
  width: 286px;

  @media screen and (min-width: 1300px) {
    background-color: $white;  
    width: 541px;
    height: 304px;
    padding: 48px 61px 0 48px;
    margin-right: 17px;
    margin-top: 50px;
  }
}

.PushThreeCard--margin-left {
  @media screen and (min-width: 1300px) {
    margin-left: 13px;
  }
}

.PushThreeCard--green {
  @media screen and (min-width: 1300px) {
    background-color: $ekm-green;  
    left: 0;
  }
}

.PushThreeCard--static {
  @media screen and (min-width: 1300px) {
    left: 0;
  }
}

.PushThreeCard__card-title {
  width: 266px;
  font-size: 20px;
  font-weight: 600;
  color: #000000;
  margin-bottom: 12px;
  line-height: normal;

  @media screen and (min-width: 1300px) {
    font-size: 24px;
    width: 338px;
  }
}

.PushThreeCard__card-line {
  display: none;

  @media screen and (min-width: 1300px) {
    display: block;
    margin-bottom: 25px;
    width: 64px;
    height: 2px;
    background-color: $black;
  }
}

.PushThreeCard__grey-line {
  background-color: #dee3e9;
}

.PushThreeCard__card-description {
  font-size: 16px;
  line-height: 1.56;

  @media screen and (min-width: 1300px) {
    font-size: 18px;
  }
}

.PushThreeCard__image {
  width: 286px;
  height: 214px;
  margin-bottom: 24px;

  @media screen and (min-width: 1300px) {
    width: 667px;
    height: 470px;
    margin-bottom: 0;
  }
}

.CapabilitiesSection {
  width: 100vw;
  background-color: $ekm-green;
  padding-top: 64px;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-bottom: 44px;
  margin-bottom: 34px;

  @media screen and (min-width: 875px) {
    padding-bottom: 66px;
    margin-bottom: 48px;
  }
}

.CapabilitiesSection__title {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 48px;
}

.CapabilitiesSection__tile-container {
  display: flex;
  flex-direction: column;

  @media screen and (min-width: 875px) {
    flex-direction: row;
    flex-wrap: wrap;
    height: 424px;
    width: 875px;
    justify-content: center;
  }
}