/* Comfortable tap targets on touch screens.
 *
 * Phones and tablets need about 44px of reachable area per control; several of
 * the header, breadcrumb and footer links are text-sized (15–34px tall). Most
 * of them are inline, so they get the room as vertical padding, which grows the
 * hit area without moving anything on the page. Controls that are already a box
 * (the burger, the gallery expander, the social icons) get a minimum size
 * instead. Mice are unaffected: everything here is behind pointer: coarse.
 */
@media (pointer: coarse) {
  header a, footer a, .breadcrumb a, .breadcrumb span, .topstrip .wrap a,
  .footer-col a, .footer-bottom a {
    padding-block: 14px !important;
  }
  /* inline links sit on one text line, so their padding would overlap the
     link above and below; as inline-blocks they take the room properly */
  footer a, .breadcrumb a, .breadcrumb span, .topstrip .wrap a { display: inline-block; }
  /* the address, phone and e-mail in a contact block are links too; these
     stand on their own line, so the extra room does not crowd body copy */
  .value a, a[href^="tel:"], a[href^="mailto:"], a[href*="maps"] {
    display: inline-block;
    padding-block: 14px !important;
  }
  .brand, .logo, .nav-back, .scp0 { min-height: 44px; }
  .nav-back { min-width: 44px; }
  .nav-toggle { width: 44px !important; height: 44px !important; }
  .gal-expand { width: 44px !important; height: 44px !important; }
  .footer-social a { min-width: 44px; min-height: 44px; }
  .skt-skip { min-height: 44px; display: inline-flex; align-items: center; }
  /* the phone icon sits beside the quote button; it can only widen once the
     full menu has collapsed, and pages that hide it outright keep it hidden */
  @media (max-width: 980px) {
    .nav-phone { min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }
  }
}
