.work-section { background: #f3f6fa; color: #12233a; padding: 88px 24px; scroll-margin-top: 90px; }
.work-inner { max-width: 1200px; margin: 0 auto; }
.work-inner > h2 { font-size: clamp(2rem, 4vw, 3rem); margin: 0 0 16px; text-align: center; }
.work-intro { max-width: 680px; margin: 0 auto 40px; text-align: center; line-height: 1.7; color: #475569; }
.work-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; list-style: none; padding: 0; margin: 0; }
.work-step { background: white; border: 1px solid #dce4ed; border-radius: 16px; padding: 28px 24px; }
.work-number { display: block; font-size: 1.9rem; font-weight: 700; color: #305d89; margin-bottom: 24px; }
.work-step h3 { font-size: 1.12rem; line-height: 1.5; margin: 0 0 12px; }
.work-step p { font-size: .95rem; line-height: 1.75; color: #475569; margin: 0; }
.career-note { max-width: 760px; margin: 0 auto 28px; padding: 20px 16px; }
.career-note h2 { font-size: 1.05rem; margin: 0 0 12px; }
.career-note p { font-size: .9rem; line-height: 1.7; }
.career-note a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 1000px) { .work-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .work-section { padding: 56px 20px; } .work-steps { grid-template-columns: 1fr; } .work-number { margin-bottom: 12px; } }

/* Reuse the original Career card treatment and horizontal mobile track. */
.work-section.career-section { background: linear-gradient(180deg,#f8f9fa 0%,#fff 100%); padding: 80px 24px; }
.work-steps.career-grid { display: flex; gap: 16px; padding: 8px 6px 20px; max-width: 1200px; }
.work-steps .work-step { cursor: default; grid-template-rows: auto auto 1fr auto; }
.work-steps .work-step:nth-child(1)::before { background: url('../images/process-understand-needs.png') center/cover; }
.work-steps .work-step:nth-child(2)::before { background: url('../images/process-define-scope.png') center/cover; }
.work-steps .work-step:nth-child(3)::before { background: url('../images/process-build-review.png') center/cover; }
.work-steps .work-step:nth-child(4)::before { background: url('../images/process-test-handover.png') center/cover; }
.work-steps .work-number { justify-self: center; align-self: end; margin: 10px 16px 14px; padding: 6px 10px; border-radius: 999px; font-size: .78rem; font-weight: 700; color: #fff; background: linear-gradient(135deg,#b45309,#f59e0b); }
@media(min-width:1100px) { .work-steps .work-step { flex: 1 0 0; min-width: 0; } }
@media(prefers-reduced-motion:reduce) { .work-steps .work-step,.work-steps .work-step::before { transition:none; } }
.work-controls { display: flex; justify-content: center; gap: 16px; margin-top: 12px; }
.services-heading { padding: 64px 24px 12px; text-align: center; background: #f8f9fa; color: #12233a; }
.services-heading h2 { font-size: clamp(2rem,4vw,3rem); margin: 0 0 14px; }
.services-heading p { max-width: 720px; margin: 0 auto; line-height: 1.7; color: #475569; }
#services .services-heading { display: block; position: static; width: 100%; box-sizing: border-box; text-align: center; }
#services {
  background: linear-gradient(180deg, rgba(17,24,31,.48) 0%, rgba(17,24,31,.12) 35%, rgba(17,24,31,0) 65%), #343a40 url('../images/services-background-cinematic.png') center / cover no-repeat;
  background-blend-mode: normal;
  padding-bottom: 32px;
}
#services .services-heading { background: transparent; padding: 64px 24px 24px; color: #fff; }
#services .services-heading h2 { color: #fff; }
#services .services-heading p { color: #e1eaf3; }
#services .services-section { background: transparent; padding: 32px 40px 56px; gap: 24px; }
#services .services-section::after { background: none; }
@media(max-width:600px) {
  #services .services-heading { padding: 48px 24px 20px; }
  #services .services-section { padding: 24px 24px 40px; }
  #services { padding-bottom: 12px; }
}
#services { scroll-margin-top: 80px; }
#services .svc-media { aspect-ratio: 3 / 2; background: #fcfaf5; }
#services .svc-media img { object-fit: contain; transform: none; }
.work-steps .work-step { scroll-snap-stop: normal; }
.work-controls[hidden] { display: none; }
.work-controls button { min-height: 44px; padding: 8px 18px; border: 1px solid #cbd5e1; border-radius: 24px; background: #e9eef4; color: #12233a; font: inherit; cursor: pointer; }
.work-controls button:disabled { opacity: .4; cursor: default; }
.work-controls button:focus-visible, #workTrack:focus-visible { outline: 3px solid #2563eb; outline-offset: 3px; }
@media(max-width:600px) { .work-steps .work-step { flex: 0 0 calc(100% - 12px); min-width: 0; } }

#about .hero-2{background-image:linear-gradient(rgba(15,25,34,.43),rgba(15,25,34,.55)),url('../images/about-engineering-cinematic.png');background-size:cover;background-position:center;}

/* About and Process inherit the homepage hero's light Poppins typography. */
#about .content .section-title,#how-we-work #work-heading{font-family:Poppins,Arial,sans-serif;font-size:clamp(1.8rem,3vw + 1rem,3rem);font-weight:300;letter-spacing:normal;line-height:1.3;background:none;-webkit-text-fill-color:currentColor;text-shadow:none;animation:none;transform:none}
#about .content p,#how-we-work .work-intro{font-family:Poppins,Arial,sans-serif;font-size:clamp(1rem,1.2vw + .6rem,1.2rem);font-weight:300;letter-spacing:normal;line-height:1.7}
#about .content p{display:block;overflow:visible;color:rgba(255,255,255,.95);max-width:850px;margin:16px auto}
#how-we-work .work-step h3{font-family:Poppins,Arial,sans-serif;font-weight:400;letter-spacing:normal;line-height:1.5}
#how-we-work .work-step p{font-family:Poppins,Arial,sans-serif;font-weight:300;letter-spacing:normal;line-height:1.7}
/* Shared services-to-process flow; cinematic artwork now belongs to About. */
#about .hero-2{background-image:linear-gradient(90deg,rgba(15,25,34,.68),rgba(15,25,34,.48)),url('../images/services-background-cinematic.png');background-size:cover;background-position:center}
#services{background:#f8f9fa;color:#1c2e48;padding-bottom:0}
#services .services-heading{color:#1c2e48;padding:64px 24px 20px}
#services .services-heading h2{color:#1c2e48;font-family:Poppins,Arial,sans-serif;font-weight:300;font-size:clamp(1.8rem,3vw + 1rem,3rem);line-height:1.3}
#services .services-heading p{color:#475569;font-weight:300}
#services .services-section{box-sizing:border-box;max-width:1248px;margin:0 auto;padding:24px 24px 40px;background:none;color:#1c2e48;gap:20px}
#services .services-section::after{display:none}
#services .service{background:#fff;border:1px solid #d8dfe5;box-shadow:0 6px 20px #17263b08;backdrop-filter:none;color:#1c2e48}
#services .svc-body h2{color:#1c2e48;text-shadow:none}#services .svc-body p{color:#475569;text-shadow:none}
#services .service-destinations{margin-bottom:12px}#services .process-shortcut{color:#6c4b22;margin-bottom:8px}
#how-we-work.work-section.career-section{background:#f8f9fa;color:#1c2e48;padding:0 24px 64px}
#how-we-work .work-inner{padding-top:40px;border-top:1px solid #d8dfe5}
#how-we-work .work-intro{font-size:clamp(1rem,1.2vw + .6rem,1.2rem);color:#475569}
@media(max-width:640px){#services .services-heading{padding:48px 20px 16px}#services .services-section{padding:20px 16px 32px;gap:20px}#how-we-work.work-section.career-section{padding:0 16px 48px}#how-we-work .work-inner{padding-top:32px}}

/* Match Services card widths and gutters to the Process track. */
#services .services-section{gap:16px;padding-inline:30px;grid-template-columns:repeat(4,minmax(0,1fr))}
#services .services-section > .service{box-sizing:border-box;width:100%;max-width:none;min-width:0;margin:0}
@media(max-width:1099px){#services .services-section{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){#services .services-section{grid-template-columns:1fr;padding-inline:22px}}