body {
  --section-clip-path-height: 120px;

  --avenir-next: "Avenir Next", sans-serif;
  --min-padding-x-text: 10vw;
  --min-padding-x-graphics: 5.5vw;
  --margin-x: 46px;
  --color-orange: #ff9d0e;
  --color-purple: #6b63e6;
  --color-teal: #73fff5;
  --color-text: #545454;
  --color-blue-background: #f4fcff;
  --color-yellow-background: #fdf7ef;
  --color-purple-background: #f9f8ff;
  box-sizing: border-box;
}
  @media (max-width: 960px) {body {
    --section-clip-path-height: 68px
}
  }
  @media (max-width: 480px) {body {
    --section-clip-path-height: 32px
}
  }
  @media (max-width: 480px) {body {
    --margin-x: 32px
}
  }
  body *,
  body *::before,
  body *::after {
    box-sizing: border-box;
  }
  body h1 {
    white-space: pre-line;
  }
  body h5 {
    margin: 0;
  }
  body hr {
    margin: 0;
    border: none;
  }
  body ul,
  body ol {
    list-style: none;
    padding: 0;
    margin: 0;
  }
  body a.button-link {
    z-index: 2;
    padding: 0 41px;
    border-radius: 30px;
    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));

    font-weight: 700;
    font-size: 18px;
    line-height: 2.5;

    display: grid;
    grid-template-columns: 1fr auto;
    column-gap: 19px;
    align-items: center;
  }
  body a.button-link:hover {
      transition: all 0.3s;
    }
  body a.button-link:hover img {
        filter: invert();
        transition: all 0.3s;
      }
  @media (max-width: 480px) {
  body a.button-link {
      padding: 0 31px;
      column-gap: 15px;
      margin-top: 8px
  }
    }

footer.footer div.container {
    padding: 0;
  }

