/* Home — phone: every section fills exactly one screen, on any phone height.
 * 100svh = the visible height with the browser bars showing, so nothing is hidden and it doesn't jump on scroll.
 * Top padding clears the fixed navbar; one element per section absorbs the spare height and keeps its
 * original margins as minimums, so short phones just scroll as before. Load after the other home-mobile sheets. */
@media (max-width: 767px) {
    body.home-bw-theme {
        --hm-nav: 52px;
        --hm-screen: 100vh;
    }
    @supports (height: 100svh) {
        body.home-bw-theme { --hm-screen: 100svh; }
    }

    /* Hero — card deck centred in the space between the Telegram card and the copy (design 1c) */
    .hcm { min-height: var(--hm-screen); padding-top: var(--hm-nav); }
    .hcm__stage { flex: 1 0 auto; align-items: center; }
    /* 20px between the buttons and the dock; the floating chat button docks into the row's end slot at load */
    body.home-bw-theme.home-v5 .hcm { padding-bottom: calc(var(--tb-total, 0px) + 20px); }
    body.home-v5 #lc-widget { bottom: calc(var(--tb-total, 0px) + 21px); --lc-offset: calc(var(--tb-total, 0px) + 109px); }
    body.home-v5 .scroll-top-btn { bottom: calc(var(--tb-total, 0px) + 91px); }

    /* Shared section frame — compact: no forced full-screen height */
    .hm {
        --hm-pad-top: clamp(24px, calc(var(--hm-screen) * .03), 36px);
        min-height: 0;
        padding-top: var(--hm-pad-top);
        padding-bottom: clamp(16px, calc(var(--hm-screen) * .03), 28px);
    }
    /* Corner coins keep their original offset from the content top instead of sliding under the navbar */
    .hmp__coin { top: calc(var(--hm-pad-top) - 18px); }

    /* Visuals below size themselves from the screen height (the constant = the rest of the section's
     * content), so each section fits one screen down to ~iPhone SE; below their floor they scroll. */


    /* Why — the rings shrink on short phones so title, rings, copy and dial fit one screen */
    .hmo { --hmo-s: clamp(200px, min(290px, calc(100vw - 100px), calc(var(--hm-screen) - 515px)), 290px); }

    /* How It Works — big number centred, step text + step cards anchored to the bottom */
    .hmh { display: flex; flex-direction: column; }
    .hmh__stage {
        --hmh-num: clamp(112px, min(47vw, calc(var(--hm-screen) - 515px)), 196px);
        flex: 1 0 auto; height: auto; min-height: calc(var(--hmh-num) * .98);
    }
    .hmh__num { font-size: var(--hmh-num); }
    .hmh__art { width: calc(var(--hmh-num) * .72); }

    /* Closing CTA banner */
    .home-cta-sec {
        min-height: 0;
        display: flex; flex-direction: column; justify-content: center;
        padding-top: 32px; padding-bottom: 32px;
    }
}
@media (min-width: 640px) and (max-width: 767px) {
    body.home-bw-theme { --hm-nav: 72px; }
}