/* =========================================================
   BUILD DETAIL VARIANT — WEB & MOBILE APPS
   /services/build/web-mobile-apps/
   Shared through build-details.css.
   ========================================================= */

.wmb-section-intro,
.wmb-blueprint-head,
.wmb-impact-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;
}

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

.wmb-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);
}

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

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

.wmb-hero-shade {
  background:
    linear-gradient(90deg,rgba(6,29,50,.96) 0%,rgba(6,29,50,.90) 36%,rgba(6,29,50,.35) 66%,rgba(6,29,50,.08) 100%),
    linear-gradient(180deg,rgba(6,29,50,.06),rgba(6,29,50,.45));
}

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

.wmb-hero .inner-page-title {
  max-width:650px;
  font-size:clamp(3.1rem,4.55vw,5.2rem);
  line-height:.98;
  letter-spacing:-.055em;
}

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

.wmb-hero-mobile-card {
  position:absolute;
  z-index:4;
  right:2rem;
  top:2rem;
  width:225px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.16);
  border-radius:14px;
  background:rgba(8,31,51,.84);
  backdrop-filter:blur(8px);
  box-shadow:0 16px 38px rgba(3,17,31,.22);
}

.wmb-hero-mobile-card img {
  width:100%;
  height:135px;
  display:block;
  object-fit:cover;
}

.wmb-hero-mobile-card div {
  padding:.85rem .9rem;
}

.wmb-hero-mobile-card span {
  display:block;
  margin-bottom:.28rem;
  color:#79B8EF;
  font-size:.49rem;
  font-weight:850;
  letter-spacing:.12em;
}

.wmb-hero-mobile-card strong {
  color:#fff;
  font-size:.76rem;
}

.wmb-hero-signals {
  position:absolute;
  z-index:4;
  right:2rem;
  bottom:2rem;
  display:grid;
  width:min(560px,48%);
  grid-template-columns:repeat(3,1fr);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  background:rgba(8,31,51,.80);
  backdrop-filter:blur(8px);
}

.wmb-hero-signals > div {
  padding:.85rem .9rem;
}

.wmb-hero-signals > div + div {
  border-left:1px solid rgba(255,255,255,.09);
}

.wmb-hero-signals span {
  display:block;
  margin-bottom:.38rem;
  color:#E1849D;
  font-size:.5rem;
  font-weight:850;
}

.wmb-hero-signals > div:nth-child(even) span {
  color:#79B8EF;
}

.wmb-hero-signals strong {
  display:block;
  color:#fff;
  font-size:.73rem;
}

.wmb-hero-signals small {
  display:block;
  margin-top:.18rem;
  color:#A7B8C4;
  font-size:.53rem;
  line-height:1.35;
}

/* Experience Types */
.wmb-experiences {
  background:#fff;
}

.wmb-experience-strip {
  display:grid;
  grid-template-columns:1.2fr .8fr .8fr;
  gap:1rem;
}

.wmb-experience-panel {
  position:relative;
  min-height:460px;
  overflow:hidden;
  border-radius:18px;
  background:#17344E;
}

.wmb-experience-panel::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(7,28,47,.03) 25%,rgba(7,28,47,.88) 100%);
}

.wmb-experience-panel img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.wmb-experience-mobile,
.wmb-experience-work {
  min-height:380px;
  align-self:end;
}

.wmb-experience-panel-copy {
  position:absolute;
  left:1.15rem;
  right:1.15rem;
  bottom:1.15rem;
  z-index:2;
}

.wmb-experience-panel-copy span {
  display:block;
  margin-bottom:.45rem;
  color:#9BCBF1;
  font-size:.51rem;
  font-weight:850;
  letter-spacing:.12em;
}

.wmb-experience-panel:nth-child(even) .wmb-experience-panel-copy span {
  color:#E1849D;
}

.wmb-experience-panel-copy h3 {
  margin:0 0 .45rem;
  color:#fff;
  font-size:1.05rem;
  line-height:1.3;
}

.wmb-experience-customer .wmb-experience-panel-copy h3 {
  font-size:1.35rem;
}

.wmb-experience-panel-copy p {
  margin:0;
  color:#D0DBE3;
  font-size:.76rem;
  line-height:1.58;
}

.wmb-capability-ribbon {
  display:flex;
  flex-wrap:wrap;
  margin-top:1.25rem;
  border-top:1px solid #E2E8EC;
  border-bottom:1px solid #E2E8EC;
}

.wmb-capability-ribbon span {
  flex:1 1 150px;
  padding:.75rem .55rem;
  color:#5C6974;
  font-size:.62rem;
  font-weight:760;
  text-align:center;
}

.wmb-capability-ribbon span + span {
  border-left:1px solid #E2E8EC;
}

/* Context */
.wmb-context {
  background:#F7F9FB;
  border-top:1px solid #E6ECEF;
  border-bottom:1px solid #E6ECEF;
}

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

.wmb-context-copy .section-title {
  margin-bottom:1.1rem;
}

.wmb-context-points {
  margin-top:1.6rem;
}

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

.wmb-context-points article:first-child {
  border-top:1px solid #DDE4E9;
}

