/* v19 standard of type and air, 27.10.2026. The owner took the second block («Понимает вас с полуслова») as the measure
   for every block after the first screen: a large heading, 19-22 px text under it and wide gaps. Loaded last;
   !important and long selectors where type-v15 and older layers set the same sizes with them.
   --sec   air above a block's heading (and below a block, where the next one has another background)
   --head-gap  heading -> the text under it;  --body-gap  that text -> the block's content (cards, tabs, buttons) */
:root{--h2:clamp(48px,5vw,68px);--lead:22px;--sec:120px;--head-gap:36px;--body-gap:56px}
@media(max-width:700px){:root{--h2:44px;--lead:19px;--sec:88px;--head-gap:32px;--body-gap:44px}}
@media(max-width:360px){:root{--h2:38px;--lead:17px}}

/* block headings */
main section h2,#download h2{font-size:var(--h2)!important;line-height:1.1!important}

/* the text right under a heading */
.how-v13 .how-lead,
.mess .mess-note,
.field-copy>h2+p:not(.eyebrow),
#money .money-copy>h2+p:not(.eyebrow),
#audience .audience-heading>p,
.pricing-intro>h2+p:not(.eyebrow),
.referral-v10 h2+p:not(.eyebrow),
#questions .faq-intro,
#download .closing-content>h2+p:not(.eyebrow){font-size:var(--lead)!important;line-height:1.6!important;margin-top:var(--head-gap)!important;max-width:620px!important}
.field-copy>h2,.referral-v10 h2{margin-bottom:0!important}
/* from 601 px the text lies over the photo: it keeps within 40% of the screen, left of the van and the master */
@media(min-width:601px){.field-copy>h2+p:not(.eyebrow){max-width:min(520px,40vw)!important}}
/* from 821 px the audience text stands in its own column beside the heading (below that it is under the heading) */
@media(min-width:821px){#audience .audience-heading>p{margin-top:0!important}}

/* air around the blocks. Light blocks that follow each other (audience, prices, questions) share one gap:
   the next block's top; a block whose neighbour has another background keeps the same air at its bottom too.
   The referral block starts with a dividing line: the gap is split in half above and below it.
   The second block ends right before the edge-to-edge photo: below its last button only --body-gap */
.mess,#everyday,#money,#questions,#download{padding-top:var(--sec)!important;padding-bottom:var(--sec)!important}
.how-v13{padding-top:var(--sec)!important;padding-bottom:var(--body-gap)!important}
#audience{padding-top:var(--sec)!important;padding-bottom:0!important}
#pricing{padding-top:var(--sec)!important;padding-bottom:calc(var(--sec) / 2)!important}
.referral-v10{padding-top:calc(var(--sec) / 2)!important;padding-bottom:0!important}

/* the text (or the heading) -> the block's content */
.how-v13 .how-tabs{margin-top:var(--body-gap)}
#everyday .flow-rows,#audience .audience-grid,#pricing .pricing-grid{margin-top:var(--body-gap)!important}
#download .closing-content>h2+p:not(.eyebrow){margin-bottom:0!important}
#download .store-links{margin-top:var(--body-gap)}
/* up to 600 px the questions stand under the intro (one column of the grid) */
@media(max-width:600px){#questions .faq-layout{row-gap:var(--body-gap)}}

/* no small captions over the block headings (the owner, 27.10.2026): «Есть вопросы?» moved into the heading itself */
#questions h2 span{color:#3F6B57}