feat(forms): add local Form A presentation preview

www/integrations/jotform/README.md

@@ -0,0 +1,46 @@
+# AIA Form A Jotform styling and conditional-button guide
+
+This directory contains the nonproduction visual handoff for the new AIA Form A. [`aia-form-a.css`](./aia-form-a.css) is intended for Jotform Classic Forms' **Form Designer → Styles → Inject Custom CSS** after the form is created and its settings are approved.
+
+The CSS translates the existing AIA form treatment: Rubik typography, blue labels and text, `#fcf9f5` inputs with `#edeef3` borders, the `#ffbd59` filled button, the `#ff914d` hover/focus border, four-pixel corners, visible validation errors, and strong keyboard focus. The Astro page supplies the heading, introduction, privacy-policy link, and surrounding card. The stylesheet therefore removes the Jotform surface rather than adding another header, footer, or nested card.
+
+The selectors target Jotform Classic Forms identifiers such as `#form`, `.form-all`, `.form-line`, `.form-label`, `.form-sub-label`, `.form-required`, `.form-textbox`, `.form-dropdown`, `.form-textarea`, `.form-error-message`, and `.form-submit-button`. Jotform's final generated DOM must be checked in the account before relying on pixel-level parity. The stylesheet does not hide required indicators, error messages, honeypots, or focus outlines, and it does not request fonts or other external assets.
+
+## Installation and comparison
+
+1. Create or open the approved blank Form A in AIA's HIPAA-enabled Jotform account.
+2. Keep the form disabled while field, PHI, notification, conditional-logic, and language review is pending.
+3. Paste the contents of `aia-form-a.css` into Jotform's custom CSS area.
+4. Compare the Jotform preview with the Astro Form A mock at 390px and 1440px. Check the form surface, label rhythm, input height, button fill, outlined hover/focus state, error state, and mobile reflow.
+5. Check both English and Spanish configurations. Confirm translated labels, required indicators, validation messages, confirmation copy, and the accessible iframe title supplied by the parent Astro integration.
+6. Test the form in a real embedded iframe and on the direct hosted-form fallback. Confirm the iframe has a practical mobile height, does not create horizontal overflow, and does not trap keyboard focus.
+
+The current Astro meeting preview remains `off` by default and can only be shown in a non-indexing mock build. It does not load Jotform and is not a live submission test.
+
+## Form context and button labels
+
+The current Form A design uses a hidden `formContext` value with fixed, approved values such as `contact` and `landing`. Jotform does not provide a native conditional rule that changes one Submit button's accessible label safely in every context. If owner-approved context-specific labels are required, use multiple native Jotform Submit buttons and Jotform's conditional visibility rules:
+
+- Add one native Submit button for each approved context/language label.
+- Show exactly one intended Submit button for the current, validated `formContext`.
+- Keep every button a real Jotform Submit control; do not use CSS `::before`/`::after` text as a label.
+- Verify that every visible variant submits through the same approved form and preserves the honeypot and validation behavior.
+- Make the no-context and invalid-context states fail closed: no ambiguous extra button and no unintended submission path.
+- Verify keyboard order, focus visibility, screen-reader names, English/Spanish labels, and mobile layout for every variant.
+
+The four campaign pages remain mapped to Form B in the production architecture. Their current Form A mock override is temporary meeting-preview behavior only. Do not add an external Astro button that attempts to submit a cross-origin iframe.
+
+## Verification checklist
+
+- [ ] Form A is disabled while configuration is reviewed.
+- [ ] Exact question types, required flags, choices, conditional logic, and `formContext` values are approved.
+- [ ] English and Spanish labels, validation, confirmation, and button variants are reviewed by fluent-language owners.
+- [ ] The hidden honeypot remains present, effective, and excluded from user-facing visual changes.
+- [ ] Exactly one native Submit button is visible for every valid context.
+- [ ] Invalid or missing context does not expose an unintended submission path.
+- [ ] No PHI-bearing answer, PDF, recipient, redirect, webhook, or HTTP POST forwarding is inherited without privacy/security approval.
+- [ ] The iframe title, loading/error state, keyboard behavior, and mobile height are accepted.
+- [ ] Synthetic testing uses only approved synthetic values and a separately authorized test form.
+- [ ] No Jotform, Contabo, analytics, advertising, or production API request is made by off/mock builds.
+
+JF-01 through JF-09, privacy/security review, operations approval, fluent-language review, and production activation remain pending. This guide does not authorize Jotform account changes or live integration.

www/integrations/jotform/aia-form-a.css

