.feature {
  display: grid;
  grid-template-columns: var(--column-one-third);
  gap: var(--size-grids-gutter-md);
  padding: var(--size-block-space-xl) 0;
  border-bottom: solid 1px var(--color-border-neutral-md);
}
.feature_commercial .feature__title, .feature_commercial .feature__title a, .feature__title .feature_commercial a {
  /* Heading3xlMd */
  font-variant-numeric: var(--font-varian-Heading3xlMd);
  font-family: var(--font-family-Heading3xlMd);
  font-size: var(--font-size-Heading3xlMd);
  font-style: var(--font-style-Heading3xlMd);
  font-weight: var(--font-weight-Heading3xlMd);
  line-height: var(--font-line-height-Heading3xlMd);
  letter-spacing: var(--font-letter-spacing-Heading3xlMd);
}
.feature_navigation .feature__title, .feature_navigation .feature__title a, .feature__title .feature_navigation a {
  /* Heading2xlMd */
  font-variant-numeric: var(--font-varian-Heading2xlMd);
  font-family: var(--font-family-Heading2xlMd);
  font-size: var(--font-size-Heading2xlMd);
  font-style: var(--font-style-Heading2xlMd);
  font-weight: var(--font-weight-Heading2xlMd);
  line-height: var(--font-line-height-Heading2xlMd);
  letter-spacing: var(--font-letter-spacing-Heading2xlMd);
}
.feature:first-child {
  border-top: solid 1px var(--color-border-neutral-md);
}
.feature:last-child {
  padding-bottom: 0;
  border-bottom: none;
}
.feature__data {
  display: grid;
  grid-auto-rows: max-content;
  gap: var(--size-content-space-1xl);
  max-width: var(--size-block-text-third-body-max);
}
.feature__title, .feature__title a {
  color: var(--color-content-neutral-primary);
}
.feature .feature__description {
  color: var(--color-content-neutral-secondary);
  /* BodyLgRegular */
  font-variant-numeric: var(--font-variant-numeric-BodyLgRegular);
  font-family: var(--font-family-BodyLgRegular);
  font-size: var(--font-size-BodyLgRegular);
  font-style: var(--font-style-BodyLgRegular);
  font-weight: var(--font-weight-BodyLgRegular);
  line-height: var(--font-line-height-BodyLgRegular);
  letter-spacing: var(--font-letter-spacing-BodyLgRegular);
}
.feature__button {
  align-self: end;
}
.feature__media {
  border-radius: 8px;
  overflow: hidden;
}
.feature__media img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.feature__video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.feature__animation {
  display: grid;
  position: relative;
  width: 100%;
  height: 100%;
  /*.spine {
      &-container {
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
      }
  }*/
}

/* Base Breakpoints */
@media (min-width: 1920px) {
  .feature__media {
    height: calc(640px + 560 * (100vw - 1920px) / 1920);
  }
}
@media (min-width: 1280px) and (max-width: 1919px) {
  .feature__media {
    height: calc(400px + 240 * (100vw - 1280px) / 639);
  }
}
@media (min-width: 768px) and (max-width: 1279px) {
  .feature__media {
    height: calc(360px + 40 * (100vw - 768px) / 511);
  }
}
@media (max-width: 767px) {
  .feature__media {
    height: calc(200px + 160 * (100vw - 360px) / 407);
  }
}
/* Custom Breakpoints */
@media (max-width: 1024px) {
  .feature {
    grid-template-columns: 1fr;
  }
  .feature__media {
    order: -1;
  }
}/*# sourceMappingURL=feature.css.map */