/* =========================================================
   BUILD DETAIL VARIANT — API & INTEGRATIONS
   /services/build/api-integrations/
   Shared through build-details.css.
   ========================================================= */

.api-section-intro,
.api-capability-head,
.api-fabric-head,
.api-outcomes-head {
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:clamp(2.5rem,6vw,6rem);
  align-items:end;
  margin-bottom:2.7rem;
}

/* Hero */
.api-hero {
  overflow:hidden;
}

.api-hero-stage {
  position:relative;
  min-height:650px;
  overflow:hidden;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 28px 68px rgba(3,17,31,.24);
}

.api-hero-image,
.api-hero-shade {
  position:absolute;
  inset:0;
}

.api-hero-image img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.api-hero-shade {
  background:
    linear-gradient(90deg,rgba(5,25,44,.97) 0%,rgba(5,25,44,.91) 38%,rgba(5,25,44,.54) 67%,rgba(5,25,44,.30) 100%),
    linear-gradient(180deg,rgba(5,25,44,.02),rgba(5,25,44,.42));
}

.api-hero-copy {
  position:absolute;
  z-index:3;
  left:clamp(1.5rem,4vw,3.6rem);
  top:50%;
  width:min(620px,52%);
  transform:translateY(-54%);
}

.api-hero .inner-page-title {
  max-width:680px;
  font-size:clamp(3rem,4.4vw,5rem);
  line-height:.98;
  letter-spacing:-.055em;
}

.api-hero .inner-page-lead {
  max-width:620px;
  font-size:clamp(1rem,1.15vw,1.18rem);
  line-height:1.66;
}

.api-hero-flow {
  position:absolute;
  z-index:4;
  right:2rem;
  top:2rem;
  display:flex;
  align-items:center;
  gap:.55rem;
  padding:.75rem;
  border:1px solid rgba(255,255,255,.14);
  border-radius:14px;
  background:rgba(8,31,51,.82);
  backdrop-filter:blur(8px);
}

.api-hero-flow-node,
.api-hero-flow-core {
  min-width:100px;
  padding:.7rem .8rem;
  text-align:center;
  border-radius:9px;
}

.api-hero-flow-node {
  background:rgba(255,255,255,.045);
}

.api-hero-flow-core {
  min-width:135px;
  border:1px solid rgba(121,184,239,.25);
  background:rgba(10,49,97,.72);
}

.api-hero-flow-node span,
.api-hero-flow-core small {
  display:block;
  margin-bottom:.25rem;
  color:#79B8EF;
  font-size:.47rem;
  font-weight:850;
  letter-spacing:.12em;
}

.api-hero-flow-node:last-child span {
  color:#E1849D;
}

.api-hero-flow strong {
  display:block;
  color:#fff;
  font-size:.69rem;
}

.api-hero-flow-line {
  width:26px;
  height:1px;
  background:rgba(121,184,239,.42);
}

.api-hero-signal {
  position:absolute;
  z-index:4;
  right:2rem;
  width:215px;
  padding:.8rem .9rem;
  border:1px solid rgba(255,255,255,.13);
  border-radius:10px;
  background:rgba(8,31,51,.80);
  backdrop-filter:blur(8px);
}

.api-hero-signal-one { bottom:2rem; }
.api-hero-signal-two { bottom:7.9rem; right:4.1rem; }
.api-hero-signal-three { bottom:13.8rem; }

.api-hero-signal span {
  display:block;
  margin-bottom:.25rem;
  color:#E1849D;
  font-size:.48rem;
  font-weight:850;
}

.api-hero-signal:nth-of-type(even) span {
  color:#79B8EF;
}

.api-hero-signal strong {
  display:block;
  color:#fff;
  font-size:.72rem;
}

.api-hero-signal small {
  display:block;
  margin-top:.18rem;
  color:#A7B8C4;
  font-size:.54rem;
}

/* Landscape */
.api-landscape {
  background:#fff;
}

.api-landscape-layout {
  display:grid;
  grid-template-columns:minmax(300px,.86fr) minmax(0,1.14fr);
  gap:1.2rem;
  align-items:start;
}

.api-landscape-overview {
  padding:1.35rem;
  border:1px solid #DCE5EA;
  border-radius:18px;
  background:linear-gradient(180deg,#FBFCFD 0%,#F4F8FA 100%);
  box-shadow:0 18px 36px rgba(18,42,62,.05);
}

.api-landscape-kicker {
  display:inline-block;
  margin-bottom:.55rem;
  color:#0A3161;
  font-size:.45rem;
  font-weight:850;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.api-landscape-overview h3 {
  margin:0 0 .65rem;
  color:var(--itx-ink);
  font-size:1.25rem;
  line-height:1.26;
}

.api-landscape-overview-top p {
  margin:0;
  color:#6D7984;
  font-size:.78rem;
  line-height:1.68;
}

.api-landscape-points {
  display:grid;
  gap:.75rem;
  margin-top:1rem;
}

.api-landscape-points article {
  padding:.85rem .9rem;
  border:1px solid #DFE7EC;
  border-radius:14px;
  background:#fff;
}

.api-landscape-points strong {
  display:block;
  margin-bottom:.28rem;
  color:var(--itx-ink);
  font-size:.72rem;
}

.api-landscape-points p {
  margin:0;
  color:#72808B;
  font-size:.7rem;
  line-height:1.55;
}

.api-landscape-stack {
  display:grid;
  gap:.9rem;
}

.api-landscape-mini-card {
  display:grid;
  grid-template-columns:220px minmax(0,1fr);
  gap:1rem;
  align-items:center;
  padding:.8rem;
  border:1px solid #DCE5EA;
  border-radius:18px;
  background:#fff;
  box-shadow:0 18px 36px rgba(18,42,62,.05);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.api-landscape-mini-card:hover {
  transform:translateY(-3px);
  border-color:#CFDCE4;
  box-shadow:0 22px 42px rgba(18,42,62,.08);
}

.api-landscape-mini-thumb {
  position:relative;
  height:160px;
  overflow:hidden;
  border-radius:14px;
  background:#17344E;
}

.api-landscape-mini-thumb::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(7,28,47,.05) 35%,rgba(7,28,47,.56) 100%);
}

.api-landscape-mini-thumb img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.api-landscape-mini-thumb span {
  position:absolute;
  left:.8rem;
  top:.8rem;
  z-index:2;
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  color:#fff;
  font-size:.48rem;
  font-weight:850;
  border-radius:50%;
  background:#B31942;
}

.api-landscape-mini-card:nth-child(even) .api-landscape-mini-thumb span {
  background:#0A3161;
}

.api-landscape-mini-copy small {
  display:block;
  margin-bottom:.35rem;
  color:#B31942;
  font-size:.44rem;
  font-weight:850;
  letter-spacing:.12em;
}

.api-landscape-mini-card:nth-child(even) .api-landscape-mini-copy small {
  color:#0A3161;
}

.api-landscape-mini-copy h3 {
  margin:0 0 .45rem;
  color:var(--itx-ink);
  font-size:1rem;
  line-height:1.36;
}

.api-landscape-mini-copy p {
  margin:0;
  color:#6D7984;
  font-size:.73rem;
  line-height:1.6;
}

/* Capabilities */
.api-capabilities {
  background:#F7F9FB;
  border-top:1px solid #E6ECEF;
  border-bottom:1px solid #E6ECEF;
}

.api-capability-bands {
  border-top:1px solid #DDE4E9;
}

.api-capability-bands article {
  display:grid;
  grid-template-columns:56px minmax(240px,.8fr) minmax(0,1fr) 42px;
  gap:1.2rem;
  align-items:center;
  min-height:112px;
  border-bottom:1px solid #DDE4E9;
}

.api-capability-index {
  display:grid;
  place-items:center;
  width:40px;
  height:40px;
  color:#fff;
  font-size:.55rem;
  font-weight:850;
  border-radius:50%;
  background:#0A3161;
}

.api-capability-bands article:nth-child(even) .api-capability-index {
  background:#B31942;
}

.api-capability-main small {
  display:block;
  margin-bottom:.28rem;
  color:#B31942;
  font-size:.49rem;
  font-weight:850;
  letter-spacing:.12em;
}

.api-capability-bands article:nth-child(even) .api-capability-main small {
  color:#0A3161;
}

.api-capability-main h3 {
  margin:0;
  color:var(--itx-ink);
  font-size:.92rem;
  line-height:1.38;
}

.api-capability-bands article > p {
  margin:0;
  color:#6D7984;
  font-size:.75rem;
  line-height:1.55;
}

.api-capability-bands article > i {
  color:#8A9AA6;
  font-size:1.05rem;
}

/* Pressure */
.api-pressure {
  background:#fff;
}

.api-pressure-grid {
  display:grid;
  grid-template-columns:minmax(390px,.9fr) minmax(0,1.1fr);
  gap:clamp(3rem,6vw,6rem);
  align-items:center;
}

.api-pressure-visual {
  position:relative;
  min-height:610px;
  overflow:hidden;
  border-radius:20px;
  box-shadow:0 22px 55px rgba(19,42,65,.11);
}

.api-pressure-visual img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.api-pressure-visual::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(7,28,47,.02) 34%,rgba(7,28,47,.82) 100%);
}

