/* Главная «Нео», разделы ниже первого экрана (бриф «Живой чат» 31.10.2026, п. 5.3–5.10).
   Подключается после home.css: токены и сообщение Нео (.msg) — там. Фон разделов чередуется:
   белый и светло-мятный (.sec-tint); на белом карточки и пузыри Нео — мятно-серые, на мятном — белые. */
section { padding: 88px 0; background: var(--card); }
section.sec-tint { background: var(--bg); }
section h2 { font-size: clamp(28px, 3.4vw, 40px); font-weight: 800; letter-spacing: -.02em; line-height: 1.1; margin: 0 0 14px; }
.card h3, .row-title, .rates-title, .nrg-box h3 { letter-spacing: -.01em; }
/* абзацы — во всю ширину колонки, вровень с карточками под ними */
section p.sub { color: var(--lead); font-size: 17px; margin: 0 0 36px; }
/* блок сразу под заголовком, без подзаголовка — на том же расстоянии, что под подзаголовком */
section h2 + .duo, section h2 + .feed, section h2 + .promises { margin-top: 36px; }
@media (max-width: 760px) {
  section { padding: 56px 0; } section p.sub { margin-bottom: 28px; }
  section h2 + .duo, section h2 + .feed, section h2 + .promises { margin-top: 28px; }
}

