@layer modules {
  #stats {
    padding: 3rem max((100% - 1200px) / 2 + 2rem, 2rem);
    text-align: center;
    ul {
      list-style: none;
      display: grid;
      grid: auto / repeat(4, 1fr);
      gap: 2rem 1rem;
      padding: 0;
      margin: 0;
    }
    li {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: .5rem;
      position: relative;
      font-size: 1.1rem;
      &:where(:not(:last-of-type))::after {
        content: "";
        width: 1px;
        position: absolute;
        inset: 1.5rem 0 1.5rem auto;
        background: #d4d8dc;
      }
    }
    b {
      font-size: clamp(1.5rem, 2vw + 1.5rem, 3.4rem);
      font-weight: 700;
      position: relative;
      background: linear-gradient(115deg, #4541ff, #01cedb 85%);
      background-clip: border-box;
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      text-fill-color: transparent;
    }
    img {
      display: block;
      width: auto;
      height: 1.3em;
      margin: .1em;
    }
    small {
      display: block;
      font-size: .8rem;
    }

    @media (width < 800px){
      li::after { content: none; }
      ul { grid: auto auto / 1fr 1fr; }
    }
  }
}