section.Hero {
  z-index: 0;
  background: linear-gradient(130deg, #7c73ff 5%, #463ce0 60%);
  clip-path: polygon(
    0 0,
    100% 0,
    100% calc(100% - var(--section-clip-path-height)),
    0 100%
  );

  padding: 98px var(--min-padding-x-text) 143px;
  display: grid;
  row-gap: 24px;
  justify-items: center;
  align-content: center;
  color: white;
}

@media (max-width: 960px) {

section.Hero {
    padding: 70px var(--min-padding-x-text) 110px;
    row-gap: 19px
}
  }

@media (max-width: 480px) {

section.Hero {
    padding: 46px var(--min-padding-x-text) 75px;
    row-gap: 14px
}
  }

section.Hero > img {
    z-index: 1;
    position: absolute;
    top: 2%;
    left: 50%;
    transform: translateX(-50%);
    mix-blend-mode: multiply;
    opacity: 0.85;
    object-fit: cover;
    width: 100%;
    max-width: 100%;
  }

section.Hero h1 {
    z-index: 2;
    font-family: var(--avenir-next);
    font-weight: 400;
    font-style: normal;
    text-align: center;
    font-size: 75px;
    line-height: 1.04;
  }

@media (max-width: 960px) {

section.Hero h1 {
      font-size: 56px;
      line-height: 1.08
  }
    }

@media (max-width: 480px) {

section.Hero h1 {
      font-size: 40px;
      line-height: 1.12
  }
    }

section.Hero p {
    z-index: 2;
    max-width: 559px;
    text-align: center;
    font-weight: 400;
    font-size: 31px;
    line-height: 1.4;
  }

@media (max-width: 960px) {

section.Hero p {
      max-width: 448px;
      font-size: 25px
  }
    }

@media (max-width: 480px) {

section.Hero p {
      font-size: 20px
  }
    }

section.Hero a {
    background-color: var(--color-teal);
    color: black;
  }

section.Hero a:hover {
      color: white;
      background-color: var(--color-orange);
    }

section.CaseStudies {
  --margin-top: 47px;
  --heanding-to-cards: 94px;
  --heading-height: 55px;
  margin-top: var(--margin-top);
  padding: 0 var(--margin-x);
  display: grid;
  row-gap: var(--heanding-to-cards);
  justify-content: center;
  position: relative;
}

@media (max-width: 768px) {

section.CaseStudies {
    --margin-top: 60px;
    --heanding-to-cards: 50px;
    --heading-height: 40px
}
  }

@media (max-width: 480px) {

section.CaseStudies {
    padding: 0 23px
}
  }

section.CaseStudies > * {
    max-width: 1156px;
  }

section.CaseStudies h1 {
    font-family: var(--avenir-next);
    font-weight: 500;
    font-size: 48px;
    line-height: var(--heading-height);
  }

@media (max-width: 768px) {

section.CaseStudies h1 {
      font-family: 'Roboto', sans-serif;
      font-weight: 700;
      font-size: 33px;
      text-align: center;
      padding: 0 30px
  }
    }

section.CaseStudies ul {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 10vw;
    align-items: start;
    position: relative;
  }

section.CaseStudies ul::after {
      content: "";
      background-image: url("/img/data-ops/end-quote.svg");
      background-size: contain;
      background-repeat: no-repeat;
      position: absolute;
      --icon-width: 8.5vw;
      right: 0;
      top: calc(
        (
            var(--heanding-to-cards) + var(--heading-height) + var(--margin-top) +
              var(--section-clip-path-height) / 2
          ) * -1
      );
      width: var(--icon-width);
      height: calc(var(--icon-width) * 0.79);
    }

@media (max-width: 480px) {

section.CaseStudies ul::after {
        left: 50%;
        transform: translate(-50%, -80%);
        --icon-width: 30vw
    }
      }

@media (max-width: 960px) {

section.CaseStudies ul {
      column-gap: 6vw
  }
    }

@media (max-width: 768px) {

section.CaseStudies ul {
      grid-template-columns: 1fr;
      row-gap: 32px;
      padding-bottom: 64px
  }
    }

section.CaseStudies ul li {
      --offset-y: 99px;
      --card-padding-top: 51px;
      --purple-light: #9494ff;

      max-width: 488px;
      padding: var(--card-padding-top) 32px 26px;
      display: grid;
      row-gap: 35px;
      border: 7px solid #f2f3f6;
      position: relative;
    }

@media (max-width: 960px) {

section.CaseStudies ul li {
        --card-padding-top: 42px
    }
      }

@media (max-width: 960px) {

section.CaseStudies ul li {
        padding: var(--card-padding-top) 24px 26px
    }
      }

section.CaseStudies ul li::before {
        content: "";
        position: absolute;
        top: var(--card-padding-top);
        left: 0;
        bottom: 0;
        width: 14px;
        transform: translateX(-50%);
        background-color: white;
      }

section.CaseStudies ul li p {
        color: var(--color-text);
        font-size: 18px;
        line-height: 1.56;
        white-space: pre-line;
        position: relative;
      }

section.CaseStudies ul li p::before,
        section.CaseStudies ul li p::after {
          content: "";
          background-image: url("/img/data-ops/end-quote.svg");
          background-size: contain;
          background-repeat: no-repeat;
          filter: grayscale() brightness(85%);
          width: 9px;
          height: 10px;
          margin-bottom: 6px;
          display: inline-block;
          margin-left: 4px;
        }

section.CaseStudies ul li p::before {
          margin: 0;
          position: absolute;
          left: 0;
          top: 0;
          transform: translateX(-15px) rotate(180deg);
        }

section.CaseStudies ul li .person {
        display: grid;
        row-gap: 5px;
      }

section.CaseStudies ul li .person h4 {
          color: #6B63E6;
          font-size: 18px;
          line-height: 21px;
          font-weight: 400;
        }

section.CaseStudies ul li .person h5 {
          color: var(--purple-light);
          font-size: 15px;
          font-weight: 400;
        }

section.CaseStudies ul li a {
        justify-self: center;
        color: var(--purple-light);
        background-color: transparent;
        border: 1px solid var(--purple-light);
        filter: none;
      }

section.CaseStudies ul li a .right-arrow {
          width: 28px;
          height: 29px;
          background-color: var(--purple-light);
          clip-path: path(
            "M18.6783 12.833H5.83329C5.19163 12.833 4.66663 13.358 4.66663 13.9997C4.66663 14.6414 5.19163 15.1664 5.83329 15.1664H18.6783V17.2547C18.6783 17.7797 19.3083 18.0364 19.67 17.663L22.9133 14.408C23.135 14.1747 23.135 13.813 22.9133 13.5797L19.67 10.3247C19.3083 9.95135 18.6783 10.2197 18.6783 10.733V12.833V12.833Z"
          );
        }

@media (max-width: 480px) {

section.CaseStudies ul li a {
          width: max-content
      }
        }

section.CaseStudies ul li a:hover {
          color: white;
          background-color: var(--purple-light);
          transition: all 0.3s;
        }

section.CaseStudies ul li a:hover .right-arrow {
            transition: all 0.3s;
            background-color: white;
          }

section.CaseStudies ul li:first-child {
        margin-bottom: var(--offset-y);
      }

@media (max-width: 768px) {

section.CaseStudies ul li:first-child {
          margin-bottom: unset
      }
        }

section.CaseStudies ul li:last-child {
        margin-top: var(--offset-y);
      }

@media (max-width: 768px) {

section.CaseStudies ul li:last-child {
          margin-top: unset
      }
        }

section.CaseStudies ul li img.logo {
        width: 50%;
      }

section.Demo {
  margin: 100px 0 0;
  background: #6b63e6;
  background-image: url(/img/landing/pipe-pattern.svg);
  background-size: 50%;
  background-position: -0px -15px;

  display: flex;
  justify-content: center;
}

section.Demo .container {
    max-width: 1156px;
    display: grid;
    grid-template-columns: 1fr auto;
    column-gap: 7vw;
  }

@media (max-width: 670px) {

section.Demo .container {
      grid-template-columns: unset;
      row-gap: 120px;
      justify-items: center
  }
      
      section.Demo .container .description {
        text-align: center;
      }
    }

section.Demo .container .description {
      margin-top: 100px;
      color: white;
      display: grid;
      row-gap: 10px;
      align-content: start;
    }

section.Demo .container .description h2 {
        font-family: var(--avenir-next);
        font-size: 34px;
        line-height: 1.2;
        max-width: 470px;
      }

@media (max-width: 768px) {

section.Demo .container .description h2 {
          font-size: 24px
      }
        }

section.Demo .container .description p {
        font-size: 17px;
        line-height: 1.5;
        opacity: 0.75;
        max-width: 440px;
      }

section.Demo .container .form-container {
      --row-gap: 26px;

      background-color: white;
      box-shadow: 0px 10px 25px 0 rgba(0, 0, 0, 0.2);
      border-radius: 20px;
      width: 50vw;
      max-width: 500px;
      padding: 50px 0 20px;
      margin: -50px 0;
      display: grid;
      row-gap: var(--row-gap);
      justify-items: center;
      align-content: start;
    }

@media (max-width: 670px) {

section.Demo .container .form-container {
        width: 85vw
    }
      }

section.Demo .container .form-container h3 {
        color: #243651;
        line-height: 1;
      }

section.Demo .container .form-container .hbspt-form {
        width: 100%;
      }

section.Demo .container .form-container .hbspt-form .submitted-message p {
            text-align: center;
            margin-top: 50px;
            padding: 20px;
            border: 1px solid #6b63e6;
            margin: 50px;
            border-radius: 5px;
            background: #d0cdfc;
            color: #5e55da;
          }

section.Demo .container .form-container .hbspt-form .hs-richtext p, section.Demo .container .form-container .hbspt-form .hs-form-booleancheckbox p {
            line-height: 18px;
            color: #6A6A6A;
            font-size: 12px;
            padding: 0;
          }

section.Demo .container .form-container .hbspt-form ul.inputs-list {
          padding: 0px;
        }

section.Demo .container .form-container .hbspt-form li.hs-form-booleancheckbox {
          color: white;
          display: flex;
          flex-direction: row;
        }

section.Demo .container .form-container .hbspt-form label {
          position: absolute;
          margin-left: 20px;
          opacity: 0;
        }

section.Demo .container .form-container .hbspt-form .field {
          margin-top: 15px;
        }

section.Demo .container .form-container .hbspt-form input[type="text"],
        section.Demo .container .form-container .hbspt-form input[type="email"],
        section.Demo .container .form-container .hbspt-form input[type="tel"],
        section.Demo .container .form-container .hbspt-form textarea {
          width: calc(100% - 40px);
          margin: 5px 20px;
          padding: 10px;
          border-radius: 5px;
          border: 1px solid rgba(0, 0, 0, 0.2);
        }

section.Demo .container .form-container .hbspt-form input[type="text"]:focus, section.Demo .container .form-container .hbspt-form input[type="email"]:focus, section.Demo .container .form-container .hbspt-form input[type="tel"]:focus, section.Demo .container .form-container .hbspt-form textarea:focus {
            border: 1px solid #6B63E6;
          }

section.Demo .container .form-container .hbspt-form .hs-error-msg {
          opacity: 1;
          color: red;
          font-size: 14px;
        }

section.Demo .container .form-container .hbspt-form .hs-submit {
          display: flex;
          justify-content: center;
        }

section.Demo .container .form-container .hbspt-form input[type="submit"] {
          border-radius: 100px;
          cursor: pointer;
          outline: none;
          box-shadow: none;
          border: none;
          display: inline-block;
          text-decoration: none;
          background: #6B63E6;
          color: white;
          font-weight: 500;
          background-image: url(/img/right-arrow-knockout.svg),
          linear-gradient(0deg, #6b63e6 50%, #8881ea 100%);
          background-repeat: no-repeat;
          background-position: calc(100% - 40px) center, top left;
          background-size: 15px 9px, 100% 100%;
          padding: 19px 64px 21px 40px;
          transition: background-position 0.2s linear,
          background-image 0.2s linear;
          position: relative;
          z-index: 2;
          font-size: 1em;
        }

section.Demo .container .form-container .hbspt-form input[type="submit"]:hover {
            background-image: url(/img/right-arrow-knockout.svg),
            linear-gradient(0deg, #8983eb 50%, #a09bef 100%);
            background-position: calc(100% - 38px) center, top left;
          }

section.Demo .container .form-container .hbspt-form .legal-consent-container {
          background: #fff;
          font-size: 12px !important;
          padding: 0;
        }

section.Demo .container .form-container .hbspt-form .actions {
          margin-top: 50px;
          display: flex;
          justify-content: center;
        }

section.Demo .container .form-container .hbspt-form .hs-form-booleancheckbox label {
          position: relative;
          opacity: 1;
          width: 100%;
          text-align: left;
        }

section.Demo .container .form-container .hbspt-form .hs-form-booleancheckbox label span {
            margin: 0px;
            padding: 0;
            line-height: 18px;
            color: #6A6A6A;
            font-size: 12px;
          }

section.Demo .container .form-container .hbspt-form .hs-form-booleancheckbox label p {
            margin-left: 10px;
          }

section.Demo .container .form-container .hbspt-form .hs-form-booleancheckbox label .quote {
            text-align: center;
            margin-bottom: 92px;
          }

section.Demo .container .form-container .hbspt-form .hs-form-booleancheckbox label .quote blockquote {
              font-weight: 300;
              font-style: italic;
              color: #6A6A6A;
              font-size: 24px;
              line-height: 40px;
              letter-spacing: -0.2px;
              max-width: 960px;
              margin: 0 auto;
              padding: 5px;
            }

@media screen and (min-width: 768px) {

section.Demo .container .form-container .hbspt-form .hs-form-booleancheckbox label .quote blockquote {
                font-size: 34px;
                line-height: 48px;
                letter-spacing: -0.4px
            }
              }

section.Demo .container .form-container .hbspt-form .hs-form-booleancheckbox label .quote cite {
              display: block;
              width: 100%;
              margin-top: 33px;
            }

section.Demo .container .form-container .hbspt-form .hs-form-booleancheckbox label .quote cite img {
                width: 120px;
                height: 41px;
              }

#data-ops {
  position: relative;
  z-index: 1;
}

#data-ops section.Overview {
    padding: 42px var(--min-padding-x-graphics);
    display: grid;
    row-gap: 72px;
    justify-items: center;
  }

#data-ops section.Overview h1 {
      font-family: var(--avenir-next);
      font-weight: 500;
      font-style: normal;
      text-align: center;
      font-size: 48px;
      line-height: 1.15;
    }

