/* ── Знаки площадки ───────────────────────────────────────────────────────
   Логотип чужой, и обращаться с ним надо как с чужим: пропорция из
   viewBox (30000×11317), фирменный синий у знака не трогаем, словесная
   часть наследует цвет текста.

   Готча из V1, повторять не надо: соседние правила задавали мелким
   line-иконкам width: 14px той же специфичностью, и логотип расплющивало
   в те же 14px. Поэтому здесь ширина берётся из атрибутов разметки, а
   высота считается от неё — правило вообще не трогает width. */

.svg-defs {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.fp-mark {
  height: auto;
  flex: none;
  /* На ступень светлее окружающего текста, а не вровень с ним: логотип не
     должен оказаться самым тусклым элементом строки — знак площадки здесь
     несёт больше смысла, чем подпись рядом с ним. */
  color: var(--c-text-secondary);
  /* Оптическое выравнивание: логотип с высокими буквами садится выше
     базовой линии соседнего текста и «висит». */
  vertical-align: -0.18em;
}

.fp-mark--inline {
  margin-inline-start: 0.5ch;
}

/* Предлог, знак и запятая переносятся одним куском. Без этого строка
   рвётся перед логотипом, и он повисает в начале следующей строки
   отдельно от слова, к которому относится. */
.fp-inline {
  white-space: nowrap;
}

/* ── Полоса доверия под кнопками героя ───────────────────────────────── */

.fp-proof {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1.5rem;
  margin: 1.5rem 0 0;
  padding: 0;
  list-style: none;
}

.fp-proof__item {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  /* min-width: 0 обязателен: без него длинный пункт распирает флекс-строку
     и уносит страницу в горизонтальную прокрутку на узком экране. */
  min-width: 0;
  color: var(--c-text-muted);
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1.35;
}

.fp-proof__icon {
  width: 1rem;
  height: 1rem;
  flex: none;
  color: var(--c-accent);
}

/* ── Шаг «Оформляете заказ» ──────────────────────────────────────────── */

.steps__on {
  display: flex;
  align-items: center;
  margin: 0.375rem 0 0;
  color: var(--c-text-muted);
  font-size: 0.8125rem;
  font-weight: 500;
  /* Знак не переносится и не сжимается: в колонке шага для него места
     ровно столько, сколько он занимает. */
  white-space: nowrap;
}

/* ── Подвал ──────────────────────────────────────────────────────────── */

.footer__fp {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
}

.footer__hint {
  margin: 0.75rem 0 0;
  color: var(--c-text-muted);
  font-size: 0.8125rem;
  line-height: 1.5;
}

.footer__compliance {
  margin: 0.875rem 0 0;
  max-width: 68ch;
  color: var(--c-text-faint);
  font-size: 0.75rem;
  line-height: 1.6;
}

@media (max-width: 40rem) {
  .fp-proof {
    gap: 0.5rem 1rem;
  }

  .fp-proof__item {
    /* На телефоне пункты встают колонкой: три коротких строки читаются,
       три обрывка в две колонки — нет. */
    flex: 1 1 100%;
  }
}