/* ==========================================================================
   Contact Page Layout — split form/direct-contact, per Wireframe v4 §10.
   Mobile: direct contact block first (tap-to-call faster than typing).
   Desktop: form first (60/40-ish split), direct contact second.
   ========================================================================== */

.contact-grid {
  display: grid;
  gap: var(--space-6);
}

.contact-grid__direct { order: 1; }
.contact-grid__form { order: 2; }

@media (min-width: 900px) {
  .contact-grid { grid-template-columns: 1.3fr 1fr; }
  .contact-grid__form { order: 1; }
  .contact-grid__direct { order: 2; }
}

.contact-list { list-style: none; margin: var(--space-3) 0; padding: 0; }
.contact-list li { margin-bottom: var(--space-2); }
.contact-list a {
  display: inline-flex;
  align-items: center;
  min-height: var(--touch-target-min);
  font-weight: 500;
  color: var(--color-navy-900);
}
.contact-hours { color: var(--color-text-secondary); font-size: var(--fs-ui); }

.contact-form__promise {
  font-size: var(--fs-ui);
  color: var(--color-text-secondary);
  margin-bottom: var(--space-4);
}