@media (max-width: 480px) {

#data-ops section.Overview h1 {
        font-size: 33px;
        line-height: 1.21
    }
      }

#data-ops section.Overview .cards {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      column-gap: min(4%, 52px);
    }

@media (max-width: 1192px) {

#data-ops section.Overview .cards {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(2, 1fr);
        row-gap: 30px
    }
      }

@media (max-width: 800px) {

#data-ops section.Overview .cards {
        grid-template-columns: 1fr;
        grid-template-rows: repeat(3, 1fr);
        row-gap: 20px
    }
      }

#data-ops section.Overview .cards > div {
        max-width: 348px;
        padding: 26px 35px;
        display: grid;
        row-gap: 20px;
        justify-items: center;
        align-items: center;
        text-align: center;
        border: 1px solid #00ADEE;
        box-shadow: 0px 12.73px 65.2px -24.53px rgba(0, 0, 0, 0.15);
        border-radius: 13px;
      }

@media (max-width: 480px) {

#data-ops section.Overview .cards > div {
          padding: 26px
      }
        }

#data-ops section.Overview .cards > div.usability {
          border: 0.7px solid #ff9d0e;
        }

#data-ops section.Overview .cards > div.usability h3::before {
            content: "E";
            background-color: #e8763a;
          }

#data-ops section.Overview .cards > div.flexibility {
          border-color: #6b63e6;
        }

#data-ops section.Overview .cards > div.flexibility h3::before {
            content: "F";
            background-color: #5c46b3;
          }

@media (max-width: 1192px) {

#data-ops section.Overview .cards > div.flexibility {
            grid-column: 1 / -1;
            justify-self: center
        }
          }

#data-ops section.Overview .cards > div h3 {
          font-family: var(--avenir-next);
          font-weight: 500;
          font-style: normal;
          font-size: 25px;
          line-height: 1.16;
          display: flex;
          gap: 13px;
          align-items: center;
        }

#data-ops section.Overview .cards > div h3::before {
            content: "R";
            display: grid;
            width: 22px;
            height: 22px;
            align-items: center;
            font-size: 15px;
            line-height: 0;
            padding-top: 1px;
            font-weight: 500;
            text-align: center;
            color: white;
            background-color: #00ADEE;
          }

#data-ops section.Overview .cards > div p {
          color: #545454;
          font-weight: 400;
          font-size: 16px;
          line-height: 1.5;
        }

#data-ops section.Reliability {
    --max-width: 1060px;
    overflow-x: hidden;
    z-index: 1;
    position: relative;
    background-color: var(--color-blue-background);
    display: grid;
    padding: 198px 0 220px;
    clip-path: polygon(
      0 var(--section-clip-path-height),
      100% 0,
      100% 100%,
      0 calc(100% - var(--section-clip-path-height))
    );
  }

@media (max-width: 768px) {

#data-ops section.Reliability {
      padding-top: 132px;
      padding-bottom: 150px
  }
    }

@media (max-width: 480px) {

#data-ops section.Reliability {
      padding-top: 72px;
      padding-bottom: 82px
  }
    }

#data-ops section.Reliability .PartA {
      display: grid;
      row-gap: 22px;
      justify-items: center;
    }

#data-ops section.Reliability .PartA header {
        display: flex;
        gap: 19px;
        align-items: center;
        color: #0097cf;
        font-weight: 400;
        font-size: 19px;
        line-height: 1.53;
        letter-spacing: 0.11em;
        text-transform: uppercase;
      }

#data-ops section.Reliability .PartA header img {
          width: 36px;
        }

@media (max-width: 480px) {

#data-ops section.Reliability .PartA header {
          justify-self: start;
          margin: 0 32px
      }
        }

#data-ops section.Reliability .PartA h1 {
        font-family: var(--avenir-next);
        font-size: 48px;
        line-height: 1.15;
        text-align: center;
        margin-bottom: 101px;
      }

@media (max-width: 960px) {

#data-ops section.Reliability .PartA h1 {
          margin: 0 60px 66px;
          font-size: 40px
      }
        }

@media (max-width: 710px) {

#data-ops section.Reliability .PartA h1 {
          white-space: normal;
          margin: 0 32px 34px;
          font-size: 33px
      }
        }

@media (max-width: 480px) {

#data-ops section.Reliability .PartA h1 {
          text-align: left
      }
        }

#data-ops section.Reliability .PartA figure {
        --line-specs: 9px solid #00ADEE;
        padding: 0;
        margin: 0 var(--margin-x);
        display: grid;
        grid-template-columns: auto 1fr auto auto 1fr;
        grid-template-rows: 45px 64px 45px 54px 62px;
        grid-template-areas:
          ".       .              .         gear      gear"
          ".       gear-line      gear-line gear      gear"
          "caption .              .         .         .   "
          "caption .              magnifier magnifier .   "
          ".       .              magnifier magnifier .   ";
      }

