/* ============================================================
   bufet — этапы работы (левая колонка липкая, справа список шагов).
   Перенос из docs/02/design_2/assets/home-c.css (строки 299–312)
   плюс относящиеся к секции правила блока RESPONSIVE.
   Инлайновый сброс списка из разметки макета перенесён в .psteps.
   ============================================================ */
.process { padding-block: var(--section-y); background: var(--bg-2); }
.process__grid { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: clamp(40px, 6vw, 100px); align-items: start; }
.process__sticky { position: sticky; top: 120px; }
.process__sticky .sec-title { margin-bottom: 26px; }
.process__sticky p { color: var(--ink-2); max-width: 34ch; margin: 0 0 30px; }

/* Ссылка на страницу «Как работаем» под кнопкой: сама кнопка ведёт в заявку, а этот
   переход — для тех, кто ещё читает.
   Селектор ПАРНЫЙ, и это не украшение: правило `.process__sticky p` выше в этом же
   файле имеет специфичность 0,1,1 и одиночный `.process__more` (0,1,0) молча перебило бы
   его нижним отступом в 30 px, рассчитанным на абзац над кнопкой. */
.process__sticky .process__more { margin: 22px 0 0; max-width: none; }

.psteps { display: flex; flex-direction: column; gap: 4px; list-style: none; margin: 0; padding: 0; }
.pstep { display: grid; grid-template-columns: auto 1fr; gap: clamp(18px, 2vw, 32px); padding: 34px 0; border-top: 1px solid var(--line); align-items: start; }
.pstep:last-child { border-bottom: 1px solid var(--line); }
.pstep__n { font-family: var(--font-display); font-weight: 800; font-size: clamp(2rem, 3.6vw, 3.2rem); line-height: .9; letter-spacing: -.03em; color: var(--accent); }
.pstep__t { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-h4); color: var(--ink); margin: 2px 0 10px; }
.pstep__d { color: var(--ink-2); max-width: 42ch; margin: 0; }
/* Строка «что нужно от вас · срок» под описанием шага — только на странице
   «Как работаем» (page-templates/process.php); в секции главной шаги без неё.
   Кегль и цвет — те же, что у подписи под кадром (--fs-cap / --ink-3): это
   служебная строка, спорить с описанием шага она не должна. */
.pstep__meta { margin: 12px 0 0; font-family: var(--font-display); font-weight: 600; font-size: var(--fs-cap); color: var(--ink-3); max-width: 42ch; }

@media (max-width: 1024px) {
  .process__grid { grid-template-columns: 1fr; gap: 40px; }
  .process__sticky { position: static; }
}