/* =====================================================================
   CADMCP.AI site design  |  loaded by the cadmcp-site plugin (assets/css/cadmcp.css)
   Everything is scoped to .cm (page, header and footer wrappers) or to
   pages that contain one, so wp-admin and other pages are untouched.
   Version 1.2.0  |  last updated 2026-11-01
   ===================================================================== */

/* ---------- 0. Logo: the cadmcp-site plugin sets --cm-logo from its CADMCP_SITE_LOGO
   constant (concept-1, -2 or -3). Without the plugin, concept 1 is used (fallback below). ---------- */

/* ---------- 0b. Launch-state switch. THE switch is data-cm-launch="early|live" on the header
   template part. Early: banner shown, buttons read "Join early access". Live: banner hidden,
   buttons read "Start now". Elements carry .cm-when-early / .cm-when-live. ---------- */
.cm.cm-header[data-cm-launch="live"] .cm-when-early,
.cm.cm-header:not([data-cm-launch="live"]) .cm-when-live { display: none !important; }
@supports selector(:has(a)) {
  body:has(.cm-header[data-cm-launch="live"]) .cm .cm-when-early { display: none !important; }
  body:not(:has(.cm-header[data-cm-launch="live"])) .cm .cm-when-live { display: none !important; }
}
@supports not selector(:has(a)) {
  html:not(.cm-launch-live) .cm .cm-when-live { display: none !important; }
  html.cm-launch-live .cm .cm-when-early { display: none !important; }
}

/* ---------- 0c. Signed-in switch. WordPress puts .logged-in on <body> for signed-in people:
   they see Account and Your dashboard (.cm-when-in) instead of Log in and Join (.cm-when-out). ---------- */
body.logged-in .cm .cm-when-out { display: none !important; }
body:not(.logged-in) .cm .cm-when-in { display: none !important; }