@media (max-width: 1070px) {

#data-ops section.Reliability .PartA figure {
          grid-template-columns: 1.8fr 1fr auto auto 1fr
      }
        }

@media (max-width: 1070px) {

#data-ops section.Reliability .PartA figure {
          grid-template-columns: 1.8fr 1fr auto auto 1fr;
          grid-template-areas:
            ".       .              .         gear      gear     "
            ".       gear-line      gear-line gear      gear     "
            "caption .              .         .         .        "
            "caption .              .         magnifier magnifier"
            ".       .              .         magnifier magnifier"
      }
        }

@media (max-width: 710px) {

#data-ops section.Reliability .PartA figure {
          grid-template-columns: 1fr;
          grid-template-rows: auto 1fr 1fr;
          row-gap: 19px;
          grid-template-areas:
            "caption  "
            "gear     "
            "magnifier";
          justify-items: center
      }
        }

#data-ops section.Reliability .PartA figure p {
          white-space: pre-line;
          padding: 0 16px 16px 28px;
          font-weight: 300;
          font-size: 24px;
          line-height: 1.29;
          display: flex;
          justify-content: start;
          align-items: center;
        }

#data-ops section.Reliability .PartA figure p.gear,
          #data-ops section.Reliability .PartA figure p.magnifier {
            width: 344px;
            padding: 0 0 0 47px;
            background: white;
            box-shadow: 0 3.73366px 49.2px -10.53px rgba(0, 0, 0, 0.15);
            border-radius: 8px;

            font-family: var(--avenir-next);
            font-weight: 500;
            font-size: 19px;
            line-height: 1.37;
            color: rgba(0, 0, 0, 0.8);
            position: relative;
          }

#data-ops section.Reliability .PartA figure p.gear img, #data-ops section.Reliability .PartA figure p.magnifier img {
              position: absolute;
              top: 45%;
              left: 0;
              transform: translate(-50%, -50%);
            }

@media (max-width: 1070px) {
            #data-ops section.Reliability .PartA figure p.caption {
              align-self: end;
              white-space: normal;
              font-size: 22px;
              line-height: 1.33;
              min-width: 208px;
            }
          }

@media (max-width: 710px) {
            #data-ops section.Reliability .PartA figure p.caption {
              margin-bottom: 8px;
              justify-self: start;
              padding-left: 0;
            }
            #data-ops section.Reliability .PartA figure p.gear,
            #data-ops section.Reliability .PartA figure p.magnifier {
              white-space: unset;
              width: auto;
              padding: 22px 32px 22px 49px;
              max-width: 350px;
              margin-left: 29px;
              font-family: unset;
              font-weight: 400;
            }
          }

#data-ops section.Reliability .PartA figure .caption {
          grid-area: caption;
          z-index: 1;
        }

#data-ops section.Reliability .PartA figure .caption-line {
          grid-area: caption;
          z-index: 0;
          width: 100%;
          height: 100%;
          border-bottom-right-radius: 16px;
          border: var(--line-specs);
          border-top: none;
          border-left: none;
          opacity: 0.35;
          transform: translateX(9px);
          position: relative;
        }

#data-ops section.Reliability .PartA figure .caption-line::before {
            content: "";
            width: 5px;
            height: 9px;
            position: absolute;
            bottom: -9px;
            left: -5px;
            background-color: #00ADEE;
            clip-path: circle(5px at 100% 50%);
          }

@media (max-width: 710px) {

#data-ops section.Reliability .PartA figure .caption-line {
            display: none
        }
          }

#data-ops section.Reliability .PartA figure .gear {
          grid-area: gear;
          z-index: 1;
        }

#data-ops section.Reliability .PartA figure .gear-line {
          grid-area: gear-line;
          width: 100%;
          height: 100%;
          border: var(--line-specs);
          border-radius: 16px 0 0 0;
          border-bottom: none;
          border-right: none;
          opacity: 0.35;
        }

@media (max-width: 710px) {

#data-ops section.Reliability .PartA figure .gear-line {
            display: none
        }
          }

#data-ops section.Reliability .PartA figure .magnifier {
          grid-area: magnifier;
          z-index: 1;
        }

#data-ops section.Reliability .PartA figure .magnifier-line {
          grid-area: 4 / 1 / span 1 / span 2;
          transform: translateX(9px);
          width: 100%;
          height: 100%;
          border: none;
          border-bottom: var(--line-specs);
          opacity: 0.2;
          position: relative;
        }

#data-ops section.Reliability .PartA figure .magnifier-line::before {
            content: "";
            width: 5px;
            height: 9px;
            position: absolute;
            bottom: -9px;
            left: -5px;
            background-color: #00ADEE;
            clip-path: circle(5px at 100% 50%);
          }

@media (max-width: 710px) {

#data-ops section.Reliability .PartA figure .magnifier-line {
            display: none
        }
          }

#data-ops section.Reliability .PartB {
      padding: 130px 0;
      clip-path: margin-box;
      margin: 0 var(--margin-x);
      justify-self: center;
      max-width: var(--max-width);
      display: grid;
      row-gap: 56px;
      grid-template-columns: auto 1fr;
      column-gap: 7vw;
    }

@media (max-width: 960px) {

#data-ops section.Reliability .PartB {
        column-gap: 4vw;
        padding-bottom: 60px
    }
      }

@media (max-width: 620px) {

#data-ops section.Reliability .PartB {
        grid-template-columns: 1fr
    }
      }

#data-ops section.Reliability .PartB h2 {
        grid-column: 1 / -1;
        justify-self: left;
        max-width: 680px;
        font-family: var(--avenir-next);
        font-weight: 500;
        font-size: 35px;
        line-height: 1.23;
        display: flex;
        gap: 23px;
        align-items: start;
      }

#data-ops section.Reliability .PartB h2 img {
          width: 32px;
        }

@media (max-width: 620px) {

#data-ops section.Reliability .PartB h2 img {
            display: none
        }
          }

#data-ops section.Reliability .PartB ul {
        align-self: start;
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 1fr 1fr;
        column-gap: 43px;
        row-gap: 12px;
        padding-left: 55px;
        margin-top: -20px;
      }

@media (max-width: 960px) {

#data-ops section.Reliability .PartB ul {
          grid-template-columns: 1fr;
          grid-template-rows: repeat(6, 1fr);
          padding-left: 32px
      }
        }

@media (max-width: 620px) {

#data-ops section.Reliability .PartB ul {
          padding-left: 9px
      }
        }

#data-ops section.Reliability .PartB ul li.challenge {
          max-width: 230px;
          height: 90px;
          background-color: white;
          border-radius: 10px;
          padding: 10px 30px;
          display: flex;
          align-items: center;
          color: var(--color-text);
          font-size: 16px;
          line-height: 1.38;
          position: relative;

          transition: all 0.3s linear;
          --ready-offset-right: 120%;
          --ready-offset-left: calc(var(--ready-offset-right) * -1);
        }