.api-pressure-note {
  position:absolute;
  left:1.3rem;
  right:1.3rem;
  bottom:1.3rem;
  z-index:2;
  padding:1rem 1.05rem;
  border-left:3px solid #B31942;
  border-radius:8px;
  background:rgba(9,34,57,.81);
}

.api-pressure-note span {
  display:block;
  margin-bottom:.35rem;
  color:#9BCBF1;
  font-size:.51rem;
  font-weight:850;
  letter-spacing:.12em;
}

.api-pressure-note strong {
  color:#fff;
  font-size:.9rem;
  line-height:1.45;
}

.api-pressure-copy .section-title {
  margin-bottom:1.05rem;
}

.api-pressure-signals {
  margin-top:1.55rem;
}

.api-pressure-signals article {
  display:grid;
  grid-template-columns:42px 1fr;
  gap:.8rem;
  padding:.9rem 0;
  border-bottom:1px solid #DDE4E9;
}

.api-pressure-signals article:first-child {
  border-top:1px solid #DDE4E9;
}

.api-pressure-signals article > span {
  color:#B31942;
  font-size:.56rem;
  font-weight:850;
}

.api-pressure-signals article:nth-child(even) > span {
  color:#0A3161;
}

.api-pressure-signals strong {
  display:block;
  color:var(--itx-ink);
  font-size:.86rem;
}

.api-pressure-signals p {
  margin:.25rem 0 0;
  color:#6D7984;
  font-size:.73rem;
  line-height:1.52;
}

/* Integration Fabric */
.api-fabric {
  position:relative;
  overflow:hidden;
  color:#C8D4DD;
  background:
    radial-gradient(circle at 78% 18%,rgba(121,184,239,.10),transparent 30%),
    linear-gradient(142deg,#203A53,#152D43);
}

.api-fabric .eyebrow {
  color:#92C8F4;
}

.api-fabric .section-title {
  color:#fff;
}

.api-fabric .section-lead {
  color:#BAC9D3;
}

.api-fabric-stage {
  position:relative;
  min-height:660px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.10);
  border-radius:22px;
  background:#102A40;
  box-shadow:0 24px 60px rgba(3,17,31,.18);
}

.api-fabric-image {
  position:absolute;
  inset:0;
}

.api-fabric-image::after {
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 50% 45%,rgba(25,64,93,.18),rgba(8,27,42,.90) 70%),
    linear-gradient(180deg,rgba(8,27,42,.38),rgba(8,27,42,.84));
}

.api-fabric-image img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  opacity:.30;
}

.api-fabric-core {
  position:absolute;
  left:50%;
  top:44%;
  z-index:4;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  width:285px;
  height:190px;
  transform:translate(-50%,-50%);
  text-align:center;
  border:1px solid rgba(121,184,239,.25);
  border-radius:22px;
  background:rgba(17,48,72,.95);
  box-shadow:0 20px 45px rgba(3,17,31,.24);
}

.api-fabric-core small {
  display:block;
  margin-bottom:.5rem;
  color:#9BCBF1;
  font-size:.49rem;
  font-weight:850;
  letter-spacing:.13em;
}

.api-fabric-core strong {
  color:#fff;
  font-size:.88rem;
}

.api-fabric-core span {
  margin-top:.45rem;
  color:#AABBC7;
  font-size:.58rem;
}

.api-fabric-node {
  position:absolute;
  z-index:4;
  width:220px;
  min-height:102px;
  padding:.82rem .9rem;
  border:1px solid rgba(255,255,255,.10);
  border-radius:12px;
  background:rgba(17,45,67,.88);
  backdrop-filter:blur(7px);
}

.api-fabric-node > span {
  position:absolute;
  right:.8rem;
  top:.65rem;
  color:#AABAC6;
  font-size:.5rem;
  font-weight:850;
}

.api-fabric-node small {
  display:block;
  margin-bottom:.3rem;
  color:#79B8EF;
  font-size:.47rem;
  font-weight:850;
  letter-spacing:.11em;
}

.api-fabric-node:nth-of-type(even) small {
  color:#E1849D;
}

.api-fabric-node strong {
  color:#fff;
  font-size:.76rem;
}

.api-fabric-node-apps { left:7%; top:14%; }
.api-fabric-node-enterprise { right:7%; top:14%; }
.api-fabric-node-partners { left:9%; bottom:18%; }
.api-fabric-node-data { right:9%; bottom:18%; }

.api-fabric-lines {
  position:absolute;
  z-index:3;
  height:1px;
  transform-origin:left center;
  background:rgba(121,184,239,.22);
}

.api-line-one { left:24%; top:29%; width:28%; transform:rotate(12deg); }
.api-line-two { left:52%; top:29%; width:25%; transform:rotate(-12deg); }
.api-line-three { left:25%; bottom:31%; width:29%; transform:rotate(-12deg); }
.api-line-four { left:52%; bottom:31%; width:26%; transform:rotate(12deg); }

.api-fabric-principles {
  position:absolute;
  left:1.2rem;
  right:1.2rem;
  bottom:1.1rem;
  z-index:5;
  display:grid;
  grid-template-columns:repeat(5,1fr);
  border-top:1px solid rgba(255,255,255,.10);
  border-bottom:1px solid rgba(255,255,255,.07);
  background:rgba(8,25,39,.40);
  backdrop-filter:blur(6px);
}

.api-fabric-principles span {
  position:relative;
  padding:.68rem .4rem;
  color:#D3DEE6;
  font-size:.5rem;
  font-weight:850;
  letter-spacing:.11em;
  text-align:center;
  text-transform:uppercase;
}

.api-fabric-principles span + span {
  border-left:1px solid rgba(255,255,255,.07);
}

.api-fabric-principles span::before {
  content:"";
  position:absolute;
  top:-1px;
  left:50%;
  width:22px;
  height:2px;
  transform:translateX(-50%);
  background:#79B8EF;
}

.api-fabric-principles span:nth-child(even)::before {
  background:#B31942;
}

/* Delivery */
.api-delivery {
  background:#F7F9FB;
  border-top:1px solid #E6ECEF;
  border-bottom:1px solid #E6ECEF;
}

.api-delivery-top {
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(400px,.95fr);
  gap:clamp(3rem,6vw,6rem);
  align-items:center;
}

