/* Contact shares the site's typefaces, colour tokens, and full-width sections. */
.contact-body { background:var(--paper); color:var(--ink); }
.contact-body .site-header { position:sticky; top:0; }
.contact-page {
  --bs-gutter-x:0;
  padding:clamp(80px, 9vw, 144px) 4.2vw;
  min-height:calc(85svh - 78px);
  display:flex;
  align-items:center;
}
.contact-layout { --bs-gutter-x:0; --bs-gutter-y:64px; width:100%; max-width:1120px; margin-top:0; margin-inline:auto; align-items:start; }
.contact-layout > * { margin-top:0; min-width:0; }
.contact-intro h1 { margin:0 0 32px; font-size:clamp(56px, 5.5vw, 88px); line-height:1.05; font-weight:400; letter-spacing:-.04em; }
.contact-intro > p { max-width:24ch; margin:0; font-size:clamp(20px, 2vw, 26px); line-height:1.55; color:rgba(11,16,22,.68); }
.contact-details { padding-top:0; }
.contact-details h2 { margin:0 0 26px; font-family:var(--font-inter); font-size:14px; line-height:1.5; font-weight:400; letter-spacing:.1em; text-transform:uppercase; }
.contact-purpose { margin:28px 0 0; max-width:40ch; font-size:18px; line-height:1.65; }
.contact-note { margin:20px 0 0; max-width:48ch; font-size:16px; line-height:1.65; color:rgba(11,16,22,.68); }
.contact-intro > .contact-intro-note { margin-top:28px; font-size:18px; max-width:32ch; }
.contact-required { font-size:14px; color:rgba(11,16,22,.68); margin:0 0 28px; }
.contact-field label { display:block; font-size:14px; line-height:1.6; margin-bottom:10px; }
.contact-field label span { color:rgba(11,16,22,.62); }
.contact-field .form-control, .contact-field .form-select { min-height:50px; font:inherit; font-size:16px; border:1px solid rgba(11,16,22,.3); border-radius:0; background-color:transparent; color:var(--ink); padding:12px; }
.contact-field .form-select { padding-right:38px; }
.contact-field textarea { resize:vertical; min-height:170px; }
.contact-field .form-control:focus, .contact-field .form-select:focus { border-color:var(--ink); outline:2px solid var(--ink); outline-offset:2px; box-shadow:none; }
.contact-field [aria-invalid=true] { border-color:#8b342b; }
.contact-field .field-help, .contact-field .errorlist { margin:10px 0 0; font-size:14px; line-height:1.5; }
.contact-field .field-help { color:rgba(11,16,22,.68); }
.contact-field .errorlist { padding:0; list-style:none; color:#8b342b; }
.contact-submit { display:flex; justify-content:space-between; gap:48px; align-items:center; min-height:52px; margin-top:28px; padding:16px 24px; border:1px solid var(--ink); border-radius:0; background:var(--ink); color:var(--paper); font-size:16px; }
.contact-submit:hover { background:var(--ink-raised); }
.contact-submit:focus-visible { outline:2px solid var(--ink); outline-offset:4px; }
.contact-success, .contact-errors { padding:20px 0; margin-bottom:28px; border-block:1px solid var(--line); }
.contact-success h2, .contact-errors h2 { font-size:18px; text-transform:none; letter-spacing:0; margin-bottom:12px; }
.contact-success p, .contact-errors ul { font-size:16px; line-height:1.6; margin:0; }
.contact-errors { color:#8b342b; }
.contact-errors ul { padding-left:20px; }
.contact-trap { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.message-count { display:block; margin-top:8px; text-align:right; font-size:14px; color:rgba(11,16,22,.68); }
.contact-client-error { color:#8b342b; font-size:16px; line-height:1.6; }

@media (min-width:1400px) { .contact-page { padding-inline:5vw; } }
@media (min-width:992px) and (max-width:1199.98px) { .contact-page { padding-inline:32px; } }
@media (max-width:991.98px) {
  .contact-page { min-height:calc(85svh - 72px); padding:80px 32px; }
  .contact-details { margin-top:64px; padding-top:0; }
}
@media (max-width:767.98px) { .contact-page { padding:64px 24px 80px; } }
@media (max-width:575.98px) {
  .contact-page { padding-inline:18px; }
  .contact-intro h1 { font-size:clamp(52px, 13vw, 64px); margin-bottom:24px; }
  .contact-details { margin-top:52px; }
  .contact-details h2 { margin-bottom:20px; }
}