/* =========================================================
   SB Global Solution — All Services page (slug: services) and All Case Studies page (slug: case-studies, same design) — scoped by the body classes .page-all-services / .page-all-case-studies. Loaded only on those two templates.
   Same rules as html-work/css/style.css. The CTA band wrapper (.srv-cta) is in components.css.
   ========================================================= */
/* ---- Jump bar, category sections, service cards ---- */
:is(.page-all-services, .page-all-case-studies) .srv-jump { padding: 30px 0 0; background: #fff; }
:is(.page-all-services, .page-all-case-studies) .srv-jump__inner { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
:is(.page-all-services, .page-all-case-studies) .srv-jump a { display: inline-flex; align-items: center; gap: 9px; padding: 11px 20px; border-radius: 999px; border: 1px solid var(--line); background: #fff; box-shadow: var(--shadow-1); font-family: var(--font-head); font-size: 15px; font-weight: 700; color: var(--navy-900); transition: border-color .2s, color .2s, transform .2s; }
:is(.page-all-services, .page-all-case-studies) .srv-jump a:hover { border-color: var(--orange-500); color: var(--orange-600); transform: translateY(-2px); }
:is(.page-all-services, .page-all-case-studies) .srv-jump svg { width: 18px; height: 18px; fill: none; stroke: var(--orange-500); stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
:is(.page-all-services, .page-all-case-studies) .srv-sec { padding: var(--sec-pad) 0; background: #fff; scroll-margin-top: 80px; }
:is(.page-all-services, .page-all-case-studies) .srv-sec--alt { background: #F6F8FC; }
:is(.page-all-services, .page-all-case-studies) .srv-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
:is(.page-all-services, .page-all-case-studies) .srv-card {
  --c: #F07A1A; --bg1: #FFF6EE;
  display: flex; flex-direction: column; gap: 10px; padding: 24px 22px 22px; border-radius: 20px;
  background: linear-gradient(160deg, var(--bg1), #fff 55%); border: 1px solid rgba(15,23,42,.06); box-shadow: var(--shadow-1);
  transition: transform .25s, box-shadow .25s;
}
:is(.page-all-services, .page-all-case-studies) .srv-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-2); }
:is(.page-all-services, .page-all-case-studies) .srv-card:nth-child(6n+2) { --c: #7C3AED; --bg1: #F6F1FF; }
:is(.page-all-services, .page-all-case-studies) .srv-card:nth-child(6n+3) { --c: #2563EB; --bg1: #EEF4FF; }
:is(.page-all-services, .page-all-case-studies) .srv-card:nth-child(6n+4) { --c: #16A34A; --bg1: #ECFAF2; }
:is(.page-all-services, .page-all-case-studies) .srv-card:nth-child(6n+5) { --c: #0284C7; --bg1: #ECF6FD; }
:is(.page-all-services, .page-all-case-studies) .srv-card:nth-child(6n+6) { --c: #DB2777; --bg1: #FDEFF5; }
:is(.page-all-services, .page-all-case-studies) .srv-card__top { display: flex; align-items: center; gap: 12px; }
:is(.page-all-services, .page-all-case-studies) .srv-card__ic { display: grid; place-items: center; flex-shrink: 0; width: 46px; height: 46px; border-radius: 14px; background: #fff; box-shadow: 0 8px 18px -10px rgba(15,23,42,.3); }
:is(.page-all-services, .page-all-case-studies) .srv-card__ic svg { width: 23px; height: 23px; fill: none; stroke: var(--c); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
:is(.page-all-services, .page-all-case-studies) .srv-card h3 { margin: 0; font-family: var(--font-head); font-size: 17px; font-weight: 800; line-height: 1.3; color: var(--ink); }
:is(.page-all-services, .page-all-case-studies) .srv-card p { margin: 0; font-size: 14.5px; line-height: 1.6; color: var(--text); }
:is(.page-all-services, .page-all-case-studies) .srv-card ul { display: grid; gap: 7px; margin: 4px 0 6px; padding: 12px 0 0; list-style: none; border-top: 1px dashed var(--line); flex-grow: 1; align-content: start; }
:is(.page-all-services, .page-all-case-studies) .srv-card li { display: flex; align-items: flex-start; gap: 8px; font-size: 14px; line-height: 1.45; font-weight: 500; color: var(--ink); }
:is(.page-all-services, .page-all-case-studies) .srv-card li svg { width: 16px; height: 16px; flex-shrink: 0; margin-top: 1px; fill: none; stroke: var(--c); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
:is(.page-all-services, .page-all-case-studies) .srv-card__link { display: inline-flex; align-items: center; gap: 7px; margin-top: 4px; font-family: var(--font-head); font-size: 14.5px; font-weight: 700; color: var(--c); }
:is(.page-all-services, .page-all-case-studies) .srv-card__link svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s; }
:is(.page-all-services, .page-all-case-studies) .srv-card__link:hover svg { transform: translateX(4px); }
/* All Case Studies: few cards — centred, same card width as a 4-column grid */
.page-all-case-studies .srv-grid--center { grid-template-columns: repeat(auto-fit, minmax(0, calc((100% - 54px) / 4))); justify-content: center; }
@media (max-width: 1100px) {
  :is(.page-all-services, .page-all-case-studies) .srv-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-all-case-studies .srv-grid--center { grid-template-columns: repeat(auto-fit, minmax(0, calc((100% - 18px) / 2))); }
}
@media (max-width: 600px) {
  :is(.page-all-services, .page-all-case-studies) .srv-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  :is(.page-all-services, .page-all-case-studies) .srv-jump a { padding: 9px 14px; font-size: 14px; }
}