/* Integration service family (WS79). Layered on hub.css + productmodule/module.css; tokens only. */
.cm-ig-page .cm-ig-hero .cm-pm-hero__h1 { max-width: 24ch; }
.cm-ig-page .cm-ig-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* AIO answer box + key facts */
.cm-ig-page .cm-ig-answer { padding: var(--sp-24) var(--sp-32); margin: 0 0 var(--sp-24); background: var(--c-surface-0); border: 1px solid var(--c-lx-line); border-left: var(--sp-4) solid var(--c-brand-500); border-radius: var(--lx-radius-sm); box-shadow: var(--shadow-lx-1); }
.cm-ig-page .cm-ig-answer .lx-eyebrow { margin: 0 0 var(--sp-8); }
.cm-ig-page .cm-ig-answer__text { margin: 0; font-size: var(--text-lead); line-height: var(--lh-body); color: var(--c-navy-900); }
.cm-ig-page .cm-ig-facts .cm-pm-table tbody th { width: 24%; }

/* Diagram (inline SVG, tokens, light and dark). The wide SVG shows on desktop, the vertical one on phones. */
.cm-ig-page .cm-ig { --ig-line: var(--c-navy-400); --ig-node-bg: var(--color-surface); --ig-node-line: var(--c-navy-300); --ig-ink: var(--color-text); margin: 0; padding: var(--sp-24); background: var(--color-surface); border: 1px solid var(--c-lx-line); border-radius: var(--lx-radius-sm); box-shadow: var(--shadow-lx-1); }
[data-theme="dark"] .cm-ig-page .cm-ig { --ig-line: var(--color-link); --ig-node-line: var(--color-link); }
.cm-ig-page .cm-ig .ig-svg { display: block; width: 100%; height: auto; margin: 0 auto; }
.cm-ig-page .cm-ig .ig-svg--wide { max-width: 960px; }
.cm-ig-page .cm-ig .ig-svg--tall { display: none; max-width: 320px; }
.cm-ig-page .cm-ig .ig-node { fill: var(--ig-node-bg); stroke: var(--ig-node-line); stroke-width: 1.5; }
.cm-ig-page .cm-ig .ig-node--key { fill: var(--c-navy-500); stroke: var(--c-navy-500); }
.cm-ig-page .cm-ig .ig-node--cta { stroke: var(--c-brand-500); stroke-width: 2; }
.cm-ig-page .cm-ig .ig-node--side { stroke-dasharray: 5 4; }
.cm-ig-page .cm-ig .ig-t { fill: var(--ig-ink); font-family: var(--font-heading); font-size: var(--fs-14); font-weight: var(--fw-semibold); }
.cm-ig-page .cm-ig .ig-t--key { fill: var(--c-surface-0); }
.cm-ig-page .cm-ig .ig-t--small { font-size: var(--fs-12); font-weight: var(--fw-normal); }
.cm-ig-page .cm-ig .ig-lbl { fill: var(--color-text-muted); font-family: var(--font-base); font-size: var(--fs-12); text-anchor: middle; }
.cm-ig-page .cm-ig .ig-lbl--left { text-anchor: start; }
.cm-ig-page .cm-ig .ig-lbl--right { text-anchor: end; }
.cm-ig-page .cm-ig .ig-line { stroke: var(--ig-line); stroke-width: 2; fill: none; }
.cm-ig-page .cm-ig .ig-line--dash { stroke-dasharray: 5 4; }
.cm-ig-page .cm-ig .ig-ah { fill: var(--ig-line); }
.cm-ig-page .cm-ig .ig-badge { fill: var(--c-brand-500); }
.cm-ig-page .cm-ig .ig-badge-t { fill: var(--c-surface-0); font-family: var(--font-heading); font-size: var(--fs-12); font-weight: var(--fw-semibold); }
.cm-ig-page .cm-ig__cap { margin: var(--sp-16) 0 0; font-size: var(--fs-14); color: var(--color-text-muted); }
@media (max-width: 720px) {
	.cm-ig-page .cm-ig { padding: var(--sp-16); }
	.cm-ig-page .cm-ig .ig-svg--wide { display: none; }
	.cm-ig-page .cm-ig .ig-svg--tall { display: block; }
}

/* Formula text, chips, cards */
.cm-ig-page .cm-ig-formula { font-family: var(--font-mono); font-size: var(--fs-13); color: var(--c-navy-900); overflow-wrap: anywhere; }
.cm-ig-page .cm-ig-chips { display: flex; flex-wrap: wrap; gap: var(--sp-8); margin: 0 0 var(--sp-16); padding: 0; list-style: none; }
.cm-ig-page .cm-ig-chips li { padding: var(--sp-4) var(--sp-12); border: 1px solid var(--c-lx-line); border-radius: var(--r-pill); background: var(--c-surface-0); font-size: var(--fs-14); color: var(--c-navy-900); }
.cm-ig-page .cm-ig-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--lx-grid-gap); margin: 0; padding: 0; list-style: none; }
.cm-ig-page .cm-ig-card { padding: var(--sp-20) var(--sp-24); background: var(--c-surface-0); border: 1px solid var(--c-lx-line); border-radius: var(--lx-radius-sm); box-shadow: var(--shadow-lx-1); }
.cm-ig-page .cm-ig-card h3 { margin: 0 0 var(--sp-8); font-family: var(--font-heading); font-size: var(--text-h4); font-weight: var(--fw-semibold); color: var(--c-navy-900); }
.cm-ig-page .cm-ig-card p { margin: 0 0 var(--sp-8); }
.cm-ig-page .cm-ig-card .cm-pm-fine { margin-top: var(--sp-8); }
.cm-ig-page .cm-pm-cards > .cm-ig-card { height: 100%; }
.cm-ig-page .cm-ig-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cm-ig-page .cm-ig-linkcard__photo { position: relative; display: block; overflow: hidden; aspect-ratio: 16 / 9; background: var(--c-navy-900); }
.cm-ig-page .cm-ig-linkcard__photo .cm-pm-bg { position: absolute; inset: 0; }