.wmb-context-points article > span {
  color:#B31942;
  font-size:.56rem;
  font-weight:850;
}

.wmb-context-points article:nth-child(even) > span {
  color:#0A3161;
}

.wmb-context-points h3 {
  margin:0 0 .28rem;
  color:var(--itx-ink);
  font-size:.87rem;
  line-height:1.4;
}

.wmb-context-points p {
  margin:0;
  color:#6B7883;
  font-size:.75rem;
  line-height:1.54;
}

.wmb-context-gallery {
  position:relative;
  min-height:610px;
}

.wmb-context-main {
  position:absolute;
  inset:0 55px 65px 0;
  overflow:hidden;
  margin:0;
  border-radius:20px;
  box-shadow:0 22px 55px rgba(19,42,65,.12);
}

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

.wmb-context-main img,
.wmb-context-small img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.wmb-context-main figcaption {
  position:absolute;
  left:1.2rem;
  right:1.2rem;
  bottom:1.2rem;
  z-index:2;
  padding:.95rem 1rem;
  border-left:3px solid #B31942;
  border-radius:8px;
  background:rgba(9,34,57,.80);
}

.wmb-context-main figcaption span {
  display:block;
  margin-bottom:.34rem;
  color:#9BCBF1;
  font-size:.5rem;
  font-weight:850;
  letter-spacing:.12em;
}

.wmb-context-main figcaption strong {
  color:#fff;
  font-size:.86rem;
  line-height:1.45;
}

.wmb-context-small {
  position:absolute;
  right:0;
  bottom:0;
  z-index:3;
  width:185px;
  height:220px;
  overflow:hidden;
  margin:0;
  border:7px solid #F7F9FB;
  border-radius:16px;
  box-shadow:0 14px 34px rgba(19,42,65,.14);
}

/* Application Blueprint */
.wmb-blueprint {
  position:relative;
  overflow:hidden;
  color:#C8D4DD;
  background:
    radial-gradient(circle at 80% 15%,rgba(121,184,239,.09),transparent 30%),
    linear-gradient(142deg,#203A53,#152D43);
}

.wmb-blueprint .eyebrow {
  color:#92C8F4;
}

.wmb-blueprint .section-title {
  color:#fff;
}

.wmb-blueprint .section-lead {
  color:#B9C8D3;
}

.wmb-blueprint-canvas {
  display:grid;
  grid-template-columns:minmax(360px,.82fr) minmax(0,1.18fr);
  gap:1rem;
  margin-top:2.7rem;
}

.wmb-blueprint-photo {
  position:relative;
  min-height:560px;
  overflow:hidden;
  border-radius:18px;
}

.wmb-blueprint-photo::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(7,28,47,.05) 34%,rgba(7,28,47,.83) 100%);
}

.wmb-blueprint-photo img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.wmb-blueprint-photo-label {
  position:absolute;
  left:1.2rem;
  right:1.2rem;
  bottom:1.2rem;
  z-index:2;
}

.wmb-blueprint-photo-label span {
  display:block;
  margin-bottom:.38rem;
  color:#9BCBF1;
  font-size:.51rem;
  font-weight:850;
  letter-spacing:.12em;
}

.wmb-blueprint-photo-label strong {
  color:#fff;
  font-size:.94rem;
  line-height:1.45;
}

.wmb-blueprint-flow {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.8rem;
}

.wmb-blueprint-step {
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  min-height:270px;
  padding:1.25rem;
  border:1px solid rgba(255,255,255,.10);
  border-radius:15px;
  background:rgba(255,255,255,.035);
}

.wmb-blueprint-step > span {
  position:absolute;
  top:1rem;
  right:1rem;
  color:#A7B8C4;
  font-size:.54rem;
  font-weight:850;
}

.wmb-blueprint-step small {
  display:block;
  margin-bottom:.48rem;
  color:#79B8EF;
  font-size:.5rem;
  font-weight:850;
  letter-spacing:.12em;
}

.wmb-blueprint-step:nth-child(even) small {
  color:#E1849D;
}

.wmb-blueprint-step h3 {
  margin:0 0 .45rem;
  color:#fff;
  font-size:.95rem;
}

.wmb-blueprint-step p {
  margin:0;
  color:#AFC0CC;
  font-size:.74rem;
  line-height:1.56;
}

.wmb-blueprint-principles {
  grid-column:1 / -1;
  display:grid;
  grid-template-columns:repeat(5,1fr);
  overflow:hidden;
  border-top:1px solid rgba(255,255,255,.10);
  border-bottom:1px solid rgba(255,255,255,.07);
  border-radius:8px;
  background:rgba(8,25,39,.32);
}

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

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

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

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

/* Delivery Journey */
.wmb-delivery {
  background:#fff;
}

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

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

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

.wmb-delivery-journey {
  position:relative;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  margin-top:2.4rem;
  border-top:1px solid #DDE4E9;
}

