/* ─────────────────────────────────────────────────────────────
   Form-led page — acquisitions and careers
   ───────────────────────────────────────────────────────────── */

.jm-formpage {
    background: var(--bg-white);
    /* Clear of the fabric seam, which laps down over the top of this
       section by --seam-overlap. */
    padding: clamp(54px, 6.4vw, 92px) 0 clamp(48px, 6vw, 92px);
}

.jm-formpage__inner {
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(28px, 3.4vw, 48px);
    padding-inline: clamp(12px, 2.4vw, 28px);
}

/* The form takes the larger share: it is what the visitor came for, and the
   copy beside it only has to explain why the fields are being asked. */
@media (min-width: 920px) {
    .jm-formpage__inner {
        grid-template-columns: minmax(0, 0.78fr) minmax(0, 1fr);
        align-items: start;
        gap: clamp(36px, 4vw, 64px);
    }

    /* Sticks alongside a long form rather than scrolling away from it. */
    .jm-formpage__aside {
        position: sticky;
        top: calc(var(--header-height) + 34px);
    }
}

.jm-formpage__eyebrow { margin-bottom: 0; }

.jm-formpage__intro {
    margin: 0;
    max-width: 46ch;
    color: var(--text-secondary);
    font-size: var(--fs-small);
    line-height: 1.85;
}

.jm-formpage__alt {
    margin: clamp(22px, 2.6vw, 30px) 0 0;
    font-size: var(--fs-small);
    color: var(--text-light);
}

.jm-formpage__alt a {
    color: var(--primary);
    text-decoration: none;
    border-bottom: 1px solid rgba(64, 103, 118, 0.32);
}

@media (hover: hover) and (pointer: fine) {
    .jm-formpage__alt a:hover { border-bottom-color: var(--primary); }
}

.jm-formpage__form {
    padding: clamp(24px, 3.2vw, 44px);
}