/* 02-what-we-deliver — section-specific stylesheet */


/* The original global.css contains the base design. Add/override only this section here. */


/* Keep every section in the same navy / orange visual language as the reference. */
.services-page{background:#f6f8f8;color:#10283a;position:relative}

.services-page:before,.process-page:before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(6,30,52,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(6,30,52,.035) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(90deg,#000,transparent 88%)}

.what-we-deliver{
  min-height:710px;
  padding:0 0 72px;
  background:#f7fafb;
  color:#0b2740;
  position:relative;
  overflow:hidden;
}

.what-deliver-bg{
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:315px;
  background:url("../assets/what-we-deliver-bg.webp") center top/cover no-repeat;
  z-index:0;
}

.what-deliver-bg:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(248,250,251,.98) 0%,rgba(248,250,251,.96) 31%,rgba(248,250,251,.64) 51%,rgba(248,250,251,.05) 72%,rgba(248,250,251,0) 100%);
}

.what-deliver-inner{
  width:min(100% - 96px,1730px);
  margin:0 auto;
  position:relative;
  z-index:2;
}

.what-deliver-heading{
  height:279px;
  position:relative;
}

.what-deliver-copy{
  padding-top:42px;
  padding-left:0;
}

.what-deliver-eyebrow{
  margin:0 0 20px;
  color:#27445a!important;
  font:800 12px "Manrope",Arial,sans-serif;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.what-deliver-eyebrow span{
  width:33px;
  height:3px;
  background:var(--orange)!important;
  display:inline-block;
  vertical-align:middle;
  margin-right:12px;
}

.what-deliver-copy h2{
  margin:0;
  color:#0b2740;
  font:700 clamp(48px,4.05vw,68px)/.88 "Space Grotesk",Arial,sans-serif;
  letter-spacing:-.055em;
}

.what-deliver-copy h2 em{
  font-style:normal;
  color:var(--orange)!important;
}

.what-deliver-lead{
  margin:20px 0 0;
  color:#61778a;
  font:400 16px/1.45 "DM Sans",Arial,sans-serif;
  letter-spacing:-.01em;
}

.what-deliver-side-note{
  position:absolute;
  left:51.3%;
  top:65px;
  border-left:2px solid var(--orange);
  padding-left:24px;
  min-height:92px;
}

.what-deliver-side-note p{
  margin:7px 0 0;
  color:#29475e;
  font:800 10px/1.7 "Manrope",Arial,sans-serif;
  letter-spacing:.11em;
}

.what-deliver-tech-card{
  position:absolute;
  right:-24px;
  top:119px;
  width:180px;
  height:105px;
  border:1px solid rgba(255,149,31,.75);
  background:rgba(10,42,64,.05);
  padding:25px 25px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:3px;
  color:#fff;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);
}

.what-deliver-tech-card span{
  font:800 10px/1.35 "Space Grotesk",Arial,sans-serif;
  letter-spacing:.16em;
}

.what-deliver-cards{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:19px;
  position:relative;
  z-index:3;
}

.deliver-card{
  min-width:0;
  background:#fff;
  border-radius:10px;
  overflow:hidden;
  box-shadow:0 7px 24px rgba(15,42,62,.09);
  border:1px solid #e7edf0;
}

.deliver-card-image{
  height:176px;
  position:relative;
  background-size:cover;
  background-position:center;
  overflow:hidden;
}

.deliver-card-image:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(5,26,42,.05),rgba(4,24,40,.13));
}

.deliver-card-image-1{background-image:url("../assets/what-deliver-card-01.webp")}

.deliver-card-image-2{background-image:url("../assets/what-deliver-card-02.webp")}

.deliver-card-image-3{background-image:url("../assets/what-deliver-card-03.webp")}

.deliver-card-image-4{background-image:url("../assets/what-deliver-card-04.webp")}

.deliver-card-image-5{background-image:url("../assets/what-deliver-card-04.webp")}

.deliver-image-label{
  position:absolute;
  z-index:2;
  left:27px;
  top:30px;
  color:#fff;
  display:flex;
  flex-direction:column;
  font:800 10px/1.38 "Manrope",Arial,sans-serif;
  letter-spacing:.17em;
  text-transform:uppercase;
}

.deliver-image-label i{
  width:28px;
  height:2px;
  background:var(--orange);
  margin-top:11px;
}

.deliver-card-body{
  min-height:209px;
  padding:17px 27px 20px;
  position:relative;
  background:#fff;
}

.deliver-number{
  display:block;
  color:#ff6d00;
  font:700 19px/1 "Manrope",Arial,sans-serif;
  margin-bottom:6px;
}