.wmb-delivery-journey::before {
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-1px;
  height:2px;
  background:linear-gradient(90deg,#B31942 0 25%,#0A3161 25% 50%,#B31942 50% 75%,#0A3161 75%);
  opacity:.85;
}

.wmb-delivery-journey article {
  min-height:250px;
  padding:1.3rem 1.2rem;
  border-bottom:1px solid #DDE4E9;
}

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

.wmb-delivery-journey article > span {
  display:block;
  margin-bottom:2rem;
  color:#B31942;
  font-size:1.4rem;
  font-weight:720;
  letter-spacing:-.04em;
}

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

.wmb-delivery-journey small {
  display:block;
  margin-bottom:.4rem;
  color:#8B98A2;
  font-size:.49rem;
  font-weight:850;
  letter-spacing:.12em;
}

.wmb-delivery-journey h3 {
  margin:0 0 .45rem;
  color:var(--itx-ink);
  font-size:.9rem;
  line-height:1.4;
}

.wmb-delivery-journey p {
  margin:0;
  color:#6C7883;
  font-size:.74rem;
  line-height:1.56;
}

/* Technology Fit */
.wmb-technology {
  background:#F7F9FB;
  border-top:1px solid #E6ECEF;
  border-bottom:1px solid #E6ECEF;
}

.wmb-technology-stage {
  display:grid;
  grid-template-columns:minmax(390px,.88fr) minmax(0,1.12fr);
  gap:clamp(3rem,6vw,6rem);
  align-items:stretch;
}

.wmb-technology-image {
  min-height:610px;
  overflow:hidden;
  border-radius:20px;
  box-shadow:0 22px 55px rgba(19,42,65,.11);
}

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

.wmb-technology-copy {
  align-self:center;
}

.wmb-technology-copy .section-title {
  margin-bottom:1.1rem;
}

.wmb-tech-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.8rem;
  margin-top:1.7rem;
}

.wmb-tech-grid article {
  min-height:180px;
  padding:1rem;
  border:1px solid #DFE6EB;
  border-radius:12px;
  background:#fff;
}

.wmb-tech-grid span {
  display:block;
  margin-bottom:.8rem;
  color:#B31942;
  font-size:.5rem;
  font-weight:850;
  letter-spacing:.12em;
}

.wmb-tech-grid article:nth-child(even) span {
  color:#0A3161;
}

.wmb-tech-grid strong {
  display:block;
  margin-bottom:.45rem;
  color:var(--itx-ink);
  font-size:.82rem;
  line-height:1.4;
}

.wmb-tech-grid p {
  margin:0;
  color:#6D7984;
  font-size:.72rem;
  line-height:1.5;
}

/* Business Impact */
.wmb-impact {
  background:#fff;
}

.wmb-impact-board {
  display:grid;
  grid-template-columns:1.35fr repeat(3,1fr);
  border-top:1px solid #DDE4E9;
  border-bottom:1px solid #DDE4E9;
}

.wmb-impact-board article {
  min-height:300px;
  padding:1.35rem 1.2rem;
}

.wmb-impact-board article + article {
  border-left:1px solid #DDE4E9;
}

.wmb-impact-board span {
  display:block;
  margin-bottom:3rem;
  color:#A0ABB4;
  font-size:.57rem;
  font-weight:850;
}

.wmb-impact-board strong {
  display:block;
  margin-bottom:.65rem;
  color:#0A3161;
  font-size:1.2rem;
  line-height:1.25;
  letter-spacing:-.025em;
}

.wmb-impact-board article:nth-child(even) strong {
  color:#B31942;
}

.wmb-impact-feature strong {
  font-size:1.55rem;
}

.wmb-impact-board p {
  margin:0;
  color:#697681;
  font-size:.77rem;
  line-height:1.6;
}

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

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

