/* GridWind — responsive overrides.
   Base styling is inline and desktop-exact at >=1024px; these rules only
   restructure below the breakpoints. !important beats inline styles.
   NOTE: the runtime applies inline styles via CSSOM, so [style*=...]
   selectors must match the browser-NORMALIZED serialization:
   "prop: value" spacing, rgb() colors, "repeat(3, 1fr)", "0.95fr", "0px". */

/* ============================== <= 1023px ============================== */
@media (max-width: 1023px) {

  /* --- top nav: logo row, then a horizontally-scrollable link row --- */
  div[style*="height: 76px"][style*="backdrop-filter"] {
    height: auto !important;
    flex-wrap: wrap;
    padding: 10px 20px !important;
    row-gap: 2px;
  }
  div[style*="height: 76px"][style*="backdrop-filter"] > div[style*="gap: 34px"] {
    order: 3;
    flex-basis: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding: 8px 0 6px;
    gap: 22px !important;
    scrollbar-width: none;
  }
  div[style*="height: 76px"][style*="backdrop-filter"] > div[style*="gap: 34px"]::-webkit-scrollbar { display: none; }
  div[style*="height: 76px"][style*="backdrop-filter"] > div[style*="gap: 34px"] > * { flex: none; }

  /* dark headers on Status/Docs wrap */
  div[style*="max-width: 960px"][style*="justify-content: space-between"],
  div[style*="max-width: 1060px"][style*="justify-content: space-between"] { flex-wrap: wrap; row-gap: 12px; }

  /* --- collapse two-column section grids (normalized: leading zeros) --- */
  div[style*="grid-template-columns: 1.05fr 0.95fr"],
  div[style*="grid-template-columns: 0.9fr 1.1fr"],
  div[style*="grid-template-columns: 1.1fr 0.9fr"],
  div[style*="grid-template-columns: 0.8fr 1.2fr"],
  div[style*="grid-template-columns: 1.2fr 0.8fr"],
  div[style*="grid-template-columns: 0.72fr"],
  div[style*="grid-template-columns: minmax(0px, 1fr) 722px"],
  div[style*="grid-template-columns: 722px minmax(0px, 1fr)"],
  div[style*="grid-template-columns: 250px minmax(0px, 1fr)"],
  div[style*="grid-template-columns: 380px 1fr"],
  div[style*="grid-template-columns: 1fr 400px"] {
    grid-template-columns: 1fr !important;
  }

  /* symmetric halves: login split + big section grids (gap is clamp(...)) */
  div[style*="grid-template-columns: 1fr 1fr; min-height: 100vh"],
  div[style*="grid-template-columns: 1fr 1fr; gap: clamp"] {
    grid-template-columns: 1fr !important;
  }

  /* card grids become fluid */
  div[style*="grid-template-columns: repeat(2, 1fr)"] { grid-template-columns: 1fr !important; }
  div[style*="grid-template-columns: repeat(3, 1fr)"] { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important; }
  div[style*="grid-template-columns: repeat(4, 1fr)"] { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important; }
  div[style*="grid-template-columns: repeat(5, 1fr)"] { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important; }

  /* --- wide data tables: keep columns, scroll horizontally --- */
  div:has(> div[style*="grid-template-columns: 1fr 1fr 1fr 1fr"]),
  div:has(> div[style*="grid-template-columns: 100px repeat(4, 1fr)"]),
  div:has(> div[style*="grid-template-columns: 1fr 200px 200px"]),
  div:has(> div[style*="grid-template-columns: 90px 1fr 220px"]) {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }
  div[style*="grid-template-columns: 1fr 1fr 1fr 1fr"] { min-width: 660px; }
  div[style*="grid-template-columns: 100px repeat(4, 1fr)"] { min-width: 520px; }
  div[style*="grid-template-columns: 1fr 200px 200px"] { min-width: 560px; }
  div[style*="grid-template-columns: 90px 1fr 220px"] { min-width: 540px; }

  /* partners wordmark strip wraps */
  div[style*="display: flex"][style*="gap: 58px"] {
    flex-wrap: wrap;
    gap: 24px 36px !important;
    justify-content: center;
  }

  /* --- legal-page TOC: static above content --- */
  div[style*="position: sticky"][style*="top: 104px"] { position: static !important; }
  div[style*="grid-template-columns: 250px minmax(0px, 1fr)"] > div { min-width: 0; }

  /* --- baked footer --- */
  div[style*="padding: 44px 0px"][style*="justify-content: space-between"] {
    flex-direction: column;
    gap: 32px;
  }
  div[style*="padding: 20px 0px"][style*="justify-content: space-between"] {
    flex-wrap: wrap;
    gap: 8px;
    line-height: 1.6 !important;
  }

  /* --- console preview images scale down --- */
  img[src*="console-"] { width: 100% !important; height: auto !important; }
  div[style*="width: 866px"] { width: 100% !important; max-width: 866px; }
  div[style*="width: 722px"] { width: 100% !important; max-width: 722px; }

  /* CTA/button rows + hero stat strips wrap */
  div[style*="display: flex"][style*="gap: 14px"],
  div[style*="display: flex"][style*="gap: 12px"],
  div[style*="display: flex"][style*="gap: 26px"] { flex-wrap: wrap; row-gap: 12px; }

  /* Login: brand panel gets a sensible height when stacked below the form */
  div[data-screen-label="Login"] > div[style*="rgb(12, 28, 48)"] { min-height: 360px; }
}

/* ============================== <= 640px =============================== */
@media (max-width: 640px) {

  /* contact/login field pairs stack */
  div[style*="grid-template-columns: 1fr 1fr; gap: 18px"] { grid-template-columns: 1fr !important; }

  /* compact stat cards: two-up instead of one long column */
  div[style*="grid-template-columns: repeat(4, 1fr)"] { grid-template-columns: repeat(2, 1fr) !important; }

  /* region rows tighten */
  div[style*="grid-template-columns: 90px 1fr auto auto"] { grid-template-columns: 56px 1fr auto auto !important; gap: 10px !important; }

  /* legal doc header meta wraps */
  div[style*="display: flex"][style*="gap: 22px"] { flex-wrap: wrap; row-gap: 8px; }

  /* careers rows stack */
  div[style*="grid-template-columns: 1fr auto auto"] { grid-template-columns: 1fr !important; gap: 6px !important; }

  /* definition/retention tables stack their label column */
  div[style*="grid-template-columns: 230px 1fr"],
  div[style*="grid-template-columns: 210px 1fr"],
  div[style*="grid-template-columns: 130px 1fr"],
  div[style*="grid-template-columns: 1fr 240px"],
  div[style*="grid-template-columns: 1fr 320px"] {
    grid-template-columns: 1fr !important;
    gap: 4px !important;
  }
}