.numbered-steps {

}

.numbered-steps__title.h1 {
   margin-bottom: clamp(28px, 84 * (100vw/1920), 84px);
}

.numbered-steps__list {
   display: flex;
   flex-direction: column;
   gap: clamp(16px, 46 * (100vw/1920), 46px);
   position: relative;
}

.numbered-steps__line {
   position: absolute;
   left: 4px;
   width: 2px;
   background: repeating-linear-gradient(
           to bottom,
           #d1d1d1,
           #d1d1d1 4px,
           transparent 4px,
           transparent 8px
   );
   z-index: 0;
}


.numbered-steps__item {
   display: flex;
}

.numbered-steps__item-header {
   flex: 1 1 auto;
   display: flex;
   gap: 12px;
}

.numbered-steps__item-header.h2 {
   margin-bottom: 0;
   font-weight: 500!important;
}

.numbered-steps__item-text {
   flex: 0 0 46%;
   display: flex;
   justify-content: space-between;
   gap: clamp(16px, 46 * (100vw/1920), 46px);

}

.numbered-steps__item-text.h3 {
   margin-bottom: 0;
   color: #000;

}

.numbered-steps__item-text.h3 * {
   color: inherit;
}


.numbered-steps__number {
   position: relative;
   display: flex;
   height: fit-content;
   gap: clamp(16px, 46 * (100vw/1920), 46px);
   align-items: center;
}

.numbered-steps__number-value--mobile {
   display: none;
}

.numbered-steps__number-bullet.numbered-steps__number-bullet--invisible {
   opacity: 0;
   display: none;
}

.numbered-steps__number-bullet {
   width: 20px;
   height: 20px;
   background-color: #fff;
   border: 2px solid #000;
   position: relative;
   left: 0;
   display: flex;
   justify-content: center;
   align-items: center;
}

.numbered-steps__number-bullet > span {
   background: #000;
   width: 10px;
   height: 10px;
}

@media (max-width: 1024px) {
   .numbered-steps__item {
      flex-direction: column;
      gap: 12px;
   }

   .numbered-steps__number-bullet.numbered-steps__number-bullet--invisible {
      display: flex;
      aspect-ratio: 1 / 1;
   }

   .numbered-steps__number {
      padding-top: 2px;
   }

   .numbered-steps__number-value {
      display: none;
   }

   .numbered-steps__number-value.numbered-steps__number-value--mobile {
      display: inline;
   }

   .numbered-steps__number-bullet {
      width: 15px;
      height: 15px;
   }

   .numbered-steps__number-bullet > span {
      width: 7px;
      height: 7px;
   }
}

@media (max-width: 768px) {

}