.api-delivery-image {
  min-height:340px;
  overflow:hidden;
  border-radius:18px;
}

.api-delivery-image img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.api-delivery-path {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  margin-top:2.4rem;
  border-top:1px solid #DDE4E9;
  border-bottom:1px solid #DDE4E9;
}

.api-delivery-path article {
  min-height:250px;
  padding:1.25rem 1.15rem;
}

.api-delivery-path article + article {
  border-left:1px solid #DDE4E9;
}

.api-delivery-path article > span {
  display:block;
  margin-bottom:2rem;
  color:#B31942;
  font-size:1.35rem;
  font-weight:720;
}

.api-delivery-path article:nth-child(even) > span {
  color:#0A3161;
}

.api-delivery-path small {
  display:block;
  margin-bottom:.38rem;
  color:#8B98A2;
  font-size:.48rem;
  font-weight:850;
  letter-spacing:.12em;
}

.api-delivery-path h3 {
  margin:0 0 .42rem;
  color:var(--itx-ink);
  font-size:.88rem;
  line-height:1.4;
}

.api-delivery-path p {
  margin:0;
  color:#6D7984;
  font-size:.72rem;
  line-height:1.54;
}

/* Technology Patterns */
.api-patterns {
  background:#fff;
}

.api-patterns-layout {
  display:grid;
  grid-template-columns:minmax(380px,.88fr) minmax(0,1.12fr);
  gap:clamp(3rem,6vw,6rem);
  align-items:center;
}

.api-patterns-image {
  position:relative;
  min-height:620px;
  overflow:hidden;
  border-radius:20px;
  box-shadow:0 22px 55px rgba(19,42,65,.11);
}

.api-patterns-image img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.api-patterns-image::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(7,28,47,.02) 34%,rgba(7,28,47,.82) 100%);
}

.api-patterns-image-note {
  position:absolute;
  left:1.25rem;
  right:1.25rem;
  bottom:1.25rem;
  z-index:2;
  padding:.95rem 1rem;
  border-left:3px solid #79B8EF;
  border-radius:8px;
  background:rgba(9,34,57,.81);
}

.api-patterns-image-note span {
  display:block;
  margin-bottom:.34rem;
  color:#9BCBF1;
  font-size:.5rem;
  font-weight:850;
  letter-spacing:.12em;
}

.api-patterns-image-note strong {
  color:#fff;
  font-size:.88rem;
  line-height:1.45;
}

.api-patterns-copy .section-title {
  margin-bottom:1.05rem;
}

.api-pattern-cards {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.75rem;
  margin-top:1.6rem;
}

.api-pattern-cards article {
  min-height:180px;
  padding:1rem;
  border:1px solid #DFE6EB;
  border-radius:12px;
  background:#FAFCFD;
}

.api-pattern-cards span {
  display:block;
  margin-bottom:.75rem;
  color:#B31942;
  font-size:.49rem;
  font-weight:850;
  letter-spacing:.12em;
}

.api-pattern-cards article:nth-child(even) span {
  color:#0A3161;
}

.api-pattern-cards strong {
  display:block;
  margin-bottom:.42rem;
  color:var(--itx-ink);
  font-size:.82rem;
}

.api-pattern-cards p {
  margin:0;
  color:#6D7984;
  font-size:.71rem;
  line-height:1.5;
}

.api-tech-line {
  display:flex;
  flex-wrap:wrap;
  gap:.4rem;
  margin-top:1rem;
}

.api-tech-line span {
  padding:.38rem .52rem;
  color:#5E6C77;
  font-size:.58rem;
  font-weight:720;
  border:1px solid #DDE4E9;
  border-radius:6px;
  background:#fff;
}

/* Outcomes */
.api-outcomes {
  color:#fff;
  background:
    radial-gradient(circle at 84% 12%,rgba(121,184,239,.10),transparent 30%),
    linear-gradient(145deg,#203A53,#152D43);
}

.api-outcomes .eyebrow {
  color:#92C8F4;
}

.api-outcomes .section-title {
  color:#fff;
}

.api-outcomes .section-lead {
  color:#C0CFD9;
}

.api-outcome-grid {
  display:grid;
  grid-template-columns:1.35fr repeat(3,1fr);
  border-top:1px solid rgba(255,255,255,.11);
  border-bottom:1px solid rgba(255,255,255,.08);
}

.api-outcome-grid article {
  min-height:270px;
  padding:1.25rem;
}

.api-outcome-grid article + article {
  border-left:1px solid rgba(255,255,255,.08);
}

.api-outcome-grid span {
  display:block;
  margin-bottom:2.6rem;
  color:#9FB1BE;
  font-size:.55rem;
  font-weight:850;
}

.api-outcome-grid strong {
  display:block;
  color:#fff;
  font-size:.95rem;
  line-height:1.42;
}

.api-outcome-feature strong {
  font-size:1.35rem;
}

.api-outcome-grid p {
  margin:.55rem 0 0;
  color:#BFCCD6;
  font-size:.73rem;
  line-height:1.56;
}

/* Related */
.api-related {
  background:#F7F9FB;
  border-top:1px solid #E6ECEF;
}

.api-related-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
}

.api-related-card {
  overflow:hidden;
  color:inherit;
  text-decoration:none;
  border:1px solid #DDE4E9;
  border-radius:14px;
  background:#fff;
  transition:transform .2s ease,box-shadow .2s ease;
}

.api-related-card:hover {
  transform:translateY(-4px);
  box-shadow:0 16px 38px rgba(19,42,65,.08);
}

.api-related-thumb {
  height:165px;
  overflow:hidden;
}

.api-related-thumb img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  transition:transform .25s ease;
}

.api-related-card:hover .api-related-thumb img {
  transform:scale(1.025);
}

.api-related-copy {
  padding:1rem;
}

.api-related-copy > span {
  display:block;
  margin-bottom:.42rem;
  color:#B31942;
  font-size:.48rem;
  font-weight:850;
  letter-spacing:.12em;
}

.api-related-card:nth-child(even) .api-related-copy > span {
  color:#0A3161;
}

.api-related-copy h3 {
  margin:0 0 .42rem;
  color:var(--itx-ink);
  font-size:.94rem;
}

.api-related-copy p {
  margin:0 0 .8rem;
  color:#6D7984;
  font-size:.72rem;
  line-height:1.52;
}

.api-related-copy strong {
  color:#0A3161;
  font-size:.65rem;
}

.api-related-card:nth-child(even) .api-related-copy strong {
  color:#B31942;
}

/* Capability Cards */
.api-capability-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:.9rem;
}

.api-capability-card {
  overflow:hidden;
  border:1px solid #DDE5EA;
  border-radius:16px;
  background:#fff;
  box-shadow:0 14px 34px rgba(18,42,62,.05);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.api-capability-card:hover {
  transform:translateY(-4px);
  border-color:#CBD8E0;
  box-shadow:0 18px 40px rgba(18,42,62,.08);
}

.api-capability-image {
  position:relative;
  height:220px;
  overflow:hidden;
  background:#17344C;
}

.api-capability-image::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(7,28,47,.04) 42%,rgba(7,28,47,.62) 100%);
}

.api-capability-image img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  transition:transform .25s ease;
}

.api-capability-card:hover .api-capability-image img {
  transform:scale(1.035);
}

.api-capability-image span {
  position:absolute;
  left:.85rem;
  bottom:.8rem;
  z-index:2;
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  color:#fff;
  font-size:.5rem;
  font-weight:850;
  border-radius:50%;
  background:rgba(179,25,66,.88);
}

.api-capability-card:nth-child(even) .api-capability-image span {
  background:rgba(10,49,97,.88);
}

.api-capability-copy {
  padding:1rem;
}

.api-capability-copy small {
  display:block;
  margin-bottom:.4rem;
  color:#B31942;
  font-size:.43rem;
  font-weight:850;
  letter-spacing:.12em;
}

