@media (max-width:1366px){
  .services-page{overflow-x:clip}
  .services-page .wrap{width:100%;max-width:none;padding-inline:32px}
  .services-hero-inner{grid-template-columns:1fr;gap:46px}
  .services-hero-copy{max-width:760px}
  .services-hero-visual{width:min(100%,720px);margin-inline:auto;min-height:520px}
  .services-index{grid-template-columns:repeat(2,minmax(0,1fr))}
  .service-detail-grid,.service-detail-reverse{grid-template-columns:1fr!important;gap:42px}
  .service-detail-visual{order:0!important;width:min(100%,760px);margin-inline:auto}
}
@media (max-width:820px){
  .services-page .wrap{padding-inline:22px}
  .services-hero-title{font-size:clamp(46px,9vw,72px)}
  .services-hero-visual{min-height:430px}
  .services-index{grid-template-columns:1fr}
  .service-detail-inner{grid-template-columns:1fr!important}
  .service-capabilities{grid-template-columns:1fr}
  .services-partner-grid,.services-faq-grid{grid-template-columns:1fr}
}
@media (max-width:560px){
  .services-page .wrap{padding-inline:16px}
  .services-hero-actions{display:grid;grid-template-columns:1fr;width:100%}
  .services-hero-actions .btn{width:100%;justify-content:center}
  .services-hero-visual{min-height:330px;transform:scale(.94)}
  .service-index-card{grid-template-columns:56px minmax(0,1fr);gap:12px}
  .service-detail{padding-block:68px}
  .services-final-actions{display:grid;grid-template-columns:1fr}
  .services-final-actions .btn{width:100%;justify-content:center}
}

@media (max-width:600px){
  .services-page h1,.services-page h2,.services-page h3,.services-page h4,.services-page p,.services-page .eyebrow,.services-page .kicker,.services-page .section-label{text-align:center!important}
  .services-page [class*="actions"],.services-page [class*="buttons"]{justify-content:center}
}

@media (min-width:601px) and (max-width:1366px){
  .services-page{overflow-x:clip;overflow-y:visible}
  .services-page .wrap{width:100%;max-width:none;padding-inline:clamp(24px,4vw,48px)}
  .services-page img,.services-page video,.services-page svg{max-width:100%}
  .services-final-card{height:auto;max-height:none;flex-wrap:wrap}
}
@media (min-width:601px) and (max-width:1024px){
  .services-hero-inner,.service-detail-grid,.service-detail-reverse,.services-partner-grid,.services-faq-grid{grid-template-columns:1fr!important}
  .services-final-card{display:grid;grid-template-columns:1fr;gap:28px}
}


/* =========================================================
   SERVICES — MOBILE + TABLET BREADCRUMB / HERO SPACING FIX
   2026-09-13
   Keep the breadcrumb in normal document flow so it never
   overlaps the Services hero copy on phones or iPads.
   ========================================================= */
@media (max-width: 1099px) {
  body.page-services.page-video-under-header .page-chrome {
    position: relative !important;
    inset: auto !important;
    z-index: 40 !important;
    width: 100% !important;
    padding-top: 96px !important;
    padding-bottom: 18px !important;
    background: var(--bg-0) !important;
    pointer-events: auto !important;
  }

  body.page-services .page-chrome > .wrap {
    width: 100% !important;
    max-width: none !important;
    padding-inline: clamp(16px, 3vw, 32px) !important;
  }

  body.page-services .site-breadcrumb {
    width: 100% !important;
    max-width: none !important;
    min-height: 82px !important;
    margin: 0 !important;
    border-radius: 22px !important;
  }

  body.page-services .site-breadcrumb-links {
    width: 100% !important;
    margin: 0 !important;
    padding-inline: clamp(24px, 4vw, 38px) !important;
    gap: 13px !important;
    justify-content: flex-start !important;
  }

  html[dir="rtl"] body.page-services .site-breadcrumb-links {
    justify-content: flex-start !important;
  }

  body.page-services .site-breadcrumb-links a,
  body.page-services .site-breadcrumb-current {
    font-size: clamp(16px, 2.2vw, 19px) !important;
  }

  body.page-services .services-hero {
    margin-top: 0 !important;
    min-height: auto !important;
    padding-top: 0 !important;
    align-items: flex-start !important;
  }

  body.page-services .services-hero-inner {
    padding-top: 34px !important;
    padding-bottom: 72px !important;
  }

  body.page-services .services-hero-copy {
    padding-block: 0 !important;
    margin-top: 0 !important;
  }
}

/* iPad / tablet: generous full-width breadcrumb and clear hero separation */
@media (min-width: 601px) and (max-width: 1099px) {
  body.page-services.page-video-under-header .page-chrome {
    padding-top: 104px !important;
    padding-bottom: 22px !important;
  }

  body.page-services .page-chrome > .wrap {
    padding-inline: clamp(24px, 4vw, 44px) !important;
  }

  body.page-services .site-breadcrumb {
    min-height: 88px !important;
    border-radius: 24px !important;
  }

  body.page-services .site-breadcrumb-links {
    padding-inline: 34px !important;
  }

  body.page-services .services-hero-inner {
    padding-top: 42px !important;
    padding-bottom: 86px !important;
  }
}

/* Phone: nearly edge-to-edge breadcrumb, then hero text below it */
@media (max-width: 600px) {
  body.page-services.page-video-under-header .page-chrome {
    padding-top: 84px !important;
    padding-bottom: 16px !important;
  }

  body.page-services .page-chrome > .wrap {
    padding-inline: 14px !important;
  }

  body.page-services .site-breadcrumb {
    min-height: 78px !important;
    border-radius: 20px !important;
  }

  body.page-services .site-breadcrumb-links {
    padding-inline: 24px !important;
    gap: 11px !important;
  }

  body.page-services .site-breadcrumb-links a,
  body.page-services .site-breadcrumb-current {
    font-size: 17px !important;
  }

  body.page-services .services-hero-inner {
    padding-top: 26px !important;
    padding-bottom: 64px !important;
  }

  body.page-services .services-hero-title {
    margin-top: 0 !important;
  }
}