.wmb-related-list > a {
  position:relative;
  display:flex;
  flex-direction:column;
  min-width:0;
  min-height:100%;
  padding:0;
  overflow:hidden;
  color:inherit;
  text-decoration:none;
  border:1px solid #DDE4E9;
  border-radius:14px;
  background:#fff;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}

.wmb-related-list > a:hover {
  transform:translateY(-4px);
  border-color:#CBD7DF;
  box-shadow:0 16px 38px rgba(19,42,65,.08);
}

.wmb-related-image {
  width:100%;
  height:170px;
  overflow:hidden;
  border-radius:0;
  background:#DDE5EA;
}

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

.wmb-related-list > a:hover .wmb-related-image img {
  transform:scale(1.025);
}

.wmb-related-copy {
  display:flex;
  flex:1;
  flex-direction:column;
  padding:1rem 1rem 1.15rem;
}

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

.wmb-related-list > a:nth-child(even) .wmb-related-copy > span {
  color:#0A3161;
}

.wmb-related-copy h3 {
  margin:0 0 .45rem;
  color:var(--itx-ink);
  font-size:.96rem;
  line-height:1.35;
}

.wmb-related-copy p {
  margin:0;
  color:#6D7984;
  font-size:.74rem;
  line-height:1.55;
}

.wmb-related-list > a > i {
  position:absolute;
  right:1rem;
  bottom:1rem;
  color:#0A3161;
  font-size:.95rem;
  transition:transform .2s ease;
}

.wmb-related-list > a:nth-child(even) > i {
  color:#B31942;
}

.wmb-related-list > a:hover > i {
  transform:translateX(4px);
}

/* Responsive */
@media (max-width:1199.98px) {
  .wmb-hero-content {
    width:min(630px,56%);
  }

  .wmb-hero-signals {
    width:min(510px,45%);
  }

  .wmb-context-layout,
  .wmb-delivery-top,
  .wmb-technology-stage {
    grid-template-columns:1fr;
  }

  .wmb-context-gallery {
    min-height:520px;
  }

  .wmb-technology-image {
    min-height:430px;
  }

  .wmb-impact-board {
    grid-template-columns:repeat(2,1fr);
  }

  .wmb-impact-board article:nth-child(3) {
    border-left:0;
    border-top:1px solid #DDE4E9;
  }

  .wmb-impact-board article:nth-child(4) {
    border-top:1px solid #DDE4E9;
  }
}

@media (max-width:991.98px) {
  .wmb-section-intro,
  .wmb-blueprint-head,
  .wmb-impact-head {
    grid-template-columns:1fr;
  }

  .wmb-hero-stage {
    min-height:760px;
  }

  .wmb-hero-shade {
    background:
      linear-gradient(180deg,rgba(6,29,50,.94) 0%,rgba(6,29,50,.84) 55%,rgba(6,29,50,.30) 100%);
  }

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

  .wmb-hero-mobile-card {
    display:none;
  }

  .wmb-hero-signals {
    left:1.6rem;
    right:1.6rem;
    bottom:1.6rem;
    width:auto;
  }

  .wmb-experience-strip {
    grid-template-columns:1fr 1fr;
  }

  .wmb-experience-customer {
    grid-column:1 / -1;
    min-height:420px;
  }

  .wmb-experience-mobile,
  .wmb-experience-work {
    min-height:340px;
  }

  .wmb-blueprint-canvas {
    grid-template-columns:1fr;
  }

  .wmb-blueprint-photo {
    min-height:390px;
  }

  .wmb-blueprint-principles {
    grid-column:auto;
  }

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

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

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

@media (max-width:767.98px) {
  .wmb-hero-stage {
    min-height:790px;
  }

  .wmb-hero .inner-page-title {
    font-size:clamp(2.65rem,11vw,4rem);
  }

  .wmb-hero-signals {
    grid-template-columns:1fr;
  }

  .wmb-hero-signals > div + div {
    border-left:0;
    border-top:1px solid rgba(255,255,255,.09);
  }

  .wmb-experience-strip,
  .wmb-blueprint-flow,
  .wmb-tech-grid,
  .wmb-delivery-journey,
  .wmb-impact-board {
    grid-template-columns:1fr;
  }

  .wmb-experience-customer {
    grid-column:auto;
  }

  .wmb-experience-panel,
  .wmb-experience-mobile,
  .wmb-experience-work {
    min-height:390px;
  }

  .wmb-context-gallery {
    min-height:450px;
  }

  .wmb-context-main {
    inset:0 35px 55px 0;
  }

  .wmb-context-small {
    width:145px;
    height:175px;
  }

  .wmb-blueprint-principles {
    grid-template-columns:1fr 1fr;
  }

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

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

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

  .wmb-impact-board article {
    min-height:auto;
  }

  .wmb-impact-board span {
    margin-bottom:1.4rem;
  }

  .wmb-related-list > a {
    grid-template-columns:120px minmax(0,1fr) 30px;
  }

  .wmb-related-image {
    height:95px;
  }
}

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

  .wmb-context-gallery {
    min-height:410px;
  }

  .wmb-context-small {
    display:none;
  }

  .wmb-context-main {
    inset:0;
  }

  .wmb-blueprint-principles {
    grid-template-columns:1fr;
  }

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

  .wmb-capability-ribbon span {
    flex:1 1 50%;
  }

  .wmb-related-list > a {
    grid-template-columns:90px minmax(0,1fr);
    gap:.8rem;
  }

  .wmb-related-list > a > i {
    display:none;
  }

  .wmb-related-image {
    height:82px;
  }
}

@media (prefers-reduced-motion:reduce) {
  .wmb-related-list > a > i {
    transition:none !important;
  }
}


/* =========================================================
   BUILD DETAIL VARIANT — SAAS & PLATFORMS
   /services/build/saas-platforms/
   Shared through build-details.css.
   ========================================================= */

.sap-section-intro,
.sap-fabric-intro,
.sap-decisions-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;
}

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

.sap-hero-grid {
  display:grid;
  grid-template-columns:minmax(0,.96fr) minmax(500px,1.04fr);
  gap:clamp(2.5rem,5vw,5rem);
  align-items:center;
}

.sap-hero .inner-page-title {
  max-width:790px;
  font-size:clamp(3rem,4.3vw,4.9rem);
  line-height:.99;
  letter-spacing:-.052em;
}

.sap-hero .inner-page-lead {
  max-width:700px;
  font-size:clamp(1rem,1.16vw,1.18rem);
  line-height:1.65;
}

.sap-hero-signals {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.75rem;
  margin-top:1.5rem;
  padding-top:1.15rem;
  border-top:1px solid rgba(255,255,255,.10);
}

