/**
 * Section: Form
 *
 * Small on purpose. Almost everything this section draws is already global and
 * is NOT re-declared here:
 *
 *   .pasia-form-card .pasia-form-* .recipient                components.css
 *   .field .input .select .textarea .form-row .checkline    components.css
 *   .field.invalid .field .err .hint .req                   components.css
 *   .alert, .alert-danger, .alert-success, .note            components.css
 *   .btn, .eyebrow, .container, .section                    tokens.css
 *   .head, .head.center, .head h2 em, .section.tint         base.css
 *   .reveal                                                 base.css
 *
 * The card and the form's own rules are shared with single-vacancy.php, which
 * renders no section stack at all, so they cannot live here: a section
 * stylesheet is only enqueued on pages whose stack contains that section, and
 * that template's stack is empty. components.css §THE FORM CARD owns them.
 * What IS here is the width column, which components.css explicitly hands back.
 *
 * Ported from _mockups/contact.html `.ct-form-wrap` (the column) and
 * _mockups/book-consultation.html `--container-form` (the measure). Tokens
 * only. No hex, no rgb(), no pixel type size.
 *
 * CONTRAST, measured numerically and as composited rather than eyeballed. The
 * band is --paper and the card is --paper, so everything is on white:
 *
 *   --ink       #14231f  on --paper      16.28:1  field labels, typed text
 *   --ink-soft  #45524d  on --paper       8.18:1  consent line, recipient line
 *   --ink-faint #5f6b66  on --paper       5.55:1  .hint, the required note
 *   --danger    #b23b2e  on --paper       5.90:1  the required asterisk, .err
 *   --pine      #16564b  on --paper       8.51:1  the privacy policy link
 *   --danger-ink         on --danger-bg   7.60:1  the error summary
 *   --success-ink        on --success-bg  8.00:1  the confirmation
 *   --gold-deep #7e622e  on --paper       5.72:1  eyebrow, heading <em>
 *
 * All clear AA for normal text.
 *
 * TWO NON-TEXT MEASUREMENTS THAT DO NOT CLEAR 1.4.11's 3:1, BOTH IN
 * components.css AND THEREFORE NOT THIS FILE'S TO FIX. Recorded here because
 * this is where they were first measured, and reported upward:
 *   --input-border (--line) against --paper                        1.32:1
 *   .input:focus, --gold border against --paper                    2.56:1
 * `.input:focus { outline: none }` in components.css also replaces the global
 * `:focus-visible` outline with that weaker treatment. Now that the form is
 * live and focusable on three pages, that rule is worth revisiting there.
 */

/* ---------------------------------------------------------------------------
 * The width column
 * ---------------------------------------------------------------------------
 * contact.html puts this inside `.container` and book-consultation.html beside
 * it with its own gutter. Inside wins: one gutter, one measure, and the head
 * above stays optically centred over the card at every width.
 * ------------------------------------------------------------------------ */
.form-panel-col {
  max-width: var(--container-form);
  margin-inline: auto;
}

/* A long unbroken string anywhere in this section must not widen the page.
   Measured at 320 before this rule existed: a 57-character heading ran 706px
   past its container. `anywhere` rather than `break-word`, because only
   `anywhere` is taken into account when the min-content size is computed. */
.form-panel {
  overflow-wrap: anywhere;
}