/* Lead form (see _tools/leadform_lib.py). It reads each site's own CSS variables, so it takes on that site's look:
   generated sites (--navy/--gold/--card or --rail/--accent) and the older sister sites (--brand/--btn-bg/--paper). The submit button uses the site's own button classes. */
.lf-box, .lf-thanks, form.lf-full {
  --lf-ink: var(--ink, #1c2733);
  --lf-muted: var(--muted, #566272);
  --lf-line: var(--line, #cdd5de);
  --lf-bg: var(--card, var(--paper, #fff));
  --lf-soft: var(--soft, var(--bg-alt, #f4f6f8));
  --lf-head: var(--brand, var(--navy, var(--rail, #10294a)));
  --lf-accent: var(--accent, var(--gold, var(--brand-2, #2563eb)));
  --lf-radius: var(--r-card, var(--radius, 10px));
  --lf-radius-sm: var(--r-sm, 8px);
  --lf-font: var(--font-body, var(--sans, system-ui, "Segoe UI", Arial, sans-serif));
  --lf-font-head: var(--font-head, var(--serif, var(--font-body, var(--sans, Georgia, serif))));
  --lf-bad: #9b1c1c;
  --lf-bad-bg: #fdecec;
  font-family: var(--lf-font);
  color: var(--lf-ink);
}
.lf-box { margin: 2.2rem 0 1rem; padding: 22px 24px; background: var(--lf-bg); border: 1px solid var(--lf-line); border-top: 4px solid var(--lf-accent); border-radius: var(--lf-radius); font-size: 1rem; line-height: 1.5; }
.lf-box.lf-callback { margin: 0; max-width: 720px; }
.lf-title { margin: 0 0 .35em; font-family: var(--lf-font-head); color: var(--lf-head); line-height: 1.2; font-size: 1.35rem; }
.lf-box .lf-title, .prose .lf-box .lf-title, .doc-body .lf-box .lf-title { margin-top: 0; padding-top: 0; border: 0; }   /* article styles add a rule above h2 */
.lf-lead { margin: 0 0 1em; color: var(--lf-muted); }
.lf-box label, .lf-box input, .lf-box select, .lf-box textarea, .lf-box p { max-width: none; }
form.lf { display: grid; gap: 14px; margin: 0; }
form.lf-full { padding: 22px 24px; background: var(--lf-bg); border: 1px solid var(--lf-line); border-radius: var(--lf-radius); font-size: 1rem; line-height: 1.5; }
.lf-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.lf-field { min-width: 0; }
.lf-field label { display: block; margin: 0 0 4px; font-weight: 700; font-size: .95rem; color: var(--lf-ink); }
.lf-req, .lf-opt { font-weight: 400; color: var(--lf-muted); font-size: .85rem; }
.lf input[type=text], .lf input[type=email], .lf input[type=tel], .lf select, .lf textarea {
  display: block; width: 100%; padding: .65em .8em; font: inherit; color: var(--lf-ink); background: #fff;
  border: 1.5px solid #8c97a5; border-radius: var(--lf-radius-sm); box-sizing: border-box; min-height: 44px; }
.lf textarea { min-height: 7.5em; resize: vertical; }
.lf input:focus, .lf select:focus, .lf textarea:focus { outline: 3px solid var(--lf-accent); outline-offset: 1px; border-color: var(--lf-head); }
.lf [aria-invalid=true] { border-color: var(--lf-bad); background: var(--lf-bad-bg); }
.lf-help { margin: -4px 0 0; font-size: .9rem; color: var(--lf-muted); }
.lf-note { margin: 0; padding: 10px 14px; font-size: .92rem; background: var(--lf-soft); border-left: 4px solid var(--lf-accent); border-radius: var(--lf-radius-sm); }
.lf-consent { display: flex; gap: 10px; align-items: flex-start; font-size: .93rem; color: var(--lf-ink); }
.lf-consent input { flex: none; width: 22px; height: 22px; margin: 2px 0 0; accent-color: var(--lf-head); }
.lf-errors { margin: 0; padding: 10px 14px; background: var(--lf-bad-bg); color: var(--lf-bad); border: 1px solid var(--lf-bad); border-radius: var(--lf-radius-sm); font-weight: 600; font-size: .95rem; }
.lf-errors[hidden] { display: none; }
.lf-errors ul { margin: 0; padding-left: 1.2em; }
.lf-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
.lf-btn { display: inline-flex; align-items: center; justify-content: center; padding: .7em 1.4em; border: 2px solid transparent; border-radius: var(--r-btn, var(--lf-radius-sm)); background: var(--brand, var(--lf-head)); color: #fff; line-height: 1.2; text-decoration: none; }   /* the older sister sites: their main colour */
.lf-btn:hover { background: var(--brand-2, var(--lf-accent)); }
.lf-actions button { cursor: pointer; font: inherit; font-weight: 700; margin: 0; min-height: 44px; }
.lf-actions button[disabled] { opacity: .6; cursor: wait; }
.lf-after { font-size: .9rem; color: var(--lf-muted); }
.lf-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.lf-thanks { max-width: 720px; }
.lf-thanks .lf-lead { font-size: 1.15rem; color: var(--lf-ink); }
@media (max-width: 640px) {
  .lf-row { grid-template-columns: 1fr; }
  .lf-box, form.lf-full { padding: 18px 16px; }
  .lf-actions button { width: 100%; }
}
@media (prefers-reduced-motion: no-preference) { .lf input, .lf select, .lf textarea { transition: border-color .15s; } }
