.contact-page .contact-main {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  align-items: start;
  gap: clamp(40px, 7vw, 100px);
  padding-block: 76px 96px;
}
.contact-page .contact-intro h1 {
  max-width: 560px;
  font-size: clamp(2.5rem, 4.1vw, 3.8rem);
  line-height: 1.08;
  color: var(--blue);
}
.contact-page .contact-intro p {
  margin-top: 28px;
  max-width: 470px;
  font-size: 1.0625rem;
  line-height: 1.8;
}
.contact-page #contact-form { min-width: 0; }
.contact-page #required-instruction { margin-bottom: 32px; }
.contact-page .contact-details h2 {
  font-size: 1.625rem;
  letter-spacing: -.02em;
  line-height: 1.3;
  margin-bottom: 28px;
}
.contact-page .contact-field { margin-bottom: 28px; }
.contact-page .contact-field > label,
.contact-page .contact-choices legend {
  display: block;
  font-size: 1rem;
  font-weight: 550;
  line-height: 1.6;
  overflow-wrap: anywhere;
}
.contact-page .field-help {
  font-size: .9375rem;
  margin-top: 6px;
  line-height: 1.65;
}
.contact-page .contact-field input,
.contact-page textarea {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 52px;
  margin-top: 10px;
  padding: 12px 14px;
  border: 2px solid #8da4c3;
  border-radius: 3px;
  background: var(--light);
  color: var(--light-ink);
  color-scheme: light;
  font: inherit;
  line-height: 1.6;
}
.contact-page textarea { resize: vertical; }
.contact-page .contact-choices {
  min-width: 0;
  padding: 0;
  margin: 0 0 32px;
  border: 0;
}
.contact-page .contact-choices legend { padding: 0; }
.contact-page .contact-request { margin-top: 40px; }
.contact-page .choice-list { display: grid; gap: 10px; margin-top: 14px; }
.contact-page .choice {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid #6d84a5;
  border-radius: 3px;
  background: var(--deep);
  cursor: pointer;
  overflow-wrap: anywhere;
}
.contact-page .choice:hover { background: var(--panel); }
.contact-page .choice input {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  margin: 3px 0 0;
  accent-color: var(--blue);
}
.contact-page .choice span { min-width: 0; }
.contact-page .choice:has(input:checked) { border-color: var(--blue); background: #20395a; }
.contact-page .field-error { color: #ffd2c8; font-size: .9375rem; font-weight: 550; }
.contact-page .field-error:not(:empty) { margin-top: 10px; padding-left: 12px; border-left: 3px solid currentColor; }
.contact-page .contact-trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.contact-page .error-summary { margin-bottom: 32px; padding: 18px 20px; border: 2px solid #f2a897; border-radius: 3px; }
.contact-page .error-summary h2 { font-size: 1.25rem; }
.contact-page .error-summary ul { margin: 12px 0 0; padding-left: 24px; }
.contact-page .error-summary a { color: #ffd2c8; }
.contact-page .contact-field input[aria-invalid="true"] { border-color: #f2a897; }
.contact-page input:focus-visible,
.contact-page textarea:focus-visible,
.contact-page .local-preview:focus {
  outline: 3px solid var(--blue);
  outline-offset: 5px;
}
.contact-page :is(input, textarea, button, .local-preview) { scroll-margin-block: 150px 32px; }
.contact-page .contact-send { border-top: 1px solid var(--rule); padding-top: 28px; }
.contact-page .contact-send p { font-size: 1rem; line-height: 1.75; }
.contact-page #send-request { margin-top: 26px; font-size: 1rem; }
.contact-page .contact-send .local-preview {
  margin-top: 18px;
  padding: 14px 16px;
  border: 1px solid #6d84a5;
  border-radius: 3px;
  color: var(--text);
  background: var(--panel);
}
.contact-page .local-preview:focus { border-color: var(--blue); }
.contact-page .form-status:empty { display: none; }
.contact-page .form-status-error { border-color: #f2a897 !important; }
.contact-page .form-status-success { border-color: var(--blue) !important; }
.contact-page .request-reference { margin-top: 10px; font-size: .9375rem; }
.contact-page #send-request:disabled { opacity: .7; cursor: wait; }
.contact-page .contact-privacy { margin-top: 32px; padding-top: 28px; border-top: 1px solid var(--rule); }
.contact-page .contact-privacy p { font-size: .9375rem; line-height: 1.8; }
@media (max-width: 1000px) {
  .contact-page .contact-main { grid-template-columns: minmax(0, 1fr); gap: 42px; max-width: 740px; padding-block: 52px 72px; }
  .contact-page .contact-intro p { max-width: 640px; }
}
@media (max-width: 650px) {
  .contact-page .contact-main { gap: 36px; padding-block: 40px 56px; }
  .contact-page .contact-intro h1 { font-size: 2.5rem; }
  .contact-page .contact-intro p { margin-top: 22px; font-size: 1rem; }
  .contact-page .contact-details h2 { font-size: 1.5rem; }
  .contact-page :is(input, textarea, button, .local-preview) { scroll-margin-block: 28px; }
}