/* Sync table: stack rows on phones so no column is clipped. */
.cm-ig-page .cm-ig-sync thead th { font-size: var(--fs-13); text-align: left; padding: var(--sp-12) var(--sp-16); color: var(--c-navy-900); background: var(--c-surface-50); }
.cm-ig-page .cm-ig-sync th, .cm-ig-page .cm-ig-sync td { padding: var(--sp-12) var(--sp-16); font-size: var(--fs-14); }

/* Provider sections (POD page) */
.cm-ig-page .cm-ig-jump { display: flex; flex-wrap: wrap; gap: var(--sp-8); margin: 0 0 var(--sp-24); padding: 0; list-style: none; }
.cm-ig-page .cm-ig-jump a { display: inline-block; padding: var(--sp-4) var(--sp-12); border: 1px solid var(--c-lx-line); border-radius: var(--r-pill); background: var(--c-surface-0); font-size: var(--fs-14); text-decoration: none; }
.cm-ig-page .cm-ig-prov-grid { display: grid; gap: var(--sp-16); }
.cm-ig-page .cm-ig-prov { scroll-margin-top: var(--sp-96); padding: var(--sp-20) var(--sp-24); background: var(--c-surface-0); border: 1px solid var(--c-lx-line); border-radius: var(--lx-radius-sm); box-shadow: var(--shadow-lx-1); }
.cm-ig-page .cm-ig-prov h3 { margin: 0 0 var(--sp-12); font-family: var(--font-heading); font-size: var(--text-h4); font-weight: var(--fw-semibold); color: var(--c-navy-900); }
.cm-ig-page .cm-ig-prov dl { margin: 0; display: grid; gap: var(--sp-8); }
.cm-ig-page .cm-ig-prov dl div { display: grid; grid-template-columns: minmax(0, 11rem) minmax(0, 1fr); gap: var(--sp-12); }
.cm-ig-page .cm-ig-prov dt { font-size: var(--fs-13); font-weight: var(--fw-semibold); color: var(--c-ink-500); }
.cm-ig-page .cm-ig-prov dd { margin: 0; font-size: var(--fs-14); }
.cm-ig-page .cm-ig-prov p { margin: var(--sp-8) 0 0; }
.cm-ig-page .cm-ig-prov .cm-pm-fine { margin-top: var(--sp-12); }

/* Core / Custom, scope, enterprise, related products */
.cm-ig-page .cm-ig-cc { display: grid; gap: var(--sp-16); }
.cm-ig-page .cm-ig-pill { display: inline-block; margin-right: var(--sp-8); padding: var(--sp-2) var(--sp-10); border-radius: var(--r-pill); font-size: var(--fs-12); letter-spacing: var(--ls-label); }
.cm-ig-page .cm-ig-pill--core { background: var(--c-brand-50); color: var(--c-brand-600); }
.cm-ig-page .cm-ig-pill--custom { background: var(--c-navy-500); color: var(--c-surface-0); }
.cm-ig-page .cm-ig-scope { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--lx-grid-gap); margin: 0 0 var(--lx-grid-gap); }
.cm-ig-page .cm-ig-scope .cm-pm-note { padding: var(--sp-24); }
.cm-ig-page .cm-ig-ent .cm-pm-checks { margin-bottom: var(--sp-16); }
.cm-ig-page .cm-ig-prod { margin: 0 0 var(--sp-12); padding: 0; list-style: none; display: grid; gap: var(--sp-12); }
.cm-ig-page .cm-ig-prod li { display: grid; gap: var(--sp-2); }
.cm-ig-page .cm-ig-prod a { text-decoration: none; }
.cm-ig-page .cm-ig-prod span { font-size: var(--fs-14); color: var(--c-ink-500); }
.cm-ig-page .cm-pm-related { justify-content: flex-start; }

@media (max-width: 1100px) {
	.cm-ig-page .cm-ig-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.cm-ig-page .cm-ig-scope { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 720px) {
	.cm-ig-page .cm-ig-grid, .cm-ig-page .cm-ig-cards { grid-template-columns: minmax(0, 1fr); }
	.cm-ig-page .cm-ig-prov dl div { grid-template-columns: minmax(0, 1fr); gap: var(--sp-2); }
	.cm-ig-page .cm-ig-answer { padding: var(--sp-20); }
	.cm-ig-page .cm-ig-sync, .cm-ig-page .cm-ig-sync tbody, .cm-ig-page .cm-ig-sync tr, .cm-ig-page .cm-ig-sync th, .cm-ig-page .cm-ig-sync td { display: block; width: 100%; box-sizing: border-box; min-width: 0; }
	.cm-ig-page .cm-ig-sync { min-width: 0 !important; width: 100% !important; max-width: 100%; }
	.cm-ig-page .cm-ig-sync thead { display: none; }
	.cm-ig-page .cm-ig-sync tbody th { width: 100%; padding-bottom: var(--sp-4); border-bottom: 0; }
	.cm-ig-page .cm-ig-sync td { padding-top: var(--sp-4); padding-bottom: var(--sp-4); border-bottom: 0; }
	.cm-ig-page .cm-ig-sync td::before { content: attr(data-label) ": "; font-weight: var(--fw-semibold); color: var(--c-ink-500); }
	.cm-ig-page .cm-ig-sync tr { padding-bottom: var(--sp-8); border-bottom: 1px solid var(--c-lx-line); }
}