/* iOS Safari: stop automatic text inflation ("font boosting") on desktop-formatted pages. */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

/* Touch devices: hover cannot open the language menu; lang-menu.js adds tap toggle. */
[data-lang-hover] > span:first-child { cursor: pointer; }

/* Mobile layer for impromatrix.com — linearizes the desktop-first inline-styled layouts. */
@media (max-width: 840px) {
  /* — page scaffolding grids collapse to one column — */
  [style*="grid-template-columns: repeat(4, 1fr)"],
  [style*="grid-template-columns: repeat(3, 1fr)"],
  [style*="grid-template-columns: 1fr 1fr"],
  [style*="grid-template-columns: 1.15fr 1fr"],
  [style*="grid-template-columns: 1.2fr 1fr"],
  [style*="grid-template-columns: 1.25fr 1fr"],
  [style*="grid-template-columns: 2fr 1fr"] {
    grid-template-columns: 1fr !important;
  }
  /* card strips: side borders become bottom borders when stacked */
  [style*="grid-template-columns: repeat(4, 1fr)"] > [style*="border-right"],
  [style*="grid-template-columns: repeat(3, 1fr)"] > [style*="border-right"] {
    border-right: none !important;
    border-bottom: 1px solid rgba(18, 49, 47, 0.14);
  }
  /* data-table rows (mixed-ratio fr grids, tagged at build time): keep columns, compress */
  [data-imx-row] { font-size: 12px !important; gap: 6px !important; overflow-wrap: anywhere; }
  [data-imx-row] > * { padding: 10px 7px !important; }
  /* px-column scaffolding grids (e.g. case-study cards 200px 1fr auto): stack */
  [data-imx-stack] { grid-template-columns: 1fr !important; }

  /* — flex rows may wrap (inline styles never set flex-wrap) — */
  header, header nav, footer, [style*="display: flex"] {
    flex-wrap: wrap;
  }
  header { row-gap: 10px; }
  header nav { gap: 10px 14px !important; }

  /* — spacing & type scale — */
  header, section, footer {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  section { padding-top: 40px !important; padding-bottom: 40px !important; }
  h1 { font-size: clamp(30px, 8.5vw, 38px) !important; }
  h2 { font-size: clamp(22px, 6.5vw, 27px) !important; }
  body { overflow-wrap: break-word; }

  /* — details — */
  aside { position: static !important; }              /* calculator estimate panel */
  footer [style*="text-align: right"] { text-align: left !important; }
  table { display: block; overflow-x: auto; }
  input[type="range"] { width: 100%; }
}

/* Mid-size screens (small tablets, landscape phones): wrap the header before it overflows. */
@media (max-width: 1100px) {
  header, header nav { flex-wrap: wrap; }
  header { row-gap: 10px; }
}

/* Small phones: tighten article comparison rows and large CTAs. */
@media (max-width: 430px) {
  [data-imx-row] { font-size: 11px !important; gap: 4px !important; }
  [data-imx-row] > * { padding: 8px 5px !important; }
  [style*="min-width: 130px"] { min-width: 100px !important; }
  [style*="padding: 15px 28px"] { padding: 13px 16px !important; }
}

/* ---- mobile hamburger nav ---- */
[data-imx-burger] { display: none; background: none; border: 0; padding: 8px 6px; cursor: pointer; flex-direction: column; gap: 5px; }
[data-imx-burger] span { display: block; width: 22px; height: 2px; background: #F0EFE6; border-radius: 2px; transition: transform 0.2s, opacity 0.2s; }
body.imx-nav-open [data-imx-burger] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
body.imx-nav-open [data-imx-burger] span:nth-child(2) { opacity: 0; }
body.imx-nav-open [data-imx-burger] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 840px) {
  header { position: relative; }
  [data-imx-burger] { display: flex; }
  header > nav { display: none !important; }
  body.imx-nav-open header > nav {
    display: flex !important;
    position: absolute; top: 100%; left: 0; right: 0; z-index: 200;
    flex-direction: column; align-items: stretch !important; gap: 0 !important;
    background: #0A3532; padding: 4px 24px 22px;
    border-bottom: 1px solid rgba(240, 239, 230, 0.16);
    box-shadow: 0 18px 34px rgba(0, 0, 0, 0.35);
    max-height: calc(100vh - 90px); overflow-y: auto;
  }
  body.imx-nav-open header > nav > a { padding: 14px 0; border-top: 1px solid rgba(240, 239, 230, 0.09); font-size: 15px; text-align: left; width: 100%; }
  body.imx-nav-open header > nav > a:first-child { border-top: none; }
  body.imx-nav-open header > nav > a[style] { padding: 13px 18px !important; margin: 14px 0 0 !important; border-top: none; text-align: center; border-radius: 8px; box-sizing: border-box; width: 100%; }
  body.imx-nav-open header > nav > div[data-lang-hover] { padding: 12px 0 0; border-top: 1px solid rgba(240, 239, 230, 0.09); }
  body.imx-nav-open [data-lang-menu] { position: static !important; box-shadow: none !important; margin-top: 8px; }
  /* stacked link-cards: keep the arrow bottom-right instead of orphaned left */
  a[data-imx-stack] > :last-child { justify-self: end; }
}