.deliver-card-body h3{
  margin:0;
  color:#0b2946;
  font:700 22px/1.12 "Space Grotesk",Arial,sans-serif;
  letter-spacing:-.035em;
}

.deliver-card-body p{
  margin:15px 0 0;
  max-width:350px;
  color:#657b8d;
  font:400 15px/1.38 "DM Sans",Arial,sans-serif;
}

.deliver-card-body a{
  position:absolute;
  left:27px;
  bottom:24px;
  color:#073b62;
  text-decoration:none;
  font:700 14px "DM Sans",Arial,sans-serif;
  border-bottom:2px solid var(--orange);
  padding-bottom:5px;
}

.deliver-card-body a span{
  position:absolute;
  left:calc(100% + 234px);
  bottom:-2px;
  width:49px;
  height:49px;
  border:1px solid #d1dde4;
  border-radius:50%;
  display:grid;
  place-items:center;
  font-size:24px;
  font-weight:400;
  color:#0c3859;
  border-bottom-color:#d1dde4;
}

.deliver-card:nth-child(2) .deliver-card-body a span{left:calc(100% + 234px)}

.deliver-card:nth-child(3) .deliver-card-body a span{left:calc(100% + 234px)}

.deliver-card:nth-child(4) .deliver-card-body a span{left:calc(100% + 234px)}

.deliver-card:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(15,42,62,.13);transition:.25s ease}

@media(max-width:1450px){
  .what-deliver-inner{width:calc(100% - 70px)}
  .what-deliver-copy h2{font-size:58px}
  .deliver-card-body{padding-left:22px;padding-right:20px}
  .deliver-card-body h3{font-size:19px}
  .deliver-card-body p{font-size:13px}
  .deliver-card-body a{left:22px}
  .deliver-card-body a span{left:calc(100% + 145px)}
}

@media(max-width:1100px){
  .trust-inner{gap:18px}
  .trust-inner span{font-size:10px}
  .what-deliver-heading{height:300px}
  .what-deliver-copy h2{font-size:52px}
  .what-deliver-side-note{left:56%}
  .what-deliver-tech-card{right:0;width:150px}
  .what-deliver-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
  .deliver-card-image{height:190px}
  .deliver-card-body{min-height:205px}
  .deliver-card-body a span{left:calc(100% + 185px)}
}

@media(max-width:700px){
  .trust-strip,.trust-inner{height:50px}
  .trust-inner{width:calc(100% - 24px);justify-content:flex-start;gap:13px;overflow:hidden}
  .trust-inner span{font-size:7px;letter-spacing:.08em}
  .trust-inner i{width:5px;height:5px}
  .what-we-deliver{padding-bottom:42px}
  .what-deliver-inner{width:calc(100% - 30px)}
  .what-deliver-bg{height:390px}
  .what-deliver-bg:after{background:linear-gradient(90deg,rgba(248,250,251,.98),rgba(248,250,251,.78) 62%,rgba(248,250,251,.1))}
  .what-deliver-heading{height:auto;min-height:430px}
  .what-deliver-copy{padding-top:34px}
  .what-deliver-copy h2{font-size:43px;line-height:.92}
  .what-deliver-lead{font-size:13px;line-height:1.5}
  .desktop-only{display:none}
  .what-deliver-side-note{position:relative;left:auto;top:auto;margin:28px 0 0;display:inline-block}
  .what-deliver-tech-card{right:0;top:315px;width:150px;height:92px;padding:18px}
  .what-deliver-cards{grid-template-columns:1fr;gap:16px}
  .deliver-card-image{height:185px}
  .deliver-card-body{min-height:220px;padding:17px 20px 20px}
  .deliver-card-body h3{font-size:20px}
  .deliver-card-body p{font-size:13px;max-width:95%}
  .deliver-card-body a{left:20px;bottom:24px}
  .deliver-card-body a span{left:calc(100vw - 105px);bottom:-5px}
}

/* Final image visibility fix */
.deliver-card-image-1{background-image:url("../assets/what-deliver-card-01.webp") !important}
.deliver-card-image-2{background-image:url("../assets/what-deliver-card-02.webp") !important}
.deliver-card-image-3{background-image:url("../assets/what-deliver-card-03.webp") !important}
.deliver-card-image-4{background-image:url("../assets/what-deliver-card-04.webp") !important}
.deliver-card-image-5{background-image:url("../assets/what-deliver-card-04.webp") !important}
.deliver-card-image{background-color:#183b55}