@media (max-width: 768px) {

#data-ops section.Reliability .PartB ul li.challenge {
            max-width: 200px;
            padding: 10px 16px 10px 24px
        }
          }

@media (max-width: 620px) {

#data-ops section.Reliability .PartB ul li.challenge {
            max-width: unset;
            padding: 10px 5vw
        }
          }

#data-ops section.Reliability .PartB ul li.challenge img {
            position: absolute;
            top: 27%;
            left: 0;
            transform: translateX(-50%);
          }

@media (max-width: 620px) {

#data-ops section.Reliability .PartB ul li.challenge img {
              top: 50%;
              transform: translate(-50%, -50%)
          }
            }

#data-ops section.Reliability .PartB ul li.challenge.active {
            opacity: 1;
            transform: translate(0, 0);
          }

#data-ops section.Reliability .PartB ul li.challenge.active.reset {
              transition-duration: 0s;
            }

#data-ops section.Reliability .PartB ul li.challenge.fading {
            opacity: 1;
            transform: translate(0, 300px);
            transition-duration: 12s;
          }

#data-ops section.Reliability .PartB ul li.challenge.fading.reset {
              transition-duration: 0s;
            }

@media (max-width: 960px) {

#data-ops section.Reliability .PartB ul li.challenge.fading {
              transform: translate(0, 404px)
          }
            }

#data-ops section.Reliability .PartB ul li.challenge.removed {
            opacity: 0;
            transform: translate(0, 360px);
          }

#data-ops section.Reliability .PartB ul li.challenge.removed.reset {
              transition-duration: 0s;
            }

@media (max-width: 960px) {

#data-ops section.Reliability .PartB ul li.challenge.removed {
              transform: translate(0, 464px)
          }
            }

#data-ops section.Reliability .PartB ul li.challenge.ready {
            opacity: 0;
            transition-duration: 0s;
          }

#data-ops section.Reliability .PartB ul li.challenge.top-left {
            grid-row: 1;
            grid-column: 1;
          }

@media (max-width: 960px) {

#data-ops section.Reliability .PartB ul li.challenge.top-left {
              grid-row: 1;
              grid-column: 1
          }
            }

#data-ops section.Reliability .PartB ul li.challenge.top-left.ready {
              transform: translate(var(--ready-offset-left), 0);
            }

#data-ops section.Reliability .PartB ul li.challenge.top-right {
            grid-row: 1;
            grid-column: 2;
          }

@media (max-width: 960px) {

#data-ops section.Reliability .PartB ul li.challenge.top-right {
              grid-row: 2;
              grid-column: 1
          }
            }

#data-ops section.Reliability .PartB ul li.challenge.top-right.ready {
              transform: translate(var(--ready-offset-right), 0);
            }

#data-ops section.Reliability .PartB ul li.challenge.bottom-left {
            grid-row: 2;
            grid-column: 1;
          }

@media (max-width: 960px) {

#data-ops section.Reliability .PartB ul li.challenge.bottom-left {
              grid-row: 3;
              grid-column: 1
          }
            }

#data-ops section.Reliability .PartB ul li.challenge.bottom-left.ready {
              transform: translate(var(--ready-offset-left), 0);
            }

#data-ops section.Reliability .PartB ul li.challenge.bottom-right {
            grid-row: 2;
            grid-column: 2;
          }

@media (max-width: 960px) {

#data-ops section.Reliability .PartB ul li.challenge.bottom-right {
              grid-row: 4;
              grid-column: 1
          }
            }

#data-ops section.Reliability .PartB ul li.challenge.bottom-right.ready {
              transform: translate(var(--ready-offset-right), 0);
            }

#data-ops section.Reliability .PartB .paragraphs {
        white-space: pre-line;
        color: var(--color-text);
        font-size: 16px;
        line-height: 1.5;
        display: grid;
        row-gap: 10px;
        align-content: start;
      }

@media (max-width: 620px) {

#data-ops section.Reliability .PartB .paragraphs {
          grid-row: 2 / span 1
      }
        }

#data-ops section.Reliability .PartC {
      --text-margin-left: 53px;
      --item-offset-x: -15px;
      --item-offset-y: 64px;
      --current-margin-right: calc(var(--margin-x) - var(--item-offset-x) * 2);
      margin: 0 0 0 var(--margin-x);
      justify-self: center;
      max-width: var(--max-width);
    }

#data-ops section.Reliability .PartC h2 {
        grid-column: 1 / -1;
        justify-self: left;
        font-family: var(--avenir-next);
        font-weight: 500;
        font-size: 35px;
        line-height: 1.23;
        display: flex;
        gap: 23px;
      }

#data-ops section.Reliability .PartC h2 img {
          width: 30px;
          margin-top: 2px;
        }

@media (max-width: 620px) {

#data-ops section.Reliability .PartC h2 img {
            display: none
        }
          }

#data-ops section.Reliability .PartC > p {
        grid-column: 1 / -1;
        max-width: 648px;
        font-size: 16px;
        line-height: 1.5;
        color: var(--color-text);
        margin: 36px 0 72px var(--text-margin-left);
      }

@media (max-width: 768px) {

#data-ops section.Reliability .PartC > p {
          margin: 20px var(--margin-x) 39px 0
      }
        }

#data-ops section.Reliability .PartC ol {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        margin-left: var(--text-margin-left);
        margin-bottom: calc(var(--item-offset-y) * 2);
        margin-right: calc(var(--item-offset-x) * 2);
      }

@media (max-width: 768px) {

#data-ops section.Reliability .PartC ol {
          grid-template-columns: 1fr;
          margin-right: var(--margin-x);
          margin-bottom: unset;
          margin-left: unset
      }
        }

#data-ops section.Reliability .PartC ol li {
          --item-border: 6px solid #e0f1f2;
          position: relative;
          border: var(--item-border);
          border-radius: 4px;
          border-left: none;
          border-bottom: none;
          padding: 70px 4.6vw 0 0;
          background-color: var(--color-blue-background);
          display: grid;
          align-content: start;
          row-gap: 17px;
        }

@media (max-width: 960px) {

#data-ops section.Reliability .PartC ol li {
            padding-top: 40px
        }
          }

#data-ops section.Reliability .PartC ol li:nth-child(2) {
            transform: translate(var(--item-offset-x), var(--item-offset-y));
          }

#data-ops section.Reliability .PartC ol li:last-child {
            border-right: none;
            padding-right: 0;
            margin-right: 4.6vw;
            --current-offset-x: calc(var(--item-offset-x) * 2);
            --current-offset-y: calc(var(--item-offset-y) * 2);
            transform: translate(
              var(--current-offset-x),
              var(--current-offset-y)
            );
          }

#data-ops section.Reliability .PartC ol li img {
            z-index: 1;
            position: absolute;
            left: 0;
            top: 0;
            transform: translateY(-14px);
          }

#data-ops section.Reliability .PartC ol li .image-background {
            z-index: 0;
            position: absolute;
            left: 0;
            top: 0;
            width: 39px;
            height: 39px;
            background-color: var(--color-blue-background);
            transform: translate(-8px, -22px);
          }

