/* Connected architecture and implementation experience for the infrastructure page */
.dci {
  --dci-readable: #302f49;
}
.dci-hero__jump { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 20px; }
.dci .dci-hero__jump a { color: var(--dci-indigo-dark); font-size: 14px; text-underline-offset: 4px; }
#dci-page .dci-connected,
#dci-page .dci-implementation { scroll-margin-top: calc(var(--dci-header-height, 110px) + 86px); }
#dci-page .dci-system__outputs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
#dci-page .dci-standard-card__foot,
#dci-page .dci-editor-preview__sig { font-size: 13px !important; }
#dci-page .dci-paper__brand,
#dci-page .dci-stack__number,
#dci-page .dci-record-card__top strong,
#dci-page .dci-lr-seal,
#dci-page .dci-record-card__seal { font-size: 13px; }

/* Correct the page's undersized interface and diagram typography without changing
   the existing component contracts or the credential-checking workflows. */
#dci-page .dci-eyebrow,
#dci-page .dci-kicker { font-size: 13px; }
#dci-page .dci-system__label,
#dci-page .dci-system__connector,
#dci-page .dci-system__sources span,
#dci-page .dci-system__core div span,
#dci-page .dci-system__core-index,
#dci-page .dci-system__outputs b,
#dci-page .dci-system__outputs span,
#dci-page .dci-system__caption,
#dci-page .dci-lifecycle-ribbon,
#dci-page .dci-stack__tag,
#dci-page .dci-layer-nav__label,
#dci-page .dci-layer-nav__links a,
#dci-page .dci-layer-nav__links b,
#dci-page .dci-layer-nav__progress,
#dci-page .dci-route span,
#dci-page .dci-paper__brand small,
#dci-page .dci-paper__label,
#dci-page .dci-paper__description,
#dci-page .dci-paper__footer,
#dci-page .dci-paper__signature,
#dci-page .dci-paper__qr span,
#dci-page .dci-credential-art__annotation,
#dci-page .dci-workflow,
#dci-page .dci-ui-bar,
#dci-page .dci-ui-context,
#dci-page .dci-template-choice > span:nth-child(2),
#dci-page .dci-template-choice small,
#dci-page .dci-template-choice__glyph,
#dci-page .dci-template-preview__label,
#dci-page .dci-mini-certificate > span,
#dci-page .dci-mini-certificate b,
#dci-page .dci-mini-certificate small,
#dci-page .dci-template-preview__meta,
#dci-page .dci-editor__saved,
#dci-page .dci-fields label,
#dci-page .dci-field-note,
#dci-page .dci-field-note__icon,
#dci-page .dci-editor-preview__institution,
#dci-page .dci-editor-preview__overline,
#dci-page .dci-editor-preview > span:not(.dci-editor-preview__institution):not(.dci-editor-preview__overline),
#dci-page .dci-editor-preview small,
#dci-page .dci-editor-preview__sig,
#dci-page .dci-text-button,
#dci-page .dci-record-card__top small,
#dci-page .dci-status,
#dci-page .dci-record-card__label,
#dci-page .dci-record-card__skills > span,
#dci-page .dci-record-card__main p,
#dci-page .dci-record-card__facts span,
#dci-page .dci-record-card__facts strong,
#dci-page .dci-record-card__skills i,
#dci-page .dci-record-card__bottom,
#dci-page .dci-methods b,
#dci-page .dci-methods span,
#dci-page .dci-api-flow__step > span,
#dci-page .dci-api-flow__step small,
#dci-page .dci-share-map__seal,
#dci-page .dci-share-map__center b,
#dci-page .dci-share-map__center small,
#dci-page .dci-destination,
#dci-page .dci-standard-card__tag,
#dci-page .dci-object__root b,
#dci-page .dci-object__root span,
#dci-page .dci-object__branches b,
#dci-page .dci-object__branches span,
#dci-page .dci-standard-card__foot,
#dci-page .dci-vc-flow__icon,
#dci-page .dci-vc-flow b,
#dci-page .dci-vc-flow small,
#dci-page .dci-json > div,
#dci-page .dci-json > div span:last-child,
#dci-page .dci-json pre,
#dci-page .dci-compare__label,
#dci-page .dci-compare__column > div,
#dci-page .dci-compare__column > i,
#dci-page .dci-standards-route > div span,
#dci-page .dci-standards-route > b,
#dci-page .dci-trust-questions p,
#dci-page .dci-trust-questions article > i,
#dci-page .dci-verify-tabs__intro > p:not(.dci-kicker),
#dci-page .dci-tab-list button,
#dci-page .dci-id-flow > span,
#dci-page .dci-otp-flow > span,
#dci-page .dci-id-flow > span b,
#dci-page .dci-note,
#dci-page .dci-sign-flow span,
#dci-page .dci-sign-flow i,
#dci-page .dci-drop__icon,
#dci-page .dci-drop strong,
#dci-page .dci-drop > span:not(.dci-drop__icon),
#dci-page .dci-drop__choose,
#dci-page .dci-pdf-result,
#dci-page .dci-download-sample,
#dci-page .dci-proof-fields span,
#dci-page .dci-proof-fields b,
#dci-page .dci-matrix-heading > p:last-child,
#dci-page .dci-table-scroll thead th,
#dci-page .dci-table-scroll tbody th,
#dci-page .dci-table-scroll td,
#dci-page .dci-lifecycle p:not(.dci-kicker),
#dci-page .dci-lifecycle__steps span,
#dci-page .dci-skill-map__steps span,
#dci-page .dci-skill-map__title,
#dci-page .dci-skill-map__row span,
#dci-page .dci-skill-map__row b,
#dci-page .dci-skill-map__review,
#dci-page .dci-record-inputs span,
#dci-page .dci-lr-head b,
#dci-page .dci-lr-head small,
#dci-page .dci-lr-chip,
#dci-page .dci-lr-person span,
#dci-page .dci-lr-entry b,
#dci-page .dci-lr-entry small,
#dci-page .dci-lr-entry__verified,
#dci-page .dci-lr-skills > span,
#dci-page .dci-lr-skills i,
#dci-page .dci-learner-record__caption,
#dci-page .dci-layer--workforce .dci-strategy__intro .dci-muted,
#dci-page .dci-job-engine__heading,
#dci-page .dci-job-engine__pipeline span,
#dci-page .dci-job-engine__join b,
#dci-page .dci-job-engine__join span,
#dci-page .dci-job-engine__result,
#dci-page .dci-job-engine__result span,
#dci-page .dci-signature__stack b,
#dci-page .dci-signature__stack span,
#dci-page .dci-signature__journey,
#dci-page .dci-integration-map__inputs span,
#dci-page .dci-integration-map__outputs span,
#dci-page .dci-integration-map__core,
#dci-page .dci-integration-map__core small,
#dci-page .dci-buyer-grid article > p,
#dci-page .dci-buyer-grid__number,
#dci-page .dci-buyer-grid li {
  font-size: max(13px, 1em);
}
#dci-page .dci-fields input { min-height: 44px; font-size: 16px; }
#dci-page .dci-editor-preview { min-height: 330px; }
#dci-page .dci-template-ui__body { min-height: 360px; }
#dci-page .dci-mini-certificate { min-height: 190px; }
#dci-page .dci-paper { min-height: 355px; padding: 34px 38px 28px; }
#dci-page .dci-paper > :not(.dci-paper__rule) { min-width: 0; overflow-wrap: anywhere; }
#dci-page .dci-paper__footer { display: grid; grid-template-columns: minmax(0, 1fr) 96px; align-items: end; gap: 20px; margin-top: 28px; padding-right: 0; }
#dci-page .dci-paper__metadata { display: grid; min-width: 0; gap: 20px; overflow-wrap: anywhere; }
#dci-page .dci-paper__signature { width: fit-content; max-width: 100%; }
#dci-page .dci-paper__qr { position: static; min-width: 0; width: 96px; text-align: center; }
#dci-page .dci-paper__qr img { width: 70px; height: 70px; }
#dci-page .dci-credential-art { flex-direction: column; gap: 16px; padding-block: 18px; }
#dci-page .dci-credential-art__annotation { position: static; justify-content: center; text-align: center; }
#dci-page .dci-share-map { min-height: 300px; }
#dci-page .dci-layer-nav__links { overflow-x: auto; justify-content: flex-start; scrollbar-width: thin; }
#dci-page .dci-layer-nav__links a { flex: 0 0 auto; min-height: 44px; }
#dci-page .dci-layer-nav__inner { gap: 10px; }
#dci-page .dci-verify-panel > p:not(.dci-kicker):not(.dci-note):not(.dci-pdf-result),
#dci-page .dci-standard-card > p:not(.dci-kicker) { font-size: 16px; }
#dci-page .dci-layer--workforce .dci-strategy__intro .dci-muted { font-size: 13px !important; }

