/* Instrument Grade, Climax Scientific.
   Scoped to .cx wrappers so Astra's global styles are overridden without
   stripping anything the theme or plugins legitimately need. */

.cx {
  --cx-bg: #FFFFFF;
  --cx-surface: #F2F5F7;
  --cx-ink: #101A21;
  --cx-accent: #A85B18;
  --cx-primary: #0E3B5C;
  --cx-link: #1B5A8A;
  --cx-border: #D6DEE4;
  --cx-muted: #5A6B78;
  --cx-sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --cx-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --cx-max: 1120px;
  --cx-sm: 8px;
  --cx-md: 16px;
  --cx-lg: 32px;
  --cx-xl: 64px;
  font-family: var(--cx-sans);
  color: var(--cx-ink);
  background: var(--cx-bg);
  font-size: 17px;
  line-height: 1.6;
}

.cx :where(h1, h2, h3, p, ul, ol, li, table, tbody, tr, th, td, figure) {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  color: inherit;
  background: none;
}

.cx__wrap { max-width: var(--cx-max); margin: 0 auto; padding: 0 24px; }
.cx__section { padding: var(--cx-xl) 0; border-top: 1px solid var(--cx-border); }
.cx__section--first { border-top: 0; }

.cx h1, .cx h2, .cx h3 {
  font-family: var(--cx-sans);
  font-weight: 600;
  color: var(--cx-primary);
  line-height: 1.1;
  letter-spacing: -0.01em;
}
.cx h1 { font-size: clamp(34px, 5vw, 52px); }
.cx h2 { font-size: clamp(22px, 2.6vw, 28px); margin-bottom: var(--cx-lg); }
.cx h3 { font-size: 19px; }

.cx__eyebrow {
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--cx-muted);
  margin-bottom: var(--cx-md);
}

.cx__technique { font-family: var(--cx-mono); font-size: 14px; color: var(--cx-link); margin-top: var(--cx-md); }

.cx__tagline {
  font-size: clamp(19px, 2.2vw, 23px);
  line-height: 1.45;
  max-width: 44ch;
  margin-top: var(--cx-lg);
}

.cx__prose p { max-width: 66ch; margin-bottom: var(--cx-md); }
.cx__prose p:last-child { margin-bottom: 0; }
.cx__prose a { color: var(--cx-link); text-decoration: none; }
.cx__prose a:hover { text-decoration: underline; }

.cx__specs { width: 100%; border-collapse: collapse; }
.cx__specs tr { border-bottom: 1px solid var(--cx-border); }
.cx__specs tr:first-child { border-top: 1px solid var(--cx-border); }
.cx__specs th, .cx__specs td { text-align: left; vertical-align: top; padding: 14px 0; }
.cx__specs th { width: 34%; padding-right: var(--cx-lg); font-weight: 400; font-size: 15px; color: var(--cx-muted); }
.cx__specs td {
  font-family: var(--cx-mono);
  font-size: 15px;
  line-height: 1.55;
  color: var(--cx-ink);
  font-variant-numeric: tabular-nums;
}

.cx__features { list-style: none; }
.cx__features li { position: relative; padding: 0 0 var(--cx-md) 26px; max-width: 74ch; }
.cx__features li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 12px;
  width: 9px;
  height: 1px;
  background: var(--cx-accent);
}
.cx__features li:last-child { padding-bottom: 0; }

.cx__sectors { display: flex; flex-wrap: wrap; gap: var(--cx-sm) var(--cx-lg); list-style: none; }
.cx__sectors a { color: var(--cx-link); text-decoration: none; border-bottom: 1px solid var(--cx-border); padding-bottom: 2px; }
.cx__sectors a:hover { border-bottom-color: var(--cx-link); }

.cx__enquire { background: var(--cx-surface); }
.cx__enquire p { color: var(--cx-muted); }

.cx__btn {
  display: inline-block;
  margin-top: var(--cx-lg);
  padding: 14px 28px;
  background: var(--cx-accent);
  color: #FFFFFF;
  font-weight: 500;
  font-size: 16px;
  text-decoration: none;
  border-radius: 4px;
}
.cx__btn:hover { background: #8F4C13; color: #FFFFFF; }

.cx__meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--cx-lg);
  margin-top: var(--cx-lg);
  padding-top: var(--cx-lg);
  border-top: 1px solid var(--cx-border);
  font-size: 15px;
  color: var(--cx-muted);
}
.cx__meta strong { font-weight: 500; color: var(--cx-ink); }

.cx__index { list-style: none; }
.cx__index li { border-bottom: 1px solid var(--cx-border); padding: var(--cx-lg) 0; }
.cx__index li:first-child { border-top: 1px solid var(--cx-border); }
.cx__index a { color: var(--cx-primary); text-decoration: none; font-size: 22px; font-weight: 600; }
.cx__index a:hover { color: var(--cx-link); }
.cx__index p { margin-top: var(--cx-sm); color: var(--cx-muted); max-width: 70ch; }

@media (max-width: 720px) {
  .cx__specs th, .cx__specs td { display: block; width: auto; padding-right: 0; }
  .cx__specs th { padding-bottom: 2px; }
  .cx__specs td { padding-top: 0; padding-bottom: 14px; }
  .cx__section { padding: 40px 0; }
}
