/* ═══════════════════════════════════════════════════════════════
   home-typo.css — типографика и ритм главной (редизайн, шаг 5, 04.10.2026).
   Надзаголовок соломой над каждой секцией (.page-eyebrow, как «Аналитика рынка»),
   заголовки крупнее, одинаковые отступы, сплошные иконки «Как работает» (.hs-ico).
   ═══════════════════════════════════════════════════════════════ */
.sh-titles{display:flex;flex-direction:column}
.section-title,.section-title-center{font-size:clamp(28px,3vw,36px)!important;letter-spacing:-.5px;line-height:1.15;color:var(--g900)}
.section-sub-center{font-size:16px;color:var(--gr600);margin-bottom:32px}
.section-head{margin-bottom:32px;align-items:flex-end}
#farms-live-text{margin-top:8px}

/* ритм: одинаковые отступы секций */
.categories,.listings,.farms,#how,.reviews,.faq{padding-top:96px!important;padding-bottom:96px!important}
.cta-section{padding:88px 0}

/* «Как работает»: плашка иконки тёплая, иконка сплошная */
.how-step-icon,.how-step:nth-child(n) .how-step-icon{width:76px;height:76px;border-radius:22px;background:var(--cream-2)!important;color:var(--g800)!important}
.how-step-icon .hs-ico{width:38px;height:38px;display:block}
.how-step:not(:last-child)::after{top:38px;left:calc(50% + 38px);width:calc(100% - 76px);background:repeating-linear-gradient(90deg,var(--straw) 0 6px,transparent 6px 12px);height:2px;opacity:.7}
.how-step-title{font-size:17px;font-weight:800;color:var(--g900)}
.how-step-desc{font-size:14px}

@media (max-width:768px){
  .page-eyebrow{font-size:11px;margin-bottom:4px}
  .section-title,.section-title-center{font-size:24px!important}
  .farms .section-title,.listings .section-title,.section-title-center{font-size:24px!important}
  .categories,.listings,.farms,#how,.reviews,.faq{padding-top:32px!important;padding-bottom:32px!important}
  .section-head{margin-bottom:16px}
  .mob-how-step-icon{width:44px;height:44px;border-radius:14px;background:var(--cream-2)}
  .mob-how-step-icon svg.hs-ico{width:26px;height:26px;fill:initial;stroke:none;color:var(--g800)}
}

/* 04.10: на телефоне .how-inner без боковых полей (ленты от края), надзаголовок прилипал к краю */
@media (max-width:768px){
  section#how .how-inner>.page-eyebrow{padding:0 16px}
}