body[data-page="services"] .page-hero { background: radial-gradient(ellipse at 90% 10%,#38216a 0,transparent 48%),linear-gradient(120deg,#080e21,#101c3a); }
body[data-page="services"] .page-hero-inner.services-hero-grid { max-width: 1280px; margin-inline: auto; display: grid; grid-template-columns: minmax(0,1.25fr) minmax(0,1fr); align-items: center; gap: 64px; padding-block: 76px; }
body[data-page="services"] .page-title { max-width: 18ch; font-size: clamp(2.2rem,3.5vw,3.5rem); line-height: 1.14; letter-spacing: -.035em; margin-bottom: 22px; }
body[data-page="services"] .page-lead { font-size: 1rem; line-height: 1.85; color: #c3cbe0; }
body[data-page="services"] .page-hero .section-label { background: transparent; color: #bca9f3; }
.services-hero-actions { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; margin-top: 28px; }
.services-text-link { color: #e2d9fb; font-size: 13px; display: inline-flex; gap: 12px; align-items: center; }
.services-overview { border: 1px solid #ffffff26; border-radius: 0; padding: 24px; background: #ffffff07; }
.services-overview-label { margin: 0 0 12px; color: #c1b6de; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
.services-overview > a { display: flex; align-items: center; gap: 14px; padding: 21px 0; border-bottom: 1px solid #ffffff18; color: #fff; transition: color .2s; }
.services-overview > a:hover { color: #cbb6ff; }
.expertise-number { display: grid; place-items: center; width: 38px; height: 38px; flex-shrink: 0; color: #cbb6ff; background: #ffffff08; border: 1px solid #ffffff18; border-radius: 10px; font-size: 12px; }
.services-overview > a > span:nth-child(2) { flex: 1; min-width: 0; }
.services-overview strong { display: block; font-size: 15px; font-weight: 600; }
.services-overview small { display: block; margin-top: 4px; color: #a9b4cd; font-size: 12px; }
.services-overview > a.services-training-link { border: 0; padding-bottom: 0; font-size: 11px; justify-content: space-between; flex-wrap: wrap; gap: 8px; color: #bac3d8; }
.services-training-link span { color: #dfcfff; }
.services-section-nav { background: #faf9fd; border-bottom: 1px solid #ece9f3; scroll-margin-top: 132px; }
.services-section-nav > div { display: flex; align-items: center; gap: 30px; padding-block: 18px; flex-wrap: wrap; }
.services-section-nav span { font-size: 11px; font-weight: 700; color: #7b7192; text-transform: uppercase; letter-spacing: .06em; margin-right: auto; }
.services-section-nav a { color: #342452; font-size: 13px; font-weight: 600; }
.services-section-nav a:hover { color: #6a38c3; }
body[data-page="services"] .page-section { padding-block: 72px; }
body[data-page="services"] section[id] { scroll-margin-top: 130px; }
body[data-page="services"] .section-header-block { max-width: 780px; margin-bottom: 32px; }
body[data-page="services"] .section-title { font-size: clamp(1.65rem,2.5vw,2.5rem); line-height: 1.25; letter-spacing: -.025em; }
body[data-page="services"] .section-lead { font-size: 15px; color: #64748b; line-height: 1.8; }
body[data-page="services"] .service-grid { counter-reset: service; gap: 20px; }
body[data-page="services"] .service-card { counter-increment: service; border: 1px solid #e7e4ef; border-radius: 0; box-shadow: 0 4px 18px #1d0d3c05; padding: 28px; min-height: 0; }
body[data-page="services"] .service-card::before { content: '0' counter(service); position: static; display: grid; place-items: center; width: 38px; height: 38px; margin-bottom: 20px; border-radius: 10px; color: #7445bd; background: #f3eefb; font-size: 12px; font-weight: 700; }
body[data-page="services"] .service-card:hover {  border-color: #d7dce5; box-shadow: 0 12px 28px rgba(15,23,42,.08); }
body[data-page="services"] .service-kicker { font-size: 10px; letter-spacing: .07em; }
body[data-page="services"] .service-card h3 { font-size: 18px; line-height: 1.4; margin-block: 10px 14px; }
body[data-page="services"] .service-card p, body[data-page="services"] .service-card li { font-size: 13px; line-height: 1.85; }
body[data-page="services"] .service-card ul { border-top: 1px solid #eeeaf4; padding-top: 16px; margin-top: 18px; }
body[data-page="services"] .illustration-media { border-radius: 0; overflow: hidden; }
.services-project { padding-block: 58px; background: #f5f1fc; border-top: 1px solid #eae2f5; }
.services-project > div { display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.services-project h2 { font-size: clamp(1.6rem,2.6vw,2.3rem); margin: 0 0 12px; color: #15102d; letter-spacing: -.025em; }
.services-project p:last-child { color: #706581; font-size: 14px; margin: 0; }
.services-project .btn-primary { flex-shrink: 0; }
@media(max-width:900px) {
  body[data-page="services"] .page-hero-inner.services-hero-grid { grid-template-columns: minmax(0,1fr); gap: 32px; padding-block: 48px; }
  .services-overview { max-width: 620px; }
  .services-section-nav > div { gap: 18px; }
  .services-section-nav span { flex-basis: 100%; }
  body[data-page="services"] .service-grid { grid-template-columns: minmax(0,1fr); }
  body[data-page="services"] .page-section { padding-block: 48px; }
  .services-project > div { flex-direction: column; align-items: flex-start; gap: 24px; }
}
@media(max-width:600px) {
  body[data-page="services"] .page-hero-inner.services-hero-grid { padding-top: 50px; padding-inline: 22px; }
  .services-overview { padding: 18px; }
  .services-overview strong { font-size: 14px; }
  .services-section-nav a { font-size: 12px; }
  body[data-page="services"] .service-card { padding: 24px; }
  .services-hero-actions .btn-primary { width: 100%; justify-content: center; }
  .services-section-nav, body[data-page="services"] section[id] { scroll-margin-top: 80px; }
}

/* IT services: illustrated panels in the site's blue palette. */
body[data-page="services"] #dev-it { background: #f3f6fb; }
body[data-page="services"] #dev-it .it-services-heading { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(0,1fr); align-items: start; column-gap: 72px; row-gap: 18px; max-width: none; margin-bottom: 42px; }
#dev-it .it-services-heading .section-label { grid-column: 1 / -1; margin-bottom: 0; font-size: 10px; letter-spacing: .08em; }
body[data-page="services"] #dev-it .section-title { max-width: 22ch; margin: 0; color: #10264b; font-size: clamp(1.8rem,2.8vw,2.6rem); font-weight: 700; line-height: 1.2; letter-spacing: -.035em; }
body[data-page="services"] #dev-it .section-lead { margin: 0; padding-top: 3px; font-size: 14px; line-height: 1.9; color: #667085; }
body[data-page="services"] #dev-it .it-services-grid { gap: 24px; border: 0; }
body[data-page="services"] #dev-it .service-card { display: flex; flex-direction: column; background: #fff; border: 1px solid #dce4ef; border-radius: 0; overflow: hidden; box-shadow: 0 5px 18px #18376408; padding: 0 26px 28px; transform: none; transition: transform .2s, box-shadow .2s, border-color .2s; }
body[data-page="services"] #dev-it .service-card:hover {  border-color: #d7dce5; box-shadow: 0 12px 28px rgba(15,23,42,.08); }
.it-service-visual { height: 186px; flex-shrink: 0; margin: 0 -26px 26px; overflow: hidden; border-bottom: 1px solid #e5ecf6; }
.it-service-visual img { width: 100%; height: 100%; display: block; object-fit: cover; }
.it-service-visual img[src$=".svg"] { object-fit: contain; padding: 15px 20px 0; }
.it-visual-web { background: #163272; }
.it-visual-app { background: #e9f0fc; }
.it-visual-host { background: #edf3fa; }
body[data-page="services"] #dev-it .service-card::before { content: none; }
body[data-page="services"] #dev-it .service-kicker { color: #2563b8; font-size: 10px; font-weight: 700; letter-spacing: .08em; }
body[data-page="services"] #dev-it .service-card h3 { margin: 12px 0 16px; color: #13213b; font-size: 21px; font-weight: 600; line-height: 1.35; letter-spacing: -.025em; }
body[data-page="services"] #dev-it .service-card p { margin: 0 0 20px; color: #667085; font-size: 13px; line-height: 1.85; }
body[data-page="services"] #dev-it .service-card ul { display: grid; gap: 10px; margin: auto 0 0; padding: 18px 0 0; border-top: 1px solid #e8edf5; }
body[data-page="services"] #dev-it .service-card li { margin: 0; padding-left: 20px; color: #38445a; font-size: 12px; line-height: 1.7; }
body[data-page="services"] #dev-it .service-card li::before { content: ''; width: 9px; height: 5px; top: .5em; border: solid #3970be; border-width: 0 0 1.5px 1.5px; border-radius: 0; background: transparent; transform: rotate(-45deg); }
.it-services-followup { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 28px; padding: 24px 28px; border-radius: 0; background: #e7eef9; border: 1px solid #dce6f5; }
.it-services-followup p { max-width: 65ch; margin: 0; color: #435573; font-size: 13px; line-height: 1.8; }
.it-services-followup a { display: inline-flex; align-items: center; gap: 12px; flex-shrink: 0; padding: 12px 18px; border-radius: 6px; background: #163272; color: #fff; font-size: 12px; font-weight: 600; text-decoration: none; }
.it-services-followup a:hover { background: #20458f; }
@media(max-width:900px) {
  body[data-page="services"] #dev-it .it-services-heading { grid-template-columns: minmax(0,1fr); gap: 18px; margin-bottom: 30px; }
  body[data-page="services"] #dev-it .it-services-grid { gap: 20px; }
  body[data-page="services"] #dev-it .service-card { padding: 0 26px 28px; }
  .it-service-visual { height: 200px; }
  body[data-page="services"] #dev-it .service-card ul { margin-top: 0; }
  .it-services-followup { flex-direction: column; align-items: flex-start; gap: 14px; }
}
@media (prefers-reduced-motion: reduce) { body[data-page="services"] #dev-it .service-card { transition: none; } body[data-page="services"] #dev-it .service-card:hover {  } }