.sap-hero-signals span {
  display:block;
  margin-bottom:.34rem;
  color:#E1849D;
  font-size:.51rem;
  font-weight:850;
}

.sap-hero-signals > div:nth-child(even) span {
  color:#79B8EF;
}

.sap-hero-signals strong {
  display:block;
  color:#fff;
  font-size:.74rem;
}

.sap-hero-signals small {
  display:block;
  margin-top:.16rem;
  color:#A2B3C0;
  font-size:.56rem;
  line-height:1.35;
}

.sap-hero-product {
  position:relative;
  min-height:545px;
}

.sap-hero-dashboard {
  position:absolute;
  inset:0 55px 55px 0;
  overflow:hidden;
  border-radius:22px;
  background:#06090C;
  box-shadow:0 30px 70px rgba(3,17,31,.28);
}

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

.sap-hero-dashboard::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(7,28,47,.02) 50%,rgba(7,28,47,.32) 100%);
  pointer-events:none;
}

.sap-hero-product-card {
  position:absolute;
  z-index:3;
  width:205px;
  padding:.8rem .9rem;
  border:1px solid rgba(255,255,255,.14);
  border-radius:11px;
  background:rgba(9,34,57,.88);
  backdrop-filter:blur(8px);
  box-shadow:0 14px 34px rgba(3,17,31,.22);
}

.sap-hero-product-card-tenants {
  right:0;
  top:45px;
}

.sap-hero-product-card-revenue {
  right:20px;
  top:164px;
}

.sap-hero-product-card-ops {
  right:0;
  bottom:0;
}

.sap-hero-product-card span {
  display:block;
  margin-bottom:.28rem;
  color:#79B8EF;
  font-size:.47rem;
  font-weight:850;
  letter-spacing:.12em;
}

.sap-hero-product-card-revenue span {
  color:#E1849D;
}

.sap-hero-product-card strong {
  display:block;
  color:#fff;
  font-size:.71rem;
  line-height:1.35;
}

.sap-hero-product-card small {
  display:block;
  margin-top:.2rem;
  color:#AABAC6;
  font-size:.53rem;
}

/* SaaS Operating Model */
.sap-model {
  background:#fff;
}

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

.sap-model-story .section-title {
  margin-bottom:1.1rem;
}

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

.sap-model-pillars article {
  display:grid;
  grid-template-columns:34px 1fr;
  gap:.7rem;
  padding:.95rem;
  border:1px solid #E0E6EB;
  border-radius:11px;
  background:#FAFCFD;
}

.sap-model-pillars article > span {
  color:#B31942;
  font-size:.55rem;
  font-weight:850;
}

.sap-model-pillars article:nth-child(even) > span {
  color:#0A3161;
}

.sap-model-pillars strong {
  display:block;
  color:var(--itx-ink);
  font-size:.84rem;
}

.sap-model-pillars p {
  margin:.25rem 0 0;
  color:#6D7984;
  font-size:.72rem;
  line-height:1.5;
}

.sap-model-visuals {
  position:relative;
  min-height:590px;
}

.sap-model-main {
  position:absolute;
  inset:0 35px 60px 0;
  overflow:hidden;
  margin:0;
  border-radius:20px;
  box-shadow:0 22px 55px rgba(19,42,65,.12);
}

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

.sap-model-main img,
.sap-model-small img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.sap-model-main figcaption {
  position:absolute;
  left:1.2rem;
  right:1.2rem;
  bottom:1.2rem;
  z-index:2;
  padding:.95rem 1rem;
  border-left:3px solid #B31942;
  border-radius:8px;
  background:rgba(9,34,57,.80);
}

.sap-model-main figcaption span {
  display:block;
  margin-bottom:.34rem;
  color:#9BCBF1;
  font-size:.5rem;
  font-weight:850;
  letter-spacing:.12em;
}

.sap-model-main figcaption strong {
  color:#fff;
  font-size:.86rem;
  line-height:1.45;
}

.sap-model-small {
  position:absolute;
  right:0;
  bottom:0;
  z-index:3;
  width:210px;
  height:180px;
  overflow:hidden;
  margin:0;
  border:7px solid #fff;
  border-radius:15px;
  background:#fff;
  box-shadow:0 14px 34px rgba(19,42,65,.14);
}

.sap-model-small figcaption {
  position:absolute;
  left:.65rem;
  bottom:.6rem;
  padding:.3rem .42rem;
  color:#fff;
  font-size:.52rem;
  font-weight:800;
  border-radius:5px;
  background:rgba(9,34,57,.82);
}

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

.sap-capability-field {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  grid-auto-rows:minmax(235px,auto);
  gap:1rem;
}

.sap-capability-block {
  position:relative;
  overflow:hidden;
  border-radius:16px;
}

.sap-capability-feature {
  grid-column:span 2;
  min-height:300px;
  background:#17344E;
}

.sap-capability-feature-image {
  position:absolute;
  inset:0;
}

.sap-capability-feature-image::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(7,28,47,.03) 25%,rgba(7,28,47,.88) 100%);
}

.sap-capability-feature-image img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.sap-capability-feature-copy {
  position:absolute;
  left:1.2rem;
  right:1.2rem;
  bottom:1.2rem;
  z-index:2;
}

