/* Core Mobile — responsive layer.
   Pages are authored at a fixed 1440px. Two tiers:
   1. 900–1439px: responsive.js scales the page container to fit the window.
   2. <=899px: real reflow — single column, reduced padding, smaller type. */

@media (max-width: 899px) {
  html, body { overflow-x: hidden !important; }

  [style*="min-width: 1440px"],
  [style*="width: 1440px"] {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    zoom: 1 !important;
  }

  /* every multi-column grid collapses */
  [style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }

  /* no horizontal overflow: rows wrap, children may shrink */
  [style*="display: flex"]:not([style*="flex-direction: column"]) { flex-wrap: wrap !important; }
  [style*="display: flex"] > *, [style*="display: grid"] > * { min-width: 0 !important; }
  /* list rows with a trailing arrow: keep the arrow on the row, vertically centred */
  a[style*="justify-content: space-between"] {
    flex-wrap: nowrap !important;
    align-items: center !important;
  }
  a[style*="justify-content: space-between"] > div { flex: 1 1 auto !important; }
  a[style*="justify-content: space-between"] > i {
    flex: 0 0 auto !important;
    margin-left: 14px !important;
    align-self: center !important;
  }
  [style*="white-space: nowrap"] { white-space: normal !important; }
  /* vertical hairline dividers between inline groups */
  [style*="width: 1px"][style*="height: 28px"] { display: none !important; }
  /* long text should break rather than push the page wide */
  h1, h2, h3, p, div, span, a { overflow-wrap: break-word !important; }

  /* horizontal gutters */
  [style*="padding: 88px 64px"],
  [style*="padding: 84px 64px"],
  [style*="padding: 80px 64px"],
  [style*="padding: 76px 64px"],
  [style*="padding: 72px 64px"],
  [style*="padding: 56px 64px"],
  [style*="padding: 48px 64px"],
  [style*="padding: 44px 64px"],
  [style*="padding: 0 64px"],
  [style*="64px 76px 64px"],
  [style*="64px 72px 64px"],
  [style*="64px 68px 64px"] {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  [style*="padding: 88px 64px"],
  [style*="padding: 84px 64px"],
  [style*="padding: 80px 64px"] {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
  }

  /* type scale */
  h1 { font-size: 32px !important; line-height: 1.16 !important; }
  h2 { font-size: 26px !important; line-height: 1.2 !important; }
  h3 { font-size: 20px !important; }
  h1, h2, h3, p { max-width: 100% !important; }

  /* header: stack, drop hover menus (nav labels still link) */
  [style*="height: 76px"] {
    height: auto !important;
    flex-wrap: wrap !important;
    gap: 10px 18px !important;
    padding-top: 14px !important;
    padding-bottom: 14px !important;
  }
  .cm-nav-item { padding: 4px 0 !important; }
  .cm-nav-item > a { white-space: nowrap !important; }
  .cm-dropdown { display: none !important; }
  img[style*="height: 34px"] { height: 26px !important; }

  /* floating hero stat cards become normal blocks */
  [style*="backdrop-filter"] {
    position: static !important;
    inset: auto !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
    margin: 10px 0 0 0 !important;
    width: auto !important;
  }

  /* decorative concentric rings */
  [style*="position: absolute"][style*="border-radius: 50%"][style*="border: 1.5px"] { display: none !important; }

  /* any fixed-height stage that holds a device shot */
  [style*="position: relative"][style*="height: 560px"],
  [style*="position: relative"][style*="height: 520px"],
  [style*="position: relative"][style*="height: 480px"] { height: auto !important; overflow: visible !important; }
  img[style*="height: 340px"],
  img[style*="height: 300px"] { height: auto !important; width: auto !important; max-width: 100% !important; }

  /* media */
  img { max-width: 100% !important; }
  [style*="height: 680px"],
  [style*="height: 620px"],
  [style*="height: 460px"],
  [style*="height: 430px"] { height: auto !important; }
  [style*="aspect-ratio"] > img { height: 100% !important; max-width: none !important; }
  /* hero device shots: absolutely placed, oversized — bring them into the flow */
  img[style*="position: absolute"]:not([style*="inset: 0"]) {
    position: static !important;
    transform: none !important;
    width: 100% !important;
    height: auto !important;
    max-width: 300px !important;
    margin: 0 auto !important;
    display: block !important;
  }
  [style*="position: relative"][style*="height: 620px"],
  [style*="position: relative"][style*="height: 430px"] { height: auto !important; overflow: visible !important; }
  /* fixed-height / clipped wrappers must not crop art once it is in the flow */
  [style*="overflow: hidden"]:not([style*="aspect-ratio"]):not([style*="border-radius: 50%"]) { overflow: visible !important; }
  img:not([style*="inset: 0"]) { max-height: none !important; object-fit: contain !important; }
  [style*="transform: scale("] { transform: none !important; }
  [style*="overflow: hidden"][style*="height: 150px"] { height: auto !important; }

  /* fixed-width columns */
  [style*="width: 660px"],
  [style*="width: 620px"],
  [style*="width: 420px"],
  [style*="width: 390px"] { width: auto !important; max-width: 100% !important; }

  /* keep tap targets honest */
  a[style*="padding: 15px"], a[style*="padding: 14px"], a[style*="padding: 13px"] { min-height: 44px !important; }
}

@media (max-width: 599px) {
  h1 { font-size: 27px !important; }
  h2 { font-size: 22px !important; }
  [style*="padding: 88px 64px"],
  [style*="padding: 84px 64px"],
  [style*="padding: 80px 64px"],
  [style*="padding: 76px 64px"],
  [style*="padding: 72px 64px"],
  [style*="padding: 56px 64px"],
  [style*="padding: 48px 64px"],
  [style*="padding: 44px 64px"],
  [style*="padding: 0 64px"] {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  /* button rows stack */
  [style*="display: flex"][style*="gap: 16px"] { flex-wrap: wrap !important; }
}