.services-block .content-holder {
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 20px;
}

.services-block .tabs-holder {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  width: fit-content;
  gap: 5px;
  padding: 5px;
  border-radius: 5px;
  background: var(--background);
}

.services-block .tab-btn {
  display: flex;
  width: fit-content;
  border-radius: 5px;
  padding: 8px 15px;
  font-weight: 120%;
  background: var(--background-secondary);
  color: var(--head-primary);
  cursor: pointer;
  transition: all 0.3s ease-in;
}

.services-block .tab-btn:hover,
.services-block .tab-btn.active {
  background: var(--second-hover);
}

.services-block .tab-btn.active {
  pointer-events: none;
}

.services-block .services-wrapper {
  display: none;
}

.services-block .services-wrapper.active {
  display: grid;
}

.services-block .btn-show-all {
  margin-top: 30px;
}

@media (max-width: 992px) {
  .services-block .btn-show-all {
    margin-top: 20px;
  }
}

@media (max-width: 576px) {
  .services-block .services-wrapper.active {
    display: flex;
  }
}
@media (max-width: 420px) {
  .services-block .tabs-holder {
    width: 100%;
  }
  .services-block .tab-btn {
    width: 100%;
    justify-content: center;
    text-align: center;
  }
}