/* Primust — shared base + responsive styles (imported by every page) */
:root { color-scheme: light; }
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; background: #F4F1EA; }
html, body { overflow-x: hidden; max-width: 100vw; }
body { font-family: Inter, sans-serif; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
em { font-style: italic; }
a { color: inherit; }
button { font-family: inherit; }
img, svg { max-width: 100%; }
::selection { background: #2B3D6B; color: #F4F1EA; }

.pt-connected-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border: 1px solid #14110D;
  background: #FFFFFF;
}

.pt-connected-cell {
  min-width: 0;
  padding: 30px 26px 34px;
  border-right: 1px solid #D9D3C6;
}

.pt-connected-cell:last-child {
  border-right: 0;
}

/* ────────── Tablet (≤ 1100px): collapse 4/5-col grids to 2 ────────── */
@media (max-width: 1100px) {
  section[style*="padding: 96px 48px"],
  section[style*="padding: 112px 48px"],
  section[style*="padding: 80px 48px"],
  section[style*="padding: 64px 48px"] {
    padding-left: 32px !important;
    padding-right: 32px !important;
  }
  [style*="grid-template-columns: repeat(5, 1fr)"],
  [style*="grid-template-columns: repeat(4, 1fr)"],
  [style*="grid-template-columns: repeat(4, minmax(0, 1fr))"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  [style*="grid-template-columns: 200px 1fr"] {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
  .pt-connected-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .pt-connected-cell {
    border-right: 1px solid #D9D3C6;
    border-bottom: 1px solid #D9D3C6;
  }
  .pt-connected-cell:nth-child(2n) {
    border-right: 0;
  }
  .pt-connected-cell:nth-last-child(-n + 2) {
    border-bottom: 0;
  }
}

/* ────────── Mobile (≤ 760px): single column, tighter padding ────────── */
@media (max-width: 760px) {
  section[style*="padding:"] {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  section[style*="padding: 96px 48px"],
  section[style*="padding: 112px 48px"],
  section[style*="padding: 80px 48px"],
  section[style*="padding: 64px 48px"],
  section[style*="padding: 40px 48px"] {
    padding-top: 56px !important;
    padding-bottom: 56px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  /* Collapse multi-column grids to a single column */
  [style*="grid-template-columns: 1.15fr 1fr"],
  [style*="grid-template-columns: 1.05fr 1fr"],
  [style*="grid-template-columns: 1fr 1fr"],
  [style*="grid-template-columns: 0.9fr 1.1fr"],
  [style*="grid-template-columns: repeat(2, minmax(0, 1fr))"],
  [style*="grid-template-columns: repeat(2, 1fr)"],
  [style*="grid-template-columns: repeat(3, 1fr)"],
  [style*="grid-template-columns: repeat(4, minmax(0, 1fr))"],
  [style*="grid-template-columns: repeat(4, 1fr)"],
  [style*="grid-template-columns: repeat(5, 1fr)"],
  [style*="grid-template-columns: 200px 1fr"],
  [style*="grid-template-columns: 80px 220px 1fr"] {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }
  .pt-connected-grid {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }
  .pt-connected-cell {
    border-right: 0 !important;
    border-bottom: 1px solid #D9D3C6 !important;
  }
  .pt-connected-cell:last-child {
    border-bottom: 0 !important;
  }
  /* Keep 2-column key/value grids inside cards (tight) */
  [style*="grid-template-columns: 100px 1fr"],
  [style*="grid-template-columns: 110px 1fr"] {
    grid-template-columns: 90px 1fr !important;
  }
  /* Inner padding on cards — dial back */
  [style*="padding: 44px 48px"],
  [style*="padding: 32px 28px 36px"],
  [style*="padding: 28px 28px 32px"],
  [style*="padding: 26px 28px"] {
    padding: 22px 18px !important;
  }
  /* Install strip should fill width */
  [style*="display: inline-flex"][style*="flex-direction: column"][style*="font-family"] {
    display: flex !important;
    width: 100% !important;
  }
  /* Long mono strings — allow wrapping */
  [style*="white-space: nowrap"] {
    white-space: normal !important;
  }
  /* Large serif headings — scale down further */
  [style*="font-size: clamp(52px"] { font-size: 44px !important; letter-spacing: -1.5px !important; }
  [style*="font-size: clamp(48px"] { font-size: 38px !important; letter-spacing: -1.2px !important; }
  [style*="font-size: clamp(44px"] { font-size: 34px !important; letter-spacing: -1px !important; }
  [style*="font-size: clamp(40px"] { font-size: 32px !important; }
  [style*="font-size: clamp(36px"] { font-size: 30px !important; }
  [style*="font-size: clamp(32px"] { font-size: 26px !important; }
  /* Hero CTA row: allow wrapping (match via marginBottom to avoid touching install strip rows) */
  [style*="display: flex"][style*="gap: 10"][style*="margin-bottom: 40"] { flex-wrap: wrap !important; }
  /* Reduce outer container max paddings */
  [style*="padding: 64px 0"] { padding-top: 32px !important; padding-bottom: 32px !important; }
  /* Prevent grid items from forcing parent wider than viewport */
  main, section, section > div, [style*="display: grid"] > * { min-width: 0; }
  /* Hero mono install strip + VPEC card — smaller mono type */
  [style*="font-family: &quot;JetBrains Mono&quot;"],
  [style*="font-family: \"JetBrains Mono\""] { font-size: 11px !important; }
  /* Nav: drop horizontal padding a bit */
  nav[style*="padding:"] { padding-left: 16px !important; padding-right: 16px !important; }
  /* Install strip tags (SDK · Apache-2.0): hide on mobile to prevent overflow */
  [style*="margin-left: auto"][style*="text-transform: uppercase"][style*="font-size: 10"] {
    display: none !important;
  }
  /* Ensure install strip rows don't wrap (keep on single line, no orphan labels) */
  [style*="display: flex"][style*="gap: 10"][style*="padding: 10px 16px"] {
    flex-wrap: nowrap !important;
  }
  /* Card headers with space-between: allow wrap */
  [style*="display: flex"][style*="justify-content: space-between"][style*="padding: 14px 24px"],
  [style*="display: flex"][style*="justify-content: space-between"][style*="padding: 20px 24px"] {
    flex-wrap: wrap !important; gap: 4px !important;
  }
  /* Flex rows with wide content: allow wrap */
  [style*="display: flex"][style*="justify-content: space-between"][style*="flex-wrap: wrap"] {
    gap: 8px !important;
  }
  /* Generic: any inner container with a huge fixed padding gets dialed back */
  [style*="padding: 28px 30px"],
  [style*="padding: 22px 28px"],
  [style*="padding: 18px 28px"] {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
  /* Tables/grids with many cols in spoke pages */
  [style*="grid-template-columns: repeat(6, 1fr)"],
  [style*="grid-template-columns: repeat(8, 1fr)"],
  [style*="grid-template-columns: repeat(16, 1fr)"] {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
  }
  /* Common 3-column fixed layouts (e.g., 160px 1fr 160px) */
  [style*="grid-template-columns: 160px 1fr"],
  [style*="grid-template-columns: 180px 1fr"],
  [style*="grid-template-columns: 240px 1fr"],
  [style*="grid-template-columns: 1.3fr repeat(4, 1fr)"],
  [style*="grid-template-columns: 180px 280px 1fr"],
  [style*="grid-template-columns: 160px 280px 1fr"],
  [style*="grid-template-columns: 200px 220px 160px 1fr"],
  [style*="grid-template-columns: 58px 92px 1fr"],
  [style*="grid-template-columns: 44px 110px 1fr"],
  [style*="grid-template-columns: 56px 1fr 58px"],
  [style*="grid-template-columns: 48px 1fr"] {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
  /* Tables of adapter/framework info (wide rows) */
  [style*="grid-template-columns: 200px 220px"],
  [style*="grid-template-columns: 160px 220px"] {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }
}
