/* Contact page — layout on top of the shared site.css components.
   Desktop: Contact.dc.html | Mobile (<860px): Mobile - Contact.dc.html */

.sep-contact-content { background: #0A0A0A; }
.sep-contact-content__inner { padding: 28px 20px; display: flex; flex-wrap: wrap; gap: 16px; }

.sep-form-card { flex: 1 1 420px; min-width: 280px; padding: 24px; width: 100%; }
.sep-call-card { flex: 1 1 280px; min-width: 260px; display: flex; flex-direction: column; gap: 16px; width: 100%; }
.sep-call-card__box { padding: 24px; display: flex; flex-direction: column; align-items: flex-start; }
.sep-call-card__label { font: 600 11px/1 'Inter', sans-serif; letter-spacing: .16em; color: #9ea3a9; margin-top: 16px; }
.sep-call-card__number { font: 700 26px/1.2 'Oswald', sans-serif; letter-spacing: .02em; color: #fff; margin-top: 6px; }
.sep-call-card__blurb { margin: 14px 0 0; font: 400 14px/1.6 'Inter', sans-serif; color: #8d9298; }

@media (min-width: 860px) {
  .sep-contact-content__inner { max-width: 1000px; padding: clamp(36px, 4vw, 60px) 20px; gap: clamp(24px, 3vw, 40px); }
  .sep-form-card { padding: clamp(22px, 2.4vw, 32px); }
  .sep-call-card__box { padding: clamp(24px, 2.6vw, 32px); }
  .sep-call-card__number { font-size: 28px; }
}
