/* ============================================================================
   contact.css — the only page with a form on a light background.
   The shared .field styles in main.css are built for the dark quote card, so
   the light variant lives here rather than being duplicated (11_ACTIVE_RULES).
   ========================================================================= */

.nap {
  font-style: normal;
  font-size: 18px;
  line-height: 1.7;
  margin-bottom: 22px;
}
.nap b { font-family: "Fraunces", Georgia, serif; font-size: 21px; font-weight: 600; }

.nap-list { margin-bottom: 30px; }
.nap-list a { border-bottom: 1px solid var(--line); }
.nap-list a:hover { color: var(--brass-text); border-color: var(--brass); }

.map-contact { aspect-ratio: 16 / 9; }

/* ── Light form ───────────────────────────────────────────────────────────── */
.form-light .field label { color: var(--brass-text); }

/* --alert is tuned for the dark quote card (6.90:1 on ink). On this light
   panel it is only 2.16:1, so errors here use the darker step (4.84:1). */
.form-light .field .error,
.form-light .form-error { color: var(--alert-deep); }
.form-light .form-error {
  background: rgba(168, 66, 38, .08);
  border-color: rgba(168, 66, 38, .3);
}
.form-light .field .is-invalid { border-color: var(--alert-deep); }
.form-light .field input,
.form-light .field textarea,
.form-light .field select {
  background: var(--paper);
  border-color: var(--line);
  color: var(--txt);
}
.form-light .field input::placeholder,
.form-light .field textarea::placeholder { color: var(--txt-soft); }
.form-light .field input:focus,
.form-light .field textarea:focus,
.form-light .field select:focus {
  border-color: var(--brass);
  background: #fff;
}

.contact-form {
  background: var(--paper-2);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: 26px;
}
.contact-form .btn { margin-top: 8px; }

.contact-sent { text-align: center; }
.contact-sent .sent-lead {
  font-family: "Fraunces", Georgia, serif;
  font-size: 22px;
  line-height: 1.3;
  color: var(--txt);
  margin: 12px 0 10px;
}
.contact-sent p { color: var(--txt-soft); }

.micro-light {
  font-size: 13px;
  color: var(--txt-soft);
  text-align: center;
  margin-top: 14px;
}
.micro-light a { border-bottom: 1px solid var(--line); }
.micro-light a:hover { color: var(--brass-text); }