/*
 * Phone and small-tablet layout for the whole site. The pages are laid out with inline styles
 * for desktop; below 860px these rules stack every multi-column grid, shrink display type and
 * turn the main menu into a row you can swipe.
 */
html { -webkit-text-size-adjust: 100%; }
img { max-width: 100%; }

@media (max-width: 860px) {
  /* stack grids; keep the small "number + text" and "label + arrow" rows side by side */
  [style*="grid-template-columns"]:not([style*="56px 1fr"]):not([style*="1fr auto"]) { grid-template-columns: minmax(0, 1fr) !important; }
  [style*="grid-column: span"] { grid-column: auto !important; }
  [style*="border-left: 1px solid #2A4468"] { border-left: 0 !important; border-top: 1px solid #2A4468; }

  /* header: logo on top, menu as a swipeable row */
  header[style] { flex-direction: column; align-items: flex-start !important; gap: 14px !important; padding-top: 14px !important; padding-bottom: 10px !important; }
  nav[aria-label="Main"] { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; gap: 20px !important; padding-bottom: 6px; scrollbar-width: none; }
  nav[aria-label="Main"]::-webkit-scrollbar { display: none; }
  nav[aria-label="Main"] a { white-space: nowrap; flex: none; }
  nav[aria-label="Main"] a[href="/contact"] { padding: 8px 14px !important; }
  body > div > div:first-child > span:first-child { display: none; } /* utility bar tagline */
  nav[aria-label="Utility"] { margin-left: auto; }

  /* type */
  h1[style] { font-size: clamp(32px, 9vw, 40px) !important; line-height: 1.12 !important; }
  h2[style] { font-size: clamp(26px, 7vw, 30px) !important; }
  [style*="font-size: 48px"], [style*="font-size: 52px"], [style*="font-size: 56px"], [style*="font-size: 64px"] { font-size: 36px !important; }
  p[style*="font-size: 20px"], p[style*="font-size: 19px"] { font-size: 17px !important; }

  /* spacing */
  section[style*="padding: 96px"], section[style*="padding: 112px"], section[style*="padding: 80px"] { padding-top: 56px !important; padding-bottom: 56px !important; }
  [style*="padding: 40px"] { padding: 24px !important; }
  [style*="gap: 48px"] { gap: 28px !important; }

  /* wide tables scroll inside themselves instead of widening the page */
  table { display: block; overflow-x: auto; max-width: 100%; }
  /* rows of links and buttons wrap instead of running off the screen (the main menu scrolls instead) */
  [style*="display: flex"]:has(> a) { flex-wrap: wrap; }
  nav[aria-label="Main"] { flex-wrap: nowrap !important; }
  a[style*="padding: 14px 28px"] { flex: 1 1 auto; justify-content: center; text-align: center; max-width: 100%; }
}