@media (max-width: 768px) {

#data-ops section.Reliability .PartC ol li {
            padding: 0 0 30px 27px;
            border: none;
            border-left: var(--item-border)
        }
            #data-ops section.Reliability .PartC ol li:last-child {
              padding-bottom: 0;
            }
            #data-ops section.Reliability .PartC ol li:nth-child(2),
            #data-ops section.Reliability .PartC ol li:last-child {
              transform: none;
              margin-right: 0;
            }
            #data-ops section.Reliability .PartC ol li img {
              transform: translateX(-14px);
            }
            #data-ops section.Reliability .PartC ol li .image-background {
              transform: translate(-55%, -22%);
            }
          }

#data-ops section.Reliability .PartC ol li h3 {
            font-family: var(--avenir-next);
            font-weight: 500;
            font-size: 20px;
            line-height: 27px;
          }

#data-ops section.Reliability .PartC ol li p {
            color: var(--color-text);
            font-size: 16px;
            line-height: 1.5;
          }

#data-ops section.Usability {
    background-color: var(--color-yellow-background);
    margin-top: calc(var(--section-clip-path-height) * -1);
    padding: calc(var(--section-clip-path-height) + 48px) 0 194px;
    display: grid;
    justify-content: center;
    row-gap: 68px;
  }

#data-ops section.Usability .Info {
      margin: 0 var(--margin-x);
      display: grid;
      justify-content: center;
      justify-items: center;
      row-gap: 49px;
    }

#data-ops section.Usability .Info header {
        display: flex;
        gap: 19px;
        align-items: center;
        justify-content: center;
        color: var(--color-orange);
        font-weight: 400;
        font-size: 19px;
        line-height: 1.53;
        letter-spacing: 0.11em;
        text-transform: uppercase;
      }

#data-ops section.Usability .Info header img {
          width: 36px;
        }

@media (max-width: 480px) {

#data-ops section.Usability .Info header {
          justify-self: start
      }
        }

#data-ops section.Usability .Info h1,
      #data-ops section.Usability .Info h2 {
        font-family: var(--avenir-next);
        font-size: 45px;
        line-height: 1.13;
        text-align: center;
      }

@media (max-width: 480px) {

#data-ops section.Usability .Info h1,
      #data-ops section.Usability .Info h2 {
          justify-self: start;
          text-align: left;
          font-size: 34px;
          line-height: 1.21
      }
        }

#data-ops section.Usability .Info h2 {
        max-width: 650px;
        font-size: 35px;
        line-height: 1.23;
      }

@media (max-width: 480px) {

#data-ops section.Usability .Info h2 {
          font-size: 25px;
          line-height: 1.2
      }
        }

#data-ops section.Usability .Info .paragraphs {
        display: grid;
        grid-template-columns: 1fr 1fr;
        column-gap: min(50px, 3.5vw);
        max-width: 850px;
        font-size: 16px;
        line-height: 1.5;
        color: var(--color-text);
      }

@media (max-width: 768px) {

#data-ops section.Usability .Info .paragraphs {
          grid-template-columns: 1fr;
          row-gap: 10px
      }
        }

#data-ops section.Usability figure {
      --column-gap: 3vw;
      --etleap-row-margin-bottom: 46px;
      --no-etleap-first-row-margin-top: 46px;
      --no-etleap-last-row-margin-bottom: 32px;
      --mobile-row-margin-top: 16px;
      --mobile-row-margin-right: 15px;
      --item-max-width: 181px;

      z-index: 0;
      margin: 0 var(--min-padding-x-graphics);
      max-width: 1200px;
      display: grid;
      grid-template-columns: auto 1fr 1fr 1fr;
      grid-template-rows: auto;
      grid-template-areas:
        ".          monitor        alert           resolve         "
        "etleap     etleap-one     etleap-two      etleap-three    "
        "no-etleap  no-etleap-one  no-etleap-four  no-etleap-five  "
        ".          .              .                no-etleap-six  "
        ".          no-etleap-two  no-etleap-three  no-etleap-seven";
      column-gap: var(--column-gap);
      justify-items: center;
      align-items: center;
    }

@media (max-width: 480px) {

#data-ops section.Usability figure {
        --mobile-row-margin-right: 8px
    }
      }

@media (max-width: 960px) {

#data-ops section.Usability figure {
        grid-template-columns: auto 1fr 1fr;
        grid-template-areas:
          ".       etleap       no-etleap"
          "monitor etleap-one   no-etleap-one"
          "monitor .            no-etleap-two"
          "alert   etleap-two   no-etleap-three"
          "alert   .            no-etleap-four"
          "resolve etleap-three no-etleap-five"
          "resolve etleap-three no-etleap-six"
          ".       .            no-etleap-seven";
        align-items: start;
        row-gap: 18px;
        max-width: 600px;
        justify-self: center
    }
      }

#data-ops section.Usability figure .separator {
        z-index: 1;
        width: 100%;
        grid-column: 1 / -1;
        grid-row: 2;
        border: none;
        border-bottom: 3px solid var(--color-yellow-background);
        align-self: end;
      }

@media (max-width: 960px) {

#data-ops section.Usability figure .separator {
          display: none
      }
        }

#data-ops section.Usability figure .path-name {
        z-index: 1;
        grid-area: no-etleap;
        width: 178px;
        height: 54px;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: white;
        padding: 14px;
        border: 1px solid #CDD3D8;
        border-radius: 9px;
        color: var(--color-text);
        font-family: var(--avenir-next);
        font-weight: 500;
        font-size: 17px;
        line-height: 1.18;
        text-align: center;
        margin-top: var(--no-etleap-first-row-margin-top);
      }

@media (max-width: 960px) {

#data-ops section.Usability figure .path-name {
          max-width: var(--item-max-width);
          width: 100%;
          padding: 7px;
          margin: 0;
          height: 100%;
          font-size: 16px
      }
        }

#data-ops section.Usability figure .path-name.etleap {
          width: 180px;
          height: 60px;
          grid-area: etleap;
          border: 0.5px solid #00ADEE;
          box-shadow: 0px 12.73px 52.2px -18.53px rgba(0, 0, 0, 0.12);
          margin-top: 0;
          margin-bottom: var(--etleap-row-margin-bottom);
        }

@media (max-width: 960px) {

#data-ops section.Usability figure .path-name.etleap {
            padding: 16px;
            width: 100%;
            margin: 0;
            height: 55px
        }
          }

#data-ops section.Usability figure .step-background {
        grid-row: 1 / -1;
        width: 100%;
        height: 100%;
        border: none;
        background-color: white;
        border-radius: 13px;
      }

#data-ops section.Usability figure .step-background.monitor {
          grid-column: 2;
        }

@media (max-width: 960px) {

#data-ops section.Usability figure .step-background.monitor {
            grid-column: 1 / -1;
            grid-row: 2 / span 2
        }
          }

#data-ops section.Usability figure .step-background.alert {
          grid-column: 3;
        }

