/* A compact phone-only contact section. Retain the existing typefaces,
   palette, Instagram destination and email form behavior. */
@media (max-width: 760px) {
  #contact { padding-block: 28px 32px; }
  #contact .contact-grid { gap: 14px; }
  #contact .contact-intro > .eyebrow { margin-bottom: 8px; }
  #contact #contact-title {
    font-size: clamp(1.5rem, 7.2vw, 2.125rem);
    white-space: nowrap;
  }
  #contact .desktop-contact-title,
  #contact .desktop-contact-intro { display: none; }
  #contact .mobile-contact-title,
  #contact .mobile-contact-intro { display: block; }
  #contact .contact-intro .heading-rule { display: none; }
  #contact .contact-intro > p:not(.eyebrow) {
    margin-top: 8px;
    font-size: 1rem;
    line-height: 1.5;
    max-width: none;
  }

  #contact .contact-card { padding: 16px; }
  #contact .contact-label,
  #contact .contact-panel > h3,
  #contact .contact-panel > p { display: none; }
  #contact .contact-instagram-option > h4 { margin-top: 0; }
  #contact .instagram-button {
    min-height: 46px;
    padding: 10px 12px;
    font-size: 1rem;
  }
  #contact .contact-email-option { margin-top: 14px; padding-top: 14px; }
  #contact .contact-email-option > h4 {
    font-size: 1.25rem;
    margin-bottom: 8px;
  }

  #contact #contact-form { gap: 6px; }
  #contact #contact-form > label {
    font-size: 1rem;
    line-height: 1.4;
    margin-top: 4px;
  }
  #contact #contact-form > label:first-child { margin-top: 0; }
  #contact #contact-form > input:not([type="hidden"]),
  #contact #contact-form > textarea {
    font-size: 1rem;
    line-height: 1.5;
    padding: 10px 12px;
  }
  #contact #contact-form > input:not([type="hidden"]) { min-height: 46px; }
  #contact #contact-form > textarea { height: 112px; min-height: 112px; }
  #contact #contact-submit {
    margin-top: 4px;
    min-height: 46px;
    padding: 10px 12px;
    font-size: 1rem;
  }
}