/**
 * The base file that should be imported by every file.
 * There should be no CSS generation in this or from imported scss files at all!
 */
/**
 * Library
 */
/**
 * Variables and functions
 */
.section-content-number-usps .container {
  display: grid;
  align-items: flex-start;
  grid-template-columns: 1fr;
  gap: calc(90px / 4); }
  @media (min-width: 981px) {
    .section-content-number-usps .container {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 45px; } }
  .section-content-number-usps .container h1, .section-content-number-usps .container h2, .section-content-number-usps .container h3 {
    margin: 0; }
  .section-content-number-usps .container .title .h1 {
    display: flex;
    gap: 30px; }
    @media (min-width: 981px) {
      .section-content-number-usps .container .title .h1 {
        justify-content: space-between;
        margin-left: -10px;
        margin-bottom: 15px; } }
    .section-content-number-usps .container .title .h1 span {
      font-weight: normal; }
  @media (max-width: 980px) {
    .section-content-number-usps .container .content-info {
      order: 3; } }
  @media (min-width: 981px) {
    .section-content-number-usps .container .content-info .content {
      margin-top: 45px; } }
  .section-content-number-usps .container .numbers {
    order: 2;
    display: flex;
    flex-wrap: wrap;
    flex-shrink: 1; }
    @media (min-width: 981px) {
      .section-content-number-usps .container .numbers {
        padding-left: 0; } }
    .section-content-number-usps .container .numbers .number {
      min-height: 150px;
      position: relative;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      padding: 10px;
      flex-grow: 1; }
      @media (min-width: 981px) {
        .section-content-number-usps .container .numbers .number {
          min-height: 250px;
          padding: 1.5em; } }
      .section-content-number-usps .container .numbers .number:after {
        content: '';
        height: 0;
        width: 100%;
        position: absolute;
        bottom: 0;
        left: 0; }
      .section-content-number-usps .container .numbers .number h3, .section-content-number-usps .container .numbers .number .number-title {
        position: relative;
        z-index: 1;
        display: flex; }
      .section-content-number-usps .container .numbers .number .number-title {
        text-transform: uppercase;
        font-family: "JetBrains Mono", Helvetica, Arial, sans-serif;
        font-size: 12px;
        line-height: 100%; }
        @media (min-width: 981px) {
          .section-content-number-usps .container .numbers .number .number-title {
            font-size: 16px; } }
    .section-content-number-usps .container .numbers.animate .number.green:after {
      background: linear-gradient(180deg, #00FFA0 0%, rgba(0, 255, 160, 0.5) 100%);
      animation: background 1s ease-in-out forwards; }
    .section-content-number-usps .container .numbers.animate .number.white:after {
      animation: background 1s ease-in-out forwards;
      background: linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0.5) 100%); }
    .section-content-number-usps .container .numbers.animate .number.dark:after {
      animation: background 1s ease-in-out forwards;
      background: linear-gradient(180deg, #2C435E 0%, rgba(44, 67, 94, 0.5) 100%); }
    .section-content-number-usps .container .numbers.animate .number.dark h3 {
      color: var(--green); }
    .section-content-number-usps .container .numbers.animate .number.dark .number-title {
      color: var(--green); }

.section-content-number-usps.dark .number-title {
  color: var(--dark-blue); }

@keyframes background {
  0% {
    height: 0; }
  100% {
    height: 100%; } }

/*# sourceMappingURL=content-number-usps.css.map */