.sap-capability-feature-copy span,
.sap-capability-compact > span {
  display:block;
  margin-bottom:.42rem;
  color:#9BCBF1;
  font-size:.5rem;
  font-weight:850;
  letter-spacing:.12em;
}

.sap-capability-feature-copy h3 {
  margin:0 0 .45rem;
  color:#fff;
  font-size:1.12rem;
}

.sap-capability-feature-copy p {
  margin:0;
  max-width:650px;
  color:#D2DDE4;
  font-size:.77rem;
  line-height:1.58;
}

.sap-capability-compact {
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  min-height:235px;
  padding:1.15rem;
  border:1px solid #DFE6EB;
  background:#fff;
}

.sap-capability-compact i {
  display:grid;
  place-items:center;
  width:40px;
  height:40px;
  margin-bottom:auto;
  color:#fff;
  border-radius:9px;
  background:#0A3161;
}

.sap-capability-compact > span {
  color:#B31942;
}

.sap-capability-compact h3 {
  margin:0 0 .45rem;
  color:var(--itx-ink);
  font-size:.93rem;
  line-height:1.35;
}

.sap-capability-compact p {
  margin:0;
  color:#6D7984;
  font-size:.73rem;
  line-height:1.54;
}

.sap-capability-compact small {
  display:block;
  margin-top:.8rem;
  padding-top:.65rem;
  color:#7D8993;
  font-size:.58rem;
  border-top:1px solid #E5EAED;
}

.sap-capability-navy {
  color:#fff;
  border-color:#203C56;
  background:linear-gradient(145deg,#203A53,#172E44);
}

.sap-capability-navy i {
  background:#B31942;
}

.sap-capability-navy > span {
  color:#79B8EF;
}

.sap-capability-navy h3 {
  color:#fff;
}

.sap-capability-navy p {
  color:#BECCD6;
}

.sap-capability-navy small {
  color:#AABAC6;
  border-color:rgba(255,255,255,.10);
}

.sap-capability-red i {
  background:#B31942;
}

/* Growth Pressure */
.sap-growth {
  background:#fff;
}

.sap-growth-banner {
  display:grid;
  grid-template-columns:minmax(420px,.88fr) minmax(0,1.12fr);
  overflow:hidden;
  border:1px solid #DFE6EB;
  border-radius:20px;
  background:#FAFCFD;
}

.sap-growth-image {
  min-height:410px;
}

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

.sap-growth-copy {
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:clamp(2rem,4vw,4rem);
}

.sap-growth-copy .section-title {
  margin-bottom:1.05rem;
}

.sap-growth-signals {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  margin-top:1.3rem;
  border-top:1px solid #DDE4E9;
  border-bottom:1px solid #DDE4E9;
}

.sap-growth-signals article {
  min-height:210px;
  padding:1.15rem;
}

.sap-growth-signals article + article {
  border-left:1px solid #DDE4E9;
}

.sap-growth-signals span {
  display:block;
  margin-bottom:1.8rem;
  color:#B31942;
  font-size:.56rem;
  font-weight:850;
}

.sap-growth-signals article:nth-child(even) span {
  color:#0A3161;
}

.sap-growth-signals strong {
  display:block;
  margin-bottom:.45rem;
  color:var(--itx-ink);
  font-size:.88rem;
  line-height:1.35;
}

.sap-growth-signals p {
  margin:0;
  color:#6D7984;
  font-size:.72rem;
  line-height:1.55;
}

/* Platform Fabric */
.sap-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);
}

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

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

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

.sap-fabric-stage {
  position:relative;
  min-height:650px;
  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);
}

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

.sap-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,.35),rgba(8,27,42,.82));
}

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

.sap-fabric-ring {
  position:absolute;
  left:50%;
  top:45%;
  transform:translate(-50%,-50%);
  border:1px solid rgba(121,184,239,.16);
  border-radius:50%;
}

.sap-fabric-ring-outer {
  width:72%;
  height:62%;
}

.sap-fabric-ring-inner {
  width:43%;
  height:38%;
  border-color:rgba(255,255,255,.11);
}

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

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

.sap-fabric-core strong {
  max-width:230px;
  color:#fff;
  font-size:.86rem;
  line-height:1.45;
}

.sap-fabric-core span {
  max-width:220px;
  margin-top:.5rem;
  color:#AABBC7;
  font-size:.58rem;
  line-height:1.45;
}

.sap-fabric-node {
  position:absolute;
  z-index:4;
  width:220px;
  min-height:105px;
  padding:.85rem .9rem;
  border:1px solid rgba(255,255,255,.10);
  border-radius:12px;
  background:rgba(17,45,67,.88);
  backdrop-filter:blur(7px);
  box-shadow:0 14px 34px rgba(3,17,31,.18);
}

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

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

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

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

.sap-fabric-node p {
  margin:.2rem 0 0;
  color:#AABAC6;
  font-size:.55rem;
  line-height:1.4;
}

.sap-fabric-node-product {
  left:7%;
  top:15%;
}

.sap-fabric-node-data {
  right:7%;
  top:15%;
}

.sap-fabric-node-connect {
  left:9%;
  bottom:17%;
}

