.contact-layout {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  gap: clamp(36px, 7vw, 100px);
  padding-block: clamp(42px, 6vw, 85px);
  align-items: start;
}
.contact-intro h1 { font-size: clamp(45px, 5.5vw, 75px); margin-bottom: 18px; }
.contact-intro > p { max-width: 38ch; color: var(--muted); }
.contact-animal { margin: 28px 0 0; }
.contact-animal img { display: block; width: 100%; height: auto; border-radius: 8px; }
.contact-animal figcaption { margin-top: 9px; color: var(--muted); font-size: 13px; }
.contact-panel {
  min-width: 0;
  padding: clamp(20px, 3.2vw, 40px);
  background: #10291d;
  border: 1px solid var(--line);
  border-radius: 8px;
}
.contact-panel form > label, .contact-panel #contact-email-field label {
  display: block; margin: 16px 0 5px; font-weight: bold;
}
.contact-panel form > label:first-child { margin-top: 0; }
.contact-panel input, .contact-panel textarea {
  display: block; width: 100%; padding: 10px 12px; border: 1px solid #6b806e;
  background: var(--deep); border-radius: 4px; font: inherit; font-size: 16px; color: var(--cream);
}
.contact-panel textarea { resize: vertical; min-height: 112px; }
.contact-panel input:focus-visible, .contact-panel textarea:focus-visible { outline: 2px solid var(--copper); outline-offset: 2px; }
.contact-panel .button { border: none; }
.contact-panel .button:disabled { opacity: .65; }
.contact-panel a:not(.button), .contact-copy { text-decoration: underline; text-underline-offset: 3px; color: #f3bb83; }
.contact-privacy, .contact-address, .contact-status { color: var(--muted); font-size: 14px; }
.contact-privacy { margin: 12px 0 18px; }
.contact-address { margin: 18px 0 0; }
.contact-panel .contact-error { color: #ffd2a7; margin: 10px 0; }
.contact-panel .contact-error:empty, .contact-status:empty { display: none; }
.contact-alternative { display: flex; gap: 5px 22px; flex-wrap: wrap; align-items: center; margin-top: 18px; }
.contact-alternative a, .contact-copy { min-height: 44px; display: inline-flex; align-items: center; }
.contact-copy { border: 0; padding: 0; background: none; font: inherit; }
.contact-status { margin: 8px 0; }
.contact-panel [hidden], .contact-intro [hidden] { display: none; }
.contact-trap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
#contact-done h2 { font-size: clamp(28px, 3vw, 40px); margin-bottom: 12px; }
.contact-footer { border-top: 1px solid var(--line); padding-block: 20px 34px; }
.contact-footer nav { display: flex; gap: 10px 22px; flex-wrap: wrap; font-size: 14px; color: var(--muted); }
@media (max-width: 760px) {
  .contact-layout { grid-template-columns: 1fr; gap: 24px; }
  .contact-intro > p { max-width: none; }
  .contact-animal { display: flex; gap: 13px; align-items: center; margin-top: 14px; }
  .contact-animal img { width: 94px; flex: none; }
  .contact-animal figcaption { margin: 0; }
}