@@ -0,0 +1,192 @@
+/*
+ * AIA Form A — Jotform Classic Forms custom CSS
+ *
+ * Paste into Jotform Form Designer > Styles > Inject Custom CSS after
+ * creating the approved Form A. These selectors are scoped to Jotform's
+ * Classic Forms structure and do not replace Jotform validation or controls.
+ * Validate the final generated form DOM before activation; no account access
+ * or pixel-perfect Jotform comparison was performed for this artifact.
+ */
+
+/* The Astro page supplies the surrounding heading, copy, privacy link and
+   card. Keep the iframe's own surface quiet so it does not create a second
+   card inside the page's existing form container. */
+#form,
+#form .form-all {
+  background: #fff;
+  border: 0;
+  box-shadow: none;
+  color: #254080;
+  font-family: Rubik, Arial, sans-serif;
+  max-width: 100%;
+}
+
+#form .form-all {
+  margin: 0;
+  padding: 0;
+}
+
+#form .form-line {
+  background: transparent;
+  border: 0;
+  margin: 0;
+  padding: 0 0 1rem;
+}
+
+#form .form-label,
+#form .form-label-left,
+#form .form-label-right,
+#form .form-label-top {
+  color: #254080;
+  font-size: .9rem;
+  font-weight: 700;
+  line-height: 1.5;
+  margin: 0 0 .4rem;
+  padding: 0;
+}
+
+#form .form-sub-label {
+  color: #254080;
+  font-size: .78rem;
+  line-height: 1.5;
+}
+
+#form .form-required {
+  color: #a21c28;
+  margin-left: .2rem;
+}
+
+#form input.form-textbox,
+#form input.form-textbox.form-phone,
+#form input.form-textbox.form-email,
+#form select.form-dropdown,
+#form textarea.form-textarea {
+  background: #fcf9f5;
+  border: 1px solid #edeef3;
+  border-radius: 4px;
+  box-sizing: border-box;
+  color: #254080;
+  font: inherit;
+  line-height: 1.5;
+  min-height: 2.9rem;
+  padding: .7rem .8rem;
+  width: 100%;
+}
+
+#form textarea.form-textarea {
+  min-height: 7rem;
+  resize: vertical;
+}
+
+#form input.form-textbox:focus-visible,
+#form select.form-dropdown:focus-visible,
+#form textarea.form-textarea:focus-visible,
+#form input[type='radio']:focus-visible + label,
+#form input[type='checkbox']:focus-visible + label,
+#form .form-submit-button:focus-visible {
+  outline: 3px solid #115bbd;
+  outline-offset: 3px;
+}
+
+#form .form-line.form-line-error input.form-textbox,
+#form .form-line.form-line-error select.form-dropdown,
+#form .form-line.form-line-error textarea.form-textarea {
+  border-color: #a21c28;
+  outline: 2px solid #a21c28;
+  outline-offset: 1px;
+}
+
+#form .form-error-message,
+#form .form-line-error .form-error-message {
+  color: #a21c28;
+  font-size: .85rem;
+  font-weight: 700;
+  line-height: 1.5;
+  margin: .45rem 0 0;
+}
+
+#form .form-radio-item,
+#form .form-checkbox-item {
+  color: #254080;
+  line-height: 1.5;
+  margin: 0 1rem .5rem 0;
+}
+
+#form .form-radio,
+#form .form-checkbox {
+  accent-color: #254080;
+}
+
+#form .form-buttons-wrapper {
+  background: transparent;
+  border: 0;
+  margin: .25rem 0 0;
+  padding: 0;
+  text-align: left;
+}
+
+#form .form-submit-button,
+#form button[type='submit'] {
+  background: #ffbd59;
+  border: 2px solid #ffbd59;
+  border-radius: 4px;
+  box-shadow: none;
+  color: #254080;
+  cursor: pointer;
+  font: inherit;
+  font-weight: 400;
+  line-height: 1.5;
+  min-height: 3rem;
+  padding: .65rem 1.2rem;
+  transition: .3s linear all;
+  width: 100%;
+}
+
+#form .form-submit-button:hover,
+#form .form-submit-button:focus-visible,
+#form button[type='submit']:hover,
+#form button[type='submit']:focus-visible {
+  background: transparent;
+  border-color: #ff914d;
+  color: #254080;
+}
+
+#form .form-submit-button:disabled,
+#form button[type='submit']:disabled {
+  cursor: not-allowed;
+  opacity: .65;
+}
+
+/* Jotform error and required content must remain visible. Do not hide these
+   classes in a campaign-specific override. */
+#form .form-validation-error,
+#form .form-required,
+#form .form-error-message {
+  visibility: visible;
+}
+
+@media (max-width: 640px) {
+  #form .form-line,
+  #form .form-label,
+  #form .form-label-left,
+  #form .form-label-right,
+  #form .form-label-top {
+    width: 100%;
+  }
+
+  #form .form-all {
+    width: 100%;
+  }
+
+  #form .form-submit-button,
+  #form button[type='submit'] {
+    min-height: 3rem;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  #form .form-submit-button,
+  #form button[type='submit'] {
+    transition: none;
+  }
+}