.sap-fabric-node-operate {
  right:9%;
  bottom:17%;
}

.sap-fabric-guardrails {
  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);
}

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

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

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

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

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

.sap-delivery-layout {
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(380px,.92fr);
  gap:clamp(3rem,6vw,6rem);
  align-items:center;
}

.sap-delivery-copy .section-title {
  margin-bottom:1.05rem;
}

.sap-delivery-steps {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.75rem;
  margin-top:1.65rem;
}

.sap-delivery-steps article {
  display:grid;
  grid-template-columns:38px 1fr;
  gap:.72rem;
  padding:1rem;
  border:1px solid #DFE6EB;
  border-radius:11px;
  background:#fff;
}

.sap-delivery-steps article > span {
  color:#B31942;
  font-size:.58rem;
  font-weight:850;
}

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

.sap-delivery-steps small {
  display:block;
  margin-bottom:.28rem;
  color:#B31942;
  font-size:.48rem;
  font-weight:850;
  letter-spacing:.12em;
}

.sap-delivery-steps article:nth-child(even) small {
  color:#0A3161;
}

.sap-delivery-steps h3 {
  margin:0 0 .3rem;
  color:var(--itx-ink);
  font-size:.86rem;
}

.sap-delivery-steps p {
  margin:0;
  color:#6D7984;
  font-size:.71rem;
  line-height:1.5;
}

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

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

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

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

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

.sap-delivery-note strong {
  color:#fff;
  font-size:.88rem;
  line-height:1.45;
}

/* Technology Decisions */
.sap-decisions {
  background:#fff;
}

.sap-decision-stage {
  display:grid;
  grid-template-columns:minmax(360px,.82fr) minmax(0,1.18fr);
  gap:1rem;
}

.sap-decision-analytics {
  position:relative;
  min-height:610px;
  overflow:hidden;
  border-radius:18px;
}

.sap-decision-analytics::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(7,28,47,.03) 35%,rgba(7,28,47,.84) 100%);
}

.sap-decision-analytics img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.sap-decision-analytics-copy {
  position:absolute;
  left:1.2rem;
  right:1.2rem;
  bottom:1.2rem;
  z-index:2;
}

.sap-decision-analytics-copy span {
  display:block;
  margin-bottom:.4rem;
  color:#9BCBF1;
  font-size:.5rem;
  font-weight:850;
  letter-spacing:.12em;
}

.sap-decision-analytics-copy strong {
  color:#fff;
  font-size:.94rem;
  line-height:1.45;
}

.sap-decision-stack {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.8rem;
}

.sap-decision-stack article {
  position:relative;
  min-height:290px;
  padding:1.15rem;
  border:1px solid #DFE6EB;
  border-radius:14px;
  background:#FAFCFD;
}

.sap-decision-stack article > span {
  position:absolute;
  right:1rem;
  top:.85rem;
  color:#A0ABB4;
  font-size:.52rem;
  font-weight:850;
}

.sap-decision-stack small {
  display:block;
  margin-bottom:1.6rem;
  color:#B31942;
  font-size:.49rem;
  font-weight:850;
  letter-spacing:.12em;
}

.sap-decision-stack article:nth-child(even) small {
  color:#0A3161;
}

.sap-decision-stack h3 {
  margin:0 0 .5rem;
  color:var(--itx-ink);
  font-size:.94rem;
  line-height:1.38;
}

.sap-decision-stack p {
  margin:0;
  color:#6D7984;
  font-size:.74rem;
  line-height:1.56;
}

.sap-decision-techline {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  margin-top:1rem;
  border-top:1px solid #DDE4E9;
  border-bottom:1px solid #DDE4E9;
}

.sap-decision-techline span {
  padding:.75rem .65rem;
  color:#5D6A75;
  font-size:.59rem;
  font-weight:720;
  text-align:center;
}

.sap-decision-techline span + span {
  border-left:1px solid #DDE4E9;
}

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

.sap-outcomes-statement {
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);
  gap:clamp(2.5rem,6vw,6rem);
  align-items:end;
  margin-bottom:2.5rem;
}

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

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

.sap-outcomes-lead {
  padding-left:1.2rem;
  border-left:3px solid #B31942;
}

.sap-outcomes-lead strong {
  display:block;
  margin-bottom:.35rem;
  color:#fff;
  font-size:1rem;
}

.sap-outcomes-lead p {
  margin:0;
  color:#BECBD5;
  font-size:.78rem;
  line-height:1.6;
}

.sap-outcomes-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);
}

.sap-outcomes-grid article {
  min-height:260px;
  padding:1.25rem;
}

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

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

.sap-outcomes-grid small {
  display:block;
  margin-bottom:.5rem;
  color:#79B8EF;
  font-size:.49rem;
  font-weight:850;
  letter-spacing:.12em;
}

.sap-outcomes-grid article:nth-child(even) small {
  color:#E1849D;
}

.sap-outcomes-grid strong {
  display:block;
  color:#fff;
  font-size:.96rem;
  line-height:1.45;
}