.api-capability-card:nth-child(even) .api-capability-copy small {
  color:#0A3161;
}

.api-capability-copy h3 {
  margin:0 0 .45rem;
  color:var(--itx-ink);
  font-size:.88rem;
  line-height:1.42;
}

.api-capability-copy p {
  margin:0;
  color:#6D7984;
  font-size:.72rem;
  line-height:1.56;
}

/* Integration Fabric — V2 */
.api-fabric-layout {
  display:grid;
  grid-template-columns:minmax(390px,.96fr) minmax(0,1.04fr);
  gap:clamp(2.4rem,5vw,4.5rem);
  align-items:stretch;
}

.api-fabric-visual-v2 {
  position:relative;
  min-height:580px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.10);
  border-radius:22px;
  background:#102A40;
  box-shadow:0 24px 60px rgba(3,17,31,.18);
}

.api-fabric-visual-v2::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(8,27,42,.18) 14%,rgba(8,27,42,.82) 100%);
}

.api-fabric-visual-v2 img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  opacity:.42;
}

.api-fabric-overlay-card {
  position:absolute;
  left:1.25rem;
  right:1.25rem;
  bottom:5rem;
  z-index:2;
  padding:1rem 1.05rem;
  border-left:3px solid #79B8EF;
  border-radius:10px;
  background:rgba(8,34,55,.86);
  box-shadow:0 18px 34px rgba(3,17,31,.16);
}

.api-fabric-overlay-card small {
  display:block;
  margin-bottom:.35rem;
  color:#9BCBF1;
  font-size:.47rem;
  font-weight:850;
  letter-spacing:.12em;
}

.api-fabric-overlay-card strong {
  display:block;
  color:#fff;
  font-size:.9rem;
  line-height:1.4;
}

.api-fabric-overlay-card p {
  margin:.45rem 0 0;
  color:#C0CFD9;
  font-size:.71rem;
  line-height:1.55;
}

.api-fabric-chip-row {
  position:absolute;
  left:1.25rem;
  right:1.25rem;
  bottom:1.15rem;
  z-index:2;
  display:flex;
  flex-wrap:wrap;
  gap:.45rem;
}

.api-fabric-chip-row span {
  padding:.44rem .58rem;
  color:#D5E2EA;
  font-size:.52rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  border:1px solid rgba(255,255,255,.10);
  border-radius:999px;
  background:rgba(8,28,45,.68);
}

.api-fabric-details {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.8rem;
  align-content:start;
}

.api-fabric-details article {
  min-height:250px;
  padding:1rem;
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  background:rgba(255,255,255,.05);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.02);
}

.api-fabric-details article > span {
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  margin-bottom:1rem;
  color:#fff;
  font-size:.5rem;
  font-weight:850;
  border-radius:50%;
  background:#B31942;
}

.api-fabric-details article:nth-child(even) > span {
  background:#0A3161;
}

.api-fabric-details small {
  display:block;
  margin-bottom:.35rem;
  color:#9BCBF1;
  font-size:.45rem;
  font-weight:850;
  letter-spacing:.12em;
}

.api-fabric-details article:nth-child(even) small {
  color:#E7A0B2;
}

.api-fabric-details h3 {
  margin:0 0 .45rem;
  color:#fff;
  font-size:.92rem;
  line-height:1.42;
}

.api-fabric-details p {
  margin:0;
  color:#C0CFD9;
  font-size:.72rem;
  line-height:1.58;
}

/* Build Service Navigation */
.api-service-nav {
  background:#F7F9FB;
  border-top:1px solid #E6ECEF;
  border-bottom:1px solid #E6ECEF;
}

.api-service-nav-head,
.api-family-nav-intro {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,.92fr);
  gap:clamp(2.3rem,6vw,5rem);
  align-items:end;
  margin-bottom:1.4rem;
}

.api-service-nav-head .section-title,
.api-family-nav-intro .section-title {
  max-width:780px;
  margin-bottom:0;
}

.api-service-nav-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.75rem;
}

.api-service-nav-card {
  position:relative;
  display:grid;
  grid-template-columns:98px minmax(0,1fr);
  min-height:98px;
  overflow:hidden;
  color:inherit;
  text-decoration:none;
  border:1px solid #DCE4E9;
  border-radius:12px;
  background:#fff;
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.api-service-nav-card:hover {
  color:inherit;
  transform:translateY(-3px);
  border-color:#C8D5DE;
  box-shadow:0 15px 34px rgba(18,42,62,.07);
}

.api-service-nav-card.is-current {
  border-color:#BFCED8;
  box-shadow:inset 0 0 0 1px rgba(10,49,97,.04);
}

.api-service-nav-card.is-current::after {
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:3px;
  background:#B31942;
}

.api-service-nav-thumb {
  overflow:hidden;
  background:#17344C;
}

.api-service-nav-thumb img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  transition:transform .25s ease;
}

.api-service-nav-card:hover .api-service-nav-thumb img {
  transform:scale(1.04);
}

.api-service-nav-copy {
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
  padding:.75rem .8rem;
}

.api-service-nav-copy span {
  display:block;
  margin-bottom:.28rem;
  color:#B31942;
  font-size:.39rem;
  font-weight:850;
  letter-spacing:.1em;
}

.api-service-nav-card:nth-child(even) .api-service-nav-copy span {
  color:#0A3161;
}

.api-service-nav-copy strong {
  display:block;
  color:var(--itx-ink);
  font-size:.7rem;
  line-height:1.35;
}

.api-service-nav-copy small {
  display:block;
  margin-top:.2rem;
  color:#7A8892;
  font-size:.48rem;
  line-height:1.35;
}

/* Service Family Navigation */
.api-family-nav {
  background:#fff;
}

.api-family-nav-rail {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  overflow:hidden;
  border:1px solid #DCE4E9;
  border-radius:16px;
  background:#fff;
}

.api-family-nav-rail a {
  display:grid;
  grid-template-columns:44px minmax(0,1fr) 16px;
  gap:.8rem;
  align-items:center;
  min-height:112px;
  padding:1rem;
  color:inherit;
  text-decoration:none;
  transition:background .2s ease;
}

.api-family-nav-rail a + a {
  border-left:1px solid #DCE4E9;
}

.api-family-nav-rail a:hover {
  background:#F6F9FB;
}

