.numbers{
  padding: 3rem 0;
}

.numbers-middle-left-col{
  padding-right: 1rem !important;
}
.numbers-middle-right-col{
  padding-left: 1.3rem !important;
}

.numbers h2{
  font-weight: 700;
  font-size: 34px;
  line-height: 120%;
  text-align:  center;
}

.numbers .title-wrap p{
  margin-bottom: 0;
  padding: 0 7rem;
}

.numbers-card{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  width: 100%;
  height: 202px;
  margin-top: 48px;

  background: #F2F2F2;
  border-radius: 24px;
}

.numbers-card h4 > span{
  color: var(--accent-color);
}

.numbers-card h4{
  font-weight: 700;
  font-size: 3rem;
  line-height: 100%;

  letter-spacing: 0.01em;

  color: #27272A;
}

.numbers-card p{
  font-size: 1rem;
  font-weight: 300;
  text-align: center;
  padding: 0 0.9rem;
}

.numbers-card p > span{
  color: var(--accent-color);
}

.numbers-main-row{
  margin-left: -1.5rem !important;
  margin-right: -1.5rem !important;
}


@media (min-width: 1201px) and (max-width: 1550px){
  .container{
    max-width: 1140px !important;
  }
  
  .numbers h2{
    font-size: 28px;
  }
  .numbers-middle-left-col{
    padding-right: 0rem !important;
  }
  .numbers-middle-right-col{
    padding-left: 0rem !important;
  }
}

@media screen and (max-width: 1201px){
  .numbers h2{
    font-size: 20px;
  }

  .numbers-middle-left-col{
    padding-right: 0.1rem !important;
  }
  .numbers-middle-right-col{
    padding-left: 0.3rem !important;
  }

  .numbers-card{
    width: 230px !important;
  }

  .numbers p{
    font-size: 14px;
  }

  .numbers .upper-title{
    font-size: 12px;
  }
}

@media screen and (max-width: 993px){
  .numbers .title-wrap p{
    padding: 0 3rem;
  }

  .numbers-middle-left-col{
    padding-right: 0rem !important;
  }
  .numbers-middle-right-col{
    padding-left: 0rem !important;
  }
  
  .numbers-card{
    width: 290px !important;
  }

  .numbers .container{
    height: max-content !important;
    padding: 0;
  }

  .numbers-card{
    padding: 0 1rem;
  }

  .numbers-card p{
    font-size: 1rem;
  }

  .numbers-card h4{
    font-size: 3rem;
  }
  .numbers-card_final h4{
    font-size: 1.5rem !important;
  }
}

@media screen and (max-width: 769px){
  .numbers h2{
    font-size: 24px;
  }

  .numbers .title-wrap p{
    margin-bottom: 2rem;
  }

  .numbers-card{
    width: 100%;
    margin-top: 1rem;
    margin-bottom: 0;
  }
  .numbers-card-col{
    display: flex;
    justify-content: center;
  }
}

@media screen and (max-width: 577px){
  .numbers-main-row{
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  
  .numbers .title-wrap p{
    padding: 0 1.5rem;
  }
  
  .numbers-card-col{
    text-align: center;
  }

  .numbers-card{
      max-width: 500px;
      height: 202px;
  }

  .numbers-card h4{
      padding: 0 3rem !important;
  }
}