@media (max-width: 960px) {

#data-ops section.Usability figure .step-background.alert {
            grid-column: 1 / -1;
            grid-row: 4 / span 2
        }
          }

#data-ops section.Usability figure .step-background.resolve {
          grid-column: 4;
        }

@media (max-width: 960px) {

#data-ops section.Usability figure .step-background.resolve {
            grid-column: 1 / -1;
            grid-row: 6 / -1
        }
          }

#data-ops section.Usability figure .step-heading {
        z-index: 1;
        color: var(--color-text);
        font-family: var(--avenir-next);
        font-weight: 500;
        font-size: 20px;
        text-transform: uppercase;
        display: flex;
        gap: 12px;
        justify-content: center;
        align-items: center;
        padding: 21px;
        grid-area: monitor;
      }

#data-ops section.Usability figure .step-heading.alert {
          grid-area: alert;
        }

#data-ops section.Usability figure .step-heading.resolve {
          grid-area: resolve;
        }

@media (max-width: 960px) {

#data-ops section.Usability figure .step-heading {
          padding: var(--mobile-row-margin-top) var(--mobile-row-margin-right);
          display: grid;
          justify-content: start;
          position: relative
      }
          #data-ops section.Usability figure .step-heading img {
            width: 21px;
          }
          #data-ops section.Usability figure .step-heading span {
            font-size: 17px;
            position: absolute;
            right: 50%;
            top: 32px;
            transform-origin: right center;
            transform: rotate(-90deg);
          }
        }

#data-ops section.Usability figure .path-item {
        z-index: 2;
        font-size: 16px;
        line-height: 1.5;
        color: var(--color-text);
        margin: 0 26px;
        max-width: var(--item-max-width);
        width: 100%;
        background-color: #f9f9f9;
        border-radius: 9px;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        padding: 13px 16px;
      }

#data-ops section.Usability figure .path-item.no-etleap.item1 {
          grid-area: no-etleap-one;
          margin-top: var(--no-etleap-first-row-margin-top);
        }

#data-ops section.Usability figure .path-item.no-etleap.item2 {
          grid-area: no-etleap-two;
          margin-bottom: var(--no-etleap-last-row-margin-bottom);
        }

#data-ops section.Usability figure .path-item.no-etleap.item3 {
          grid-area: no-etleap-three;
          margin-bottom: var(--no-etleap-last-row-margin-bottom);
        }

#data-ops section.Usability figure .path-item.no-etleap.item4 {
          grid-area: no-etleap-four;
          margin-top: var(--no-etleap-first-row-margin-top);
        }

#data-ops section.Usability figure .path-item.no-etleap.item5 {
          grid-area: no-etleap-five;
          margin-top: var(--no-etleap-first-row-margin-top);
        }

#data-ops section.Usability figure .path-item.no-etleap.item6 {
          grid-area: no-etleap-six;
          margin: 40px 26px;
        }

#data-ops section.Usability figure .path-item.no-etleap.item7 {
          grid-area: no-etleap-seven;
          margin-bottom: var(--no-etleap-last-row-margin-bottom);
        }

#data-ops section.Usability figure .path-item.etleap {
          font-weight: 700;
          line-height: 1.31;
          color: black;
          background-color: white;
          border: 0.5px solid #00ADEE;
          border-radius: 7px;
          box-shadow: 0 12.73px 52.2px -18.53px rgba(0, 0, 0, 0.12);
          align-self: stretch;
          margin-bottom: var(--etleap-row-margin-bottom);
        }

#data-ops section.Usability figure .path-item.etleap.item1 {
            grid-area: etleap-one;
          }

#data-ops section.Usability figure .path-item.etleap.item2 {
            grid-area: etleap-two;
          }

#data-ops section.Usability figure .path-item.etleap.item3 {
            grid-area: etleap-three;
          }

@media (max-width: 960px) {
          #data-ops section.Usability figure .path-item.etleap {
            margin: var(--mobile-row-margin-top) 0;
            font-size: 15px;
            align-self: start;
          }
          #data-ops section.Usability figure .path-item.no-etleap.item1,
          #data-ops section.Usability figure .path-item.no-etleap.item2,
          #data-ops section.Usability figure .path-item.no-etleap.item3,
          #data-ops section.Usability figure .path-item.no-etleap.item4,
          #data-ops section.Usability figure .path-item.no-etleap.item5,
          #data-ops section.Usability figure .path-item.no-etleap.item6,
          #data-ops section.Usability figure .path-item.no-etleap.item7 {
            font-size: 15px;
            margin: var(--mobile-row-margin-top) var(--mobile-row-margin-right)
              var(--mobile-row-margin-top) 0;
          }
        }

@media (max-width: 480px) {

#data-ops section.Usability figure .path-item {
          padding: 10px 14px
      }
        }

#data-ops section.Usability figure .arrow {
        z-index: 1;
        margin-bottom: var(--etleap-row-margin-bottom);
        width: 4.5vw;
        position: relative;
      }

#data-ops section.Usability figure .arrow::after {
          content: url("/img/data-ops/arrowhead.svg");
          position: absolute;
          right: 0;
          top: 0;
          transform: translate(2px, -9px);
        }

#data-ops section.Usability figure .arrow.etleap {
          border: 1px solid #00ADEE;
        }

#data-ops section.Usability figure .arrow.etleap.item1-item2 {
            grid-row: 2;
            grid-column: 2 / span 2;
          }

#data-ops section.Usability figure .arrow.etleap.item2-item3 {
            grid-row: 2;
            grid-column: 3 / span 2;
          }

@media (max-width: 960px) {

#data-ops section.Usability figure .arrow.etleap {
            width: 0;
            height: 50%;
            margin-bottom: 0;
            align-self: start
        }
            #data-ops section.Usability figure .arrow.etleap::after {
              top: unset;
              right: unset;
              bottom: 0;
              transform: translate(-6.5px, 6px) rotate(90deg);
            }
            #data-ops section.Usability figure .arrow.etleap.item1-item2 {
              grid-row: 2 / span 3;
              grid-column: 2;
              margin-top: 72px;
            }
            #data-ops section.Usability figure .arrow.etleap.item2-item3 {
              grid-row: 4 / span 3;
              grid-column: 2;
              margin-top: 88px;
              height: 48%;
            }
              @media (max-width: 480px) {
            #data-ops section.Usability figure .arrow.etleap.item2-item3 {
                height: 45%
            }
              }
          }

#data-ops section.Usability figure .arrow.no-etleap {
          border: 1px dashed #989a9d;
        }

#data-ops section.Usability figure .arrow.no-etleap::after {
            filter: grayscale();
          }

#data-ops section.Usability figure .arrow.no-etleap.down {
            width: 0;
            height: 30%;
          }

#data-ops section.Usability figure .arrow.no-etleap.down::after {
              top: unset;
              right: unset;
              bottom: 0;
              transform: translate(-7px, 7px) rotate(90deg);
            }

#data-ops section.Usability figure .arrow.no-etleap.up {
            width: 0;
            height: 30%;
          }