/* ---------- 1. Page frame: only on pages that use the design ---------- */
html:has(.cm-page), body:has(.cm-page) { overflow-x: clip; }
body:has(.cm-page) { background: #05080f; color-scheme: dark; }
body:has(.cm-page) .wp-site-blocks { padding: 0 !important; }
body:has(.cm-page) .wp-site-blocks > * { margin-block-start: 0 !important; }
body:has(.cm-page) main { margin-block-start: 0 !important; padding-block: 0 !important; }
body:has(.cm-page) main .wp-block-post-title,
body:has(.cm-page) main .wp-block-post-featured-image { display: none; }
body:has(.cm-page) main > .wp-block-group { padding-block: 0 !important; margin-block: 0 !important; }
body:has(.cm-page) .wp-block-post-content > * + * { margin-block-start: 0; }
/* sticky header: the early-access banner scrolls away, the bar stays (the script measures the banner) */
body:has(.cm-header) header.wp-block-template-part {
  position: sticky; top: calc(0px - var(--cm-banner-h, 0px)); z-index: 60; margin: 0;
}
body.admin-bar:has(.cm-header) header.wp-block-template-part { top: calc(32px - var(--cm-banner-h, 0px)); }
@media (max-width: 782px) { body.admin-bar:has(.cm-header) header.wp-block-template-part { top: calc(46px - var(--cm-banner-h, 0px)); } }
/* at 600px and below the admin bar scrolls away with the page */
@media (max-width: 600px) { body.admin-bar:has(.cm-header) header.wp-block-template-part { top: calc(0px - var(--cm-banner-h, 0px)); } }
body:has(.cm-page) footer.wp-block-template-part { margin-block-start: 0 !important; }

/* full-bleed breakout out of the theme's constrained content column */
.cm.cm-page, .cm.cm-header, .cm.cm-footer {
  width: 100vw; max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important;
}

/* ---------- 2. Tokens ---------- */
.cm {
  --cm-bg: #05080f;
  --cm-bg-2: #0a1120;
  --cm-bg-3: #0e1729;
  --cm-panel: rgba(14, 23, 41, 0.72);
  --cm-panel-2: rgba(19, 31, 55, 0.78);
  --cm-line: rgba(125, 176, 255, 0.14);
  --cm-line-2: rgba(125, 176, 255, 0.26);
  --cm-text: #e8eef8;
  --cm-text-2: #b6c3d6;
  --cm-muted: #95a6bf;
  --cm-cyan: #3ee6ff;
  --cm-cyan-2: #22d3ee;
  --cm-violet: #b29dff;
  --cm-violet-2: #8b5cf6;
  --cm-green: #5eead4;
  --cm-amber: #fbbf24;
  --cm-ink: #04101a;
  --cm-grad: linear-gradient(100deg, #3ee6ff 0%, #7aa8ff 48%, #b29dff 100%);
  --cm-radius: 14px;
  --cm-radius-sm: 9px;
  --cm-wrap: 1200px;
  --cm-gutter: clamp(16px, 4vw, 32px);
  --cm-font: var(--wp--preset--font-family--manrope, "Manrope"), "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --cm-mono: var(--wp--preset--font-family--fira-code, "Fira Code"), "Cascadia Code", ui-monospace, "SF Mono", Consolas, "Liberation Mono", monospace;
  --cm-ease: cubic-bezier(.2, .7, .2, 1);
  color: var(--cm-text);
  font-family: var(--cm-font);
  font-size: 1rem;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  color-scheme: dark;
  box-sizing: border-box;
}
.cm *, .cm *::before, .cm *::after { box-sizing: border-box; }

/* ---------- 3. Base type ---------- */
.cm :where(h1, h2, h3, h4) { color: var(--cm-text); font-family: var(--cm-font); line-height: 1.15; letter-spacing: -0.015em; margin: 0 0 .5em; font-weight: 700; }
.cm :where(h1) { font-size: clamp(2.1rem, 1.3rem + 3.2vw, 3.6rem); letter-spacing: -0.03em; }
.cm :where(h2) { font-size: clamp(1.6rem, 1.15rem + 1.8vw, 2.5rem); letter-spacing: -0.025em; }
.cm :where(h3) { font-size: clamp(1.1rem, 1rem + .4vw, 1.3rem); }
.cm :where(h4) { font-size: 1rem; }
.cm :where(p, ul, ol, dl, table, figure, blockquote) { margin: 0 0 1em; }
.cm :where(ul, ol) { padding-left: 1.25em; }
.cm :where(li) { margin: .25em 0; }
.cm :where(a) { color: var(--cm-cyan); text-decoration: underline; text-decoration-color: rgba(62, 230, 255, .4); text-underline-offset: 3px; transition: color .2s, text-decoration-color .2s; }
.cm :where(a:hover) { color: #a5f3ff; text-decoration-color: currentColor; }
.cm :where(a:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible) { outline: 2px solid var(--cm-cyan); outline-offset: 3px; border-radius: 4px; }
.cm :where(strong, b) { color: #fff; font-weight: 700; }
.cm :where(code, kbd, samp) { font-family: var(--cm-mono); font-size: .9em; background: rgba(62, 230, 255, .08); border: 1px solid var(--cm-line); border-radius: 6px; padding: .1em .4em; color: #cdf6ff; }
.cm :where(hr) { border: 0; height: 1px; background: var(--cm-line); margin: 2.5em 0; }
.cm :where(img, svg, canvas, video) { max-width: 100%; height: auto; }
.cm :where(table) { width: 100%; border-collapse: collapse; font-size: .95rem; }
.cm :where(th, td) { text-align: left; padding: .7em .9em; border-bottom: 1px solid var(--cm-line); vertical-align: top; }
.cm :where(thead th) { font-family: var(--cm-mono); font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; color: var(--cm-muted); font-weight: 500; }
.cm :where(tbody th) { color: var(--cm-text); font-weight: 600; }
.cm ::selection { background: rgba(62, 230, 255, .3); color: #fff; }

.cm .cm-sr { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.cm .cm-skip { position: absolute; left: 12px; top: -60px; z-index: 100; background: var(--cm-cyan); color: var(--cm-ink); padding: 8px 14px; border-radius: 8px; font-weight: 700; text-decoration: none; }
.cm .cm-skip:focus { top: 10px; }

/* ---------- 4. Layout ---------- */
.cm .cm-wrap { width: 100%; max-width: calc(var(--cm-wrap) + 2 * var(--cm-gutter)); margin: 0 auto; padding-left: var(--cm-gutter); padding-right: var(--cm-gutter); position: relative; }
.cm .cm-wrap--narrow { max-width: calc(820px + 2 * var(--cm-gutter)); }
.cm .cm-section { position: relative; padding: clamp(64px, 8vw, 120px) 0; }
.cm .cm-section--tight { padding: clamp(40px, 5vw, 72px) 0; }
.cm .cm-section--band { background: linear-gradient(180deg, rgba(10, 17, 32, 0) 0%, rgba(10, 17, 32, .85) 12%, rgba(10, 17, 32, .85) 88%, rgba(10, 17, 32, 0) 100%); }
.cm .cm-grid { display: grid; gap: clamp(14px, 2vw, 22px); grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
.cm .cm-grid--2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); }
.cm .cm-grid--3 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }
.cm .cm-grid--4 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); }
.cm .cm-split { display: grid; gap: clamp(28px, 5vw, 64px); grid-template-columns: 1fr; align-items: center; }
@media (min-width: 900px) { .cm .cm-split { grid-template-columns: 1.05fr .95fr; } .cm .cm-split--rev > :first-child { order: 2; } }
.cm .cm-stack > * + * { margin-top: 1rem; }
.cm .cm-center { text-align: center; }
.cm .cm-mt { margin-top: clamp(28px, 4vw, 48px); }

/* ---------- 5. Page background: blueprint grid, glows, cursor light ---------- */
.cm.cm-page {
  position: relative; isolation: isolate; overflow: clip;
  background-color: var(--cm-bg);
  background-image:
    radial-gradient(1100px 620px at 12% -8%, rgba(34, 211, 238, .13), transparent 62%),
    radial-gradient(900px 600px at 96% 8%, rgba(139, 92, 246, .14), transparent 60%),
    linear-gradient(rgba(125, 176, 255, .07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(125, 176, 255, .07) 1px, transparent 1px),
    linear-gradient(rgba(125, 176, 255, .028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(125, 176, 255, .028) 1px, transparent 1px);
  background-size: auto, auto, 240px 240px, 240px 240px, 24px 24px, 24px 24px;
  background-position: 0 0, 0 0, -1px -1px, -1px -1px, -1px -1px, -1px -1px;
  min-height: 60vh;
}
.cm.cm-page::before {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(520px circle at var(--cm-mx, 50%) var(--cm-my, -30%), rgba(62, 230, 255, .075), transparent 62%);
}
.cm.cm-page::after { /* faint scanline sheen */
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: repeating-linear-gradient(180deg, rgba(255, 255, 255, .012) 0 1px, transparent 1px 4px);
  mask-image: linear-gradient(180deg, #000, transparent 70%);
  -webkit-mask-image: linear-gradient(180deg, #000, transparent 70%);
}

/* ---------- 6. Small parts: eyebrow, chips, dimension ornaments, gradient text ---------- */
.cm .cm-eyebrow { display: inline-flex; align-items: center; gap: .6em; font-family: var(--cm-mono); font-size: .76rem; letter-spacing: .14em; text-transform: uppercase; color: var(--cm-cyan); margin: 0 0 1.1rem; }
.cm .cm-eyebrow::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--cm-cyan); box-shadow: 0 0 0 4px rgba(62, 230, 255, .14), 0 0 14px var(--cm-cyan); flex: none; }
.cm .cm-eyebrow--plain::before { display: none; }
.cm .cm-grad { background: var(--cm-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.cm .cm-lead { font-size: clamp(1.05rem, .98rem + .35vw, 1.25rem); color: var(--cm-text-2); max-width: 62ch; line-height: 1.65; }
.cm .cm-muted { color: var(--cm-muted); }
.cm .cm-small { font-size: .875rem; }
.cm .cm-mono { font-family: var(--cm-mono); }
.cm .cm-chip { display: inline-flex; align-items: center; gap: .45em; font-family: var(--cm-mono); font-size: .7rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; padding: .38em .7em; border-radius: 999px; border: 1px solid var(--cm-line-2); color: var(--cm-text-2); background: rgba(14, 23, 41, .7); white-space: nowrap; line-height: 1.2; }
.cm .cm-chip--ok { color: #a7fbe9; border-color: rgba(94, 234, 212, .4); background: rgba(94, 234, 212, .08); }
.cm .cm-chip--ok::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--cm-green); box-shadow: 0 0 8px var(--cm-green); }
.cm .cm-chip--soon { color: #fde68a; border-color: rgba(251, 191, 36, .4); background: rgba(251, 191, 36, .08); }
.cm .cm-chip--violet { color: #ddd3ff; border-color: rgba(178, 157, 255, .45); background: rgba(139, 92, 246, .12); }
.cm .cm-chips { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; padding: 0; margin: 0 0 1rem; }
.cm .cm-chips li { margin: 0; }

/* dimension line ornament:  |<-------- label -------->|  */
.cm .cm-dim { display: flex; align-items: center; gap: 12px; font-family: var(--cm-mono); font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--cm-muted); margin: 0 0 1.2rem; }
.cm .cm-dim::before, .cm .cm-dim::after { content: ""; flex: 1; height: 9px; min-width: 24px;
  background:
    linear-gradient(var(--cm-line-2), var(--cm-line-2)) left center / 1px 9px no-repeat,
    linear-gradient(var(--cm-line-2), var(--cm-line-2)) center / 100% 1px no-repeat; }
.cm .cm-dim::after { transform: scaleX(-1); }
.cm .cm-dim span { color: var(--cm-cyan); }

/* section heads */
.cm .cm-head { max-width: 760px; margin: 0 0 clamp(28px, 4vw, 48px); }
.cm .cm-head--center { margin-left: auto; margin-right: auto; text-align: center; }
.cm .cm-head--center .cm-lead { margin-left: auto; margin-right: auto; }
.cm .cm-head p:last-child { margin-bottom: 0; }
.cm .cm-index { font-family: var(--cm-mono); font-size: .76rem; letter-spacing: .14em; text-transform: uppercase; color: var(--cm-muted); display: block; margin-bottom: .9rem; }
.cm .cm-index b { color: var(--cm-cyan); font-weight: 500; }

/* ---------- 7. Buttons ---------- */
.cm .cm-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin: 1.6rem 0 0; }
.cm .cm-btn {
  --b: var(--cm-line-2);
  display: inline-flex; align-items: center; justify-content: center; gap: .55em;
  min-height: 46px; padding: .7em 1.25em; border-radius: 11px; border: 1px solid var(--b);
  font: 600 .98rem/1.1 var(--cm-font); letter-spacing: .005em; text-decoration: none; cursor: pointer;
  color: var(--cm-text); background: rgba(14, 23, 41, .6); position: relative; overflow: hidden;
  transition: transform .25s var(--cm-ease), box-shadow .25s, border-color .25s, background-color .25s, color .2s;
}
.cm .cm-btn:hover { color: #fff; border-color: rgba(62, 230, 255, .6); box-shadow: 0 0 0 4px rgba(62, 230, 255, .08), 0 10px 30px -12px rgba(62, 230, 255, .5); transform: translateY(-1px); }
.cm .cm-btn--primary { color: var(--cm-ink); border-color: transparent; background: var(--cm-grad); box-shadow: 0 10px 30px -12px rgba(62, 230, 255, .7); }
.cm .cm-btn--primary:hover { color: var(--cm-ink); box-shadow: 0 0 0 4px rgba(122, 168, 255, .18), 0 16px 40px -14px rgba(122, 168, 255, .9); }
.cm .cm-btn--primary::after { content: ""; position: absolute; inset: 0; background: linear-gradient(115deg, transparent 30%, rgba(255, 255, 255, .45) 50%, transparent 70%); transform: translateX(-120%); transition: transform .7s var(--cm-ease); }
.cm .cm-btn--primary:hover::after { transform: translateX(120%); }
.cm .cm-btn--ghost { background: transparent; }
.cm .cm-btn--sm { min-height: 44px; padding: .5em 1em; font-size: .92rem; border-radius: 10px; }
.cm .cm-btn--block { width: 100%; }
.cm .cm-btn .cm-arrow { transition: transform .25s var(--cm-ease); }
.cm .cm-btn:hover .cm-arrow { transform: translateX(3px); }
.cm .cm-link { font-weight: 600; text-decoration: none; display: inline-flex; align-items: center; gap: .4em; }
.cm .cm-link::after { content: "\2192"; transition: transform .25s var(--cm-ease); }
.cm .cm-link:hover::after { transform: translateX(3px); }

/* ---------- 8. Cards: glass, CAD selection corners, cursor spotlight ---------- */
.cm .cm-card, .cm .cm-tile, .cm .cm-plan {
  --mx: 50%; --my: 0%;
  position: relative; border: 1px solid var(--cm-line); border-radius: var(--cm-radius);
  background:
    radial-gradient(420px circle at var(--mx) var(--my), rgba(62, 230, 255, .07), transparent 55%),
    linear-gradient(180deg, var(--cm-panel-2), var(--cm-panel));
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  padding: clamp(20px, 2.4vw, 28px);
  transition: border-color .3s, transform .35s var(--cm-ease), box-shadow .35s;
}
.cm .cm-card > :last-child, .cm .cm-tile > :last-child, .cm .cm-plan > :last-child { margin-bottom: 0; }
.cm .cm-card::before, .cm .cm-tile::before {
  content: ""; position: absolute; inset: -1px; border-radius: inherit; pointer-events: none; opacity: 0; transition: opacity .3s;
  background:
    linear-gradient(var(--cm-cyan), var(--cm-cyan)) top left / 14px 1.5px no-repeat,
    linear-gradient(var(--cm-cyan), var(--cm-cyan)) top left / 1.5px 14px no-repeat,
    linear-gradient(var(--cm-cyan), var(--cm-cyan)) top right / 14px 1.5px no-repeat,
    linear-gradient(var(--cm-cyan), var(--cm-cyan)) top right / 1.5px 14px no-repeat,
    linear-gradient(var(--cm-violet), var(--cm-violet)) bottom left / 14px 1.5px no-repeat,
    linear-gradient(var(--cm-violet), var(--cm-violet)) bottom left / 1.5px 14px no-repeat,
    linear-gradient(var(--cm-violet), var(--cm-violet)) bottom right / 14px 1.5px no-repeat,
    linear-gradient(var(--cm-violet), var(--cm-violet)) bottom right / 1.5px 14px no-repeat;
}
.cm .cm-card:hover, .cm .cm-tile:hover { border-color: var(--cm-line-2); transform: translateY(-3px); box-shadow: 0 24px 60px -30px rgba(0, 0, 0, .9), 0 0 0 1px rgba(62, 230, 255, .06); }
.cm .cm-card:hover::before, .cm .cm-tile:hover::before, .cm .cm-tile:focus-within::before { opacity: 1; }
.cm .cm-card h3 { margin-bottom: .45em; }
.cm .cm-card p { color: var(--cm-text-2); }
.cm .cm-card--flat:hover { transform: none; }
.cm .cm-icon { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 12px; margin-bottom: 1rem; color: var(--cm-cyan); background: linear-gradient(180deg, rgba(62, 230, 255, .14), rgba(139, 92, 246, .1)); border: 1px solid var(--cm-line-2); }
.cm .cm-icon svg { width: 22px; height: 22px; }
.cm .cm-num { font-family: var(--cm-mono); font-size: .74rem; color: var(--cm-cyan); letter-spacing: .12em; display: block; margin-bottom: .8rem; }

/* ---------- 9. Header and main menu ----------
   One menu in the HTML for every screen size. 1120px and wider: a bar of sections whose panels open
   under the header (Connectors is a mega panel). Narrower: the same menu as a full-screen overlay with
   accordion sections. Without the script, sections are <details> elements and the overlay opens with
   #cm-mnav (:target), so every link still works. The script turns them into disclosure buttons. */
.cm.cm-header { position: relative; z-index: 60; border-bottom: 1px solid var(--cm-line); transition: border-color .3s; }
/* the glass lives on a pseudo-element: a backdrop-filter on the header itself would trap the fixed overlay */
.cm.cm-header::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: rgba(5, 8, 15, .74);
  -webkit-backdrop-filter: saturate(140%) blur(14px); backdrop-filter: saturate(140%) blur(14px);
  transition: background-color .3s;
}
.cm.cm-header.is-scrolled { border-bottom-color: var(--cm-line-2); }
.cm.cm-header.is-scrolled::before { background: rgba(5, 8, 15, .9); }
.cm.cm-header::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: linear-gradient(90deg, transparent, rgba(62, 230, 255, .55), rgba(178, 157, 255, .55), transparent); opacity: .55; pointer-events: none; }
.cm .cm-header__bar { display: flex; align-items: center; gap: 10px; min-height: 68px; }
.cm .cm-brand { display: inline-flex; align-items: center; text-decoration: none; flex: none; min-height: 44px; padding: 4px 0; }
.cm .cm-brand__logo { display: block; width: 164px; height: 40px; background: var(--cm-logo, url("/wp-content/plugins/cadmcp-site/assets/logo/concept-1/lockup.svg")) left center / contain no-repeat; }
.cm .cm-brand__text { display: none; font: 700 1.15rem/1 var(--cm-mono); letter-spacing: .04em; color: var(--cm-text); }
.cm .cm-brand__text span { color: var(--cm-cyan); }
@media (forced-colors: active) { .cm .cm-brand__logo { display: none; } .cm .cm-brand__text { display: inline; } }
@media (max-width: 359px) { .cm .cm-brand__logo { width: 136px; height: 34px; } }

/* links the script turns into buttons keep their look */
.cm :where(button.cm-mnav__top, button.cm-menu-btn, button.cm-find, button.cm-mnav__close, button.cm-mnav__find) {
  -webkit-appearance: none; appearance: none; margin: 0; font: inherit; color: inherit; background: none; border: 0; text-align: left;
}

/* 9a. Right side: quick find, sign in, join, phone menu button */
.cm .cm-tools { display: flex; align-items: center; gap: 6px; margin-left: auto; flex: none; }
.cm .cm-find {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-width: 44px; height: 44px; padding: 0 12px;
  border-radius: 10px; border: 1px solid var(--cm-line-2); background: rgba(14, 23, 41, .6); color: var(--cm-text-2);
  font: 600 .9rem/1 var(--cm-font); text-decoration: none; cursor: pointer; white-space: nowrap;
  transition: color .2s, border-color .2s, box-shadow .2s;
}
.cm .cm-find svg { width: 18px; height: 18px; flex: none; }
.cm .cm-find:hover, .cm .cm-find[aria-expanded="true"] { color: #fff; border-color: rgba(62, 230, 255, .55); box-shadow: 0 0 0 3px rgba(62, 230, 255, .07), 0 0 20px -6px rgba(62, 230, 255, .65); }
.cm .cm-find__t, .cm .cm-find__k { display: none; }
.cm .cm-find__k { font: 500 .66rem/1 var(--cm-mono); letter-spacing: .04em; padding: 4px 6px; border-radius: 5px; color: var(--cm-muted); background: rgba(62, 230, 255, .06); border: 1px solid var(--cm-line); }
.cm .cm-signin { display: none; align-items: center; min-height: 44px; padding: 8px 10px; border-radius: 8px; color: var(--cm-text-2); text-decoration: none; font-weight: 600; font-size: .94rem; white-space: nowrap; transition: color .2s; }
.cm .cm-signin:hover, .cm .cm-signin[aria-current="page"] { color: #fff; }
.cm .cm-tools__go { display: none; white-space: nowrap; }
.cm .cm-menu-btn {
  display: grid; place-items: center; width: 44px; height: 44px; padding: 0; flex: none; cursor: pointer; text-decoration: none;
  border-radius: 10px; border: 1px solid var(--cm-line-2); background: rgba(14, 23, 41, .7); color: var(--cm-text);
  transition: border-color .2s, box-shadow .2s;
}
.cm .cm-menu-btn svg { width: 20px; height: 20px; }
.cm .cm-menu-btn:hover { border-color: rgba(62, 230, 255, .55); box-shadow: 0 0 20px -6px rgba(62, 230, 255, .65); }
@media (min-width: 520px) { .cm .cm-tools__go { display: inline-flex; } }

/* 9b. Shared menu parts */
.cm .cm-mnav { display: none; }
.cm .cm-mnav__list, .cm .cm-mnav__links, .cm .cm-mnav__progs { list-style: none; margin: 0; padding: 0; }
.cm .cm-mnav__list > li, .cm .cm-mnav__links > li, .cm .cm-mnav__progs > li { margin: 0; }
.cm .cm-mnav__det > summary { list-style: none; }
.cm .cm-mnav__det > summary::-webkit-details-marker { display: none; }
.cm .cm-mnav__panel[hidden] { display: none !important; }
.cm .cm-mnav__ink { display: none; }
.cm .cm-mnav__top { cursor: pointer; text-decoration: none; }
.cm .cm-mnav__chev { flex: none; width: 12px; height: 12px; color: var(--cm-muted); transition: transform .3s var(--cm-ease), color .2s; }
.cm .cm-mnav__det[open] > .cm-mnav__top .cm-mnav__chev, .cm .cm-mnav__top[aria-expanded="true"] .cm-mnav__chev { transform: rotate(180deg); color: var(--cm-cyan); }
.cm .cm-mnav__frame { position: relative; }
.cm .cm-mnav__head { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 4px 16px; margin: 0 0 14px; padding: 0 2px 10px; border-bottom: 1px dashed var(--cm-line-2); font: 500 .66rem/1.3 var(--cm-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--cm-muted); }
.cm .cm-mnav__head span:first-child { color: var(--cm-cyan); }
.cm .cm-mnav__head span:first-child::before { content: ""; display: inline-block; width: 6px; height: 6px; margin: 0 9px 1px 1px; background: var(--cm-cyan); box-shadow: 0 0 8px var(--cm-cyan); transform: rotate(45deg); }
.cm .cm-mnav__target { display: flex; align-items: center; gap: 12px; margin: 14px 0 0; padding: 10px 2px 0; border-top: 1px dashed var(--cm-line); font: 500 .66rem/1.3 var(--cm-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--cm-muted); }
.cm .cm-mnav__path { color: #cdf6ff; letter-spacing: .04em; text-transform: none; }
.cm .cm-mnav__path::after { content: ""; display: inline-block; width: 7px; height: 12px; margin-left: 4px; vertical-align: -2px; background: var(--cm-cyan); animation: cm-blink 1.1s steps(1) infinite; }
.cm .cm-mnav__kicker { margin: 0 0 8px; font: 500 .68rem/1.3 var(--cm-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--cm-cyan); }
.cm .cm-mnav__lead { margin: 0 0 14px; color: var(--cm-text-2); font-size: .92rem; line-height: 1.5; }
.cm .cm-mnav__links { display: grid; gap: 4px; }

/* links: a CAD balloon (item callout) and the title */
.cm .cm-mnav__a {
  display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px; align-items: start; min-height: 44px; padding: 9px 12px;
  border-radius: 11px; border: 1px solid transparent; color: var(--cm-text); text-decoration: none; position: relative;
  transition: border-color .2s, background-color .2s, color .2s;
}
.cm .cm-mnav__a:hover, .cm .cm-mnav__a:focus-visible { color: #fff; border-color: var(--cm-line-2); background: rgba(62, 230, 255, .05); }
.cm .cm-mnav__a[aria-current="page"] { border-color: rgba(62, 230, 255, .32); background: rgba(62, 230, 255, .06); }
.cm .cm-mnav__ball {
  display: grid; place-items: center; min-width: 26px; height: 26px; padding: 0 5px; border-radius: 999px;
  border: 1px solid var(--cm-line-2); background: rgba(5, 8, 15, .6); color: var(--cm-cyan); font: 500 .64rem/1 var(--cm-mono);
  transition: background-color .2s, color .2s, box-shadow .2s, border-color .2s;
}
.cm .cm-mnav__a:hover .cm-mnav__ball, .cm .cm-mnav__a:focus-visible .cm-mnav__ball, .cm .cm-mnav__a[aria-current="page"] .cm-mnav__ball { background: var(--cm-cyan); border-color: var(--cm-cyan); color: var(--cm-ink); box-shadow: 0 0 14px rgba(62, 230, 255, .6); }
.cm .cm-mnav__txt { display: grid; gap: 3px; min-width: 0; padding-top: 3px; }
.cm .cm-mnav__t { font-weight: 600; font-size: .95rem; line-height: 1.3; }
.cm .cm-mnav__desc { font-size: .82rem; line-height: 1.45; color: var(--cm-muted); transition: color .2s; }
.cm .cm-mnav__a:hover .cm-mnav__desc, .cm .cm-mnav__a:focus-visible .cm-mnav__desc { color: var(--cm-text-2); }
.cm .cm-mnav__cta { display: inline-flex; align-items: center; gap: .5em; min-height: 44px; padding: 0 16px; border-radius: 10px; border: 1px solid rgba(62, 230, 255, .45); background: rgba(62, 230, 255, .08); color: #dffaff; font-weight: 600; text-decoration: none; transition: border-color .2s, box-shadow .2s, color .2s; }
.cm .cm-mnav__cta::after { content: "\2192"; transition: transform .25s var(--cm-ease); }
.cm .cm-mnav__cta:hover { color: #fff; border-color: rgba(62, 230, 255, .75); box-shadow: 0 0 22px -6px rgba(62, 230, 255, .7); }
.cm .cm-mnav__cta:hover::after { transform: translateX(3px); }
.cm .cm-mnav__colh { margin: 0 0 8px; padding: 0 2px; font: 500 .66rem/1.3 var(--cm-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--cm-violet); }
.cm .cm-mnav__kv { display: grid; margin: 0 0 6px; font-size: .92rem; color: var(--cm-text); }
.cm .cm-mnav__kv span { font: 500 .62rem/1.3 var(--cm-mono); letter-spacing: .14em; color: var(--cm-muted); }
.cm .cm-mnav__kv a { display: inline-flex; align-items: center; min-height: 44px; color: var(--cm-text); font-weight: 600; text-decoration: none; justify-self: start; }
.cm .cm-mnav__kv a:hover { color: var(--cm-cyan); }

/* the request flow drawing (Product) */
.cm .cm-mnav__flow { display: block; width: 100%; max-width: 250px; height: auto; overflow: visible; }
.cm .cm-mnav__flow-w { fill: none; stroke: var(--cm-line-2); stroke-width: 1.5; stroke-dasharray: 3 4; }
.cm .cm-mnav__flow-p { fill: none; stroke: var(--cm-cyan); stroke-width: 2.2; stroke-linecap: round; stroke-dasharray: 14 86; animation: cm-mnav-flow 2.6s linear infinite; filter: drop-shadow(0 0 4px rgba(62, 230, 255, .8)); }
.cm .cm-mnav__flow-n circle { fill: #0a1120; stroke: var(--cm-cyan); stroke-width: 1.4; }
.cm .cm-mnav__flow-n rect { fill: #0a1120; stroke: var(--cm-violet); stroke-width: 1.4; }
.cm .cm-mnav__flow-t text { font: 500 8.5px var(--cm-mono); letter-spacing: .08em; fill: var(--cm-muted); text-anchor: middle; }
.cm .cm-mnav__flow-ok { font: 600 7.5px var(--cm-mono); letter-spacing: .12em; fill: var(--cm-green); text-anchor: middle; }

/* Connectors: the featured SOLIDWORKS card and the program grid */
.cm .cm-mnav__feat {
  --mx: 50%; --my: 0%;
  display: flex; flex-direction: column; gap: 6px; padding: 16px 18px 18px; border-radius: 14px; position: relative; overflow: hidden;
  border: 1px solid rgba(62, 230, 255, .32); color: var(--cm-text); text-decoration: none;
  background: radial-gradient(360px circle at var(--mx) var(--my), rgba(62, 230, 255, .13), transparent 60%), linear-gradient(160deg, rgba(34, 211, 238, .1), rgba(139, 92, 246, .08) 60%, rgba(14, 23, 41, .6));
  transition: border-color .25s, box-shadow .25s, color .2s;
}
.cm .cm-mnav__feat:hover, .cm .cm-mnav__feat:focus-visible { color: #fff; border-color: rgba(62, 230, 255, .65); box-shadow: 0 0 0 4px rgba(62, 230, 255, .07), 0 20px 50px -24px rgba(62, 230, 255, .55); }
.cm .cm-mnav__feat-top { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.cm .cm-mnav__feat .cm-mono-badge { width: 48px; height: 48px; font-size: .74rem; border-radius: 12px; }
.cm .cm-mnav__feat .cm-mono-badge::after { inset: 4px; border-radius: 8px; }
.cm .cm-mnav__cube { display: block; width: 120px; height: auto; align-self: center; overflow: visible; margin: 2px 0; }
.cm .cm-mnav__cube-h { fill: rgba(62, 230, 255, .05); stroke: var(--cm-cyan); stroke-width: 1.4; stroke-linejoin: round; }
.cm .cm-mnav__cube-e { fill: none; stroke: rgba(62, 230, 255, .55); stroke-width: 1.1; stroke-dasharray: 4 3; }
.cm .cm-mnav__cube-c { fill: rgba(5, 8, 15, .7); stroke: var(--cm-violet); stroke-width: 1.2; }
.cm .cm-mnav__cube-s { stroke: var(--cm-violet); stroke-width: 1.2; opacity: .85; animation: cm-mnav-cube 3.2s ease-in-out infinite alternate; filter: drop-shadow(0 0 3px rgba(178, 157, 255, .9)); }
.cm .cm-mnav__feat-name { font-size: 1.25rem; font-weight: 700; letter-spacing: -.01em; line-height: 1.2; }
.cm .cm-mnav__feat .cm-api, .cm .cm-mnav__prog .cm-api { display: block; font: 500 .7rem/1.4 var(--cm-mono); letter-spacing: .02em; color: var(--cm-muted); }
.cm .cm-mnav__feat-p { font-size: .84rem; line-height: 1.5; color: var(--cm-text-2); }
.cm .cm-mnav__go { display: inline-flex; align-items: center; gap: .4em; margin-top: auto; padding-top: 6px; font-weight: 600; font-size: .9rem; color: var(--cm-cyan); }
.cm .cm-mnav__go::after { content: "\2192"; transition: transform .25s var(--cm-ease); }
.cm .cm-mnav__feat:hover .cm-mnav__go::after { transform: translateX(3px); }
.cm .cm-mnav__progs { display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; }
.cm .cm-mnav__progs > li { display: flex; }
.cm .cm-mnav__prog {
  --mx: 50%; --my: 0%;
  flex: 1 1 auto; display: grid; grid-template-columns: 36px minmax(0, 1fr); grid-template-areas: "b t" "b c"; column-gap: 11px; row-gap: 6px; align-items: start;
  padding: 9px 10px; border-radius: 11px; border: 1px solid var(--cm-line); color: var(--cm-text); text-decoration: none;
  background: radial-gradient(220px circle at var(--mx) var(--my), rgba(62, 230, 255, .08), transparent 60%), rgba(14, 23, 41, .55);
  transition: border-color .2s, box-shadow .2s, color .2s;
}
.cm .cm-mnav__prog:hover, .cm .cm-mnav__prog:focus-visible, .cm .cm-mnav__prog[aria-current="page"] { color: #fff; border-color: rgba(62, 230, 255, .45); box-shadow: 0 0 0 3px rgba(62, 230, 255, .06); }
.cm .cm-mnav__prog .cm-mono-badge { grid-area: b; width: 36px; height: 36px; font-size: .56rem; letter-spacing: .02em; border-radius: 9px; }
.cm .cm-mnav__prog .cm-mono-badge::after { inset: 3px; border-radius: 6px; }
.cm .cm-mnav__pt { grid-area: t; display: grid; gap: 1px; min-width: 0; }
.cm .cm-mnav__pn { font-weight: 600; font-size: .9rem; line-height: 1.3; }
.cm .cm-mnav__prog .cm-chip { grid-area: c; justify-self: start; font-size: .58rem; padding: .3em .55em; }
.cm .cm-mnav__prog--all { grid-template-areas: "b t"; border-style: dashed; border-color: var(--cm-line-2); background: transparent; }
.cm .cm-mnav__prog--all .cm-mono-badge { background: transparent; }

/* 9c. Desktop: a bar of sections, panels under the header */
@media (min-width: 1120px) {
  .cm .cm-signin { display: inline-flex; }
  .cm .cm-menu-btn { display: none; }
  .cm .cm-tools { margin-left: 0; }
  .cm .cm-mnav { display: flex; align-self: stretch; margin: 0 auto; }
  .cm .cm-mnav__bar, .cm .cm-mnav__find, .cm .cm-mnav__foot { display: none; }
  .cm .cm-mnav__list { display: flex; align-items: stretch; gap: 2px; }
  .cm .cm-mnav__item { display: flex; align-items: center; }
  .cm .cm-mnav__top {
    display: inline-flex; align-items: center; gap: 7px; min-height: 44px; padding: 8px 12px; border-radius: 9px; white-space: nowrap;
    color: var(--cm-text-2); font: 600 .94rem/1 var(--cm-font); transition: color .2s, background-color .2s;
  }
  .cm .cm-mnav__top:hover, .cm .cm-mnav__det[open] > .cm-mnav__top, .cm .cm-mnav__top[aria-expanded="true"] { color: #fff; background: rgba(125, 176, 255, .08); }
  .cm .cm-mnav__top[aria-current="page"], .cm .cm-mnav__top.is-current { color: #fff; }
  .cm .cm-mnav__top.is-current .cm-mnav__chev { color: var(--cm-cyan); }

  .cm .cm-mnav__panel {
    position: absolute; top: 100%; left: var(--cm-gutter); right: var(--cm-gutter); z-index: 5;
    max-height: calc(100vh - 88px - var(--cm-banner-h, 44px) - var(--wp-admin--admin-bar--height, 0px));
    max-height: calc(100dvh - 88px - var(--cm-banner-h, 44px) - var(--wp-admin--admin-bar--height, 0px));
    overflow-y: auto; overscroll-behavior: contain;
    border: 1px solid var(--cm-line-2); border-top-color: rgba(62, 230, 255, .45); border-radius: 0 0 18px 18px;
    background:
      linear-gradient(rgba(125, 176, 255, .045) 1px, transparent 1px) 0 0 / 24px 24px,
      linear-gradient(90deg, rgba(125, 176, 255, .045) 1px, transparent 1px) 0 0 / 24px 24px,
      radial-gradient(900px 320px at 18% 0%, rgba(62, 230, 255, .09), transparent 60%),
      linear-gradient(180deg, rgba(10, 17, 32, .93), rgba(5, 8, 15, .96));
    -webkit-backdrop-filter: blur(18px) saturate(150%); backdrop-filter: blur(18px) saturate(150%);
    box-shadow: 0 44px 90px -30px rgba(0, 0, 0, .95), 0 0 0 1px rgba(62, 230, 255, .04), 0 -2px 26px -6px rgba(62, 230, 255, .45);
    animation: cm-mnav-open .42s var(--cm-ease) backwards;
  }
  .cm .cm-mnav__frame { padding: 18px 22px 20px; }
  /* HUD corner brackets */
  .cm .cm-mnav__frame::before {
    content: ""; position: absolute; inset: 8px; pointer-events: none; opacity: .85;
    background:
      linear-gradient(var(--cm-cyan), var(--cm-cyan)) top left / 14px 1.5px no-repeat,
      linear-gradient(var(--cm-cyan), var(--cm-cyan)) top left / 1.5px 14px no-repeat,
      linear-gradient(var(--cm-cyan), var(--cm-cyan)) top right / 14px 1.5px no-repeat,
      linear-gradient(var(--cm-cyan), var(--cm-cyan)) top right / 1.5px 14px no-repeat,
      linear-gradient(var(--cm-violet), var(--cm-violet)) bottom left / 14px 1.5px no-repeat,
      linear-gradient(var(--cm-violet), var(--cm-violet)) bottom left / 1.5px 14px no-repeat,
      linear-gradient(var(--cm-violet), var(--cm-violet)) bottom right / 14px 1.5px no-repeat,
      linear-gradient(var(--cm-violet), var(--cm-violet)) bottom right / 1.5px 14px no-repeat;
  }
  /* scan line that sweeps the panel once as it opens */
  .cm .cm-mnav__frame::after {
    content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; pointer-events: none; opacity: 0;
    background: linear-gradient(90deg, transparent, rgba(62, 230, 255, .95) 30%, rgba(178, 157, 255, .95) 70%, transparent);
    box-shadow: 0 0 18px 3px rgba(62, 230, 255, .4);
    animation: cm-mnav-scan .75s var(--cm-ease) .04s;
  }
  .cm .cm-mnav__body { display: grid; grid-template-columns: minmax(220px, 280px) minmax(0, 1fr); gap: 22px; align-items: start; }
  .cm .cm-mnav__body--mega { grid-template-columns: minmax(250px, 300px) minmax(0, 1fr); align-items: stretch; }
  .cm .cm-mnav__body--cols { grid-template-columns: minmax(210px, 250px) minmax(0, .9fr) minmax(0, 1.7fr); }
  .cm .cm-mnav__intro { align-self: stretch; padding: 4px 22px 4px 2px; border-right: 1px dashed var(--cm-line-2); }
  .cm .cm-mnav__links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cm .cm-mnav__col .cm-mnav__links { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .cm .cm-mnav__col:last-child .cm-mnav__links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cm .cm-mnav__progs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  /* staggered reveal of the items */
  .cm .cm-mnav__panel :is(.cm-mnav__intro, .cm-mnav__feat, .cm-mnav__colh, .cm-mnav__links > li, .cm-mnav__progs > li) {
    animation: cm-mnav-item .45s var(--cm-ease) backwards; animation-delay: calc(90ms + var(--i, 0) * 26ms);
  }
  /* the glowing marker under the current or pointed-at section */
  .cm .cm-mnav__ink {
    display: block; position: absolute; left: 0; bottom: -1px; z-index: 6; height: 2px; width: var(--w, 0px); transform: translateX(var(--x, 0px));
    border-radius: 2px; background: var(--cm-grad); box-shadow: 0 0 12px rgba(62, 230, 255, .85), 0 0 2px #3ee6ff; opacity: 0; pointer-events: none;
    transition: opacity .25s;
  }
  .cm .cm-mnav__ink.is-ready { transition: transform .38s var(--cm-ease), width .38s var(--cm-ease), opacity .25s; }
  .cm .cm-mnav__ink.is-on { opacity: 1; }
  .cm .cm-mnav__ink::before { content: ""; position: absolute; left: 50%; top: -6px; width: 5px; height: 5px; margin-left: -2.5px; background: var(--cm-cyan); transform: rotate(45deg); box-shadow: 0 0 8px var(--cm-cyan); }
}
.cm .cm-mnav__panel li:nth-child(1) { --i: 1; }
.cm .cm-mnav__panel li:nth-child(2) { --i: 2; }
.cm .cm-mnav__panel li:nth-child(3) { --i: 3; }
.cm .cm-mnav__panel li:nth-child(4) { --i: 4; }
.cm .cm-mnav__panel li:nth-child(5) { --i: 5; }
.cm .cm-mnav__panel li:nth-child(6) { --i: 6; }
.cm .cm-mnav__panel li:nth-child(7) { --i: 7; }
.cm .cm-mnav__panel li:nth-child(8) { --i: 8; }
.cm .cm-mnav__panel li:nth-child(9) { --i: 9; }
.cm .cm-mnav__panel li:nth-child(10) { --i: 10; }
.cm .cm-mnav__panel li:nth-child(11) { --i: 11; }
.cm .cm-mnav__panel li:nth-child(12) { --i: 12; }
@media (min-width: 1280px) {
  .cm .cm-find { padding: 0 8px 0 12px; }
  .cm .cm-find__t, .cm .cm-find__k { display: inline-block; }
}

/* 9d. Phones and tablets: a full-screen overlay with accordion sections */
@media (max-width: 1119px) {
  html:not(.cm-js) .cm .cm-mnav:target, .cm .cm-mnav.is-open {
    display: flex; flex-direction: column; position: fixed; inset: 0; z-index: 10;
    overflow-y: auto; overscroll-behavior: contain; padding: 0 var(--cm-gutter);
    background:
      radial-gradient(120% 50% at 100% 0%, rgba(34, 211, 238, .1), transparent 60%),
      radial-gradient(90% 40% at 0% 100%, rgba(139, 92, 246, .1), transparent 60%),
      linear-gradient(rgba(125, 176, 255, .045) 1px, transparent 1px) 0 0 / 24px 24px,
      linear-gradient(90deg, rgba(125, 176, 255, .045) 1px, transparent 1px) 0 0 / 24px 24px,
      #05080f;
    animation: cm-mnav-sheet .5s var(--cm-ease) backwards;
  }
  html:not(.cm-js):has(.cm-mnav:target), html.cm-lock, html.cm-lock body { overflow: hidden; }
  html:not(.cm-js) body:has(.cm-mnav:target) header.wp-block-template-part,
  html.cm-lock body header.wp-block-template-part { z-index: 100000; }
  .cm .cm-mnav__bar {
    position: sticky; top: 0; z-index: 3; display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 68px;
    margin: 0 calc(-1 * var(--cm-gutter)); padding: 0 var(--cm-gutter);
    background: rgba(5, 8, 15, .92); border-bottom: 1px solid var(--cm-line);
  }
  .cm .cm-mnav__bar-t { display: inline-flex; align-items: center; gap: 10px; font: 500 .7rem/1 var(--cm-mono); letter-spacing: .16em; color: var(--cm-muted); }
  .cm .cm-mnav__bar-t::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--cm-cyan); box-shadow: 0 0 0 3px rgba(62, 230, 255, .15), 0 0 10px var(--cm-cyan); }
  .cm .cm-mnav__close { display: grid; place-items: center; width: 44px; height: 44px; flex: none; border-radius: 10px; border: 1px solid var(--cm-line-2); background: rgba(14, 23, 41, .7); color: var(--cm-text); cursor: pointer; }
  .cm .cm-mnav__close svg { width: 20px; height: 20px; }
  .cm .cm-mnav__close:hover { border-color: rgba(62, 230, 255, .55); }
  .cm .cm-mnav__find {
    display: flex; align-items: center; gap: 12px; width: 100%; min-height: 52px; margin: 16px 0 6px; padding: 0 14px; flex: none;
    border-radius: 12px; border: 1px solid var(--cm-line-2); background: rgba(14, 23, 41, .72); color: var(--cm-text-2);
    font: 600 1rem/1 var(--cm-font); text-decoration: none; cursor: pointer;
  }
  .cm .cm-mnav__find svg { width: 20px; height: 20px; color: var(--cm-cyan); flex: none; }
  .cm .cm-mnav__find kbd { margin-left: auto; font: 500 .7rem/1 var(--cm-mono); padding: 4px 7px; border-radius: 5px; border: 1px solid var(--cm-line-2); background: rgba(62, 230, 255, .06); color: var(--cm-muted); }
  .cm .cm-mnav__find:hover { color: #fff; border-color: rgba(62, 230, 255, .55); }
  .cm .cm-mnav__list { counter-reset: cm-sec -1; }
  .cm .cm-mnav__item { border-bottom: 1px solid var(--cm-line); }
  .cm .cm-mnav__top {
    display: flex; align-items: center; gap: 14px; width: 100%; min-height: 60px; padding: 8px 4px; scroll-margin-top: 76px;
    color: var(--cm-text); font: 700 1.15rem/1.2 var(--cm-font); letter-spacing: -.01em;
  }
  .cm .cm-mnav__top::before { counter-increment: cm-sec; content: counter(cm-sec, decimal-leading-zero); flex: none; width: 22px; font: 500 .7rem/1 var(--cm-mono); letter-spacing: .1em; color: var(--cm-muted); }
  .cm .cm-mnav__item--home .cm-mnav__top::after { content: "\2192"; margin-left: auto; color: var(--cm-muted); font-weight: 500; }
  .cm .cm-mnav__chev { margin-left: auto; width: 14px; height: 14px; }
  .cm .cm-mnav__det[open] > .cm-mnav__top, .cm .cm-mnav__top[aria-expanded="true"], .cm .cm-mnav__top[aria-current="page"] { color: #fff; }
  .cm .cm-mnav__det[open] > .cm-mnav__top::before, .cm .cm-mnav__top[aria-expanded="true"]::before, .cm .cm-mnav__top.is-current::before, .cm .cm-mnav__top[aria-current="page"]::before { color: var(--cm-cyan); }
  .cm .cm-mnav__panel { padding: 0 0 18px; animation: cm-mnav-acc .4s var(--cm-ease) backwards; }
  /* a feature tree: a dashed rail down the open section */
  .cm .cm-mnav__frame { margin-left: 10px; padding: 2px 0 2px 16px; border-left: 1px dashed rgba(62, 230, 255, .35); }
  .cm .cm-mnav__head { margin-bottom: 10px; letter-spacing: .08em; text-wrap: balance; }
  .cm .cm-mnav__head span:first-child { display: none; }
  .cm .cm-mnav__target, .cm .cm-mnav__intro { display: none; }
  .cm .cm-mnav__intro--contact { display: block; margin: 0 0 12px; }
  .cm .cm-mnav__body { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .cm .cm-mnav__links { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .cm .cm-mnav__a { min-height: 48px; padding: 9px 8px; align-items: center; }
  .cm .cm-mnav__txt { padding-top: 0; }
  .cm .cm-mnav__desc { display: none; }
  .cm .cm-mnav__col + .cm-mnav__col { margin-top: 6px; }
  .cm .cm-mnav__cube, .cm .cm-mnav__feat-p { display: none; }
  .cm .cm-mnav__panel :is(.cm-mnav__feat, .cm-mnav__links > li, .cm-mnav__progs > li) { animation: cm-mnav-item .4s var(--cm-ease) backwards; animation-delay: calc(60ms + var(--i, 0) * 22ms); }
  .cm .cm-mnav__foot {
    position: sticky; bottom: 0; z-index: 3; flex: none; margin: auto calc(-1 * var(--cm-gutter)) 0; padding: 14px var(--cm-gutter) 16px;
    background: linear-gradient(180deg, rgba(5, 8, 15, .7), #05080f 32%); border-top: 1px solid var(--cm-line);
  }
  .cm .cm-mnav__acts { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; }
  .cm .cm-mnav__acts .cm-btn { flex: 1 1 auto; white-space: nowrap; padding-left: .9em; padding-right: .9em; }
}
@media (min-width: 600px) and (max-width: 1119px) {
  .cm .cm-mnav__links { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
  .cm .cm-mnav__a { align-items: start; }
  .cm .cm-mnav__txt { padding-top: 3px; }
  .cm .cm-mnav__desc { display: block; }
  .cm .cm-mnav__progs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cm .cm-mnav__feat-p { display: block; }
  .cm .cm-mnav__body--cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cm .cm-mnav__intro--contact { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 0 28px; }
  .cm .cm-mnav__intro--contact .cm-mnav__kicker { flex-basis: 100%; }
  .cm .cm-mnav__col .cm-mnav__links, .cm .cm-mnav__col:last-child .cm-mnav__links { grid-template-columns: minmax(0, 1fr); }
  .cm .cm-mnav__col + .cm-mnav__col { margin-top: 0; }
  .cm .cm-mnav__acts { max-width: 560px; margin-left: auto; }
}
@media (min-width: 900px) and (max-width: 1119px) {
  .cm .cm-mnav__progs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cm .cm-mnav__body--mega { grid-template-columns: minmax(0, 260px) minmax(0, 1fr); }
  .cm .cm-mnav__body--mega .cm-mnav__progs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cm .cm-mnav__cube { display: block; }
}
@media (hover: none), (pointer: coarse) { .cm .cm-mnav__find kbd, .cm .cm-find__k { display: none !important; } }
/* short landscape phones: the actions scroll with the list instead of covering it */
@media (max-width: 1119px) and (max-height: 480px) { .cm .cm-mnav__foot { position: static; margin-top: 12px; } }

/* 9e. Quick find (Ctrl+K, / or the Find button): a modal list of every page */
.cm .cm-pal {
  --pal-top: min(12vh, 110px);
  width: min(680px, calc(100vw - 24px)); max-width: none; max-height: none; margin: var(--pal-top) auto 0; padding: 0; border: 0;
  background: transparent; color: var(--cm-text); overflow: visible;
}
.cm .cm-pal::backdrop { background: rgba(3, 6, 12, .64); -webkit-backdrop-filter: blur(5px) saturate(120%); backdrop-filter: blur(5px) saturate(120%); }
.cm .cm-pal__box {
  position: relative; display: flex; flex-direction: column; overflow: hidden;
  max-height: calc(100vh - var(--pal-top) - 16px); max-height: calc(100dvh - var(--pal-top) - 16px);
  border-radius: 16px; border: 1px solid var(--cm-line-2); border-top-color: rgba(62, 230, 255, .55);
  background:
    linear-gradient(rgba(125, 176, 255, .045) 1px, transparent 1px) 0 0 / 24px 24px,
    linear-gradient(90deg, rgba(125, 176, 255, .045) 1px, transparent 1px) 0 0 / 24px 24px,
    radial-gradient(700px 260px at 50% 0%, rgba(62, 230, 255, .1), transparent 60%),
    linear-gradient(180deg, #0b1324, #05080f);
  box-shadow: 0 50px 120px -30px rgba(0, 0, 0, .95), 0 0 0 1px rgba(62, 230, 255, .05), 0 0 70px -24px rgba(62, 230, 255, .45);
  animation: cm-pal-in .3s var(--cm-ease) backwards;
}
.cm .cm-pal__box::before {
  content: ""; position: absolute; inset: 7px; pointer-events: none; z-index: 2; opacity: .85;
  background:
    linear-gradient(var(--cm-cyan), var(--cm-cyan)) top left / 14px 1.5px no-repeat,
    linear-gradient(var(--cm-cyan), var(--cm-cyan)) top left / 1.5px 14px no-repeat,
    linear-gradient(var(--cm-cyan), var(--cm-cyan)) top right / 14px 1.5px no-repeat,
    linear-gradient(var(--cm-cyan), var(--cm-cyan)) top right / 1.5px 14px no-repeat,
    linear-gradient(var(--cm-violet), var(--cm-violet)) bottom left / 14px 1.5px no-repeat,
    linear-gradient(var(--cm-violet), var(--cm-violet)) bottom left / 1.5px 14px no-repeat,
    linear-gradient(var(--cm-violet), var(--cm-violet)) bottom right / 14px 1.5px no-repeat,
    linear-gradient(var(--cm-violet), var(--cm-violet)) bottom right / 1.5px 14px no-repeat;
}
.cm .cm-pal__box::after {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; pointer-events: none; z-index: 2; opacity: 0;
  background: linear-gradient(90deg, transparent, rgba(62, 230, 255, .95) 30%, rgba(178, 157, 255, .95) 70%, transparent);
  box-shadow: 0 0 18px 3px rgba(62, 230, 255, .4);
  animation: cm-mnav-scan .7s var(--cm-ease) .05s;
}
.cm .cm-pal__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 0; padding: 16px 20px 0; font: 500 .66rem/1.3 var(--cm-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--cm-muted); }
.cm .cm-pal__head > span:first-child { color: var(--cm-cyan); }
.cm .cm-pal__field { display: flex; align-items: center; gap: 12px; margin: 10px 14px 8px; padding: 0 12px; min-height: 54px; flex: none; border-radius: 12px; border: 1px solid var(--cm-line-2); background: rgba(5, 8, 15, .75); transition: border-color .2s, box-shadow .2s; }
.cm .cm-pal__field:focus-within { border-color: rgba(62, 230, 255, .6); box-shadow: 0 0 0 3px rgba(62, 230, 255, .12), 0 0 26px -8px rgba(62, 230, 255, .65); }
.cm .cm-pal__field svg { width: 20px; height: 20px; flex: none; color: var(--cm-cyan); }
.cm .cm-pal__input { flex: 1 1 auto; min-width: 0; height: 52px; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; color: #fff; font: 500 1.05rem/1.2 var(--cm-font); }
.cm .cm-pal__input::placeholder { color: var(--cm-muted); opacity: 1; }
.cm .cm-pal__input:focus, .cm .cm-pal__input:focus-visible { outline: none; box-shadow: none; }
.cm .cm-pal__field kbd, .cm .cm-pal__foot kbd { font: 500 .64rem/1 var(--cm-mono); padding: 4px 6px; border-radius: 5px; border: 1px solid var(--cm-line-2); background: rgba(62, 230, 255, .06); color: var(--cm-text-2); }
.cm .cm-pal__list { list-style: none; margin: 0; padding: 4px 10px 10px; flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.cm .cm-pal__list[hidden], .cm .cm-pal__opt[hidden], .cm .cm-pal__empty[hidden] { display: none; }
.cm .cm-pal__opt { margin: 0; }
.cm .cm-pal__opt a {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "t g" "p g"; column-gap: 12px; row-gap: 2px; align-items: center;
  min-height: 48px; padding: 7px 12px 7px 16px; border-radius: 10px; border: 1px solid transparent; position: relative;
  color: var(--cm-text); text-decoration: none;
}
.cm .cm-pal__t { grid-area: t; font-weight: 600; font-size: .96rem; line-height: 1.3; }
.cm .cm-pal__p { grid-area: p; font: 500 .7rem/1.3 var(--cm-mono); color: var(--cm-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cm .cm-pal__g { grid-area: g; font: 500 .58rem/1 var(--cm-mono); letter-spacing: .12em; color: var(--cm-muted); padding: 5px 8px; border-radius: 999px; border: 1px solid var(--cm-line); white-space: nowrap; }
.cm .cm-pal__opt[aria-selected="true"] a { background: linear-gradient(90deg, rgba(62, 230, 255, .13), rgba(62, 230, 255, .03)); border-color: rgba(62, 230, 255, .35); }
.cm .cm-pal__opt[aria-selected="true"] a::before { content: ""; position: absolute; left: 5px; top: 11px; bottom: 11px; width: 2px; border-radius: 2px; background: var(--cm-cyan); box-shadow: 0 0 10px var(--cm-cyan); }
.cm .cm-pal__opt[aria-selected="true"] .cm-pal__g { color: var(--cm-cyan); border-color: rgba(62, 230, 255, .4); }
.cm .cm-pal__m { padding: 0; background: none; color: var(--cm-cyan); text-decoration: underline; text-decoration-color: rgba(62, 230, 255, .55); text-underline-offset: 3px; }
.cm .cm-pal__empty { margin: 0; padding: 14px 22px 20px; color: var(--cm-text-2); }
.cm .cm-pal__foot { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 0; padding: 10px 20px 12px; flex: none; border-top: 1px dashed var(--cm-line); font: 500 .66rem/1.3 var(--cm-mono); letter-spacing: .06em; color: var(--cm-muted); }
.cm .cm-pal__foot span { display: inline-flex; align-items: center; gap: 4px; }
@media (max-width: 599px) {
  .cm .cm-pal { --pal-top: 12px; }
  .cm .cm-pal__g { display: none; }
}
@media (hover: none), (pointer: coarse) { .cm .cm-pal__foot, .cm .cm-pal__field kbd { display: none; } }

@keyframes cm-mnav-open { from { opacity: 0; transform: translateY(-8px); clip-path: inset(0 0 100% 0); } to { opacity: 1; transform: none; clip-path: inset(0 0 0 0); } }
@keyframes cm-mnav-scan { 0% { top: 0; opacity: 1; } 75% { opacity: .9; } 100% { top: 100%; opacity: 0; } }
@keyframes cm-mnav-item { from { opacity: 0; transform: translateY(6px); } }
@keyframes cm-mnav-acc { from { opacity: 0; transform: translateY(-6px); } }
@keyframes cm-mnav-sheet { from { clip-path: circle(0 at calc(100% - var(--cm-gutter) - 22px) 40px); } to { clip-path: circle(150vmax at calc(100% - var(--cm-gutter) - 22px) 40px); } }
@keyframes cm-mnav-flow { from { stroke-dashoffset: 100; } to { stroke-dashoffset: 0; } }
@keyframes cm-mnav-cube { from { transform: translateY(-32px); } to { transform: translateY(38px); } }
@keyframes cm-pal-in { from { opacity: 0; transform: translateY(-10px) scale(.985); } }

@media (forced-colors: active) {
  .cm .cm-mnav__panel, .cm .cm-pal__box { border: 1px solid CanvasText; }
  .cm .cm-mnav__ink { background: Highlight; }
  .cm .cm-mnav__top[aria-expanded="true"], .cm .cm-mnav__top.is-current, .cm .cm-pal__opt[aria-selected="true"] a { outline: 2px solid Highlight; outline-offset: -2px; }
  .cm .cm-mnav__a:hover, .cm .cm-mnav__prog, .cm .cm-mnav__feat, .cm .cm-find, .cm .cm-menu-btn, .cm .cm-mnav__close, .cm .cm-mnav__find { border: 1px solid CanvasText; }
}

/* ---------- 10. Footer ---------- */
.cm.cm-footer { background: #04070d; border-top: 1px solid var(--cm-line); position: relative; overflow: hidden; }
.cm.cm-footer::before { content: ""; position: absolute; inset: 0; pointer-events: none; background-image: linear-gradient(rgba(125, 176, 255, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(125, 176, 255, .045) 1px, transparent 1px); background-size: 24px 24px; mask-image: linear-gradient(180deg, #000, transparent 85%); -webkit-mask-image: linear-gradient(180deg, #000, transparent 85%); }
.cm .cm-footer__grid { position: relative; display: grid; gap: 32px; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 56px 0 28px; }
@media (min-width: 900px) { .cm .cm-footer__grid { grid-template-columns: 1.6fr repeat(4, 1fr); } }
.cm .cm-footer__about { grid-column: 1 / -1; }
@media (min-width: 900px) { .cm .cm-footer__about { grid-column: auto; } }
.cm .cm-footer__about p { color: var(--cm-muted); font-size: .92rem; max-width: 40ch; }
.cm.cm-footer h2 { font-family: var(--cm-mono); font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--cm-muted); font-weight: 500; margin: 0 0 14px; }
.cm.cm-footer ul { list-style: none; padding: 0; margin: 0; }
.cm.cm-footer li { margin: 0; }
.cm.cm-footer nav a, .cm .cm-footer__contact a, .cm .cm-footer__contact span { display: inline-flex; align-items: center; min-height: 44px; padding: 2px 0; }
.cm.cm-footer a { color: var(--cm-text-2); text-decoration: none; font-size: .95rem; }
.cm.cm-footer a:hover { color: #fff; }
.cm .cm-footer__legal { position: relative; border-top: 1px solid var(--cm-line); padding: 22px 0 34px; color: var(--cm-muted); font-size: .84rem; }
.cm .cm-footer__legal p { margin: 0 0 .6em; max-width: 120ch; }
.cm .cm-footer__legal a { color: var(--cm-text-2); text-decoration: underline; text-decoration-color: rgba(149, 166, 191, .5); font-size: inherit; }
.cm .cm-footer__copy { display: flex; flex-wrap: wrap; gap: 0 .5em; color: var(--cm-text-2); }
.cm .cm-footer__contact { margin-top: 10px !important; }
.cm .cm-footer__contact span { color: var(--cm-muted); font-size: .93rem; }
.cm .cm-footer__brand { margin-bottom: 14px; }

/* ---------- 11. Hero ---------- */
.cm .cm-hero { padding: clamp(40px, 7vw, 96px) 0 clamp(48px, 6vw, 88px); position: relative; }
.cm .cm-hero__grid { display: grid; gap: clamp(32px, 5vw, 56px); grid-template-columns: 1fr; align-items: center; }
@media (min-width: 1000px) { .cm .cm-hero__grid { grid-template-columns: 1.02fr 1fr; } }
.cm .cm-display { font-size: clamp(2.35rem, 1.2rem + 4.6vw, 4.6rem); line-height: 1.02; letter-spacing: -0.04em; margin-bottom: .45em; }
.cm .cm-display .cm-grad { display: inline-block; padding-bottom: .06em; }
.cm .cm-facts { display: flex; flex-wrap: wrap; gap: 10px 22px; list-style: none; padding: 0; margin: 2rem 0 0; font-family: var(--cm-mono); font-size: .78rem; letter-spacing: .06em; color: var(--cm-text-2); text-transform: uppercase; }
.cm .cm-facts li { margin: 0; display: inline-flex; align-items: center; gap: .55em; }
.cm .cm-facts li::before { content: ""; width: 14px; height: 1px; background: var(--cm-cyan); box-shadow: 0 0 6px var(--cm-cyan); }

/* HUD viewport frame around the live wireframe */
.cm .cm-hud { position: relative; margin: 0; border-radius: 18px; border: 1px solid var(--cm-line-2); background: radial-gradient(120% 90% at 50% 40%, rgba(19, 35, 66, .85), rgba(6, 10, 19, .92)); box-shadow: 0 40px 120px -50px rgba(34, 211, 238, .45), inset 0 0 0 1px rgba(255, 255, 255, .02); overflow: hidden; }
.cm .cm-hud::before { content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 1; background-image: linear-gradient(rgba(125, 176, 255, .06) 1px, transparent 1px), linear-gradient(90deg, rgba(125, 176, 255, .06) 1px, transparent 1px); background-size: 32px 32px; mask-image: radial-gradient(80% 70% at 50% 50%, #000, transparent); -webkit-mask-image: radial-gradient(80% 70% at 50% 50%, #000, transparent); }
.cm .cm-hud__bar { position: relative; z-index: 3; display: flex; justify-content: space-between; gap: 10px; padding: 10px 14px; font-family: var(--cm-mono); font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; color: var(--cm-muted); border-bottom: 1px solid var(--cm-line); background: rgba(5, 8, 15, .5); }
.cm .cm-hud__bar b { color: var(--cm-cyan); font-weight: 500; }
.cm .cm-hud__bar span:last-child { white-space: nowrap; }
.cm .cm-hud__stage { position: relative; aspect-ratio: 4 / 3; z-index: 2; }
.cm .cm-hud__stage canvas, .cm .cm-hud__stage .cm-hero__static { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.cm .cm-hud__stage canvas { opacity: 0; transition: opacity .6s; }
.cm .cm-hud.is-live .cm-hud__stage canvas { opacity: 1; }
.cm .cm-hud.is-live .cm-hero__static { opacity: 0; transition: opacity .4s; }
.cm .cm-hud__corner { position: absolute; width: 18px; height: 18px; z-index: 3; border-color: var(--cm-cyan); border-style: solid; border-width: 0; opacity: .8; }
.cm .cm-hud__corner--tl { top: 48px; left: 12px; border-top-width: 1.5px; border-left-width: 1.5px; }
.cm .cm-hud__corner--tr { top: 48px; right: 12px; border-top-width: 1.5px; border-right-width: 1.5px; }
.cm .cm-hud__corner--bl { bottom: 12px; left: 12px; border-bottom-width: 1.5px; border-left-width: 1.5px; border-color: var(--cm-violet); }
.cm .cm-hud__corner--br { bottom: 12px; right: 12px; border-bottom-width: 1.5px; border-right-width: 1.5px; border-color: var(--cm-violet); }
.cm .cm-hud__triad { position: absolute; left: 22px; bottom: 22px; z-index: 3; width: 54px; height: 54px; font-family: var(--cm-mono); font-size: 10px; }

/* the prompt + approval overlay */
.cm .cm-hero__overlay { position: relative; z-index: 3; display: grid; gap: 10px; padding: 0 14px 14px; margin-top: -8px; }
@media (min-width: 560px) { .cm .cm-hero__overlay { grid-template-columns: 1.35fr 1fr; align-items: end; } }
.cm .cm-term { border: 1px solid var(--cm-line-2); border-radius: 12px; background: rgba(4, 8, 16, .88); padding: 12px 14px; font-family: var(--cm-mono); font-size: .8rem; line-height: 1.55; color: #d7e6fb; min-height: 96px; }
.cm .cm-term__who { display: block; color: var(--cm-cyan); font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 6px; }
.cm .cm-term p { margin: 0; }
.cm .cm-term [data-cm-type].is-typing::after { content: ""; display: inline-block; width: .55em; height: 1.05em; margin-left: 2px; vertical-align: -0.15em; background: var(--cm-cyan); animation: cm-blink 1s steps(1) infinite; }
.cm .cm-approve { border: 1px solid rgba(94, 234, 212, .35); border-radius: 12px; background: rgba(6, 22, 26, .9); padding: 12px 14px; transition: opacity .5s, transform .5s var(--cm-ease); }
.cm .cm-approve__t { font-family: var(--cm-mono); font-size: .66rem; letter-spacing: .12em; text-transform: uppercase; color: #a7fbe9; margin: 0 0 6px; display: flex; align-items: center; gap: 6px; }
.cm .cm-approve__t::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--cm-green); box-shadow: 0 0 8px var(--cm-green); }
.cm .cm-approve ol { margin: 0 0 10px; padding: 0; list-style: none; font-size: .78rem; color: var(--cm-text-2); }
.cm .cm-approve li { margin: 2px 0; display: flex; gap: 6px; }
.cm .cm-approve li b { font-family: var(--cm-mono); font-weight: 500; color: var(--cm-cyan); font-size: .72rem; min-width: 5.2em; }
.cm .cm-approve__btns { display: flex; gap: 8px; }
.cm .cm-approve__btns span { flex: 1; text-align: center; font-size: .74rem; font-weight: 700; padding: 6px 8px; border-radius: 7px; border: 1px solid var(--cm-line-2); color: var(--cm-text-2); }
.cm .cm-approve__btns span:first-child { background: linear-gradient(90deg, #5eead4, #3ee6ff); color: var(--cm-ink); border-color: transparent; }
.cm .cm-hud.is-staged .cm-approve { opacity: 0; transform: translateY(8px); }
.cm .cm-hud.is-asking .cm-approve { opacity: 1; transform: none; }
.cm .cm-hud.is-approved .cm-approve__btns span:first-child { box-shadow: 0 0 0 3px rgba(94, 234, 212, .3), 0 0 22px rgba(94, 234, 212, .6); }
.cm .cm-hud figcaption { position: relative; z-index: 3; padding: 0 14px 12px; font-size: .74rem; color: var(--cm-muted); }

/* program ticker */
.cm .cm-ticker { border-top: 1px solid var(--cm-line); border-bottom: 1px solid var(--cm-line); background: rgba(5, 8, 15, .6); overflow: hidden; position: relative; }
.cm .cm-ticker::before, .cm .cm-ticker::after { content: ""; position: absolute; top: 0; bottom: 0; width: 80px; z-index: 2; pointer-events: none; }
.cm .cm-ticker::before { left: 0; background: linear-gradient(90deg, var(--cm-bg), transparent); }
.cm .cm-ticker::after { right: 0; background: linear-gradient(-90deg, var(--cm-bg), transparent); }
.cm .cm-ticker__track { display: flex; width: max-content; animation: cm-marquee 46s linear infinite; }
.cm .cm-ticker:hover .cm-ticker__track { animation-play-state: paused; }
.cm .cm-ticker ul { display: flex; list-style: none; margin: 0; padding: 18px 0; }
.cm .cm-ticker li { margin: 0; padding: 0 28px; font-family: var(--cm-mono); font-size: .86rem; letter-spacing: .1em; text-transform: uppercase; color: var(--cm-text-2); white-space: nowrap; display: flex; align-items: center; gap: 28px; }
.cm .cm-ticker li::after { content: "\25C7"; color: var(--cm-cyan); opacity: .7; }
.cm .cm-ticker a { color: inherit; text-decoration: none; }
.cm .cm-ticker a:hover { color: #fff; }

/* ---------- 12. Connection diagram (Claude <-> MCP <-> CAD) ---------- */
.cm .cm-diagram { position: relative; border: 1px solid var(--cm-line); border-radius: 18px; background: linear-gradient(180deg, rgba(14, 23, 41, .6), rgba(5, 8, 15, .6)); padding: clamp(14px, 3vw, 32px); overflow: hidden; }
.cm .cm-diagram svg { display: block; width: 100%; height: auto; overflow: visible; }
.cm svg.cm-defs { position: absolute; width: 0 !important; height: 0 !important; overflow: hidden; }
.cm .cm-diagram .cm-dg-v { display: block; max-width: 380px; margin: 0 auto; }
.cm .cm-diagram .cm-dg-h { display: none; }
@media (min-width: 1100px) { .cm .cm-diagram .cm-dg-v { display: none; } .cm .cm-diagram .cm-dg-h { display: block; } }
.cm .cm-dg-node { fill: rgba(9, 15, 28, .95); stroke: rgba(125, 176, 255, .35); stroke-width: 1.2; }
.cm .cm-dg-node--hub { fill: rgba(10, 22, 40, .95); stroke: url(#cmdgGrad); stroke-width: 2; }
.cm .cm-dg-t { fill: #e8eef8; font: 700 18px var(--cm-font); }
.cm .cm-dg-s { fill: #95a6bf; font: 400 11.5px var(--cm-mono); letter-spacing: .06em; }
.cm .cm-dg-l { fill: #7fe9ff; font: 500 10.5px var(--cm-mono); letter-spacing: .12em; }
.cm .cm-dg-wire { fill: none; stroke: rgba(125, 176, 255, .28); stroke-width: 1.5; }
/* pulses: pathLength=100, one 10-unit dash that runs its wire once per 7 s cycle, in order:
   AI -> server -> agent -> CAD, the approval flash, then the result travels back */
.cm .cm-dg-pulse { fill: none; stroke: var(--cm-cyan); stroke-width: 3; stroke-linecap: round; stroke-dasharray: 10 110; stroke-dashoffset: 10; filter: drop-shadow(0 0 4px rgba(62, 230, 255, .85)); animation: cm-dgp 7s linear infinite both; }
.cm .cm-dg-pulse--back { stroke: var(--cm-violet); filter: drop-shadow(0 0 4px rgba(178, 157, 255, .85)); }
.cm .cm-dg-d1 { animation-delay: 0s; } .cm .cm-dg-d2 { animation-delay: .9s; } .cm .cm-dg-d3 { animation-delay: 1.8s; }
.cm .cm-dg-d5 { animation-delay: 4.05s; } .cm .cm-dg-d6 { animation-delay: 4.95s; } .cm .cm-dg-d7 { animation-delay: 5.85s; }
.cm .cm-dg-flash { fill: rgba(94, 234, 212, .18); stroke: #5eead4; stroke-width: 2; opacity: 0; animation: cm-dgflash 7s linear infinite; }
.cm .cm-dg-btn { fill: #5eead4; }
.cm .cm-dg-btn--ghost { fill: none; stroke: rgba(125, 176, 255, .45); }
.cm .cm-dg-btnt { fill: #04101a; font: 700 10px var(--cm-mono); letter-spacing: .08em; }
.cm .cm-dg-btnt--ghost { fill: #b6c3d6; }
.cm .cm-dg-k { fill: #7fe9ff; font: 500 10px var(--cm-mono); letter-spacing: .14em; }
.cm .cm-dg-s--gate { fill: #a7fbe9; }
.cm .cm-dg-s--small { font-size: 10px; }
.cm .cm-dg-node--cad { fill: rgba(9, 15, 28, .95); stroke: rgba(178, 157, 255, .5); }
.cm .cm-dg-foot { fill: #95a6bf; font: 500 10.5px var(--cm-mono); letter-spacing: .12em; }
.cm .cm-diagram.is-off *, .cm .cm-ticker.is-off * { animation-play-state: paused !important; }
@media (pointer: coarse) { .cm .cm-dg-pulse { filter: none; } }
.cm .cm-dg-gate { fill: none; stroke: #5eead4; stroke-width: 2; }
.cm .cm-dg-gatefill { fill: rgba(94, 234, 212, .12); stroke: #5eead4; stroke-width: 1.4; }
.cm .cm-dg-ring { fill: none; stroke: var(--cm-cyan); stroke-width: 1; opacity: .5; transform-box: fill-box; transform-origin: center; animation: cm-ring 3.2s var(--cm-ease) infinite; }
.cm .cm-dg-cycle { transition: opacity .35s; }
.cm .cm-dg-cycle.is-out { opacity: 0; }

/* ---------- 13. Steps ---------- */
.cm .cm-steps { list-style: none; padding: 0; margin: 0; display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); counter-reset: cmstep; position: relative; }
.cm .cm-steps > li { margin: 0; counter-increment: cmstep; }
.cm .cm-steps > li .cm-card { height: 100%; }
.cm .cm-steps > li .cm-card::after { content: "0" counter(cmstep); position: absolute; top: 18px; right: 20px; font-family: var(--cm-mono); font-size: 2.2rem; font-weight: 600; line-height: 1; background: linear-gradient(180deg, rgba(62, 230, 255, .35), rgba(62, 230, 255, 0)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.cm .cm-steps h3 { padding-right: 3rem; }
.cm .cm-timeline { list-style: none; margin: 0; padding: 0 0 0 30px; position: relative; }
.cm .cm-timeline::before { content: ""; position: absolute; left: 9px; top: 6px; bottom: 6px; width: 1px; background: linear-gradient(180deg, var(--cm-cyan), var(--cm-violet)); opacity: .6; }
.cm .cm-timeline > li { position: relative; margin: 0 0 26px; counter-increment: cmstep; }
.cm .cm-timeline > li::before { content: ""; position: absolute; left: -27px; top: 6px; width: 13px; height: 13px; border-radius: 50%; background: var(--cm-bg); border: 2px solid var(--cm-cyan); box-shadow: 0 0 10px rgba(62, 230, 255, .6); }
.cm .cm-timeline h3 { margin-bottom: .3em; }
.cm .cm-timeline p { color: var(--cm-text-2); margin: 0; }

/* ---------- 14. Connector tiles ---------- */
.cm .cm-tiles { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); list-style: none; padding: 0; margin: 0; }
.cm .cm-tiles > li { margin: 0; }
.cm .cm-tile { display: flex; flex-direction: column; height: 100%; text-decoration: none; color: var(--cm-text); padding: 20px; }
.cm .cm-tile:hover { color: var(--cm-text); }
.cm .cm-tile__top { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; margin-bottom: 18px; }
.cm .cm-mono-badge { width: 54px; height: 54px; border-radius: 13px; display: grid; place-items: center; font-family: var(--cm-mono); font-weight: 600; font-size: .78rem; letter-spacing: .04em; color: #dffaff; position: relative; background: linear-gradient(160deg, rgba(62, 230, 255, .18), rgba(139, 92, 246, .16)); border: 1px solid rgba(125, 176, 255, .32); box-shadow: inset 0 0 18px rgba(62, 230, 255, .12); }
.cm .cm-mono-badge::after { content: ""; position: absolute; inset: 5px; border-radius: 9px; border: 1px dashed rgba(125, 176, 255, .22); }
.cm .cm-tile h3 { margin: 0 0 4px; font-size: 1.12rem; }
.cm .cm-tile .cm-api { font-family: var(--cm-mono); font-size: .74rem; color: var(--cm-muted); letter-spacing: .02em; margin: 0 0 12px; }
.cm .cm-tile p { color: var(--cm-text-2); font-size: .92rem; margin: 0 0 14px; }
.cm .cm-tile .cm-tile__go { margin-top: auto; font-weight: 600; font-size: .9rem; color: var(--cm-cyan); display: inline-flex; gap: .4em; align-items: center; }
.cm .cm-tile .cm-tile__go::after { content: "\2192"; transition: transform .25s var(--cm-ease); }
.cm .cm-tile:hover .cm-tile__go::after { transform: translateX(4px); }
.cm .cm-tile--lead { border-color: rgba(62, 230, 255, .35); }

/* connector page hero */
.cm .cm-chero { padding: clamp(36px, 6vw, 80px) 0 clamp(28px, 4vw, 48px); }
.cm .cm-chero__row { display: flex; gap: 22px; align-items: center; flex-wrap: wrap; margin-bottom: 1.2rem; }
.cm .cm-chero .cm-mono-badge { width: 76px; height: 76px; font-size: 1rem; border-radius: 18px; }
.cm .cm-chero .cm-mono-badge::after { border-radius: 13px; }
.cm .cm-chero h1 { margin: 0; }
.cm .cm-crumbs { font-family: var(--cm-mono); font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; color: var(--cm-muted); margin: 0 0 1.4rem; }
.cm .cm-crumbs a { color: var(--cm-muted); text-decoration: none; }
.cm .cm-crumbs a:hover { color: var(--cm-cyan); }
.cm .cm-pipe { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 1.4rem 0 0; padding: 0; list-style: none; font-family: var(--cm-mono); font-size: .76rem; letter-spacing: .06em; }
.cm .cm-pipe li { margin: 0; padding: 7px 12px; border: 1px solid var(--cm-line-2); border-radius: 8px; background: rgba(9, 15, 28, .8); color: var(--cm-text-2); }
.cm .cm-pipe li.cm-pipe__gate { border-color: rgba(94, 234, 212, .45); color: #a7fbe9; }
.cm .cm-pipe li.cm-pipe__sep { border: 0; background: none; padding: 0 2px; color: var(--cm-cyan); }
.cm .cm-asks { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); }
.cm .cm-asks li { margin: 0; padding: 16px 18px 16px 44px; border-radius: 12px; border: 1px solid var(--cm-line); background: rgba(4, 8, 16, .7); font-family: var(--cm-mono); font-size: .86rem; color: #d7e6fb; position: relative; line-height: 1.55; }
.cm .cm-asks li::before { content: "\203A"; position: absolute; left: 18px; top: 13px; color: var(--cm-cyan); font-size: 1.2rem; }
.cm .cm-checks { list-style: none; padding: 0; margin: 0 0 1em; }
.cm .cm-checks li { position: relative; padding-left: 30px; margin: 0 0 .7em; color: var(--cm-text-2); }
.cm .cm-checks li::before { content: ""; position: absolute; left: 0; top: .35em; width: 16px; height: 16px; border-radius: 5px; border: 1px solid rgba(62, 230, 255, .5); background: linear-gradient(135deg, rgba(62, 230, 255, .25), rgba(139, 92, 246, .2)); }
.cm .cm-checks li::after { content: ""; position: absolute; left: 5px; top: calc(.35em + 3px); width: 5px; height: 8px; border: solid var(--cm-cyan); border-width: 0 2px 2px 0; transform: rotate(45deg); }
.cm .cm-crosses li::before { border-color: rgba(251, 113, 133, .5); background: rgba(251, 113, 133, .1); }
.cm .cm-crosses li::after { left: 4px; top: calc(.35em + 7px); width: 8px; height: 0; border-width: 2px 0 0 0; border-color: #fb7185; transform: rotate(0); }

/* ---------- 15. Showcase figures ---------- */
.cm .cm-gallery { display: grid; gap: clamp(16px, 2vw, 24px); grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); }
.cm .cm-fig { margin: 0; display: flex; flex-direction: column; border: 1px solid var(--cm-line); border-radius: var(--cm-radius); overflow: hidden; background: linear-gradient(180deg, var(--cm-panel-2), var(--cm-panel)); transition: border-color .3s, transform .35s var(--cm-ease), box-shadow .35s; }
.cm .cm-fig:hover { border-color: var(--cm-line-2); transform: translateY(-3px); box-shadow: 0 30px 70px -36px rgba(34, 211, 238, .45); }
.cm .cm-fig--wide { grid-column: 1 / -1; }
@media (min-width: 900px) { .cm .cm-fig--wide { display: grid; grid-template-columns: 1.25fr 1fr; } }
.cm .cm-fig__view { position: relative; background: #e9ecf1; aspect-ratio: 16 / 10; overflow: hidden; }
.cm .cm-fig__view img { width: 100%; height: 100%; object-fit: contain; display: block; transition: transform .8s var(--cm-ease); }
.cm .cm-fig:hover .cm-fig__view img { transform: scale(1.035); }
.cm .cm-fig__view--sheet { background: #fff; }
.cm .cm-fig__view--sheet img { object-fit: contain; }
.cm .cm-fig__tag { position: absolute; left: 10px; top: 10px; z-index: 2; font-family: var(--cm-mono); font-size: .66rem; letter-spacing: .12em; text-transform: uppercase; color: #dffaff; background: rgba(5, 8, 15, .82); border: 1px solid rgba(62, 230, 255, .35); padding: 5px 8px; border-radius: 6px; }
.cm .cm-fig__view::after { content: ""; position: absolute; inset: 8px; pointer-events: none; border: 1px solid rgba(5, 8, 15, .08); border-radius: 8px; }
.cm .cm-fig figcaption { padding: 18px 20px 20px; display: flex; flex-direction: column; gap: 10px; }
.cm .cm-fig h3 { margin: 0; font-size: 1.12rem; }
.cm .cm-fig p { margin: 0; color: var(--cm-text-2); font-size: .93rem; }
.cm .cm-quote { font-family: var(--cm-mono); font-size: .8rem; line-height: 1.55; color: #d7e6fb; background: rgba(4, 8, 16, .75); border: 1px solid var(--cm-line); border-left: 2px solid var(--cm-cyan); border-radius: 8px; padding: 10px 12px; margin: 0; }
.cm .cm-quote::before { content: "you \203A  "; color: var(--cm-cyan); }
.cm .cm-ops { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; padding: 0; margin: 0; }
.cm .cm-ops li { margin: 0; font-family: var(--cm-mono); font-size: .68rem; letter-spacing: .04em; color: var(--cm-text-2); border: 1px solid var(--cm-line-2); border-radius: 6px; padding: 3px 7px; background: rgba(9, 15, 28, .7); }

/* ---------- 16. Pricing ---------- */
.cm .cm-plans { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); align-items: stretch; }
.cm .cm-plan { display: flex; flex-direction: column; }
.cm .cm-plan h3 { font-size: 1.25rem; margin-bottom: .25em; }
.cm .cm-plan__for { color: var(--cm-muted); font-size: .92rem; margin-bottom: 1rem; }
.cm .cm-price { margin: 0 0 1.1rem; padding-bottom: 1.1rem; border-bottom: 1px dashed var(--cm-line-2); }
.cm .cm-price__big { font-size: 2.4rem; font-weight: 800; letter-spacing: -0.03em; line-height: 1; color: #fff; }
.cm .cm-price__per { color: var(--cm-text-2); font-size: .95rem; }
.cm .cm-price__alt { display: block; margin-top: .5rem; color: var(--cm-muted); font-size: .88rem; }
.cm .cm-price__alt b { color: var(--cm-text); }
.cm .cm-plan ul { list-style: none; padding: 0; margin: 0 0 1.4rem; }
.cm .cm-plan li { position: relative; padding-left: 24px; margin: 0 0 .55em; color: var(--cm-text-2); font-size: .94rem; }
.cm .cm-plan li::before { content: ""; position: absolute; left: 2px; top: .55em; width: 10px; height: 6px; border: solid var(--cm-cyan); border-width: 0 0 2px 2px; transform: rotate(-45deg); }
.cm .cm-plan__cta { margin-top: auto; }
.cm .cm-plan__cta p { margin: .6rem 0 0; color: var(--cm-muted); font-size: .84rem; text-align: center; }
.cm .cm-plan__badges { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: .9rem; min-height: 24px; }
@property --cm-angle { syntax: "<angle>"; initial-value: 0deg; inherits: false; }
.cm .cm-plan--featured { border-color: transparent; background:
    radial-gradient(420px circle at var(--mx) var(--my), rgba(62, 230, 255, .08), transparent 55%) padding-box,
    linear-gradient(180deg, #13213c, #0c1426) padding-box,
    conic-gradient(from var(--cm-angle), #3ee6ff, #b29dff, #3ee6ff 40%, rgba(62, 230, 255, .2) 60%, #b29dff 80%, #3ee6ff) border-box;
  border: 1.5px solid transparent; animation: cm-spin 8s linear infinite; box-shadow: 0 30px 80px -40px rgba(62, 230, 255, .55); }
.cm .cm-plan--soon { opacity: .92; }
.cm .cm-offer { border-radius: 18px; padding: clamp(24px, 4vw, 44px); border: 1px solid rgba(178, 157, 255, .4); background: radial-gradient(600px 300px at 0% 0%, rgba(62, 230, 255, .14), transparent 70%), radial-gradient(600px 300px at 100% 100%, rgba(139, 92, 246, .2), transparent 70%), rgba(10, 17, 32, .85); }
.cm .cm-table { border: 1px solid var(--cm-line); border-radius: var(--cm-radius); overflow-x: auto; background: rgba(9, 15, 28, .7); -webkit-overflow-scrolling: touch; }
.cm .cm-table table { margin: 0; min-width: 640px; }
.cm .cm-table tr:last-child > * { border-bottom: 0; }
.cm .cm-table .is-featured { background: rgba(62, 230, 255, .06); color: #fff; }
.cm .cm-table tbody tr:hover > * { background: rgba(125, 176, 255, .04); }

/* ---------- 17. FAQ (details) ---------- */
.cm .cm-faq { display: grid; gap: 10px; }
.cm .cm-faq details { border: 1px solid var(--cm-line); border-radius: 12px; background: rgba(9, 15, 28, .7); transition: border-color .25s, background-color .25s; }
.cm .cm-faq details[open] { border-color: var(--cm-line-2); background: rgba(14, 23, 41, .85); }
.cm .cm-faq summary { cursor: pointer; list-style: none; padding: 16px 52px 16px 18px; font-weight: 700; position: relative; }
.cm .cm-faq summary::-webkit-details-marker { display: none; }
.cm .cm-faq summary::after { content: ""; position: absolute; right: 20px; top: 50%; width: 10px; height: 10px; border: solid var(--cm-cyan); border-width: 0 2px 2px 0; transform: translateY(-70%) rotate(45deg); transition: transform .3s var(--cm-ease); }
.cm .cm-faq details[open] summary::after { transform: translateY(-30%) rotate(-135deg); }
.cm .cm-faq details > :not(summary) { padding: 0 18px; color: var(--cm-text-2); }
.cm .cm-faq details > :last-child { padding-bottom: 16px; margin-bottom: 0; }

/* ---------- 18. Prose pages: docs and legal ---------- */
.cm .cm-pagehead { padding: clamp(40px, 6vw, 84px) 0 clamp(24px, 3vw, 36px); border-bottom: 1px solid var(--cm-line); background: linear-gradient(180deg, rgba(14, 23, 41, .5), transparent); }
.cm .cm-pagehead h1 { margin-bottom: .35em; }
.cm .cm-pagehead .cm-lead { margin-bottom: 0; }
.cm .cm-prose { max-width: 74ch; }
.cm .cm-prose h2 { font-size: clamp(1.3rem, 1.1rem + .8vw, 1.7rem); margin-top: 2.2em; padding-top: .2em; scroll-margin-top: 90px; }
.cm .cm-prose h3 { margin-top: 1.6em; }
.cm .cm-prose :where(p, li) { color: var(--cm-text-2); }
.cm .cm-prose :where(table) { display: block; overflow-x: auto; border: 1px solid var(--cm-line); border-radius: 12px; background: rgba(9, 15, 28, .7); }
.cm .cm-prose :where(table) :where(tr:last-child > *) { border-bottom: 0; }
.cm .cm-meta { display: flex; flex-wrap: wrap; gap: 8px; margin: 1.2rem 0 0; }
.cm .cm-note { border: 1px solid rgba(251, 191, 36, .35); background: rgba(251, 191, 36, .07); border-radius: 12px; padding: 14px 16px; color: #fde9b0; font-size: .92rem; margin: 0 0 1.5em; }
.cm .cm-note strong { color: #fff3c4; }
.cm .cm-callout { border: 1px solid var(--cm-line-2); border-left: 3px solid var(--cm-cyan); background: rgba(14, 23, 41, .8); border-radius: 10px; padding: 14px 16px; margin: 0 0 1.4em; color: var(--cm-text-2); }
.cm .cm-callout > :last-child { margin-bottom: 0; }
.cm .cm-docs { display: grid; gap: clamp(24px, 4vw, 56px); grid-template-columns: 1fr; padding-top: clamp(32px, 5vw, 64px); padding-bottom: clamp(64px, 8vw, 110px); }
@media (min-width: 960px) { .cm .cm-docs { grid-template-columns: 240px minmax(0, 1fr); } }
.cm .cm-docnav { align-self: start; }
@media (min-width: 960px) { .cm .cm-docnav { position: sticky; top: calc(var(--wp-admin--admin-bar--height, 0px) + 90px); } }
.cm .cm-docnav h2 { font-family: var(--cm-mono); font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--cm-muted); font-weight: 500; margin: 0 0 10px; }
.cm .cm-docnav ul { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--cm-line-2); }
.cm .cm-docnav li { margin: 0; }
.cm .cm-docnav a { display: block; padding: 7px 14px; margin-left: -1px; border-left: 2px solid transparent; color: var(--cm-text-2); text-decoration: none; font-size: .94rem; }
.cm .cm-docnav a:hover { color: #fff; }
.cm .cm-docnav a[aria-current="page"] { color: #fff; border-left-color: var(--cm-cyan); background: linear-gradient(90deg, rgba(62, 230, 255, .1), transparent); }
.cm .cm-docbody { min-width: 0; }
.cm .cm-docbody > h1 { margin-top: 0; }
.cm .cm-stepsol { counter-reset: cmo; list-style: none; padding: 0; }
.cm .cm-stepsol > li { counter-increment: cmo; position: relative; padding-left: 46px; margin: 0 0 1.1em; }
.cm .cm-stepsol > li::before { content: counter(cmo); position: absolute; left: 0; top: -2px; width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center; font-family: var(--cm-mono); font-size: .8rem; color: var(--cm-cyan); border: 1px solid var(--cm-line-2); background: rgba(14, 23, 41, .9); }

/* ---------- 19. Forms: Paid Member Subscriptions, Contact Form 7, generic ---------- */
.cm .cm-auth { display: grid; gap: clamp(24px, 4vw, 48px); grid-template-columns: 1fr; padding-top: clamp(40px, 6vw, 80px); padding-bottom: clamp(64px, 8vw, 110px); align-items: start; }
@media (min-width: 960px) { .cm .cm-auth { grid-template-columns: .9fr 1.1fr; } }
.cm .cm-formcard { border: 1px solid var(--cm-line-2); border-radius: 18px; background: linear-gradient(180deg, rgba(19, 31, 55, .9), rgba(10, 17, 32, .92)); padding: clamp(20px, 3vw, 36px); box-shadow: 0 40px 100px -50px rgba(62, 230, 255, .35); }
.cm form :where(label, legend) { display: block; font-weight: 600; font-size: .92rem; color: var(--cm-text); margin: 0 0 6px; }
.cm form :where(input[type="text"], input[type="email"], input[type="password"], input[type="tel"], input[type="url"], input[type="number"], input[type="search"], select, textarea),
.cm .pms-form :where(input[type="text"], input[type="email"], input[type="password"], select),
.cm #pms_login :where(input[type="text"], input[type="password"]) {
  width: 100%; min-height: 46px; padding: 10px 14px; border-radius: 10px; border: 1px solid var(--cm-line-2);
  background: rgba(4, 8, 16, .85); color: var(--cm-text); font: 400 1rem/1.4 var(--cm-font); box-shadow: none; transition: border-color .2s, box-shadow .2s;
}
.cm form textarea { min-height: 150px; resize: vertical; }
.cm form :where(input, select, textarea):focus { outline: none; border-color: var(--cm-cyan); box-shadow: 0 0 0 4px rgba(62, 230, 255, .14); }
.cm form ::placeholder { color: #7d8ea8; }
.cm form :where(input[type="checkbox"], input[type="radio"]) { accent-color: var(--cm-cyan); width: 18px; height: 18px; vertical-align: -3px; margin-right: 8px; }
.cm form :where(input[type="submit"], button[type="submit"], .button, .pms-button),
.cm .pms-form input[type="submit"], .cm #pms_login input[type="submit"], .cm .wpcf7-submit {
  appearance: none; display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: .75em 1.5em; border: 0; border-radius: 11px; cursor: pointer;
  background: var(--cm-grad); color: var(--cm-ink); font: 700 1rem/1 var(--cm-font); box-shadow: 0 12px 34px -14px rgba(62, 230, 255, .8); transition: transform .2s, box-shadow .2s; width: auto;
}
.cm form :where(input[type="submit"], button[type="submit"]):hover { transform: translateY(-1px); box-shadow: 0 0 0 4px rgba(122, 168, 255, .18), 0 16px 40px -14px rgba(122, 168, 255, .9); }
.cm .pms-form ul.pms-form-fields-wrapper, .cm .pms-form ul { list-style: none; padding: 0; margin: 0; }
.cm .pms-form li.pms-field, .cm .pms-form .pms-field { margin: 0 0 16px; padding: 0; list-style: none; }
.cm .pms-form .pms-field-subscriptions, .cm .pms-subscription-plan { border: 1px solid var(--cm-line); border-radius: 12px; padding: 12px 14px; background: rgba(4, 8, 16, .6); margin: 0 0 8px; }
.cm .pms-subscription-plan label { display: flex; align-items: center; gap: 8px; margin: 0; font-weight: 600; }
.cm .pms-subscription-plan-price, .cm .pms-subscription-plan-description { color: var(--cm-text-2); font-weight: 400; }
.cm .pms-subscription-plan-description { display: block; font-size: .88rem; margin-top: 4px; }
.cm .pms-form h3, .cm .pms-form h4, .cm .pms-form legend { color: var(--cm-text); }
.cm :where(.pms_success-messages-wrapper, .pms-success-message, .pms_success-messages) { border: 1px solid rgba(94, 234, 212, .45); background: rgba(94, 234, 212, .08); color: #b9fbef; border-radius: 10px; padding: 12px 14px; margin: 0 0 16px; }
.cm :where(.pms_field-errors-wrapper, .pms-error, .pms-warning-message, .pms_errors) { border: 1px solid rgba(251, 113, 133, .5); background: rgba(251, 113, 133, .08); color: #fecdd3; border-radius: 10px; padding: 10px 12px; margin: 6px 0 12px; font-size: .9rem; }
.cm :where(.pms-account-navigation ul, .pms-account-navigation) { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; padding: 0; margin: 0 0 20px; }
.cm .pms-account-navigation li { margin: 0; }
.cm .pms-account-navigation a { display: block; padding: 8px 14px; border-radius: 9px; border: 1px solid var(--cm-line-2); text-decoration: none; color: var(--cm-text-2); font-weight: 600; font-size: .92rem; }
.cm .pms-account-navigation a:hover, .cm .pms-account-navigation li.pms-account-navigation-link--active a { color: var(--cm-ink); background: var(--cm-grad); border-color: transparent; }
.cm :where(.pms-account-subscription-details-table, .pms-payment-history, table.pms-account-subscription-details-table) { width: 100%; border: 1px solid var(--cm-line); border-radius: 12px; overflow: hidden; background: rgba(9, 15, 28, .7); }
.cm #pms_login p { margin: 0 0 14px; }
.cm #pms_login .login-remember label { display: inline-flex; align-items: center; font-weight: 500; color: var(--cm-text-2); }
.cm [class*="stripe"]:where(div), .cm .pms-paygates-inner, .cm .pms-credit-card-information { border-radius: 12px; }
.cm .pms-credit-card-information, .cm #pms-stripe-payment-elements, .cm .pms-stripe-payment-elements-wrapper { background: #f4f7fb; color: #0a1222; padding: 14px; border: 1px solid var(--cm-line-2); }
.cm .wpcf7 form p { margin: 0 0 16px; }
.cm .wpcf7-form-control-wrap { display: block; margin-top: 6px; }
.cm .wpcf7-not-valid-tip { color: #fda4af; font-size: .86rem; margin-top: 6px; }
.cm .wpcf7 form .wpcf7-response-output { margin: 16px 0 0; border-radius: 10px; padding: 12px 14px; border: 1px solid var(--cm-line-2); color: var(--cm-text-2); }
.cm .wpcf7 form.sent .wpcf7-response-output { border-color: rgba(94, 234, 212, .5); color: #b9fbef; }
.cm .wpcf7 form.invalid .wpcf7-response-output, .cm .wpcf7 form.failed .wpcf7-response-output { border-color: rgba(251, 113, 133, .5); color: #fecdd3; }
.cm .cm-form-slot { border: 1px dashed var(--cm-line-2); border-radius: 12px; padding: 20px; color: var(--cm-muted); font-family: var(--cm-mono); font-size: .86rem; text-align: center; }

/* ---------- 20. CTA band ---------- */
.cm .cm-cta { position: relative; overflow: hidden; border-radius: 22px; padding: clamp(32px, 6vw, 72px); text-align: center; border: 1px solid var(--cm-line-2);
  background: radial-gradient(700px 360px at 50% 120%, rgba(139, 92, 246, .35), transparent 70%), radial-gradient(600px 300px at 50% -40%, rgba(62, 230, 255, .25), transparent 70%), #08101e; }
.cm .cm-cta::before { content: ""; position: absolute; inset: 0; pointer-events: none; background-image: linear-gradient(rgba(125, 176, 255, .08) 1px, transparent 1px), linear-gradient(90deg, rgba(125, 176, 255, .08) 1px, transparent 1px); background-size: 28px 28px; mask-image: radial-gradient(60% 80% at 50% 50%, #000, transparent); -webkit-mask-image: radial-gradient(60% 80% at 50% 50%, #000, transparent); }
.cm .cm-cta > * { position: relative; }
.cm .cm-cta .cm-actions { justify-content: center; }
.cm .cm-cta .cm-lead { margin-left: auto; margin-right: auto; }

/* ---------- 21. Scroll reveal (only when the script runs) ---------- */
.cm-js .cm [data-cm-reveal] { transition: opacity .8s var(--cm-ease), transform .8s var(--cm-ease); }
.cm-js .cm [data-cm-reveal]:not(.is-in) { opacity: 0; transform: translateY(22px); }
.cm-js .cm [data-cm-reveal="stagger"] { opacity: 1 !important; transform: none !important; }
.cm-js .cm [data-cm-reveal="stagger"] > * { transition: opacity .7s var(--cm-ease), transform .7s var(--cm-ease); }
.cm-js .cm [data-cm-reveal="stagger"]:not(.is-in) > * { opacity: 0; transform: translateY(18px); }
.cm-js .cm [data-cm-reveal="stagger"] > *:nth-child(2) { transition-delay: .06s; }
.cm-js .cm [data-cm-reveal="stagger"] > *:nth-child(3) { transition-delay: .12s; }
.cm-js .cm [data-cm-reveal="stagger"] > *:nth-child(4) { transition-delay: .18s; }
.cm-js .cm [data-cm-reveal="stagger"] > *:nth-child(5) { transition-delay: .24s; }
.cm-js .cm [data-cm-reveal="stagger"] > *:nth-child(6) { transition-delay: .3s; }
.cm-js .cm [data-cm-reveal="stagger"] > *:nth-child(n+7) { transition-delay: .36s; }

/* ---------- 22. Keyframes ---------- */
@keyframes cm-blink { 50% { opacity: 0; } }
@keyframes cm-marquee { to { transform: translateX(-50%); } }
@keyframes cm-dgp { 0% { stroke-dashoffset: 10; } 13% { stroke-dashoffset: -100; } 100% { stroke-dashoffset: -100; } }
@keyframes cm-dgflash { 0%, 38% { opacity: 0; } 43%, 55% { opacity: 1; } 60%, 100% { opacity: 0; } }
@keyframes cm-ring { 0% { transform: scale(.85); opacity: .7; } 100% { transform: scale(1.35); opacity: 0; } }
@keyframes cm-spin { to { --cm-angle: 360deg; } }
@keyframes cm-float { 50% { transform: translateY(-6px); } }

/* ---------- 23. Reduced motion: no movement at all ---------- */
@media (prefers-reduced-motion: reduce) {
  .cm *, .cm *::before, .cm *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .cm-js .cm [data-cm-reveal], .cm-js .cm [data-cm-reveal] > * { opacity: 1 !important; transform: none !important; }
  .cm .cm-ticker__track { width: auto; }
  .cm .cm-ticker ul + ul { display: none; }
  .cm .cm-ticker ul { flex-wrap: wrap; justify-content: center; row-gap: 8px; }
  .cm .cm-dg-pulse { display: none; }
  .cm .cm-dg-flash { opacity: 1; }
  .cm .cm-card:hover, .cm .cm-tile:hover, .cm .cm-fig:hover, .cm .cm-btn:hover { transform: none; }
}

/* ---------- 24. Print ---------- */
@media print {
  .cm.cm-page { background: #fff !important; color: #000; }
  .cm.cm-header, .cm.cm-footer, .cm .cm-hud, .cm .cm-ticker { display: none !important; }
  .cm * { color: #000 !important; background: none !important; box-shadow: none !important; }
}

/* =====================================================================
   25. Online-service components (1 November 2026)
   ===================================================================== */

/* early-access banner (inside the header part; hidden in the live state) */
.cm .cm-banner { margin: 0; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 9px var(--cm-gutter); font-size: .9rem; line-height: 1.4; text-align: center; color: #e8eef8; background: linear-gradient(90deg, rgba(34, 211, 238, .16), rgba(139, 92, 246, .2)); border-bottom: 1px solid var(--cm-line-2); }
.cm .cm-banner strong { color: #fff; }
.cm .cm-banner a { color: #bdf6ff; text-decoration: underline; text-decoration-color: rgba(189, 246, 255, .55); text-underline-offset: 3px; font-weight: 600; }
.cm .cm-banner a:hover { color: #fff; }
.cm .cm-banner__dot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--cm-amber); box-shadow: 0 0 0 3px rgba(251, 191, 36, .18); }
@media (max-width: 559px) { .cm .cm-banner { font-size: .86rem; text-align: left; justify-content: flex-start; } }

/* status chips */
.cm .cm-chip--dev { color: #bdf6ff; border-color: rgba(62, 230, 255, .45); background: rgba(62, 230, 255, .08); }
.cm .cm-chip--dev::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--cm-cyan); box-shadow: 0 0 8px var(--cm-cyan); }
.cm .cm-chip--plan { color: #ddd3ff; border-color: rgba(178, 157, 255, .4); background: rgba(139, 92, 246, .08); }
.cm .cm-chip--plan::before { content: ""; width: 6px; height: 6px; border-radius: 50%; border: 1.5px solid var(--cm-violet); }
.cm .cm-legend { flex-direction: column; gap: 10px; margin-top: 1.4rem; }
.cm .cm-legend li { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; color: var(--cm-text-2); font-size: .95rem; }

/* small helpers */
.cm .cm-mt-s { margin-top: 1rem; }
.cm h3.cm-mt-s { margin-top: .9rem; }
.cm .cm-split--top { align-items: start; }
.cm .cm-actions--center { justify-content: center; }
.cm .cm-hero__status { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 1.4rem 0 0; color: var(--cm-text-2); font-size: .95rem; }
.cm .cm-fig__title, .cm .cm-card__h, .cm .cm-formcard__h, .cm .cm-plan__name { font-size: clamp(1.1rem, 1rem + .4vw, 1.3rem); letter-spacing: -0.015em; }
.cm .cm-formcard__h { margin-bottom: .6em; }
.cm .cm-mono-badge--lg { width: 76px; height: 76px; font-size: 1rem; border-radius: 18px; }
.cm .cm-tile__name { display: block; font-size: 1.12rem; font-weight: 700; color: var(--cm-text); margin: 0 0 4px; }
.cm .cm-tile .cm-api { display: block; }
.cm .cm-tile .cm-tile__top .cm-chip { margin-top: 4px; }
.cm .cm-linklist { list-style: none; padding: 0; margin: 0 0 1em; }
.cm .cm-linklist li { margin: 0; }
.cm .cm-linklist a { display: inline-flex; align-items: center; min-height: 44px; gap: .45em; font-weight: 600; text-decoration: none; }
.cm .cm-linklist a::after { content: "\2192"; transition: transform .25s var(--cm-ease); }
.cm .cm-linklist a:hover::after { transform: translateX(3px); }

/* callouts */
.cm .cm-callout--early { border-left-color: var(--cm-amber); background: linear-gradient(90deg, rgba(251, 191, 36, .08), rgba(14, 23, 41, .85) 60%); }
.cm .cm-callout--early strong { color: #fde68a; }
.cm .cm-callout--plan { border-left-color: var(--cm-violet); background: linear-gradient(90deg, rgba(139, 92, 246, .12), rgba(14, 23, 41, .85) 60%); }
.cm .cm-callout--plan strong { color: #ddd3ff; }
.cm .cm-callout p { margin: 0; }
.cm .cm-callout p + p { margin-top: .6em; }

/* build status panel */
.cm .cm-status { border: 1px solid var(--cm-line-2); border-radius: 18px; background: linear-gradient(180deg, rgba(19, 31, 55, .85), rgba(8, 13, 25, .9)); overflow: hidden; }
.cm .cm-status__head { margin: 0; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 6px 16px; padding: 12px 18px; font-family: var(--cm-mono); font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; color: var(--cm-muted); border-bottom: 1px solid var(--cm-line); background: rgba(5, 8, 15, .5); }
.cm .cm-status__head span:first-child { color: var(--cm-cyan); }
.cm .cm-status ul { list-style: none; margin: 0; padding: 6px 0; }
.cm .cm-status__row { margin: 0; display: grid; grid-template-columns: 14px minmax(0, 1fr); gap: 4px 14px; padding: 14px 18px; border-bottom: 1px dashed var(--cm-line); }
.cm .cm-status__row:last-child { border-bottom: 0; }
.cm .cm-status__dot { width: 12px; height: 12px; margin-top: 5px; border-radius: 50%; }
.cm .cm-status__what { display: flex; flex-direction: column; gap: 2px; }
.cm .cm-status__what b { font-size: 1rem; }
.cm .cm-status__what span { color: var(--cm-text-2); font-size: .92rem; }
.cm .cm-status__state { grid-column: 2; justify-self: start; font-family: var(--cm-mono); font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; padding: 4px 9px; border-radius: 999px; border: 1px solid var(--cm-line-2); }
@media (min-width: 560px) {
  .cm .cm-status__row { grid-template-columns: 14px minmax(0, 1fr) auto; align-items: start; }
  .cm .cm-status__state { grid-column: 3; grid-row: 1; }
}
.cm .cm-status__row--ok .cm-status__dot { background: var(--cm-green); box-shadow: 0 0 10px var(--cm-green); }
.cm .cm-status__row--ok .cm-status__state { color: #a7fbe9; border-color: rgba(94, 234, 212, .45); }
.cm .cm-status__row--dev .cm-status__dot { background: var(--cm-cyan); box-shadow: 0 0 10px var(--cm-cyan); animation: cm-breathe 2.4s ease-in-out infinite; }
.cm .cm-status__row--dev .cm-status__state { color: #bdf6ff; border-color: rgba(62, 230, 255, .45); }
.cm .cm-status__row--plan .cm-status__dot { border: 2px solid var(--cm-violet); }
.cm .cm-status__row--plan .cm-status__state { color: #ddd3ff; border-color: rgba(178, 157, 255, .45); }
@keyframes cm-breathe { 50% { opacity: .35; } }

/* approval card illustration */
.cm .cm-gatecard { margin: 0; border: 1px solid rgba(94, 234, 212, .35); border-radius: 18px; background: radial-gradient(500px 240px at 100% 0%, rgba(94, 234, 212, .1), transparent 70%), rgba(6, 14, 24, .92); padding: 18px; box-shadow: 0 40px 100px -50px rgba(94, 234, 212, .4); }
.cm .cm-gatecard__bar { display: flex; justify-content: space-between; gap: 10px; margin: 0 0 14px; font-family: var(--cm-mono); font-size: .68rem; letter-spacing: .14em; color: #a7fbe9; }
.cm .cm-gatecard__bar span:last-child { color: var(--cm-muted); }
.cm .cm-gatecard__req { font-family: var(--cm-mono); font-size: .86rem; line-height: 1.6; color: #d7e6fb; background: rgba(4, 8, 16, .8); border: 1px solid var(--cm-line); border-left: 2px solid #5eead4; border-radius: 8px; padding: 12px 14px; margin: 0 0 12px; }
.cm .cm-gatecard .cm-ops { margin-bottom: 16px; }
.cm .cm-gatecard__btns { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 12px; }
.cm .cm-gatecard__btns span { flex: 1 1 140px; text-align: center; font-weight: 700; font-size: .92rem; padding: 11px 14px; border-radius: 10px; border: 1px solid var(--cm-line-2); color: var(--cm-text-2); }
.cm .cm-gatecard__btns span:first-child { background: linear-gradient(90deg, #5eead4, #3ee6ff); color: var(--cm-ink); border-color: transparent; box-shadow: 0 0 0 3px rgba(94, 234, 212, .2); }
.cm .cm-gatecard figcaption { font-size: .82rem; color: var(--cm-muted); }

/* connector URL copy box */
.cm .cm-copy { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0 0 1.2em; padding: 10px 12px; border: 1px solid var(--cm-line-2); border-radius: 12px; background: rgba(4, 8, 16, .85); }
.cm .cm-copy__label { flex: 0 0 100%; font-family: var(--cm-mono); font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; color: var(--cm-muted); }
.cm .cm-copy__value { flex: 1 1 200px; min-width: 0; overflow-wrap: anywhere; font-size: .95rem; background: none; border: 0; padding: 0; color: #cdf6ff; }
.cm .cm-copy__btn.is-done { border-color: rgba(94, 234, 212, .6); color: #a7fbe9; }

/* code blocks */
.cm .cm-code { margin: 0 0 1.2em; padding: 14px 16px; border-radius: 12px; border: 1px solid var(--cm-line-2); background: #03060c; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.cm .cm-code code { display: block; white-space: pre; background: none; border: 0; padding: 0; font-size: .88rem; line-height: 1.65; color: #cdf6ff; }
.cm q { quotes: "\201C" "\201D"; color: var(--cm-text); }

/* docs */
.cm .cm-docnav__d > summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; min-height: 44px; font-family: var(--cm-mono); font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--cm-muted); margin-bottom: 6px; }
.cm .cm-docnav__d > summary::-webkit-details-marker { display: none; }
.cm .cm-docnav__d > summary::after { content: ""; width: 8px; height: 8px; border: solid var(--cm-cyan); border-width: 0 2px 2px 0; transform: rotate(45deg); margin-right: 6px; transition: transform .25s var(--cm-ease); }
.cm .cm-docnav__d[open] > summary::after { transform: rotate(-135deg); }
.cm .cm-docnav a { display: flex; align-items: center; min-height: 44px; padding: 6px 14px; }
@media (max-width: 959px) { .cm .cm-docnav { border: 1px solid var(--cm-line); border-radius: 12px; padding: 4px 14px 8px; background: rgba(9, 15, 28, .7); } }
.cm .cm-docbody .cm-crumbs { margin-bottom: 1rem; }
.cm .cm-docbody > h1 { font-size: clamp(1.9rem, 1.3rem + 2.2vw, 2.8rem); }
.cm .cm-doclist { list-style: none; padding: 0; margin: 1.6rem 0 2.4rem; display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
.cm .cm-doclist > li { margin: 0; }
.cm .cm-doclist .cm-num { margin-bottom: .5rem; }
.cm .cm-doclist__p { display: block; color: var(--cm-text-2); font-size: .92rem; margin: 0 0 14px; }
.cm .cm-prose .cm-doclist__p { color: var(--cm-text-2); }
.cm .cm-prose .cm-tile { text-decoration: none; }
.cm .cm-stepsol > li > .cm-copy { margin-top: .8em; }
.cm .cm-stepsol--sm > li { padding-left: 40px; margin-bottom: .8em; }
.cm .cm-stepsol--sm > li::before { width: 26px; height: 26px; font-size: .74rem; }
.cm .cm-updated { margin: 0 0 1.2rem; }
.cm .cm-download { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; padding: 16px 18px; margin: 0 0 1.6em; border: 1px dashed var(--cm-line-2); border-radius: 14px; background: rgba(9, 15, 28, .7); }
.cm .cm-download p { margin: 0; }
.cm .cm-download .cm-num { margin-bottom: .3rem; }
.cm .cm-btn[disabled], .cm .cm-btn[aria-disabled="true"] { cursor: not-allowed; opacity: .7; color: var(--cm-text-2); border-style: dashed; transform: none; box-shadow: none; }

/* pricing */
.cm .cm-billing { display: inline-flex; gap: 4px; padding: 4px; margin: 0 0 22px; border: 1px solid var(--cm-line-2); border-radius: 12px; background: rgba(9, 15, 28, .8); min-inline-size: 0; }
.cm .cm-billing input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; pointer-events: none; }
.cm .cm-billing label { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 16px; margin: 0; border-radius: 9px; cursor: pointer; font-weight: 600; color: var(--cm-text-2); transition: background-color .2s, color .2s; }
.cm .cm-billing input:checked + label { background: var(--cm-grad); color: var(--cm-ink); }
.cm .cm-billing input:focus-visible + label { outline: 2px solid var(--cm-cyan); outline-offset: 2px; }
.cm .cm-billing__save { font-family: var(--cm-mono); font-size: .66rem; letter-spacing: .08em; text-transform: uppercase; padding: 3px 6px; border-radius: 6px; background: rgba(94, 234, 212, .14); color: #a7fbe9; }
.cm .cm-billing input:checked + label .cm-billing__save { background: rgba(4, 16, 26, .18); color: var(--cm-ink); }
.cm .cm-price__m, .cm .cm-price__y { display: block; }
.cm .cm-price__y { margin-top: .6rem; }
@supports selector(:has(a)) {
  .cm .cm-pricing:has(#cm-bill-y:checked) .cm-price__m { display: none; }
  .cm .cm-pricing:not(:has(#cm-bill-y:checked)) .cm-price__y { display: none; }
  .cm .cm-price__y { margin-top: 0; }
}
.cm .cm-price__from { color: var(--cm-text-2); font-size: .95rem; }
.cm .cm-plan--free { border-style: dashed; }
.cm .cm-plan__cta .cm-btn--block { width: 100%; }
.cm .cm-offer__grid { display: grid; gap: 20px 40px; grid-template-columns: 1fr; align-items: center; }
@media (min-width: 900px) { .cm .cm-offer__grid { grid-template-columns: 1.2fr 1fr; } }
.cm .cm-offer h2 { margin-bottom: .3em; }
.cm .cm-offer .cm-lead { margin-bottom: 0; }
.cm .cm-offer__facts { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.cm .cm-offer__facts li { margin: 0; padding: 12px 14px; border: 1px solid var(--cm-line-2); border-radius: 12px; background: rgba(4, 8, 16, .6); color: var(--cm-text-2); }
.cm .cm-offer__facts .cm-num { margin-bottom: .3rem; }
.cm .cm-finep { list-style: none; padding: 0; margin: 28px 0 0; display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }
.cm .cm-finep li { margin: 0; padding: 12px 14px; border-left: 2px solid var(--cm-line-2); color: var(--cm-text-2); font-size: .93rem; }

/* contact */
.cm .cm-contact { display: grid; gap: clamp(20px, 3vw, 32px); grid-template-columns: 1fr; align-items: start; }
@media (min-width: 960px) { .cm .cm-contact { grid-template-columns: 1.35fr 1fr; } }
.cm .cm-contactlist { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.cm .cm-contactlist li { margin: 0; display: flex; flex-direction: column; gap: 2px; }
.cm .cm-contactlist .cm-num { margin: 0; font-size: .68rem; }
.cm .cm-contactlist a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 600; font-size: 1.02rem; }
.cm .cm-contactlist span:not(.cm-num) { color: var(--cm-text-2); }
/* Contact Form 7 inside .cm-contact-form */
.cm .cm-contact-form .wpcf7-form { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 16px; }
.cm .cm-contact-form .wpcf7-form > * { grid-column: 1 / -1; min-width: 0; }
@media (min-width: 640px) {
  .cm .cm-contact-form .wpcf7-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cm .cm-contact-form .wpcf7-form > p:nth-of-type(-n+6) { grid-column: auto; }
}
.cm .cm-contact-form label { display: block; font-weight: 600; font-size: .92rem; color: var(--cm-text); }
.cm .cm-contact-form .wpcf7-list-item { margin: 0; display: block; }
.cm .cm-contact-form .wpcf7-acceptance label { display: flex; align-items: flex-start; gap: 10px; font-weight: 400; color: var(--cm-text-2); line-height: 1.5; min-height: 44px; }
.cm .cm-contact-form .wpcf7-acceptance input { flex: none; margin: 2px 0 0; }
.cm .cm-contact-form select, .cm form select { appearance: none; -webkit-appearance: none; padding-right: 40px; cursor: pointer;
  background-image: linear-gradient(45deg, transparent 50%, var(--cm-cyan) 50%), linear-gradient(135deg, var(--cm-cyan) 50%, transparent 50%);
  background-position: calc(100% - 20px) 50%, calc(100% - 14px) 50%; background-size: 6px 6px; background-repeat: no-repeat; }
.cm form select option { background: #0a1120; color: var(--cm-text); }
.cm .cm-contact-form .wpcf7-submit { width: 100%; }
@media (min-width: 640px) { .cm .cm-contact-form .wpcf7-submit { width: auto; min-width: 220px; } }
.cm .wpcf7-spinner { margin: 0 12px; vertical-align: middle; }
.cm .screen-reader-response { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.cm .wpcf7 .hidden-fields-container { border: 0; padding: 0; margin: 0; }
.cm .cm-preview-note { color: #fde68a; font-size: .8rem; margin: 10px 0 0; }

/* account forms (Paid Member Subscriptions) */
.cm .cm-auth__intro { padding-top: 6px; }
.cm .cm-auth__intro h1 { font-size: clamp(2rem, 1.4rem + 2.4vw, 3rem); }
.cm .cm-formcard__alt { margin: 18px 0 0; padding-top: 14px; border-top: 1px solid var(--cm-line); color: var(--cm-text-2); }
.cm .cm-formcard--wide { overflow-x: auto; }
.cm .pms-form input[type="submit"], .cm #pms_login input[type="submit"] { width: 100%; }
.cm #pms_login + a, .cm .pms-form + a { display: inline-flex; align-items: center; min-height: 44px; }
.cm .pms-account-navigation a { display: inline-flex; align-items: center; min-height: 44px; }
.cm :where(.pms-account-subscription-details-table, .pms-payment-history) td { padding: .75em .9em; }
.cm .pms-account-subscription-details-table__label { color: var(--cm-muted); font-family: var(--cm-mono); font-size: .74rem; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.cm .pms-status-active { color: #a7fbe9; font-weight: 700; }
.cm .pms-account-subscription-action-link { display: inline-flex; align-items: center; min-height: 44px; margin-right: 14px; font-weight: 600; }

/* member dashboard */
.cm .cm-pagehead--dash { padding-bottom: clamp(20px, 3vw, 30px); }
.cm .cm-dash { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 720px) { .cm .cm-dash { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-areas: "connect connect" "plan agent" "pcs usage" "help help"; } }
@media (min-width: 1080px) { .cm .cm-dash { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-areas: "connect connect plan" "connect connect agent" "pcs usage help"; } }
.cm .cm-dash__card { min-width: 0; border: 1px solid var(--cm-line); border-radius: var(--cm-radius); padding: clamp(18px, 2.4vw, 26px); background: linear-gradient(180deg, var(--cm-panel-2), var(--cm-panel)); }
.cm .cm-dash__card h2 { font-size: clamp(1.15rem, 1rem + .5vw, 1.4rem); margin-bottom: .5em; }
.cm .cm-dash__card h3 { font-size: 1.02rem; margin-top: 1rem; }
.cm .cm-dash__card > :last-child { margin-bottom: 0; }
.cm .cm-dash__card .cm-num { margin-bottom: .6rem; }
.cm .cm-dash__card--wide { border-color: var(--cm-line-2); }
@media (min-width: 720px) {
  .cm .cm-dash > section:nth-of-type(1) { grid-area: connect; }
  .cm .cm-dash > section:nth-of-type(2) { grid-area: plan; }
  .cm .cm-dash > section:nth-of-type(3) { grid-area: agent; }
  .cm .cm-dash > section:nth-of-type(4) { grid-area: pcs; }
  .cm .cm-dash > section:nth-of-type(5) { grid-area: usage; }
  .cm .cm-dash > section:nth-of-type(6) { grid-area: help; }
}
.cm .cm-dash__two { display: grid; gap: 4px 28px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 720px) { .cm .cm-dash__two { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.cm .cm-dash .cm-linklist { margin: 0; }
.cm .cm-empty { display: grid; justify-items: center; text-align: center; gap: 6px; padding: 18px 12px; border: 1px dashed var(--cm-line-2); border-radius: 12px; background: rgba(4, 8, 16, .5); }
.cm .cm-empty__icon { width: 44px; height: 44px; color: var(--cm-muted); }
.cm .cm-empty__t { margin: 0; font-weight: 700; color: var(--cm-text); }
.cm .cm-empty p { margin: 0; }

/* sitemap */
.cm .cm-sitemap { display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); align-items: start; }
.cm .cm-sitemap__group { border: 1px solid var(--cm-line); border-radius: var(--cm-radius); padding: 18px 20px; background: rgba(9, 15, 28, .7); }
.cm .cm-sitemap__group h2 { font-family: var(--cm-mono); font-size: .76rem; letter-spacing: .14em; text-transform: uppercase; color: var(--cm-cyan); font-weight: 500; margin: 0 0 8px; }
.cm .cm-sitemap__group ul { list-style: none; padding: 0; margin: 0; }
.cm .cm-sitemap__group li { margin: 0; border-bottom: 1px solid var(--cm-line); }
.cm .cm-sitemap__group li:last-child { border-bottom: 0; }
.cm .cm-sitemap__group a { display: flex; align-items: center; min-height: 44px; color: var(--cm-text); text-decoration: none; font-weight: 600; font-size: .95rem; }
.cm .cm-sitemap__group a:hover { color: var(--cm-cyan); }

/* FAQ page groups */
.cm .cm-faqpage { padding: clamp(28px, 4vw, 48px) var(--cm-gutter) clamp(40px, 5vw, 64px); }
.cm .cm-faqpage section + section { margin-top: clamp(28px, 4vw, 44px); }
.cm .cm-faqpage h2 { font-size: clamp(1.2rem, 1rem + .8vw, 1.5rem); }
.cm .cm-faq summary { min-height: 44px; }

/* showcase */
.cm .cm-fig__view--tall { aspect-ratio: 4 / 3; }
.cm .cm-fig figcaption .cm-fig__title { margin: 0; }

/* diagram figure on phones: keep the vertical drawing readable */
.cm .cm-diagram { margin: 0; }

/* small screens: comfortable type and no overflow */
@media (max-width: 420px) {
  .cm .cm-hero__overlay { padding: 0 10px 10px; }
  .cm .cm-term { font-size: .76rem; }
  .cm .cm-hud__bar { font-size: .62rem; }
  .cm .cm-pipe li { font-size: .7rem; }
  .cm .cm-billing label { padding: 8px 12px; }
}
.cm :where(p, li, h1, h2, h3, a, code, td, th) { overflow-wrap: break-word; }

/* forced colours: keep buttons and cards visible */
@media (forced-colors: active) {
  .cm .cm-btn, .cm .cm-card, .cm .cm-tile, .cm .cm-plan, .cm .cm-copy, .cm .cm-chip { border: 1px solid CanvasText; }
  .cm .cm-grad { color: CanvasText; background: none; }
}

/* hero: a faint static drawing while the request types, then the live build */
.cm .cm-hud.is-staged:not(.is-live) .cm-hero__static { opacity: .28; transition: opacity .4s; }

/* compact connector tiles (home page, "more connectors" lists): two columns even on phones */
.cm .cm-tiles--sm { grid-template-columns: repeat(auto-fill, minmax(min(100%, 150px), 1fr)); gap: 10px; }
@media (min-width: 640px) { .cm .cm-tiles--sm { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); } }
.cm .cm-tiles--sm .cm-tile { padding: 14px; }
.cm .cm-tiles--sm .cm-tile__top { margin-bottom: 12px; flex-wrap: wrap; }
.cm .cm-tiles--sm .cm-mono-badge { width: 44px; height: 44px; font-size: .7rem; border-radius: 11px; }
.cm .cm-tiles--sm .cm-mono-badge::after { inset: 4px; border-radius: 8px; }
.cm .cm-tiles--sm .cm-tile__name { font-size: 1rem; }
.cm .cm-tiles--sm .cm-api { font-size: .7rem; margin-bottom: 10px; }
.cm .cm-tiles--sm .cm-chip { font-size: .62rem; padding: .3em .55em; }

/* ---------- Review fixes (screenshot pass) ---------- */
/* Plans: one column, then two, then one row of 3 or 4 cards (never 3 + 1 orphan). */
.cm .cm-plans { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .cm .cm-plans { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .cm .cm-plans { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); } }
@media (min-width: 640px) and (max-width: 1199px) {
  html.cm-launch-live .cm .cm-plans > .cm-plan:last-child { grid-column: 1 / -1; }
}
@supports selector(:has(a)) {
  @media (min-width: 640px) and (max-width: 1199px) {
    body:has(.cm-header[data-cm-launch="live"]) .cm .cm-plans > .cm-plan:last-child { grid-column: 1 / -1; }
  }
}
/* A hint above wide tables on small screens (the table scrolls inside its own box). */
.cm .cm-table-hint { display: none; margin: 0 0 .5rem; font-family: var(--cm-mono); font-size: .75rem; letter-spacing: .06em; color: var(--cm-muted); }
@media (max-width: 719px) { .cm .cm-table-hint { display: block; } }
/* Dashboard: commands wrap instead of being cut off; help links in two columns on the tablet layout. */
.cm .cm-dash .cm-code code { white-space: pre-wrap; overflow-wrap: anywhere; }
@media (min-width: 720px) and (max-width: 1079px) {
  .cm .cm-dash > section:nth-of-type(6) .cm-linklist { columns: 2; column-gap: 28px; }
  .cm .cm-dash > section:nth-of-type(6) .cm-linklist li { break-inside: avoid; }
}
/* CF7 shows its status box only after a submit; keep it hidden in the start state even if its own CSS is off. */
.cm .wpcf7 form.init .wpcf7-response-output, .cm .wpcf7 form.resetting .wpcf7-response-output, .cm .wpcf7 form.submitting .wpcf7-response-output { display: none; }
/* Galleries: 1, 2 or 3 columns with no orphan card in the last row. */
.cm .cm-gallery { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 700px) { .cm .cm-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .cm .cm-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 700px) and (max-width: 1099px) { .cm .cm-gallery--three > .cm-fig:last-child { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
@media (min-width: 1100px) { .cm .cm-fig--pair { grid-column: span 2; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
/* Grids with a known number of cards: explicit columns, no lone card in the last row. */
.cm .cm-grid--3 { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 600px) { .cm .cm-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .cm .cm-grid--3 > :last-child:nth-child(odd) { grid-column: 1 / -1; } }
@media (min-width: 960px) { .cm .cm-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .cm .cm-grid--3 > :last-child:nth-child(odd) { grid-column: auto; } }
.cm .cm-steps { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 600px) { .cm .cm-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .cm .cm-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); } }