/* Reuse the site's existing layout, typography, and button treatments. */
.contact-page {
  --contact-column-min: 320px;
  --contact-panel-width: 620px;
  --contact-line-width: 1px;
  --contact-border: #8294a3;
  --contact-line-height: 1.6;
  --contact-heading-line-height: 1.06;
  --contact-heading-tracking: -0.018em;
  --contact-weight: 600;
  --contact-full-width: 100%;
  --contact-zero: 0;

  background: var(--pilot-ground);
  padding: var(--space-9) var(--gutter);
}
.contact-layout {
  display: grid;
  grid-template-columns: repeat(
      auto-fit,
      minmax(min(var(--contact-column-min), var(--contact-full-width)), 1fr)
    );
  gap: var(--space-9);
  max-width: var(--container);
  margin: var(--contact-zero) auto;
  align-items: start;
}
.contact-page--inline {
  padding: var(--contact-zero);
}
.contact-intro h1 {
  font-size: var(--title-page);
  font-weight: var(--contact-weight);
  line-height: var(--contact-heading-line-height);
  letter-spacing: var(--contact-heading-tracking);
  margin: var(--contact-zero) var(--contact-zero) var(--space-6);
}
.contact-intro .body-copy {
  max-width: var(--measure-standfirst);
}
.contact-booking-column {
  width: var(--contact-full-width);
  max-width: var(--contact-panel-width);
  min-width: var(--contact-zero);
}
.contact-panel {
  background: var(--surface);
  border: var(--contact-line-width) solid var(--contact-border);
  border-radius: var(--radius);
  padding: var(--space-7);
  min-width: var(--contact-zero);
}
.contact-panel-title {
  color: var(--ink);
  font-size: var(--title-card);
  font-weight: var(--contact-weight);
  line-height: var(--contact-line-height);
  letter-spacing: var(--contact-heading-tracking);
  margin: var(--contact-zero) var(--contact-zero) var(--space-2);
}
.contact-panel-copy {
  color: var(--muted);
  font-size: var(--text-body);
  line-height: var(--contact-line-height);
  margin: var(--contact-zero) var(--contact-zero) var(--space-6);
}
.contact-booking {
  max-width: var(--contact-full-width);
  white-space: normal;
}
.contact-email,
.contact-notice {
  color: var(--muted);
  line-height: var(--contact-line-height);
  overflow-wrap: anywhere;
}
.contact-notice {
  font-size: var(--text-fine);
  margin: var(--space-2) var(--contact-zero) var(--contact-zero);
}
.contact-email {
  font-size: var(--text-small);
  margin: var(--space-6) var(--contact-zero) var(--contact-zero);
}
@media (max-width: 860px) {
  .contact-layout {
    grid-template-columns: minmax(var(--contact-zero), 1fr);
    gap: var(--space-7);
  }
  .contact-page:not(.contact-page--inline) {
    padding-top: var(--space-8);
  }
  .contact-booking-column {
    max-width: none;
  }
  .contact-panel {
    padding: var(--space-6);
  }
}