#data-ops section.Usability figure .arrow.no-etleap.up::after {
              transform: translate(7px, -7px) rotate(-90deg);
            }

#data-ops section.Usability figure .arrow.no-etleap.item2-item3 {
            grid-row: 5;
            grid-column: 2 / span 2;
          }

#data-ops section.Usability figure .arrow.no-etleap.item4-item5 {
            grid-row: 3;
            grid-column: 3 / span 2;
            margin-bottom: 0;
            margin-top: var(--no-etleap-first-row-margin-top);
          }

#data-ops section.Usability figure .arrow.no-etleap.item1-item2 {
            grid-row: 3 / span 3;
            grid-column: 2;
            margin-top: 60px;
          }

#data-ops section.Usability figure .arrow.no-etleap.item3-item4 {
            grid-row: 3 / span 3;
            grid-column: 3;
            margin-top: 60px;
          }

#data-ops section.Usability figure .arrow.no-etleap.item5-item6 {
            grid-row: 3 / span 2;
            grid-column: 4;
            height: 10%;
            margin-top: 60px;
          }

#data-ops section.Usability figure .arrow.no-etleap.item6-item7 {
            grid-row: 4 / span 2;
            grid-column: 4;
            height: 10%;
            margin-top: 45px;
          }

@media (max-width: 960px) {

#data-ops section.Usability figure .arrow.no-etleap {
            width: 0;
            height: 15%
        }

            #data-ops section.Usability figure .arrow.no-etleap.item1-item2 {
              grid-column: 3;
              margin: 0;
              align-self: center;
              grid-row: 2 / span 2;
              height: 15%;
              margin-top: 20px;
            }
            #data-ops section.Usability figure .arrow.no-etleap.item2-item3 {
              grid-column: 3;
              margin: 0;
              align-self: center;
              grid-row: 3 / span 2;
              height: 15%;
            }

              #data-ops section.Usability figure .arrow.no-etleap.item2-item3::after {
                top: unset;
                right: unset;
                bottom: 0;
                transform: translate(-6.5px, 7px) rotate(90deg);
              }

              @media (max-width: 480px) {
            #data-ops section.Usability figure .arrow.no-etleap.item2-item3 {
                margin-bottom: 25px
            }
              }
            #data-ops section.Usability figure .arrow.no-etleap.item3-item4 {
              grid-column: 3;
              margin: 0;
              align-self: center;
              grid-row: 4 / span 2;
              height: 15%;
            }

              #data-ops section.Usability figure .arrow.no-etleap.item3-item4::after {
                top: unset;
                right: unset;
                bottom: 0;
                transform: translate(-6.5px, 7px) rotate(90deg);
              }

              @media (max-width: 480px) {
            #data-ops section.Usability figure .arrow.no-etleap.item3-item4 {
                margin-top: 15px
            }
              }
            #data-ops section.Usability figure .arrow.no-etleap.item4-item5 {
              grid-column: 3;
              align-self: center;
              grid-row: 5 / span 2;
              margin-top: 14px;
            }

              #data-ops section.Usability figure .arrow.no-etleap.item4-item5::after {
                top: unset;
                right: unset;
                bottom: 0;
                transform: translate(-6.5px, 7px) rotate(90deg);
              }

              @media (max-width: 480px) {
            #data-ops section.Usability figure .arrow.no-etleap.item4-item5 {
                margin-top: 0
            }
              }
            #data-ops section.Usability figure .arrow.no-etleap.down.item5-item6 {
              grid-column: 3;
              margin: 0;
              align-self: center;
              grid-row: 6 / span 2;
              height: 15%;
            }
            #data-ops section.Usability figure .arrow.no-etleap.item6-item7 {
              grid-column: 3;
              margin: 0;
              align-self: center;
              grid-row: 7 / span 2;
              height: 15%;
              margin-bottom: 20px;
            }
          }

#data-ops section.Flexibility {
    padding: 156px var(--margin-x);
    margin-top: calc(var(--section-clip-path-height) * -1);
    background-color: var(--color-purple-background);
    clip-path: polygon(
      0 var(--section-clip-path-height),
      100% 0,
      100% 100%,
      0 calc(100% - var(--section-clip-path-height))
    );
    display: grid;
    justify-content: center;
    justify-items: center;
  }

#data-ops section.Flexibility .Info {
      display: grid;
      justify-content: center;
      justify-items: center;
      row-gap: 40px;
      max-width: 650px;
      text-align: center;
    }

@media (max-width: 480px) {

#data-ops section.Flexibility .Info {
        text-align: left;
        row-gap: 24px
    }
      }

#data-ops section.Flexibility .Info header {
        margin-bottom: 10px;
        display: flex;
        gap: 19px;
        align-items: center;
        justify-content: center;
        color: var(--color-purple);
        font-weight: 400;
        font-size: 19px;
        line-height: 1.53;
        letter-spacing: 0.11em;
        text-transform: uppercase;
      }

#data-ops section.Flexibility .Info header img {
          width: 36px;
        }

@media (max-width: 480px) {

#data-ops section.Flexibility .Info header {
          justify-self: start
      }
        }

#data-ops section.Flexibility .Info h1 {
        font-family: var(--avenir-next);
        font-weight: 500;
        font-size: 45px;
        line-height: 1.13;
      }

@media (max-width: 480px) {

#data-ops section.Flexibility .Info h1 {
          font-size: 33px;
          line-height: 1.21
      }
        }

#data-ops section.Flexibility .Info p {
        color: var(--color-text);
        font-size: 18px;
        line-height: 1.33;
      }

@media (max-width: 480px) {

#data-ops section.Flexibility .Info p {
          font-size: 16px;
          line-height: 1.5
      }
        }

#data-ops section.Flexibility ul {
      margin-top: 88px;
      max-width: 1154px;
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      column-gap: 3.5vw;
      text-align: center;
    }

@media (max-width: 960px) {

#data-ops section.Flexibility ul {
        margin-top: 56px;
        grid-template-columns: 1fr;
        row-gap: 29px
    }
      }

@media (max-width: 480px) {

#data-ops section.Flexibility ul {
        margin-top: 24px
    }
      }

#data-ops section.Flexibility ul li {
        background: white;
        box-shadow: 0 12.73px 66.2px -31.53px rgba(0, 0, 0, 0.12);
        border-radius: 13px;
        display: grid;
        row-gap: 16px;
        align-content: start;
        justify-items: center;
        padding: 33px 37px 44px;
      }

@media (max-width: 960px) {

#data-ops section.Flexibility ul li {
          max-width: 460px
      }
        }

#data-ops section.Flexibility ul li img {
          height: 50px;
          margin-bottom: 12px;
        }

#data-ops section.Flexibility ul li h2 {
          font-family: var(--avenir-next);
          font-weight: 500;
          font-size: 24px;
          line-height: 1.29;
          opacity: 0.8;
        }

#data-ops section.Flexibility ul li p {
          color: var(--color-text);
          font-size: 16px;
          line-height: 1.5;
        }

#data-ops section.Flexibility ul li p mark {
            background-color: transparent;
            color: #00ADEE;
            font-weight: 700;
          }