/* ============================================================
   what-we-do.css — extends styles.css/pages.css for the
   What We Do page. Reuses .page-intro (pages.css), .approach/
   .three/.cta (styles.css) verbatim. Only new component: the
   service detail grid (.wtd-services).
   ============================================================ */

.wtd-services{padding:20px 7vw 40px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.wtd-service{background:var(--white);border-radius:20px 20px 20px 90px;overflow:hidden;display:flex;flex-direction:column}
.wtd-service:nth-child(2){border-radius:20px 90px 20px 20px}
.wtd-service:nth-child(3){border-radius:90px 20px 20px 20px}
.wtd-service-img{height:200px}
.wtd-service-body{padding:26px 26px 30px;display:flex;flex-direction:column;flex:1}
.wtd-service-body .kicker{display:block;margin-bottom:4px}
.wtd-service-body h2{font-size:var(--fs-h4);line-height:1.08;letter-spacing:-.03em;margin:0 0 12px}
.wtd-service-body p{font-size:var(--fs-xs);line-height:1.6;margin:0 0 16px;opacity:.82}
.wtd-service-body a{margin-top:auto;font-size:var(--fs-2xs);font-weight:700;border-bottom:1px solid;padding-bottom:6px;align-self:flex-start}

.wtd-process{padding:70px 7vw 20px}
.wtd-process-head{max-width:520px}
.wtd-process-head h2{font-size:var(--fs-h2-sm);line-height:1.05;letter-spacing:-.03em;margin:14px 0 0}
.wtd-process .journey-track{margin-top:55px}

@media(max-width:1000px){
  .wtd-services{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:650px){
  .wtd-services{grid-template-columns:1fr;padding:10px 6vw 30px}
  .wtd-process{padding:50px 6vw 10px}
  .wtd-process .journey-track{grid-template-columns:repeat(3,1fr);row-gap:35px;border-top:0}
  .wtd-process .journey-track div{border-top:2px solid;padding-top:15px}
}