.api-family-nav-rail a.is-current {
  background:linear-gradient(145deg,#173650,#0C2B44);
}

.api-family-nav-rail > a > span {
  color:#B31942;
  font-size:.45rem;
  font-weight:850;
}

.api-family-nav-rail a:nth-child(even) > span {
  color:#0A3161;
}

.api-family-nav-rail strong,
.api-family-nav-rail small {
  display:block;
}

.api-family-nav-rail strong {
  color:var(--itx-ink);
  font-size:.72rem;
}

.api-family-nav-rail small {
  margin-top:.18rem;
  color:#7A8892;
  font-size:.48rem;
  line-height:1.35;
}

.api-family-nav-rail i {
  color:#0A3161;
  font-size:.63rem;
}

.api-family-nav-rail a.is-current > span {
  color:#FF91AA;
}

.api-family-nav-rail a.is-current strong {
  color:#fff;
}

.api-family-nav-rail a.is-current small {
  color:#B9C8D2;
}

.api-family-nav-rail a.is-current i {
  color:#9ECFF3;
}

/* Responsive */
@media (max-width:1199.98px) {
  .api-hero-copy {
    width:min(640px,56%);
  }

  .api-pressure-grid,
  .api-delivery-top,
  .api-patterns-layout {
    grid-template-columns:1fr;
  }

  .api-pressure-visual,
  .api-patterns-image {
    min-height:440px;
  }

  .api-related-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .api-outcome-grid {
    grid-template-columns:repeat(2,1fr);
  }

  .api-outcome-grid article:nth-child(3) {
    border-left:0;
    border-top:1px solid rgba(255,255,255,.08);
  }

  .api-outcome-grid article:nth-child(4) {
    border-top:1px solid rgba(255,255,255,.08);
  }
}

@media (max-width:991.98px) {
  .api-section-intro,
  .api-capability-head,
  .api-fabric-head,
  .api-outcomes-head {
    grid-template-columns:1fr;
  }

  .api-hero-stage {
    min-height:770px;
  }

  .api-hero-shade {
    background:
      linear-gradient(180deg,rgba(5,25,44,.95) 0%,rgba(5,25,44,.84) 57%,rgba(5,25,44,.34) 100%);
  }

  .api-hero-copy {
    left:1.6rem;
    right:1.6rem;
    top:2rem;
    width:auto;
    transform:none;
  }

  .api-hero-flow {
    top:auto;
    left:1.6rem;
    right:1.6rem;
    bottom:9.2rem;
    justify-content:center;
  }

  .api-hero-signal {
    width:calc(33.333% - 1.3rem);
    right:auto;
    bottom:1.6rem;
  }

  .api-hero-signal-one { left:1.6rem; }
  .api-hero-signal-two { left:33.333%; }
  .api-hero-signal-three { right:1.6rem; left:auto; }

  .api-landscape-grid {
    grid-template-columns:1fr 1fr;
  }

  .api-landscape-feature {
    grid-column:1 / -1;
    min-height:420px;
  }

  .api-landscape-card {
    min-height:340px;
  }

  .api-capability-bands article {
    grid-template-columns:50px minmax(190px,.75fr) minmax(0,1.25fr) 32px;
  }

  .api-fabric-stage {
    min-height:720px;
  }

  .api-fabric-node-apps { left:4%; }
  .api-fabric-node-enterprise { right:4%; }
  .api-fabric-node-partners { left:5%; }
  .api-fabric-node-data { right:5%; }

  .api-delivery-path {
    grid-template-columns:repeat(2,1fr);
  }

  .api-delivery-path article:nth-child(3) {
    border-left:0;
    border-top:1px solid #DDE4E9;
  }

  .api-delivery-path article:nth-child(4) {
    border-top:1px solid #DDE4E9;
  }
}

@media (max-width:767.98px) {
  .api-hero .inner-page-title {
    font-size:clamp(2.65rem,11vw,4rem);
  }

  .api-hero-stage {
    min-height:860px;
  }

  .api-hero-flow {
    display:none;
  }

  .api-hero-signal {
    position:absolute;
    left:1.6rem !important;
    right:1.6rem !important;
    width:auto;
  }

  .api-hero-signal-one { bottom:1.6rem; }
  .api-hero-signal-two { bottom:6.9rem; }
  .api-hero-signal-three { bottom:12.2rem; }

  .api-landscape-grid,
  .api-pattern-cards,
  .api-related-grid,
  .api-outcome-grid {
    grid-template-columns:1fr;
  }

  .api-landscape-feature {
    grid-column:auto;
  }

  .api-capability-bands article {
    grid-template-columns:44px 1fr;
    gap:.7rem;
    padding:.9rem 0;
  }

  .api-capability-bands article > p {
    grid-column:2;
  }

  .api-capability-bands article > i {
    display:none;
  }

  .api-fabric-stage {
    min-height:auto;
    padding:1rem 1rem 5.2rem;
  }

  .api-fabric-lines {
    display:none;
  }

  .api-fabric-core,
  .api-fabric-node {
    position:relative;
    left:auto;
    right:auto;
    top:auto;
    bottom:auto;
    width:100%;
    height:auto;
    min-height:95px;
    margin-bottom:.7rem;
    transform:none;
    border-radius:12px;
  }

  .api-fabric-core {
    align-items:flex-start;
    text-align:left;
    padding:1rem;
  }

  .api-fabric-principles {
    grid-template-columns:1fr 1fr;
  }

  .api-fabric-principles span:nth-child(3),
  .api-fabric-principles span:nth-child(5) {
    border-left:0;
  }

  .api-fabric-principles span:nth-child(5) {
    grid-column:1 / -1;
  }

  .api-delivery-path {
    grid-template-columns:1fr;
  }

  .api-delivery-path article,
  .api-delivery-path article:nth-child(3),
  .api-delivery-path article:nth-child(4) {
    border-left:0;
    border-top:0;
    border-bottom:1px solid #DDE4E9;
  }

  .api-outcome-grid article,
  .api-outcome-grid article:nth-child(3),
  .api-outcome-grid article:nth-child(4) {
    min-height:auto;
    border-left:0;
    border-top:0;
    border-bottom:1px solid rgba(255,255,255,.08);
  }
}

@media (max-width:575.98px) {
  .api-hero-stage {
    min-height:900px;
  }

  .api-pressure-visual {
    min-height:390px;
  }

  .api-fabric-principles {
    position:relative;
    left:auto;
    right:auto;
    bottom:auto;
    grid-template-columns:1fr;
    margin-top:.4rem;
  }

  .api-fabric-principles span,
  .api-fabric-principles span:nth-child(3),
  .api-fabric-principles span:nth-child(5) {
    grid-column:auto;
    border-left:0;
    border-bottom:1px solid rgba(255,255,255,.07);
  }

  .api-related-thumb {
    height:190px;
  }
}

@media (prefers-reduced-motion:reduce) {
  .api-related-card,
  .api-related-thumb img {
    transition:none !important;
  }
}


@media (max-width:1199.98px) {
  .api-capability-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .api-fabric-layout {
    grid-template-columns:1fr;
  }

  .api-service-nav-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .api-family-nav-rail {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .api-family-nav-rail a:nth-child(3) {
    border-left:0;
    border-top:1px solid #DCE4E9;
  }

  .api-family-nav-rail a:nth-child(4) {
    border-top:1px solid #DCE4E9;
  }
}

@media (max-width:991.98px) {
  .api-service-nav-head,
  .api-family-nav-intro {
    grid-template-columns:1fr;
    gap:1rem;
  }

  .api-fabric-details {
    grid-template-columns:1fr 1fr;
  }
}

@media (max-width:767.98px) {
  .api-capability-grid,
  .api-service-nav-grid,
  .api-fabric-details,
  .api-family-nav-rail {
    grid-template-columns:1fr;
  }

  .api-capability-image {
    height:235px;
  }

  .api-fabric-visual-v2 {
    min-height:460px;
  }

  .api-fabric-overlay-card {
    bottom:5.8rem;
  }

  .api-service-nav-card {
    grid-template-columns:88px minmax(0,1fr);
  }

  .api-family-nav-rail a + a,
  .api-family-nav-rail a:nth-child(3),
  .api-family-nav-rail a:nth-child(4) {
    border-left:0;
    border-top:1px solid #DCE4E9;
  }
}

@media (prefers-reduced-motion:reduce) {
  .api-capability-card,
  .api-capability-image img,
  .api-service-nav-card,
  .api-service-nav-thumb img,
  .api-family-nav-rail a {
    transition:none !important;
  }
}


@media (max-width:1199.98px) {
  .api-landscape-layout {
    grid-template-columns:1fr;
  }
}

@media (max-width:991.98px) {
  .api-landscape-mini-card {
    grid-template-columns:190px minmax(0,1fr);
  }
}

@media (max-width:767.98px) {
  .api-landscape-mini-card {
    grid-template-columns:1fr;
  }

  .api-landscape-mini-thumb {
    height:210px;
  }

  .api-landscape-overview,
  .api-landscape-mini-card {
    border-radius:16px;
  }
}


/* =========================================================
   API & INTEGRATIONS — 2026-10-07 REFINEMENT
   Full-width hero scroller + section heading/alignment fixes
   ========================================================= */

.api-hero-v3 {
  position:relative;
  overflow:hidden;
  min-height:720px;
  color:#fff;
  background:#0A2A43;
}

.api-hero-v3-slider,
.api-hero-v3-slide,
.api-hero-v3-overlay {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}

.api-hero-v3-slider { z-index:0; }

.api-hero-v3-slide {
  opacity:0;
  background-size:cover;
  background-position:center;
  animation:apiHeroV3Cycle 18s infinite;
  transform:scale(1.035);
}

.api-hero-v3-slide-one {
  background-image:url("/assets/images/services/build/api-integrations/hero-slide-01.jpg");
  animation-delay:0s;
}

.api-hero-v3-slide-two {
  background-image:url("/assets/images/services/build/api-integrations/hero-slide-02.jpg");
  animation-delay:6s;
}

.api-hero-v3-slide-three {
  background-image:url("/assets/images/services/build/api-integrations/hero-slide-03.jpg");
  animation-delay:12s;
}

.api-hero-v3-overlay {
  z-index:2;
  background:
    linear-gradient(90deg,rgba(4,22,37,.93) 0%,rgba(4,22,37,.82) 44%,rgba(4,22,37,.54) 70%,rgba(4,22,37,.63) 100%),
    linear-gradient(180deg,rgba(4,22,37,.12) 0%,rgba(4,22,37,.44) 100%);
}

@keyframes apiHeroV3Cycle {
  0% { opacity:0; transform:scale(1.04); }
  5% { opacity:1; }
  29% { opacity:1; transform:scale(1); }
  35% { opacity:0; }
  100% { opacity:0; }
}

.api-hero-v3 > .container-xl {
  position:relative;
  z-index:5;
}

.api-hero-v3-breadcrumb {
  padding-top:.75rem;
  margin-bottom:.25rem;
}

.api-hero-v3-breadcrumb a,
.api-hero-v3-breadcrumb li {
  color:rgba(255,255,255,.74);
}

.api-hero-v3-breadcrumb a:hover { color:#fff; }

.api-hero-v3-stage {
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(360px,.66fr);
  gap:clamp(2.4rem,5vw,5.2rem);
  align-items:center;
  min-height:630px;
  padding:clamp(1.7rem,3.5vw,3.25rem) 0 4.4rem;
}

.api-hero-v3-copy { max-width:760px; }

.api-hero-v3-copy .eyebrow {
  margin-bottom:.8rem;
  color:#9FD0F4!important;
}

.api-integrations-page .api-hero-v3-copy h1.inner-page-title {
  max-width:740px;
  margin:0 0 1rem;
  color:#fff!important;
  font-size:clamp(2.55rem,4vw,4.05rem)!important;
  line-height:1.035!important;
  letter-spacing:-.042em!important;
  text-shadow:0 3px 24px rgba(0,0,0,.18);
}

.api-hero-v3-copy .inner-page-lead {
  max-width:660px;
  margin:0;
  color:#D0DCE4!important;
  font-size:clamp(.96rem,1.1vw,1.08rem);
  line-height:1.72;
}

.api-hero-v3-actions {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.8rem 1rem;
  margin-top:1.2rem;
}

.api-hero-v3 .btn-itx-primary {
  background:#B31942;
  border-color:#B31942;
  box-shadow:0 12px 28px rgba(179,25,66,.22);
}

.api-hero-v3 .btn-itx-primary:hover {
  background:#971638;
  border-color:#971638;
}

.api-hero-v3-secondary {
  display:inline-flex;
  align-items:center;
  gap:.38rem;
  color:#D8EAF7;
  font-size:.69rem;
  font-weight:800;
  text-decoration:none;
}

.api-hero-v3-secondary:hover { color:#fff; }

.api-hero-v3-tags {
  display:flex;
  flex-wrap:wrap;
  gap:.45rem;
  margin-top:1.15rem;
}

.api-hero-v3-tags span {
  padding:.42rem .62rem;
  color:#E0EAF0;
  font-size:.54rem;
  font-weight:760;
  border:1px solid rgba(255,255,255,.15);
  border-radius:999px;
  background:rgba(6,29,47,.34);
  backdrop-filter:blur(7px);
}

.api-hero-v3-map {
  position:relative;
  overflow:hidden;
  align-self:center;
  border:1px solid rgba(255,255,255,.15);
  border-radius:18px;
  background:rgba(7,31,50,.68);
  box-shadow:0 24px 58px rgba(0,13,24,.24);
  backdrop-filter:blur(11px);
}

.api-hero-v3-map::before {
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:3px;
  background:linear-gradient(180deg,#79B8EF,#B31942,#79B8EF);
}

.api-hero-v3-map-head {
  padding:1.1rem 1.15rem 1rem 1.35rem;
  border-bottom:1px solid rgba(255,255,255,.10);
}

.api-hero-v3-map-head small,
.api-hero-v3-map-head strong { display:block; }

.api-hero-v3-map-head small {
  margin-bottom:.32rem;
  color:#9FD0F4;
  font-size:.42rem;
  font-weight:850;
  letter-spacing:.12em;
}

.api-hero-v3-map-head strong {
  color:#fff;
  font-size:.88rem;
  line-height:1.42;
}

.api-hero-v3-map-flow {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  padding:1.15rem 1rem;
}

.api-hero-v3-map-node,
.api-hero-v3-map-core {
  min-width:86px;
  padding:.72rem .7rem;
  text-align:center;
  border-radius:10px;
}

.api-hero-v3-map-node { background:rgba(255,255,255,.045); }

.api-hero-v3-map-core {
  min-width:112px;
  border:1px solid rgba(121,184,239,.28);
  background:rgba(10,49,97,.68);
}

.api-hero-v3-map-node span,
.api-hero-v3-map-core small {
  display:block;
  margin-bottom:.2rem;
  color:#8FC8F2;
  font-size:.42rem;
  font-weight:850;
  letter-spacing:.11em;
}

.api-hero-v3-map-node:last-child span { color:#FF8FA7; }

.api-hero-v3-map-flow strong {
  display:block;
  color:#fff;
  font-size:.61rem;
  line-height:1.3;
}

.api-hero-v3-map-line {
  width:20px;
  height:1px;
  background:rgba(121,184,239,.46);
}

.api-hero-v3-map-foot {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  border-top:1px solid rgba(255,255,255,.09);
}

.api-hero-v3-map-foot span {
  padding:.68rem .75rem;
  color:#CDD9E1;
  font-size:.49rem;
  font-weight:780;
  text-align:center;
}

.api-hero-v3-map-foot span:nth-child(even) {
  border-left:1px solid rgba(255,255,255,.08);
}

.api-hero-v3-map-foot span:nth-child(n+3) {
  border-top:1px solid rgba(255,255,255,.08);
}

.api-hero-v3-slider-status {
  position:absolute;
  left:0;
  bottom:1.05rem;
  display:flex;
  gap:.4rem;
}

.api-hero-v3-slider-status span {
  width:32px;
  height:3px;
  border-radius:999px;
  background:rgba(255,255,255,.28);
  animation:apiHeroV3Status 18s infinite;
}

.api-hero-v3-slider-status span:nth-child(2) { animation-delay:6s; }
.api-hero-v3-slider-status span:nth-child(3) { animation-delay:12s; }

@keyframes apiHeroV3Status {
  0%,4% { background:rgba(255,255,255,.28); }
  6%,30% { background:#fff; }
  34%,100% { background:rgba(255,255,255,.28); }
}

/* Integration Landscape */
.api-section-intro {
  grid-template-columns:minmax(0,1fr) minmax(330px,.68fr);
  gap:clamp(2rem,4vw,4rem);
  align-items:center;
  margin-bottom:1.65rem;
}
.api-section-intro .section-title {
  max-width:620px;
  margin-bottom:0;
  font-size:clamp(1.8rem,2.65vw,2.6rem)!important;
  line-height:1.09!important;
  letter-spacing:-.028em!important;
}
.api-section-intro .section-lead {
  max-width:540px;
  justify-self:end;
  font-size:.9rem;
  line-height:1.72;
}

/* Integration Capabilities */
.api-capability-head {
  grid-template-columns:minmax(0,1fr) minmax(330px,.68fr);
  gap:clamp(2rem,4vw,4rem);
  align-items:center;
  margin-bottom:1.65rem;
}
.api-capability-head .section-title {
  max-width:710px;
  margin-bottom:0;
  font-size:clamp(1.8rem,2.7vw,2.65rem)!important;
  line-height:1.09!important;
  letter-spacing:-.029em!important;
}
.api-capability-head .section-lead {
  max-width:540px;
  justify-self:end;
  font-size:.9rem;
  line-height:1.72;
}

/* When This Service Fits */
.api-pressure-grid {
  grid-template-columns:minmax(390px,.92fr) minmax(0,1.08fr);
  gap:clamp(2.5rem,5vw,5rem);
  align-items:center;
}
.api-pressure-copy { max-width:650px; }
.api-pressure-copy .section-title {
  max-width:620px;
  margin-bottom:.9rem;
  font-size:clamp(1.85rem,2.7vw,2.65rem)!important;
  line-height:1.09!important;
  letter-spacing:-.029em!important;
}
.api-pressure-copy .section-lead {
  max-width:590px;
  font-size:.9rem;
  line-height:1.7;
}
.api-pressure-visual { min-height:560px; }

/* Integration Fabric */
.api-fabric-head {
  grid-template-columns:minmax(0,1fr) minmax(330px,.68fr);
  gap:clamp(2rem,4vw,4rem);
  align-items:center;
  margin-bottom:1.7rem;
}
.api-fabric-head .section-title {
  max-width:700px;
  margin-bottom:0;
  font-size:clamp(1.85rem,2.7vw,2.7rem)!important;
  line-height:1.08!important;
  letter-spacing:-.03em!important;
}
.api-fabric-head .section-lead {
  max-width:530px;
  justify-self:end;
  font-size:.9rem;
  line-height:1.72;
}
.api-fabric-layout {
  grid-template-columns:minmax(360px,.88fr) minmax(0,1.12fr);
  gap:clamp(2rem,4vw,4rem);
  align-items:stretch;
}
.api-fabric-visual-v2 { min-height:550px; }
.api-fabric-details {
  grid-template-columns:repeat(2,minmax(0,1fr));
  grid-auto-rows:1fr;
  gap:.8rem;
  align-content:stretch;
}
.api-fabric-details article {
  min-height:0;
  padding:1rem 1.05rem;
  display:flex;
  flex-direction:column;
}
.api-fabric-details article > span { margin-bottom:.8rem; }
.api-fabric-details p {
  margin-top:auto;
  padding-top:.3rem;
}

/* Integration Technology & Patterns */
.api-patterns-layout {
  grid-template-columns:minmax(380px,.92fr) minmax(0,1.08fr);
  gap:clamp(2.5rem,5vw,5rem);
  align-items:center;
}
.api-patterns-copy { max-width:700px; }
.api-patterns-copy .section-title {
  max-width:660px;
  margin-bottom:.9rem;
  font-size:clamp(1.8rem,2.65vw,2.6rem)!important;
  line-height:1.09!important;
  letter-spacing:-.028em!important;
}
.api-patterns-copy .section-lead {
  max-width:620px;
  font-size:.9rem;
  line-height:1.7;
}
.api-patterns-image { min-height:560px; }

@media (max-width:1199.98px) {
  .api-hero-v3-stage {
    grid-template-columns:minmax(0,1fr) minmax(330px,.62fr);
    gap:2.2rem;
  }
  .api-pressure-grid,
  .api-patterns-layout {
    grid-template-columns:minmax(340px,.9fr) minmax(0,1.1fr);
    gap:2.3rem;
  }
  .api-fabric-layout { grid-template-columns:1fr; }
  .api-fabric-visual-v2 { min-height:480px; }
}

@media (max-width:991.98px) {
  .api-hero-v3 { min-height:auto; }
  .api-hero-v3-stage,
  .api-section-intro,
  .api-capability-head,
  .api-pressure-grid,
  .api-fabric-head,
  .api-patterns-layout {
    grid-template-columns:1fr;
  }
  .api-hero-v3-stage {
    min-height:auto;
    padding:1.4rem 0 4rem;
  }
  .api-hero-v3-copy { max-width:760px; }
  .api-hero-v3-map { max-width:680px; }
  .api-section-intro .section-lead,
  .api-capability-head .section-lead,
  .api-fabric-head .section-lead {
    max-width:none;
    justify-self:start;
  }
  .api-pressure-copy,
  .api-patterns-copy { max-width:none; }
  .api-pressure-visual,
  .api-patterns-image { min-height:430px; }
}

@media (max-width:767.98px) {
  .api-hero-v3-overlay {
    background:
      linear-gradient(180deg,rgba(4,22,37,.90) 0%,rgba(4,22,37,.82) 60%,rgba(4,22,37,.74) 100%);
  }
  .api-hero-v3-breadcrumb {
    padding-top:.55rem;
    margin-bottom:.1rem;
  }
  .api-integrations-page .api-hero-v3-copy h1.inner-page-title {
    font-size:clamp(2.15rem,9vw,3.05rem)!important;
  }
  .api-hero-v3-stage { padding-top:1rem; }
  .api-hero-v3-map { border-radius:15px; }
  .api-hero-v3-map-flow { padding:.95rem .7rem; }
  .api-hero-v3-map-node,
  .api-hero-v3-map-core {
    min-width:0;
    flex:1;
    padding:.65rem .5rem;
  }
  .api-hero-v3-map-line { width:12px; }
  .api-section-intro .section-title,
  .api-capability-head .section-title,
  .api-pressure-copy .section-title,
  .api-fabric-head .section-title,
  .api-patterns-copy .section-title {
    font-size:clamp(1.65rem,7.3vw,2.3rem)!important;
  }
  .api-pressure-visual,
  .api-patterns-image { min-height:400px; }
  .api-fabric-details { grid-template-columns:1fr; }
  .api-fabric-visual-v2 { min-height:440px; }
}

@media (max-width:575.98px) {
  .api-hero-v3-map-flow { gap:.3rem; }
  .api-hero-v3-map-flow strong { font-size:.55rem; }
  .api-hero-v3-map-foot { grid-template-columns:1fr; }
  .api-hero-v3-map-foot span:nth-child(even) { border-left:0; }
  .api-hero-v3-map-foot span + span {
    border-top:1px solid rgba(255,255,255,.08);
  }
  .api-hero-v3-tags span { font-size:.51rem; }
  .api-fabric-visual-v2 { min-height:410px; }
}

@media (prefers-reduced-motion:reduce) {
  .api-hero-v3-slide,
  .api-hero-v3-slider-status span {
    animation:none!important;
  }
  .api-hero-v3-slide-one {
    opacity:1;
    transform:none;
  }
}



/* =========================================================
   API & INTEGRATIONS — BREADCRUMB + BUSINESS OUTCOMES V2
   ========================================================= */

/* Remove inherited hero/breadcrumb whitespace and keep the image
   scroller visually continuous from the header into the hero. */
.api-hero-v3.inner-hero {
  padding-top:0!important;
  padding-bottom:0!important;
  margin-top:0!important;
}

.api-hero-v3 > .container-xl {
  padding-top:0!important;
  padding-bottom:0!important;
}

.api-hero-v3-breadcrumb {
  min-height:0!important;
  margin:0!important;
  padding:.48rem 0 .38rem!important;
  border:0!important;
  box-shadow:none!important;
  background:transparent!important;
}

.api-hero-v3-breadcrumb ol {
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  line-height:1.2!important;
}

.api-hero-v3-breadcrumb li {
  margin-top:0!important;
  margin-bottom:0!important;
  padding-top:0!important;
  padding-bottom:0!important;
}

.api-hero-v3-stage {
  min-height:610px;
  padding-top:1rem;
}


/* ---------- BUSINESS OUTCOMES V2 ---------- */
.api-outcomes-v2 {
  position:relative;
  overflow:hidden;
  background:#F5F8FA;
  border-top:1px solid #E2E9ED;
  border-bottom:1px solid #E2E9ED;
}

.api-outcomes-v2-head {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(340px,.68fr);
  gap:clamp(2rem,4vw,4rem);
  align-items:center;
  margin-bottom:1.55rem;
}

.api-outcomes-v2-head .section-title {
  max-width:680px;
  margin:0;
  color:#172F42;
  font-size:clamp(1.9rem,2.8vw,2.8rem)!important;
  line-height:1.08!important;
  letter-spacing:-.03em!important;
}

.api-outcomes-v2-head .section-lead {
  max-width:550px;
  justify-self:end;
  color:#667984;
  font-size:.91rem;
  line-height:1.72;
}

.api-outcomes-v2-stage {
  display:grid;
  grid-template-columns:minmax(380px,.86fr) minmax(0,1.14fr);
  gap:clamp(2rem,4vw,4rem);
  align-items:stretch;
}

.api-outcomes-v2-visual {
  position:relative;
  min-height:565px;
  overflow:hidden;
  border-radius:21px;
  background:#0B2A43;
  box-shadow:0 22px 52px rgba(17,42,63,.10);
}

.api-outcomes-v2-visual > img,
.api-outcomes-v2-shade {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}

.api-outcomes-v2-visual > img {
  object-fit:cover;
  object-position:center;
}

.api-outcomes-v2-shade {
  background:
    linear-gradient(180deg,rgba(6,28,46,.03) 28%,rgba(6,28,46,.85) 100%),
    linear-gradient(90deg,rgba(6,28,46,.10),transparent 65%);
}

.api-outcomes-v2-visual-copy {
  position:absolute;
  z-index:3;
  left:1.35rem;
  right:1.35rem;
  bottom:1.35rem;
  max-width:470px;
}

.api-outcomes-v2-visual-copy small,
.api-outcomes-v2-visual-copy strong {
  display:block;
}

.api-outcomes-v2-visual-copy small {
  margin-bottom:.45rem;
  color:#9ED1F6;
  font-size:.43rem;
  font-weight:850;
  letter-spacing:.12em;
}

.api-outcomes-v2-visual-copy strong {
  color:#fff;
  font-size:clamp(1.25rem,1.8vw,1.75rem);
  line-height:1.26;
  letter-spacing:-.02em;
}

.api-outcomes-v2-visual-copy p {
  margin:.6rem 0 0;
  color:#CDD9E1;
  font-size:.72rem;
  line-height:1.62;
}

.api-outcomes-v2-signal {
  position:absolute;
  z-index:4;
  top:1rem;
  right:1rem;
  width:220px;
  padding:.8rem .85rem;
  border:1px solid rgba(255,255,255,.16);
  border-radius:11px;
  background:rgba(7,31,50,.76);
  backdrop-filter:blur(8px);
}

.api-outcomes-v2-signal span,
.api-outcomes-v2-signal strong {
  display:block;
}

.api-outcomes-v2-signal span {
  margin-bottom:.25rem;
  color:#FF90A8;
  font-size:.39rem;
  font-weight:850;
  letter-spacing:.11em;
}

.api-outcomes-v2-signal strong {
  color:#fff;
  font-size:.59rem;
  line-height:1.45;
}

.api-outcomes-v2-list {
  display:flex;
  flex-direction:column;
  justify-content:center;
  border-top:1px solid #D5E0E6;
}

.api-outcomes-v2-list article {
  display:grid;
  grid-template-columns:44px minmax(0,1fr) 32px;
  gap:1rem;
  align-items:start;
  padding:1.15rem 0;
  border-bottom:1px solid #D5E0E6;
}

.api-outcomes-v2-list article > span {
  color:#B31942;
  font-size:.66rem;
  font-weight:850;
  padding-top:.14rem;
}

.api-outcomes-v2-list article:nth-child(even) > span {
  color:#0A3161;
}

.api-outcomes-v2-list small {
  display:block;
  margin-bottom:.32rem;
  color:#7F8F99;
  font-size:.43rem;
  font-weight:850;
  letter-spacing:.11em;
}

.api-outcomes-v2-list h3 {
  margin:0 0 .34rem;
  color:#172F42;
  font-size:.96rem;
  line-height:1.4;
}

.api-outcomes-v2-list p {
  margin:0;
  max-width:650px;
  color:#687A85;
  font-size:.72rem;
  line-height:1.56;
}

.api-outcomes-v2-list i {
  color:#0A3161;
  font-size:1.05rem;
  text-align:right;
}

.api-outcomes-v2-list article:nth-child(odd) i {
  color:#B31942;
}

.api-outcomes-v2-rail {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  margin-top:1.45rem;
  overflow:hidden;
  border:1px solid #D9E3E8;
  border-radius:12px;
  background:#fff;
}

.api-outcomes-v2-rail span {
  display:grid;
  grid-template-columns:28px 1fr;
  gap:.55rem;
  align-items:center;
  padding:.82rem .9rem;
}

.api-outcomes-v2-rail span + span {
  border-left:1px solid #D9E3E8;
}

.api-outcomes-v2-rail small {
  color:#B31942;
  font-size:.44rem;
  font-weight:850;
}

.api-outcomes-v2-rail span:nth-child(even) small {
  color:#0A3161;
}

.api-outcomes-v2-rail strong {
  color:#354B5B;
  font-size:.61rem;
  line-height:1.35;
}

@media (max-width:991.98px) {
  .api-outcomes-v2-head,
  .api-outcomes-v2-stage {
    grid-template-columns:1fr;
  }

  .api-outcomes-v2-head .section-lead {
    max-width:none;
    justify-self:start;
  }

  .api-outcomes-v2-visual {
    min-height:480px;
  }
}

@media (max-width:767.98px) {
  .api-hero-v3-breadcrumb {
    padding:.38rem 0 .28rem!important;
  }

  .api-hero-v3-stage {
    padding-top:.75rem;
  }

  .api-outcomes-v2-head .section-title {
    font-size:clamp(1.65rem,7.4vw,2.35rem)!important;
  }

  .api-outcomes-v2-visual {
    min-height:420px;
  }

  .api-outcomes-v2-list article {
    grid-template-columns:38px 1fr;
  }

  .api-outcomes-v2-list i {
    display:none;
  }

  .api-outcomes-v2-rail {
    grid-template-columns:repeat(2,1fr);
  }

  .api-outcomes-v2-rail span:nth-child(3) {
    border-left:0;
    border-top:1px solid #D9E3E8;
  }

  .api-outcomes-v2-rail span:nth-child(4) {
    border-top:1px solid #D9E3E8;
  }
}

@media (max-width:575.98px) {
  .api-outcomes-v2-visual {
    min-height:390px;
  }

  .api-outcomes-v2-signal {
    width:190px;
  }

  .api-outcomes-v2-rail {
    grid-template-columns:1fr;
  }

  .api-outcomes-v2-rail span + span,
  .api-outcomes-v2-rail span:nth-child(3),
  .api-outcomes-v2-rail span:nth-child(4) {
    border-left:0;
    border-top:1px solid #D9E3E8;
  }
}