/* Layout for the three-field capture that closes each interactive experience.
 *
 * Deliberately only layout. The six experiences share one palette but each declares it
 * locally (--cream, --line, --amber, --aloe), and each already styles `.capture input`
 * as a pill in its own colours — so the name and company fields inherit the right look
 * for free. Re-declaring colours here would give six pages a seventh opinion about them
 * and drift the moment one page's palette is touched.
 *
 * The intended shape, inside the existing max-440px capture block:
 *
 *   [ Your name ] [ Company ]
 *   [ Work email             ]
 *   [        Send it         ]
 *
 * Name and company at 150px basis sit side by side and wrap to their own lines on a
 * narrow phone; email and the button always take a full row.
 */

.capture { align-items: stretch; }
.capture .ea-half { flex: 1 1 150px; }
.capture input[type=email] { flex: 1 1 100%; }
.capture .btn { flex: 1 1 100%; }

/* The honeypot. Never shown, never focusable, never announced — anything that fills it
 * in is not a person, and the server discards the submission while answering exactly as
 * it would a real one. Positioned off-canvas rather than display:none because some
 * automated clients skip inputs that are not rendered at all. */
.ea-hp {
    position: absolute !important;
    left: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Validation messages. Amber rather than red: every one of these pages uses amber as its
 * attention colour, and red belongs to nothing in this palette. min-height holds the line
 * open so the button does not jump when a message appears. */
.ea-err {
    margin-top: 10px;
    color: var(--amber, #e6a23c);
    font-size: .85rem;
    font-weight: 600;
    line-height: 1.4;
    min-height: 1.4em;
    text-align: inherit;
}

.capture input[aria-invalid="true"] { border-color: var(--amber, #e6a23c) !important; }

/* What replaces the form once it has been submitted.
 *
 * The pack is handed over here rather than only by email, because three test sends on
 * 3 Sep 2026 went to Outlook's junk folder with flawless authentication from two domains on
 * two IP pools. Somebody who just gave a work email should not be waiting on a spam filter to
 * find out whether the promise was true.
 *
 * Reuses each page's own .btn so it inherits that experience's palette; only the bits an
 * anchor needs and a button does not are set here. */
.ea-delivered {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 18px;
}
.ea-delivered .btn {
    display: inline-block;
    text-decoration: none;
    text-align: center;
}

/* The Workplace Support Experience builds its capture inside a modal with its own field
   styling, so it borrows only the honeypot rule — the trap has to be genuinely unreachable
   wherever it appears, not merely offscreen in one layout. */
.ea-hp,
#saveHp {
    position: absolute !important;
    left: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
}