/* ============================================================
   A3.3 Integrations (v4): page-local styles. Namespace in- (page),
   cv- (convergence hero figure), cov- (coverage figure), mq- (marquee).
   Teal is the core and the resolved node in the hero, and the two
   paths in coverage. No dashed lines on this page.
   ============================================================ */
.in-line { margin: var(--space-6) 0 0; max-width: var(--measure-lg); }
.in-line a { color: var(--accent-text); }
.in-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* 1 hero */
.in-hero .uw-h1 { max-width: none; }
.in-hero .uw-lead { max-width: var(--measure-lg); }
.in-hero .uw-cta { margin-block-start: calc(var(--text-lg) * var(--lh-relaxed)); }   /* one lead line-height, Modernize VM hero rhythm */
.in-hero__fig { margin-block-start: calc(var(--text-lg) * var(--lh-relaxed)); margin-block-end: 0; margin-inline: 0; }
.cv { display: block; width: 100%; height: auto; overflow: visible; --cv-s: 1; }
.cv--m { display: none; max-width: 480px; margin-inline: auto; }
.cv-core { fill: rgba(72,220,232,.10); stroke: var(--accent-text); stroke-width: 2.5; }
.cv-core__t { font-family: var(--font-sans); font-size: calc(15px * var(--cv-s)); font-weight: 600; fill: #FFFFFF; }
.cv-lbl { font-family: var(--font-sans); font-size: calc(15px * var(--cv-s)); font-weight: 500; fill: #7C8698; }
.cv-tag { font-family: var(--font-mono); font-size: calc(13px * var(--cv-s)); fill: #7C8698; opacity: 0; }
.cv-stream { stroke: #7C8698; stroke-width: 1; opacity: .12; }
.cv-particle { fill: #7C8698; }
.cv-card { opacity: 0; }
.cv-card rect { fill: #10151D; stroke: #A2ABBB; stroke-width: 2; }
.cv-card text { font-family: var(--font-mono); font-size: calc(13px * var(--cv-s)); fill: #E4E8EE; }
.cv-link { stroke: #E4E8EE; stroke-width: 2; }
.cv-node circle { fill: #E4E8EE; }
.cv-node--resolved circle { fill: var(--accent-text); r: 9; }
.cv-node text { font-family: var(--font-mono); font-size: calc(14px * var(--cv-s)); font-weight: 500; fill: #FFFFFF; }
.cv-owner { font-family: var(--font-mono); font-size: calc(13px * var(--cv-s)); fill: #E4E8EE; }
@media (max-width: 1279.98px) { .cv--d { --cv-s: 1.2; } }
.cv--m .cv-lbl { font-size: 14px; }
.cv--m .cv-core__t { font-size: 14px; }
.cv--m .cv-tag, .cv--m .cv-owner, .cv--m .cv-card text { font-size: 14px; }
@media (max-width: 1023.98px) { .cv--d { display: none; } .cv--m { display: block; } }

/* 2 coverage */
.cov { margin-top: var(--space-10); }
.cov__cols { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: var(--space-3); }
.cov__col { min-width: 0; padding-inline-start: var(--space-3); border-inline-start: 2px solid rgba(10,13,18,.18); }
.cov__col--ai { border-inline-start-color: var(--accent-text); }
.cov__col--ai .cov__h { color: var(--accent-text); }
.cov__h { display: block; font-family: var(--font-sans); font-size: 18px; font-weight: 600; line-height: 1.2; color: var(--text-primary); overflow-wrap: anywhere; }
.cov__s { display: block; margin-top: 4px; font-family: var(--font-sans); font-size: 14px; line-height: 1.35; color: var(--text-tertiary); }
.cov__svg { display: block; width: 100%; height: auto; overflow: visible; margin-top: var(--space-5); }
.cov__link { stroke: var(--accent-text); stroke-width: 2.5; }
.cov__head { fill: var(--accent-text); }
.cov__n { fill: var(--accent-text); stroke: #FFFFFF; stroke-width: 2; }
.cov__t { font-family: var(--font-mono); font-size: 9px; font-weight: 500; fill: var(--text-primary); }   /* 14.6px at 1136, 12.3px at 960 */
.cov__tag { font-family: var(--font-mono); font-size: 9px; font-weight: 500; letter-spacing: .08em; fill: var(--accent-text); }
.cov__stack, .cov__v { display: none; }
@media (max-width: 1279.98px) { .cov__col { padding-inline-start: var(--space-2); } }
@media (max-width: 1023.98px) { .cov__t, .cov__tag { font-size: 10.5px; } }
@media (max-width: 900px) {
  .cov__cols, .cov__svg { display: none; }
  .cov__stack { display: grid; margin: 0; padding: 0; list-style: none; }
  .cov__row { padding: var(--space-3) 0; border-block-end: 1px solid var(--border-default); }
  .cov__row--ai .cov__h { color: var(--accent-text); }
  .cov__v { display: grid; margin: var(--space-8) 0 0; padding: 0 0 0 28px; list-style: none; position: relative; }
  .cov__v::before { content: ""; position: absolute; left: 6px; top: 10px; bottom: 14px; width: 2.5px; background: var(--accent-text); }
  .cov__v-tag { margin: 0 0 var(--space-2) -28px; font-family: var(--font-mono); font-size: 12px; letter-spacing: .08em; color: var(--accent-text); }
  .cov__vn { position: relative; padding: 0 0 var(--space-4); }
  .cov__vn::before { content: ""; position: absolute; left: -28px; top: 4px; width: 14px; height: 14px; box-sizing: border-box; border-radius: 50%; background: var(--accent-text); border: 2px solid #FFFFFF; }
  .cov__vn:last-child::after { content: ""; position: absolute; left: -24px; top: 10px; width: 0; height: 0; }
  .cov__vname { display: block; font-family: var(--font-mono); font-size: 14px; font-weight: 500; color: var(--text-primary); }
  .cov__vdom { display: block; margin-top: 2px; font-family: var(--font-sans); font-size: 14px; color: var(--text-tertiary); }
}

/* 3 connected today: marquee */
.mq { margin-top: var(--space-8); overflow: hidden; outline: none; padding-block: var(--space-2); }
.mq:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
.mq__row { display: flex; width: max-content; animation: mq-scroll 110s linear infinite; }
.mq__row + .mq__row { margin-top: var(--space-5); }
.mq__row--2 { animation-direction: reverse; animation-duration: 125s; }
.mq__row--3 { animation-duration: 118s; }
.mq--2 { display: none; }
@media (max-width: 1023.98px) { .mq--3 { display: none; } .mq--2 { display: block; } }
.mq__track { display: flex; flex: none; gap: 14px; margin: 0; padding: 0 7px; list-style: none; }
.mq__chip { display: inline-flex; align-items: center; gap: 9px; height: 40px; padding: 0 16px; border: 1px solid rgba(10,13,18,.18); border-radius: 999px; background: #FFFFFF; white-space: nowrap; }
.mq__icon { width: 20px; height: 20px; flex: none; filter: grayscale(1) opacity(.62); }
.mq__name { font-family: var(--font-sans); font-size: 16px; line-height: 1; color: var(--text-tertiary); }
.mq:hover .mq__row, .mq:focus .mq__row, .mq:focus-within .mq__row { animation-play-state: paused; }
@keyframes mq-scroll { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
  .mq__row { animation: none; display: block; width: auto; }
  .mq__track { display: flex; flex: 1 1 auto; width: auto; flex-wrap: wrap; justify-content: center; row-gap: 10px; padding: 0; }
  .mq__track--dup { display: none; }
}

/* 4 promise */
.in-promise { border-bottom: 0; }
.in-promise p { color: #E4E8EE; }
.in-promise em { color: var(--accent-text); }