.card { border: 0; border-radius: 18px; padding: 22px 24px; background: var(--bg); }
.sec-tint .card { background: var(--card); box-shadow: var(--shadow-bubble); }
.card:hover, .plan:hover { transform: none; border-color: transparent; }
.sec-tint .card:hover { box-shadow: var(--shadow-bubble); }
.card h3 { font-size: 17px; font-weight: 700; color: var(--ink); margin: 0 0 8px; }
.card p { color: var(--lead); font-size: 15px; }
.row-title { font-size: 20px; font-weight: 800; margin: 44px 0 16px; letter-spacing: -.01em; }
.why .msg.neo { background: var(--bg); box-shadow: 0 1px 0 #D6E3DE; }

/* лента сценариев: на широком экране колонка на рубрику (бриф 5.4; сценарии разложены 7/7/6, чтобы колонки
   шли вровень), уже 1024 — рубрики рядами по два; у сценария заголовок, сообщение Нео и «N вместо M» */
.feed { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 24px; align-items: start; }
.feed-group { min-width: 0; }
.feed-title { font-size: 20px; font-weight: 800; letter-spacing: -.01em; color: var(--ink); margin: 0 0 18px; }
.feed-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 30px; }
.feed-item { display: flex; flex-direction: column; gap: 10px; min-width: 0; color: inherit; text-decoration: none; }
.feed-item h4 { margin: 0; font-size: 15px; line-height: 1.3; font-weight: 600; color: var(--ink); }
.feed-item .msg { max-width: 100%; padding: 12px 16px; font-size: 15px; transition: box-shadow .2s ease; }
.feed-item .msg .acts { margin-top: 10px; gap: 6px; }
.feed-item .msg .acts span { padding: 5px 11px; font-size: 13px; }
.feed-time { margin: auto 0 0; font-size: 14px; color: var(--muted); }
.feed-time b { font-weight: 800; color: var(--mint-text); }
.feed-item:hover h4 { text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
.feed-item:hover .msg { box-shadow: 0 1px 0 #D6E3DE, 0 18px 32px -18px rgba(15,27,45,.45); }
.feed-note { margin: 40px 0 0; font-size: 13px; color: var(--muted); }
@media (max-width: 1024px) {
  .feed { grid-template-columns: minmax(0, 1fr); }
  .feed-group + .feed-group { margin-top: 48px; }
  .feed-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 20px; }
}
@media (max-width: 560px) { .feed-list { grid-template-columns: minmax(0, 1fr); } }

/* «Чем отличается»: три мини-диалога, под каждым — тезис */
.duo { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.duo-item { display: flex; flex-direction: column; min-width: 0; }
.duo-item .chat { flex: 1; align-content: start; margin-bottom: 22px; }
.duo .msg { max-width: 100%; font-size: 15px; }
.duo .msg.me { max-width: 92%; }
.duo-item h3 { margin: 0 0 8px; font-size: 20px; font-weight: 800; color: var(--ink); }
.duo-item p { margin: 0; color: var(--lead); font-size: 16px; }
@media (max-width: 760px) { .duo { grid-template-columns: minmax(0, 1fr); gap: 48px; } .duo-item .chat { flex: none; } }
/* в три колонки заголовки и подписи — на одной линии, как бы ни разнились сообщения и длина подписи */
@media (min-width: 761px) {
  .duo { grid-template-rows: auto auto auto; row-gap: 0; }
  .duo-item { display: grid; grid-row: span 3; grid-template-rows: subgrid; }
}

/* «Потешные истории»: тексты прежние, без фото; три случая — цитатами, источник строкой сверху */
.stories p.lead { font-size: 18px; color: var(--lead); margin: 0; }
.stories .row-title:first-of-type { margin-top: 44px; }
.quote { border-left: 3px solid var(--mint); border-radius: 6px 18px 18px 6px; }
.card .quote-src { margin: 0 0 10px; font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  color: var(--mint-text); }
.slips { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 20px; }
.slips li { padding: 14px 18px; border-radius: 14px; background: var(--bg); font-size: 15.5px; color: var(--lead); min-width: 0; }
/* просьба строкой сверху, под ней «→ что вышло»: плашки одной высоты, без пустой половины */
.slips li strong { display: block; margin-bottom: 4px; font-weight: 600; color: var(--ink); }
section p.sub.stories-next { margin: 32px 0 0; color: var(--text); font-weight: 600; }
@media (max-width: 760px) { .slips { grid-template-columns: minmax(0, 1fr); } }

/* «Как начать»: шаги с номерами слева, одна переписка справа */
.how-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 56px; align-items: start; }
.steps-list { list-style: none; margin: 0; padding: 0; counter-reset: step; display: grid; gap: 30px; }
.steps-list li { counter-increment: step; display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 0 16px; }
.steps-list li::before { content: counter(step); grid-row: span 2; width: 44px; height: 44px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; background: var(--ink); color: #fff; font-weight: 800; font-size: 18px; }
.steps-list h3 { margin: 8px 0 8px; font-size: 19px; font-weight: 800; line-height: 1.25; color: var(--ink); }
.steps-list p { margin: 0; color: var(--lead); }
.how .msg strong { font-weight: 600; }
@media (max-width: 760px) { .how-grid { grid-template-columns: minmax(0, 1fr); gap: 40px; } .how .msg { max-width: 100%; } }

/* тарифы: структура прежняя; карточки без обводок, «Нео 200» — на мятной подложке, цены крупно */
.plans { gap: 18px; }
.plan { border: 0; background: var(--bg); border-radius: 22px; padding: 26px; }
.plan.featured { background: var(--mint-soft); box-shadow: none; }
.plan .name { font-size: 18px; font-weight: 800; color: var(--ink); }
.plan .price { font-size: 44px; line-height: 1.05; letter-spacing: -.02em; }
.plan .price small, .plan .save-badge { font-family: var(--font); }
.plan .nrg { border: 0; background: var(--card); }
.pay-switch { border: 0; background: var(--bg); }
.nrg-box { border: 0; background: var(--bg); }
.nrg-chat { margin-top: 18px; }
.nrg-chat .msg p { margin: 0; font-size: 15px; color: var(--text); }
section p.sub.plans-all { margin: 32px 0 0; }
section p.sub.plans-foot { margin: 20px 0 0; }
.plans-cta { margin: 26px 0 0; }
@media (max-width: 560px) { .plans { grid-template-columns: minmax(0, 1fr); } .plans-cta .btn { width: 100%; } }

/* партнёры: таблица ставок (и карточками на телефоне), цвета акции и пиктограмм — в site.css */
section p.sub.partners-more { margin: 16px 0 0; }

/* обещания: главное — «Без вашего «Да» — ничего» с сообщением Нео, бизнес — мелкой строкой внизу */
.promises { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.promise { min-width: 0; padding: 26px 28px; border-radius: 22px; background: var(--bg); }
.promise h3 { margin: 0 0 8px; font-size: 20px; font-weight: 800; color: var(--ink); }
.promise p { margin: 0; color: var(--lead); }
.promise--main { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px;
  align-items: center; background: var(--mint-soft); }
.promise--main h3 { font-size: clamp(24px, 3vw, 32px); letter-spacing: -.02em; }
.promise--main .msg { max-width: 100%; }
.honest .biz { margin: 32px 0 0; padding: 0; border: 0; background: none; font-size: 13.5px; color: var(--muted); }
.honest .biz strong { font-weight: 600; color: var(--text); }
@media (max-width: 760px) { .promises, .promise--main { grid-template-columns: minmax(0, 1fr); } .promise { padding: 22px; } }

footer { border-top: 0; }