.sap-outcome-feature strong {
  font-size:1.3rem;
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

/* Responsive */
@media (max-width:1199.98px) {
  .sap-hero-grid {
    grid-template-columns:minmax(0,.94fr) minmax(430px,1.06fr);
  }

  .sap-model-grid,
  .sap-growth-banner,
  .sap-delivery-layout,
  .sap-decision-stage {
    grid-template-columns:1fr;
  }

  .sap-model-visuals {
    min-height:510px;
  }

  .sap-capability-field {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .sap-growth-signals {
    grid-template-columns:repeat(2,1fr);
  }

  .sap-growth-signals article:nth-child(3) {
    border-left:0;
    border-top:1px solid #DDE4E9;
  }

  .sap-growth-signals article:nth-child(4) {
    border-top:1px solid #DDE4E9;
  }

  .sap-delivery-visual,
  .sap-decision-analytics {
    min-height:430px;
  }

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

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

  .sap-hero-product {
    min-height:500px;
  }

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

  .sap-fabric-node-product {
    left:4%;
  }

  .sap-fabric-node-data {
    right:4%;
  }

  .sap-fabric-node-connect {
    left:5%;
  }

  .sap-fabric-node-operate {
    right:5%;
  }

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

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

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

@media (max-width:767.98px) {
  .sap-hero-signals,
  .sap-model-pillars,
  .sap-capability-field,
  .sap-growth-signals,
  .sap-delivery-steps,
  .sap-decision-stack,
  .sap-outcomes-grid,
  .sap-related-grid {
    grid-template-columns:1fr;
  }

  .sap-hero .inner-page-title {
    font-size:clamp(2.65rem,11vw,4rem);
  }

  .sap-hero-product {
    min-height:650px;
  }

  .sap-hero-dashboard {
    inset:0 0 160px 0;
  }

  .sap-hero-product-card {
    width:calc(50% - .4rem);
    min-height:130px;
  }

  .sap-hero-product-card-tenants {
    left:0;
    right:auto;
    top:auto;
    bottom:0;
  }

  .sap-hero-product-card-revenue {
    right:0;
    top:auto;
    bottom:0;
  }

  .sap-hero-product-card-ops {
    display:none;
  }

  .sap-model-visuals {
    min-height:450px;
  }

  .sap-model-main {
    inset:0 30px 55px 0;
  }

  .sap-model-small {
    width:160px;
    height:145px;
  }

  .sap-capability-feature {
    grid-column:span 1;
  }

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

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

  .sap-fabric-ring {
    display:none;
  }

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

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

  .sap-fabric-guardrails {
    grid-template-columns:1fr 1fr;
  }

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

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

  .sap-decision-techline {
    grid-template-columns:1fr 1fr;
  }

  .sap-decision-techline span:nth-child(3) {
    border-left:0;
    border-top:1px solid #DDE4E9;
  }

  .sap-decision-techline span:nth-child(4) {
    border-top:1px solid #DDE4E9;
  }

  .sap-outcomes-grid article,
  .sap-outcomes-grid article:nth-child(3),
  .sap-outcomes-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) {
  .sap-hero-product {
    min-height:610px;
  }

  .sap-model-visuals {
    min-height:400px;
  }

  .sap-model-small {
    display:none;
  }

  .sap-model-main {
    inset:0;
  }

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

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

  .sap-decision-techline {
    grid-template-columns:1fr;
  }

  .sap-decision-techline span,
  .sap-decision-techline span:nth-child(3),
  .sap-decision-techline span:nth-child(4) {
    border-left:0;
    border-top:0;
    border-bottom:1px solid #DDE4E9;
  }

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

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


/* =========================================================
   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-grid {
  display:grid;
  grid-template-columns:1.25fr .75fr .75fr;
  gap:1rem;
}

.api-landscape-feature,
.api-landscape-card {
  position:relative;
  overflow:hidden;
  border-radius:18px;
}

.api-landscape-feature {
  min-height:540px;
  background:#17344E;
}

.api-landscape-feature::after,
.api-landscape-card::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(7,28,47,.02) 28%,rgba(7,28,47,.88) 100%);
}

.api-landscape-feature img,
.api-landscape-card img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.api-landscape-feature-copy,
.api-landscape-card > div {
  position:absolute;
  left:1.15rem;
  right:1.15rem;
  bottom:1.15rem;
  z-index:2;
}

.api-landscape-feature-copy span,
.api-landscape-card span {
  display:block;
  margin-bottom:.42rem;
  color:#9BCBF1;
  font-size:.5rem;
  font-weight:850;
  letter-spacing:.12em;
}

.api-landscape-card:nth-child(3) span {
  color:#E1849D;
}

.api-landscape-feature-copy h3 {
  margin:0 0 .5rem;
  color:#fff;
  font-size:1.35rem;
  line-height:1.28;
}

.api-landscape-card h3 {
  margin:0 0 .45rem;
  color:#fff;
  font-size:.96rem;
  line-height:1.35;
}

.api-landscape-feature-copy p,
.api-landscape-card p {
  margin:0;
  color:#D1DCE4;
  font-size:.76rem;
  line-height:1.58;
}

.api-landscape-card {
  min-height:400px;
  align-self:end;
}

/* 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;
}

/* 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;
  }
}