/* Landing-only mobile hardening: keep hero copy and proof text inside the viewport. */
body.ch-landing-page,
body.ch-landing-page main,
body.ch-landing-page .ch-hero,
body.ch-landing-page .ch-hero__grid,
body.ch-landing-page .ch-hero__content {
    max-width: 100%;
    min-width: 0;
}

body.ch-landing-page {
    overflow-x: hidden;
}

/*
 * The hero artwork is composed with both people on the right. Let the visual
 * reach the viewport edge and anchor the crop there so the assistant is not
 * cut off on desktop or narrow screens.
 */
body.ch-landing-page .ch-hero__visual {
    width: calc(100% + max(24px, (100vw - 1180px) / 2));
}

body.ch-landing-page .ch-hero__visual > img {
    object-position: right center;
}

body.ch-landing-page .ch-hero h1,
body.ch-landing-page .ch-hero__content > p,
body.ch-landing-page .ch-eyebrow,
body.ch-landing-page .ch-text-link,
body.ch-landing-page .ch-proof-row,
body.ch-landing-page .ch-proof-row * {
    max-width: 100%;
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: normal;
}

body.ch-landing-page .ch-proof-row {
    flex-wrap: wrap;
}

body.ch-landing-page .ch-proof-row small {
    white-space: normal;
    line-height: 1.35;
}

@media (max-width: 900px) {
    body.ch-landing-page .ch-hero__content {
        width: 100%;
    }

    body.ch-landing-page .ch-hero__visual {
        width: auto;
    }
}

@media (max-width: 640px) {
    body.ch-landing-page .ch-hero h1 {
        font-size: clamp(29px, 8.1vw, 33px) !important;
        line-height: 1.2;
        letter-spacing: -1.35px;
    }

    body.ch-landing-page .ch-hero__content > p {
        font-size: 13px;
        line-height: 1.75;
    }

    body.ch-landing-page .ch-proof-row {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr) minmax(0, .9fr);
        gap: 12px;
        align-items: center;
    }

    body.ch-landing-page .ch-proof-divider {
        display: none;
    }

    body.ch-landing-page .ch-proof-row strong {
        font-size: 12px;
    }

    body.ch-landing-page .ch-proof-row small {
        font-size: 9px;
    }
}

@media (max-width: 420px) {
    body.ch-landing-page .ch-shell,
    body.ch-landing-page .ch-header__inner {
        width: calc(100% - 28px);
    }

    body.ch-landing-page .ch-hero h1 {
        font-size: clamp(28px, 7.6vw, 31px) !important;
        letter-spacing: -1.1px;
    }

    body.ch-landing-page .ch-button--large {
        width: 100%;
        max-width: 270px;
        padding-inline: 14px;
    }
}

/* ---------- footer legal links on phones ---------- */
/* The landing page does not load task-fixes.css, so it needs its own copy of
   this: app.css hides the whole bottom bar under 641px, and that bar holds the
   only links to the privacy policy and the terms of service. */
@media (max-width: 640px) {
    .ch-body .ch-footer__bottom {
        display: flex !important;
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
        padding: 18px 0;
    }

    .ch-body .ch-footer__bottom div {
        display: flex;
        gap: 16px;
    }
}
