.fc_stats_repeater {
  position: relative;
  isolation: isolate;

  .stats_container {
    display: flex;
    flex-direction: column;
    gap: var(--gap-s);

    .stat {
      display: flex;
      flex-direction: column;

      .stat-text {
        color: var(--color-light-green);
      }
    }
  }

  /* graphic */
  .graphic_container {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    background: center / contain no-repeat
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 296 180'%3E%3Cpath fill='%231e5a55' d='M148 180 0 0h296z'/%3E%3C/svg%3E");

    &.white {
      background: center / contain no-repeat
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 296 180'%3E%3Cpath fill='%23fff' d='M148 180 0 0h296z'/%3E%3C/svg%3E");
    }
  }
  /* sizes */
  &.padding_top_xs {
    .graphic_container {
      height: clamp(17.3px, 0.283vw + 15.667px, 20.77px);
      aspect-ratio: 34.16 / 20.77;
    }
  }
  &.padding_top_m {
    .graphic_container {
      height: clamp(17.3px, 2.263vw + 4.265px, 45px);
      aspect-ratio: 74 / 45;
    }
  }
  &.padding_top_xl {
    .graphic_container {
      height: clamp(17.3px, 3.96vw + -5.509px, 65.77px);
      aspect-ratio: 108.15 / 65.77;
    }
  }

  /* responsive */
  @media (width >= 576px) {
    .stats_container {
      &:not(.col_3),
      &.col_3:has(> .stat:first-child:nth-last-child(6n)),
      &.col_3:has(> .stat:first-child:nth-last-child(6n) ~ .stat) {
        flex-flow: row wrap;
        justify-content: space-between;
      }
    }
  }

  @media (width >= 992px) {
    .stats_container {
      &.col_3 {
        flex-flow: row wrap;
        justify-content: space-between;
      }
    }
  }
}
