/* Contact page — imported from the Claude Design project "About Us and
   Contact Pages" (Contact.dc.html). Layout is inline-styled to match the
   approved design exactly; this file just covers link colors (scoped to
   this page only) and a couple of responsive breakpoints. */

body { background-color: #fff !important; }

.mm-contact-page a { color: #0d0d0d; }
.mm-contact-page a:hover { color: #55620f; }

/* Forces the sidebar (flex-basis 320px, max-width 420px) and form column
   (flex-basis 480px) to stay side by side down to the exact breakpoint
   below, instead of the browser's own flex-wrap kicking in early — that
   default behavior wraps the form column onto its own row while the
   sidebar stays put and grows to fill its row (capped at max-width), which
   is what left a blank gap next to it at in-between widths. */
.mm-contact-page { flex-wrap: nowrap; }

/* 320 + 480 = 800px combined flex-basis is the actual point content starts
   fighting for space — switching to a stacked column comfortably above
   that avoids ever hitting the broken in-between wrap state. */
@media screen and (max-width: 860px) {
  .mm-contact-page { flex-direction: column; }
  .mm-contact-page aside { max-width: 100% !important; }
}

@media screen and (max-width: 480px) {
  .mm-contact-page aside > div:last-child > div { flex-wrap: wrap; }
}