/* Light contact split: page heading + lede above a form panel beside a stack of info cards.
   The panel/field/card surfaces are the shared theme primitives; only the layout rhythm and the
   success callout are section-owned. */
.contact-split {
  display: block;
  background: rgba(var(--color-background));
  color: rgba(var(--color-text));
}
/* The source's compact page rhythm (56px, 40px on narrow screens) lives on the wrapper, so the
   keyed 900px container measures as the bare content box. */
.contact-split--pad-top { padding-top: 56px; }
.contact-split--pad-bottom { padding-bottom: 56px; }
.contact-split--pad-both { padding-block: 56px; }
@media (max-width: 560px) {
  .contact-split--pad-top { padding-top: 40px; }
  .contact-split--pad-bottom { padding-bottom: 40px; }
  .contact-split--pad-both { padding-block: 40px; }
}

.contact-split__lede { max-width: var(--contact-split-lede-width, 48ch); margin-top: var(--contact-split-lede-gap, 16px); }
.contact-split__split { margin-top: var(--contact-split-split-gap, 36px); gap: var(--contact-split-gap, 36px); }
.contact-split__panel { padding: var(--contact-split-panel-pad, 28px); }
.contact-split__form { gap: var(--contact-split-field-gap, 14px); }
.contact-split__cards { gap: var(--contact-split-card-gap, 14px); }

/* Success callout: the accent surface the source swaps in for the form. */
.contact-split__callout {
  background: var(--theme-accent); color: var(--theme-ink);
  border-radius: var(--radius); padding: 26px;
}
.contact-split__callout-title { font-size: 20px; }
.contact-split__callout-text { margin-top: 10px; line-height: 1.5; }

/* Info cards */
.contact-split__card-label { color: var(--theme-text-mono); margin-bottom: 8px; }
.contact-split__card-body { line-height: 1.6; color: rgba(var(--color-light-text)); text-wrap: pretty; white-space: pre-line; }
.contact-split__card-body--after-title { margin-top: 8px; }
.contact-split__card-btn { margin-top: var(--contact-split-card-btn-gap, 14px); }
.contact-split__card-links { gap: 8px; }

@media (max-width: 900px) {
  .contact-split__panel { padding: var(--contact-split-panel-pad-narrow, 22px); }
}