/* ===========================================================
   «Услуги» — карточки-модули в одном стиле с «преимуществами»
   -----------------------------------------------------------
   Только переопределения поверх style.min.css, разметка не
   меняется: прямые углы, тонкие рамки, свечение на ховере,
   моноширинные индексы через CSS-счётчик, синие акценты.
   =========================================================== */

.services-body {
  counter-reset: service;
}

.services-item {
  border-radius: 0;
  background: #191919;
  border: 1px solid rgba(255, 255, 255, .08);
  overflow: hidden;
  transition: border-color .3s ease-out, translate .3s ease-out, box-shadow .3s ease-out;
}

.services-item:hover {
  border-color: rgba(56, 169, 255, .4);
  translate: 0 -4px;
  box-shadow: 0 14px 40px rgba(0, 0, 0, .45), 0 0 24px rgba(56, 169, 255, .07);
}

/* моноширинный индекс [ 01 ]…[ 0N ] над заголовком */
.services-item::before {
  counter-increment: service;
  content: "[ 0" counter(service) " ]";
  font-family: monospace;
  font-size: .9375rem;
  letter-spacing: .08em;
  color: #38a9ff;
  opacity: .75;
  margin: .375rem 0 .625rem;
}

/* цена: цифры в акцентном синем */
.services-item__price span {
  color: #38a9ff;
}

/* пункты списка с кодовым маркером */
.services-item__list li {
  position: relative;
  padding-left: 1.125rem;
}

.services-item__list li::before {
  content: "+";
  position: absolute;
  left: 0;
  top: 0;
  font-family: monospace;
  color: #38a9ff;
  opacity: .8;
}

/* блок-описание с «?» — скругляем под общий стиль */
.services-item__description {
  border: 1px solid rgba(255, 255, 255, .25);
  border-radius: 0;
}

.services-item__description-question {
  border-radius: 0;
  top: -1px;
  right: -1px;
}

/* Сетка услуг: все четыре карточки (включая «заполнить форму»)
   одинаковой ширины и с равными промежутками на любых десктопных
   ширинах (грид вместо flex-переносов с переставленным порядком
   из style.min.css). */
@media (min-width: 90em) {
  .services-body {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.25rem;
  }
  .services-body .services-row,
  .services-body .services-row--link {
    order: 0;
    flex: none;
    width: auto;
    max-width: none;
  }
}

/* контейнер на ≤1439px сужен до 970px — карточки идут 2×2 */
@media (min-width: 62em) and (max-width: 89.99875em) {
  .services-body {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem;
  }
  .services-body .services-row,
  .services-body .services-row--link {
    order: 0;
    flex: none;
    width: auto;
    max-width: none;
  }
}

/* лендинг: цена сразу под заголовком, отступ до цены такой же,
   как у остальных карточек (те же -1.25rem из базовых стилей) */
.services-row:nth-child(1) .services-item__top {
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
}

.services-row:nth-child(1) .services-item__price {
  margin: -1.25rem 0 0;
}

/* карточка-ссылка «заполнить форму» */
.services-discount a {
  border-radius: 0;
  background: #191919;
  border: 1px solid rgba(255, 255, 255, .08);
  overflow: hidden;
  transition: background .3s ease-out, border-color .3s ease-out,
    translate .3s ease-out, box-shadow .3s ease-out;
}

.services-discount a:hover {
  border-color: rgba(56, 169, 255, .4);
  translate: 0 -4px;
  box-shadow: 0 14px 40px rgba(0, 0, 0, .45), 0 0 24px rgba(56, 169, 255, .07);
}