/* Contact page. Uses the site's own tokens only: navy (--blue), the orange
   accent (--accent, via .btn-accent from site.css) and the shared type scale. */

/* One centred column shared by the heading, the intro and the form, so the
   three line up instead of the heading sitting in the wider page measure. */
.ct-col{ max-width: 496px; margin-left: auto; margin-right: auto; }.ct-wrap{ padding-bottom: 76.8px; }.page-head .ct-col h1{ max-width: none; }.ct-intro{
  margin: 0 0 25.6px;
  font-size: 13.6px;
  line-height: 1.6;
  color: var(--muted);
}.ct-form{ display: grid; gap: 17.6px; }.ct-field{ display: grid; gap: 5.6px; }.ct-field label{
  font-size: 11.6px;
  font-weight: 600;
  color: var(--ink);
}.ct-field input,
.ct-field select,
.ct-field textarea{
  width: 100%;
  min-height: 41.6px;
  padding: 10.4px 12.8px;
  border: 1px solid var(--line);
  border-radius: var(--r-s);
  background: var(--paper);
  color: var(--ink);
  font: inherit;
  font-size: 12.8px;            /* 12.8px keeps iOS from zooming on focus */
  line-height: 1.45;
}.ct-field textarea{ min-height: 128px; resize: vertical; }.ct-field select{
  appearance: none;
  padding-right: 35.2px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%23595F66' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12.8px center;
}.ct-field input:hover,
.ct-field select:hover,
.ct-field textarea:hover{ border-color: #CFCCC3; }.ct-field input:focus-visible,
.ct-field select:focus-visible,
.ct-field textarea:focus-visible{
  outline: 2px solid var(--blue);
  outline-offset: 1px;
  border-color: var(--blue);
}/* Invalid state is driven by the script, never by :invalid, so a field is
   only marked after the user has actually tried to submit it. */
.ct-field[data-invalid] input,
.ct-field[data-invalid] select,
.ct-field[data-invalid] textarea{ border-color: var(--accent); }.ct-err{
  margin: 0;
  font-size: 10.8px;
  line-height: 1.4;
  color: var(--accent-ink);
}.ct-actions{ margin-top: 2px; }.ct-submit{ width: 100%; }.ct-arrow{ font-size: 14.4px; line-height: 1; }.ct-submit[disabled]{ opacity: .6; cursor: default; }.ct-submit[disabled]:hover{ background: var(--accent); }.ct-status{
  margin: 0;
  padding: 11.2px 12.8px;
  border-radius: var(--r-s);
  font-size: 12px;
  line-height: 1.5;
}.ct-status[data-state="ok"]{ background: #EAF2EC; color: #1F5133; }.ct-status[data-state="bad"]{ background: var(--accent-soft); color: var(--accent-ink); }@media (min-width: 640px){.ct-submit{ width: auto; min-width: 176px; }
}@media (prefers-reduced-motion: no-preference){.ct-field input, .ct-field select, .ct-field textarea{ transition: border-color .15s; }
}