/* Brokers Lens — mobile layer. Base styling stays inline (desktop); these rules only reflow small screens. */
@media (max-width: 768px) {
  body { min-width: 0 !important; }
  [style*="min-width: 1200px"], [style*="min-width: 1100px"] { min-width: 0 !important; }

  /* Header: brand row + actions, nav becomes a swipeable row below */
  header { flex-wrap: wrap !important; height: auto !important; padding: 10px 16px !important; gap: 10px 14px !important; }
  header nav { order: 3; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  header nav::-webkit-scrollbar { display: none; }
  header nav a { padding: 10px 0 !important; white-space: nowrap; border-bottom-width: 2px; }

  /* Type scale */
  h1 { font-size: clamp(26px, 7.5vw, 34px) !important; white-space: normal !important; }
  h2 { font-size: clamp(19px, 5.5vw, 24px) !important; }
  [style*="font-size: 44px"], [style*="font-size: 48px"], [style*="font-size: 52px"] { font-size: 30px !important; line-height: 1.15 !important; }
  [style*="font-size: 38px"][style*="font-family: 'IBM Plex Mono'"] { font-size: 28px !important; }

  /* Section gutters */
  [style*="padding: 40px 40px"], [style*="padding: 36px 40px"], [style*="padding: 32px 40px"],
  [style*="padding: 44px 40px"], [style*="padding: 48px 40px"], [style*="padding: 52px 40px"],
  [style*="padding: 56px 40px"], [style*="padding: 64px 40px"], [style*="padding: 72px 40px"],
  [style*="padding: 24px 40px"], [style*="padding: 28px 40px"], [style*="padding: 9px 40px"] {
    padding-left: 16px !important; padding-right: 16px !important;
  }

  /* Card grids collapse; stat strips go 2-up */
  [style*="grid-template-columns: repeat(2"], [style*="grid-template-columns: repeat(3"],
  [style*="grid-template-columns: repeat(5"], [style*="grid-template-columns: repeat(6"] { grid-template-columns: 1fr !important; }
  [style*="grid-template-columns: repeat(4"] { grid-template-columns: 1fr 1fr !important; }

  /* Two-column layouts stack (content first, rail after) */
  [style*="grid-template-columns: 1fr 1fr"],
  [style*="grid-template-columns: 1fr 320px"], [style*="grid-template-columns: 1fr 300px"],
  [style*="grid-template-columns: 240px 1fr"], [style*="grid-template-columns: 200px 1fr"],
  [style*="grid-template-columns: 1.5fr 1fr"], [style*="grid-template-columns: 1.7fr 1fr"],
  [style*="grid-template-columns: 1fr 1.2fr"], [style*="grid-template-columns: 1fr 1.3fr"],
  [style*="grid-template-columns: 150px minmax(0,1fr) 300px 220px"],
  [style*="grid-template-columns: 180px 1fr"] { grid-template-columns: 1fr !important; }

  /* Sticky rails flow normally on mobile */
  [style*="position: sticky; top: 92px"], [style*="position: sticky; top: 132px"] { position: static !important; }

  /* Data tables: keep their columns, scroll sideways inside their card */
  [style*="background: #fff"][style*="border-radius: 14px"] { overflow-x: auto !important; }
  [style*="border-radius: 0 0 12px 12px"] { overflow-x: auto !important; }
  [style*="grid-template-columns: 48px"], [style*="grid-template-columns: 210px repeat(3, 1fr)"],
  [style*="grid-template-columns: 70px 50px"], [style*="grid-template-columns: 90px 1.4fr"],
  [style*="grid-template-columns: 1.4fr 0.8fr"], [style*="grid-template-columns: 110px 160px"],
  [style*="grid-template-columns: 1.7fr 1.3fr"] { min-width: 820px; }

  /* Pill tab groups swipe instead of wrapping awkwardly */
  [style*="display: inline-flex"][style*="background: #EEF1EE"] { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  [style*="display: inline-flex"][style*="background: #EEF1EE"]::-webkit-scrollbar { display: none; }

  /* Search pills stack their button below the input */
  [style*="padding: 6px 6px 6px 24px"] { flex-wrap: wrap; border-radius: 20px !important; padding: 10px 14px !important; gap: 8px; }
  [style*="padding: 6px 6px 6px 24px"] > input { width: 100%; flex: 1 1 100%; padding: 8px 4px !important; }

  /* Footer rows wrap */
  footer [style*="display: flex"] { flex-wrap: wrap; row-gap: 10px; }
  footer [style*="margin-left: auto"] { margin-left: 0 !important; }

  img[alt="Brokers Lens logo"] { width: 30px !important; height: 30px !important; }

  /* Site header flows (no sticky) so it never overlaps section navs */
  header { position: static !important; }
  [style*="position: sticky; top: 68px"][style*="z-index: 15"] { top: 0 !important; padding: 8px 0 !important; }

  /* Broker profile v2 hero: wrap into stacked blocks */
  #overview { flex-wrap: wrap !important; padding: 18px !important; }
  #overview h1 { white-space: normal !important; font-size: 23px !important; }
  #overview > div[style*="width: 240px"] { width: 100% !important; }
  #overview > div[style*="text-align: center"] { margin: 0 auto !important; }

  /* Wide grids inside white cards scroll sideways */
  [style*="background: #fff"][style*="border-radius: 12px"][style*="padding: 22px 26px"] { overflow-x: auto !important; }
  [style*="grid-template-columns: 90px 1.4fr 0.8fr 1fr 110px 90px 110px"] { min-width: 760px; }
  [style*="grid-template-columns: 1.4fr 0.8fr 1fr 0.8fr"] { min-width: 560px; }

  /* Reach & marketing 3-col stacks */
  [style*="grid-template-columns: 1fr 1.3fr 1fr"] { grid-template-columns: 1fr !important; }

  /* Live trades keep 3 compact columns */
  [style*="grid-template-columns: 1fr 1fr 1fr"] { grid-template-columns: 1fr 1fr 1fr !important; font-size: 12px !important; }

  /* Metric tiles 2-up instead of full stack */
  [style*="grid-template-columns: repeat(4, 1fr)"][style*="gap: 12px"] { grid-template-columns: 1fr 1fr !important; }
  [style*="grid-template-columns: repeat(5, 1fr)"][style*="gap: 12px"] { grid-template-columns: 1fr 1fr !important; }

  /* Never allow sideways overflow (stops iOS zoom-out) */
  html, body { overflow-x: hidden !important; max-width: 100vw !important; }
  section { max-width: 100vw !important; }

  /* Wide fixed-column layouts stack */
  [style*="grid-template-columns: 430px 1fr"], [style*="grid-template-columns: 380px 1fr"] { grid-template-columns: 1fr !important; }

  /* Exposure wall masonry: one column */
  [style*="columns: 3"] { columns: 1 !important; }

  /* Mediation banner stacks */
  [style*="align-items: center; gap: 56px"] { flex-wrap: wrap; gap: 28px !important; }
  [style*="text-align: right"][style*="gap: 40px"] { text-align: left !important; flex-wrap: wrap; gap: 24px !important; }
}