/* ==========================================================================
   StoryStrong — polish.css
   Surgical UI/UX pass. ADDITIVE ONLY: layers on top of the compiled
   styles.css and changes no brand identity. Safe to delete with no side
   effects. Plain selectors only (no :is()/:where()) for broadest browser
   support. Scope kept intentionally small — real gaps only.
   ========================================================================== */

/* 1) Anchor offset ---------------------------------------------------------
   In-page links (#main, #fac-h, FAQ jumps) were scrolling their target under
   the fixed nav. scroll-padding on the scroll container lands them just below
   it; scroll-margin on named targets is the belt-and-suspenders backup.       */
html { scroll-padding-top: clamp(72px, 9vh, 104px); }
section[id],
main[id],
h2[id],
h3[id] { scroll-margin-top: clamp(72px, 9vh, 104px); }

/* 2) Form validation feedback ---------------------------------------------
   The Reserve / Scholarship forms are where ad spend converts. Native browser
   validation still gates submit; this just makes a missed required field
   obvious inline, in-brand (brick), instead of only a native bubble.
   forms.js toggles aria-invalid. Specificity (0,2,1) intentionally beats the
   base ".field input" rule (0,1,1).                                           */
[data-ss-form] input[aria-invalid="true"],
[data-ss-form] select[aria-invalid="true"],
[data-ss-form] textarea[aria-invalid="true"] {
  border-color: var(--brick, #8B2500);
  box-shadow: 0 0 0 3px rgba(139, 37, 0, .14);
}
/* Keep the invalid look while the field is focused — (0,3,1) beats
   ".field input:focus" (0,2,1) so the error color wins over the focus color. */
[data-ss-form] input[aria-invalid="true"]:focus,
[data-ss-form] select[aria-invalid="true"]:focus,
[data-ss-form] textarea[aria-invalid="true"]:focus {
  border-color: var(--brick, #8B2500);
  box-shadow: 0 0 0 3px rgba(139, 37, 0, .18);
  outline-color: var(--brick, #8B2500);
}

/* Optional inline hint slot, styled if present in markup. */
[data-ss-form] .field-error {
  color: var(--brick, #8B2500);
  font-size: .82rem;
  margin-top: .35rem;
}