.dci-connected,
.dci-implementation {
  --cx-ink: #272641;
  --cx-muted: #5f6074;
  --cx-line: #dcddea;
  --cx-indigo: #4f46e5;
  --cx-teal: #167d78;
  color: var(--cx-ink);
  font-family: "Source Sans 3", sans-serif;
}
.dci-connected *, .dci-connected *::before, .dci-connected *::after,
.dci-implementation *, .dci-implementation *::before, .dci-implementation *::after { box-sizing: border-box; }
.dci-connected { padding: clamp(76px, 10vw, 140px) 0; background: #f4f5fb; }
.dci-connected__shell, .dci-implementation__shell { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }
.dci-connected__intro { display: grid; grid-template-columns: minmax(0, .95fr) minmax(300px, .8fr); gap: clamp(38px, 8vw, 105px); align-items: end; margin-bottom: 46px; }
.dci-connected__eyebrow, .dci-implementation__eyebrow { margin: 0 0 17px; color: #4941b5; font-size: 14px; font-weight: 700; letter-spacing: .12em; line-height: 1.45; text-transform: uppercase; }
.dci-connected h2, .dci-implementation h2 { margin: 0; color: var(--cx-ink); font-family: "Source Sans 3", sans-serif; font-size: clamp(34px, 4.5vw, 58px); font-weight: 600; letter-spacing: -.045em; line-height: 1.08; }
.dci-connected h2 em { color: var(--cx-indigo); font-style: normal; }
.dci-connected__intro-copy { max-width: 520px; margin: 0; color: var(--cx-muted); font-size: 18px; line-height: 1.65; }
.dci-connected__frame { overflow: hidden; border: 1px solid #dedfed; background: #fff; box-shadow: 0 24px 60px rgba(42, 42, 91, .08); }
.dci-connected__frame-head { display: flex; justify-content: space-between; gap: 18px; align-items: center; padding: 20px 26px; border-bottom: 1px solid #e8e8f0; }
.dci-connected__frame-head strong { font-size: 18px; }
.dci-connected__frame-head span { color: var(--cx-muted); font-size: 14px; }
.dci-ecosystem { display: grid; grid-template-columns: minmax(190px, .78fr) 42px minmax(210px, .9fr) 42px minmax(0, 1.55fr); align-items: stretch; gap: 12px; padding: 26px; }
.dci-ecosystem__sources { display: grid; gap: 9px; align-content: center; }
.dci-ecosystem__source { display: grid; width: 100%; min-height: 72px; grid-template-columns: 34px 1fr; align-items: center; gap: 11px; padding: 12px; border: 1px solid #e1e2ed; background: #fbfbfe; color: var(--cx-ink); cursor: pointer; text-align: left; transition: border-color .2s ease, background-color .2s ease, transform .2s ease; }
.dci-ecosystem__source:hover { transform: translateX(3px); border-color: #a8a4dc; }
.dci-ecosystem__source[aria-pressed="true"] { border-color: #7770d3; background: #f2f1ff; box-shadow: inset 3px 0 #574ed0; }
.dci-ecosystem__source-mark { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid #dddeec; border-radius: 50%; color: #5148c1; font-size: 13px; font-weight: 700; }
.dci-ecosystem__source b, .dci-ecosystem__source small { display: block; }
.dci-ecosystem__source b { font-size: 16px; line-height: 1.2; }
.dci-ecosystem__source small { margin-top: 3px; color: var(--cx-muted); font-size: 13px; line-height: 1.3; }
.dci-ecosystem__bridge { display: grid; align-content: center; justify-items: center; gap: 7px; color: #77758e; font-size: 13px; text-align: center; }
.dci-ecosystem__bridge i { position: relative; width: 100%; height: 1px; background: #aaa7d7; }
.dci-ecosystem__bridge i::after { position: absolute; right: 0; top: -4px; width: 8px; height: 8px; border-top: 1px solid #6158c6; border-right: 1px solid #6158c6; content: ""; transform: rotate(45deg); }
.dci-ecosystem__core { display: flex; flex-direction: column; justify-content: center; min-width: 0; padding: 20px; border: 1px solid #635bd1; background: #393585; color: #fff; }
.dci-ecosystem__core-brand { display: flex; align-items: center; gap: 12px; padding-bottom: 17px; border-bottom: 1px solid rgba(255,255,255,.22); }
.dci-ecosystem__core-seal { display: grid; flex: 0 0 42px; width: 42px; height: 42px; place-items: center; border: 1px solid rgba(255,255,255,.55); border-radius: 50%; font-size: 22px; font-weight: 700; }
.dci-ecosystem__core-brand strong { display: block; font-size: 19px; }
.dci-ecosystem__core-brand span { display: block; margin-top: 2px; color: #dad9ff; font-size: 14px; }
.dci-ecosystem__core-brand .dci-ecosystem__core-seal { display: grid; margin: 0; color: #fff; font-size: 22px; }
.dci-ecosystem__six { display: grid; grid-template-columns: 1fr; gap: 7px; margin: 15px 0 0; padding: 0; list-style: none; }
.dci-ecosystem__six li { display: flex; align-items: baseline; gap: 8px; min-width: 0; padding: 8px 7px; border: 1px solid rgba(255,255,255,.2); color: #fff; font-size: 14px; line-height: 1.2; transition: background-color .18s ease, border-color .18s ease; }
.dci-ecosystem__six b { color: #c9c5ff; font-size: 13px; }
.dci-ecosystem__six li.is-lit { border-color: #91d7cb; background: rgba(104, 200, 183, .2); }
.dci-ecosystem__outcomes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 15px; padding-top: 13px; border-top: 1px solid rgba(255,255,255,.22); }
.dci-ecosystem__outcomes span { color: #d7d7f0; font-size: 13px; line-height: 1.35; }
.dci-ecosystem__outcomes b { display: block; color: #fff; font-size: 14px; }
.dci-ecosystem__detail { display: grid; align-content: center; gap: 15px; padding: 19px 18px; border: 1px solid #e0e1ec; background: #fbfbfe; }
.dci-ecosystem__detail-label { margin: 0; color: #5148b9; font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.dci-ecosystem__detail h3 { margin: 0; font-size: 22px; line-height: 1.17; }
.dci-ecosystem__detail p { margin: 0; color: var(--cx-muted); font-size: 16px; line-height: 1.55; }
.dci-ecosystem__detail-route { padding-top: 14px; border-top: 1px solid #e2e2ec; }
.dci-ecosystem__detail-route strong { display: block; margin-bottom: 8px; font-size: 14px; }
.dci-ecosystem__detail-route span { display: block; color: #5d5b74; font-size: 14px; line-height: 1.5; }
.dci-ecosystem__detail-route span::before { content: "→ "; color: var(--cx-indigo); font-weight: 700; }
.dci-connected__governance { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; padding: 17px 25px; border-top: 1px solid #e8e8f0; background: #fafaff; }
.dci-connected__governance p { max-width: 700px; margin: 0; color: var(--cx-muted); font-size: 15px; line-height: 1.5; }
.dci-connected__governance strong { color: var(--cx-ink); }
.dci-connected__governance a { color: #40399e; font-size: 15px; font-weight: 700; text-decoration: none; }
.dci-connected__governance a:hover { text-decoration: underline; text-underline-offset: 3px; }
.dci-connected__mobile-hint { display: none; }

.dci-implementation { padding: clamp(78px, 10vw, 132px) 0; background: #fff; }
.dci-implementation__head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, .68fr); align-items: end; gap: clamp(35px, 8vw, 100px); margin-bottom: 49px; }
.dci-implementation__head > p { max-width: 500px; margin: 0; color: var(--cx-muted); font-size: 18px; line-height: 1.65; }
.dci-implementation__sequence { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); margin: 0; padding: 0; border: 1px solid var(--cx-line); list-style: none; }
.dci-implementation__phase { position: relative; min-height: 295px; padding: 23px 19px 21px; background: #fbfbfe; }
.dci-implementation__phase + .dci-implementation__phase { border-left: 1px solid var(--cx-line); }
.dci-implementation__phase:nth-child(even) { background: #f5f5fb; }
.dci-implementation__number { display: grid; width: 39px; height: 39px; margin-bottom: 23px; place-items: center; border: 1px solid #cfcee4; border-radius: 50%; color: #4e47b2; font-size: 15px; font-weight: 700; }
.dci-implementation__phase h3 { min-height: 52px; margin: 0 0 12px; font-size: 20px; line-height: 1.25; }
.dci-implementation__phase > p { margin: 0; color: var(--cx-muted); font-size: 15px; line-height: 1.52; }
.dci-implementation__deliverable { margin-top: 18px; padding-top: 13px; border-top: 1px solid #dedee9; }
.dci-implementation__deliverable b { display: block; margin-bottom: 4px; color: #4844a1; font-size: 13px; letter-spacing: .07em; text-transform: uppercase; }
.dci-implementation__deliverable span { display: block; color: #4f4e64; font-size: 14px; line-height: 1.4; }
.dci-implementation__layers { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 15px; }
.dci-implementation__layers span { padding: 5px 7px; border: 1px solid #d9d8e8; color: #55536c; font-size: 13px; line-height: 1.25; }
.dci-implementation__layers span.is-primary { border-color: #7771cb; background: #f0efff; color: #39358a; }
.dci-implementation__collaboration { display: grid; grid-template-columns: 1fr 1fr; margin-top: 27px; border: 1px solid var(--cx-line); }
.dci-implementation__custom { margin-top: 42px; }
.dci-implementation__custom > h3 { font-size: 28px; }
.dci-implementation__custom > p { max-width: 850px; color: var(--cx-muted); font-size: 17px; line-height: 1.65; }
.dci-implementation__workscope { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.dci-implementation__workscope article { padding: 24px; border: 1px solid var(--cx-line); background: #f8f8fd; }
.dci-implementation__workscope h4 { font-size: 21px; line-height: 1.3; margin: 0 0 12px; }
.dci-implementation__workscope p { font-size: 16px; color: var(--cx-muted); line-height: 1.6; }
.dci-implementation__workscope small { display: block; color: #40399e; font-size: 13px; font-weight: 650; }
.dci-implementation__collaboration article { padding: 23px 26px; }
.dci-implementation__collaboration article + article { border-left: 1px solid var(--cx-line); }
.dci-implementation__collaboration h3 { margin: 0 0 8px; font-size: 19px; }
.dci-implementation__collaboration p { margin: 0; color: var(--cx-muted); font-size: 15px; line-height: 1.6; }
.dci-implementation__close { display: flex; align-items: center; justify-content: space-between; gap: 25px; margin-top: 35px; padding: 27px 30px; background: #302f51; color: #fff; }
.dci-implementation__close p { max-width: 650px; margin: 0; color: #e2e2f0; font-size: 16px; line-height: 1.55; }
.dci-implementation__close strong { display: block; margin-bottom: 4px; color: #fff; font-size: 20px; }
.dci .dci-implementation__cta { display: inline-flex; flex: 0 0 auto; min-height: 48px; align-items: center; justify-content: center; gap: 12px; padding: 10px 18px; background: #fff; color: #302f51; font-size: 15px; font-weight: 700; text-decoration: none; transition: transform .18s ease, background-color .18s ease; }
.dci-implementation__cta:hover { transform: translateY(-2px); background: #f0efff; }
.dci-connected :focus-visible, .dci-implementation :focus-visible { outline: 3px solid #7a73da; outline-offset: 3px; }

@media (max-width: 980px) {
  .dci-ecosystem { grid-template-columns: minmax(0, .9fr) 28px minmax(0, 1fr); }
  .dci-ecosystem__bridge--second { display: none; }
  .dci-ecosystem__detail { grid-column: 1 / -1; grid-template-columns: .7fr 1.3fr; align-items: center; }
  .dci-ecosystem__detail-label { grid-column: 1 / -1; }
  .dci-ecosystem__detail-route { grid-column: 1 / -1; }
  .dci-implementation__sequence { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dci-implementation__phase { min-height: 255px; }
  .dci-implementation__phase:nth-child(odd) { border-left: 0; }
  .dci-implementation__phase:nth-child(n+3) { border-top: 1px solid var(--cx-line); }
  .dci-implementation__phase:last-child { grid-column: 1 / -1; min-height: auto; }
}
@media (max-width: 700px) {
  #dci-page .dci-proofline { font-size: 13px; }
  #dci-page .dci-system__outputs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dci-implementation__workscope { grid-template-columns: 1fr; }
  #dci-page .dci-system__sources { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #dci-page .dci-route { grid-template-columns: 1fr; }
  #dci-page .dci-route i { transform: rotate(90deg); }
  #dci-page .dci-sign-flow { flex-direction: column; align-items: stretch; }
  #dci-page .dci-sign-flow i { align-self: center; transform: rotate(90deg); }
  #dci-page .dci-layer-nav__inner { flex-wrap: wrap; padding-block: 8px; }
  #dci-page .dci-layer-nav__label { display: none; }
  #dci-page .dci-layer-nav__links { width: 100%; order: 1; }
  #dci-page .dci-layer-nav__progress { position: absolute; right: 24px; top: -24px; min-width: 52px; padding: 3px 6px; background: #fff; }
  #dci-page .dci-layer-nav__links a { padding: 8px 12px; font-size: 14px; }
  #dci-page .dci-table-scroll td::before { font-size: 13px; }
  #dci-page .dci-paper { min-height: 330px; padding-inline: 25px; }
  #dci-page .dci-paper__footer { padding-right: 0; }
  #dci-page .dci-template-ui__body, #dci-page .dci-editor__body { grid-template-columns: 1fr; }
  #dci-page .dci-template-list { border-right: 0; border-bottom: 1px solid #eeedf3; }
  #dci-page .dci-template-preview { min-height: 300px; }
  #dci-page .dci-share-map { grid-template-rows: 70px 100px 70px; }
  #dci-page .dci-share-map__center { width: 112px; }
  #dci-page .dci-destination { min-width: 78px; }
  #dci-page .dci-destination--wallet { transform: none; }
  .dci-connected__shell, .dci-implementation__shell { width: min(100% - 32px, 600px); }
  .dci-connected__intro, .dci-implementation__head { grid-template-columns: 1fr; gap: 19px; }
  .dci-connected__intro-copy, .dci-implementation__head > p { font-size: 17px; }
  .dci-connected__frame-head { align-items: flex-start; flex-direction: column; padding: 17px; gap: 4px; }
  .dci-ecosystem { grid-template-columns: 1fr; gap: 12px; padding: 15px; }
  .dci-ecosystem__sources { grid-template-columns: 1fr 1fr; }
  .dci-ecosystem__source { min-height: 88px; grid-template-columns: 30px 1fr; gap: 8px; padding: 9px; }
  .dci-ecosystem__source-mark { width: 30px; height: 30px; }
  .dci-ecosystem__source b { font-size: 15px; }
  .dci-ecosystem__source small { font-size: 13px; }
  .dci-ecosystem__bridge { grid-template-columns: 1fr auto 1fr; gap: 9px; }
  .dci-ecosystem__bridge i { width: 100%; }
  .dci-ecosystem__bridge--second { display: grid; }
  .dci-ecosystem__core { padding: 17px; }
  .dci-ecosystem__six li { font-size: 14px; }
  .dci-ecosystem__detail { grid-column: auto; grid-template-columns: 1fr; gap: 11px; padding: 17px; }
  .dci-ecosystem__detail-label, .dci-ecosystem__detail-route { grid-column: auto; }
  .dci-connected__governance { align-items: flex-start; flex-direction: column; padding: 17px; }
  .dci-connected__mobile-hint { display: block; margin: 0; padding: 0 16px 13px; color: var(--cx-muted); font-size: 14px; }
  .dci-implementation__sequence { grid-template-columns: 1fr; }
  .dci-implementation__phase, .dci-implementation__phase:last-child { grid-column: auto; min-height: auto; padding: 20px; }
  .dci-implementation__phase + .dci-implementation__phase { border-left: 0; border-top: 1px solid var(--cx-line); }
  .dci-implementation__number { margin-bottom: 14px; }
  .dci-implementation__phase h3 { min-height: 0; }
  .dci-implementation__collaboration { grid-template-columns: 1fr; }
  .dci-implementation__collaboration article + article { border-top: 1px solid var(--cx-line); border-left: 0; }
  .dci-implementation__close { align-items: flex-start; flex-direction: column; padding: 22px; }
}
@media (prefers-reduced-motion: reduce) {
  .dci-connected *, .dci-connected *::before, .dci-connected *::after,
  .dci-implementation *, .dci-implementation *::before, .dci-implementation *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}
@media (max-width: 380px) {
  .dci-ecosystem__sources { grid-template-columns: 1fr; }
}
@media (max-width: 430px) {
  #dci-page .dci-paper__footer { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  #dci-page .dci-paper__metadata { justify-items: center; width: 100%; }
}
