/* Страница услуги «Настройка Яндекс Директа под ключ» (issue #179).
 *
 * Подключается после landing.css и help.css: карточка цены, шаги (.pd-steps), гарантия
 * (.pd-guarantee), вопросы (.faq-item) и призыв (.help-cta) — уже готовые компоненты
 * лендинга и витрин. Здесь — только раскладка страницы на тех же шкалах :root (держит
 * test_css_sizes_come_only_from_scales), своих цветов и размеров нет.
 */

.dfy-hero {
  display: flex; flex-direction: column; align-items: flex-start; gap: 1rem;
  max-width: 48rem;
  margin-bottom: 3rem;
  padding: 2.5rem;
  background: #fff;
  border: 1px solid var(--purple-bg-2);
  border-radius: var(--r-l);
  box-shadow: var(--shadow-2);
}
.dfy-hero h1 { font-size: var(--fs-h2); margin: 0; text-wrap: balance; }
.dfy-price {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem .75rem;
  margin: 0;
  font-family: var(--font-display); font-size: var(--fs-3xl); font-weight: 700;
  color: var(--purple);
}
.dfy-price-sub { font-family: var(--font-body); font-size: var(--fs-sm); font-weight: 500; color: var(--text-muted); }
.dfy-lead { margin: 0; font-size: var(--fs-lg); color: var(--text); text-wrap: pretty; }
.dfy-note { margin: 0; font-size: var(--fs-sm); color: var(--text-muted); }

.dfy-block { max-width: 48rem; margin-bottom: 2.75rem; }
.dfy-block > h2 { font-size: var(--fs-2xl); margin-bottom: 1rem; }
.dfy-block .pd-guarantee { font-size: var(--fs-md); }
.dfy-small { margin: .75rem 0 0; font-size: var(--fs-sm); color: var(--text-muted); }
.dfy-small a, .dfy-cta a:not(.btn) { color: var(--purple); text-decoration: underline; }

.dfy-list { margin: 0; padding-left: 1.25rem; display: grid; gap: .5rem; font-size: var(--fs-md); line-height: 1.6; }
.dfy-list li::marker { color: var(--purple); }
.dfy-result {
  margin: 1.25rem 0 0;
  padding: .875rem 1rem;
  border-left: 3px solid var(--purple-lighter);
  background: var(--purple-bg);
  border-radius: var(--r-s);
  font-size: var(--fs-md); line-height: 1.6;
}

/* Вопросы — компонент FAQ лендинга, но в колонке текста, а не по центру. */
.dfy-faq { margin: 0; }

.dfy-cta { max-width: 48rem; }

@media (max-width: 599px) {
  .dfy-hero { padding: 1.5rem; margin-bottom: 2.25rem; }
  .dfy-hero .btn { align-self: stretch; justify-content: center; text-align: center; }
  .dfy-price { font-size: var(--fs-2xl); }
}
