/* scoped by scripts/v4/sync-assets.mjs: pages_services */
/* pages_services v2.4 · bento layout (only additions on top of site.css)
   one idea per card · 12-col grid (gap = --col-gap) · radius 24 · tones: warm / white-line / tint, one orange card per page
   every px is a multiple of 3; letter-spacing 0 */
:where(body[data-v4~="pages_services"]) [role=tabpanel][hidden],:where(body[data-v4~="pages_services"]) .stab-p[hidden]{display:none!important}

/* ---------- bento grid ---------- */
:where(body[data-v4~="pages_services"]) .bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--col-gap);grid-auto-flow:row dense}
:where(body[data-v4~="pages_services"]) .bento+.bento,:where(body[data-v4~="pages_services"]) .bento+.more{margin-top:var(--col-gap)}
:where(body[data-v4~="pages_services"]) .bento>.span-3{grid-column:span 3}:where(body[data-v4~="pages_services"]) .bento>.span-4{grid-column:span 4}:where(body[data-v4~="pages_services"]) .bento>.span-6{grid-column:span 6}:where(body[data-v4~="pages_services"]) .bento>.span-8{grid-column:span 8}:where(body[data-v4~="pages_services"]) .bento>.span-12{grid-column:1/-1}
:where(body[data-v4~="pages_services"]) .bento>.r2,:where(body[data-v4~="pages_services"]) .bento>.tall{grid-row:span 2}
:where(body[data-v4~="pages_services"]) .bento>.flip{grid-column:7/13}
:where(body[data-v4~="pages_services"]) .bc{position:relative;border-radius:24px;padding:30px;display:flex;flex-direction:column;gap:18px;min-height:240px;color:var(--body)}
:where(body[data-v4~="pages_services"]) .t-warm{background:#F5F4F1}:where(body[data-v4~="pages_services"]) .t-tint{background:#FFEADB}:where(body[data-v4~="pages_services"]) .t-line{background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
:where(body[data-v4~="pages_services"]) .t-org{background:#FE5000;color:#fff}
:where(body[data-v4~="pages_services"]) .t-org h3,:where(body[data-v4~="pages_services"]) .t-org .kv,:where(body[data-v4~="pages_services"]) .t-org .kl,:where(body[data-v4~="pages_services"]) .t-org .ks,:where(body[data-v4~="pages_services"]) .t-org .bd-b,:where(body[data-v4~="pages_services"]) .t-org .open,:where(body[data-v4~="pages_services"]) .t-org .open b{color:#fff}
:where(body[data-v4~="pages_services"]) .bc h3{font-size:21px;line-height:1.45;font-weight:500;color:var(--ink);overflow-wrap:anywhere}
:where(body[data-v4~="pages_services"]) .bc .chip{background:#fff;color:var(--ink);height:27px}
:where(body[data-v4~="pages_services"]) .bc.t-line .chip{background:var(--warm)}
:where(body[data-v4~="pages_services"]) .bc .ic{width:48px;height:48px;color:var(--ink);--ic-bg:transparent}
:where(body[data-v4~="pages_services"]) .bc-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
:where(body[data-v4~="pages_services"]) .bc>.bd,:where(body[data-v4~="pages_services"]) .bc>h3{margin-top:auto}
/* card copy: always visible (title 21, body 15) */
:where(body[data-v4~="pages_services"]) .bd{display:grid;gap:9px}
:where(body[data-v4~="pages_services"]) .bd-b{display:grid;gap:9px;font-size:15px;line-height:1.75}
:where(body[data-v4~="pages_services"]) .bd-b b{display:block;font-size:12px;line-height:1.6;color:var(--muted);font-weight:500}
:where(body[data-v4~="pages_services"]) .open{display:grid;gap:6px;font-size:15px;line-height:1.75}
:where(body[data-v4~="pages_services"]) .open b{color:var(--ink);font-weight:500;margin-right:9px}
:where(body[data-v4~="pages_services"]) .cmp .open,:where(body[data-v4~="pages_services"]) .num-card .open{margin-top:9px;padding-top:12px;border-top:1px solid rgba(20,18,16,.1)}
:where(body[data-v4~="pages_services"]) .t-org .open{border-color:rgba(255,255,255,.35)}
:where(body[data-v4~="pages_services"]) .step-card{gap:24px}
:where(body[data-v4~="pages_services"]) .step-card .sn{font:500 clamp(39px,3.6vw,57px)/1 var(--latin);color:var(--orange)}
/* number card */
:where(body[data-v4~="pages_services"]) .num-card{justify-content:flex-end;gap:12px}
:where(body[data-v4~="pages_services"]) .kv{font:500 clamp(48px,5.4vw,84px)/1 var(--latin);color:var(--ink);font-variant-numeric:tabular-nums}
:where(body[data-v4~="pages_services"]) .kv small{font-size:.33em;margin-left:6px;font-weight:500}
:where(body[data-v4~="pages_services"]) .kv small.pre{margin:0 9px 0 0;font-family:var(--font)}
:where(body[data-v4~="pages_services"]) .kv.sm{font-size:clamp(27px,2.7vw,39px);line-height:1.25}
:where(body[data-v4~="pages_services"]) .kl{font-size:15px;line-height:1.6;color:var(--ink);font-weight:500}
:where(body[data-v4~="pages_services"]) .ks{font-size:12px;line-height:1.6;color:var(--muted)}
:where(body[data-v4~="pages_services"]) .cmp{min-height:300px;justify-content:space-between}

/* illustration card */
:where(body[data-v4~="pages_services"]) .ill-card{padding:36px;align-items:center;justify-content:center}
:where(body[data-v4~="pages_services"]) .ill-card svg{width:100%;height:auto;max-height:480px}
:where(body[data-v4~="pages_services"]) .ill-card.wide{min-height:0}:where(body[data-v4~="pages_services"]) .ill-card.wide svg{max-height:420px;width:auto;max-width:100%}
:where(body[data-v4~="pages_services"]) .case-ill{height:189px;display:flex;align-items:center;justify-content:center}
:where(body[data-v4~="pages_services"]) .case-ill svg{max-height:189px;width:auto;max-width:100%}

/* titles-only sequence: nodes on one orange dashed flow */
:where(body[data-v4~="pages_services"]) .chain-card{min-height:0;padding:39px 30px}
:where(body[data-v4~="pages_services"]) .chain{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr))}
:where(body[data-v4~="pages_services"]) .chain li{position:relative;display:grid;gap:15px;justify-items:start;align-content:start;padding-right:12px}
:where(body[data-v4~="pages_services"]) .chain li::after{content:"";position:absolute;left:0;right:0;top:21px;border-top:1.5px dashed var(--orange);z-index:0}
:where(body[data-v4~="pages_services"]) .chain li:last-child::after{right:auto;width:21px}
:where(body[data-v4~="pages_services"]) .chain .n,:where(body[data-v4~="pages_services"]) .chain .ic{position:relative;z-index:1;width:42px;height:42px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1px var(--ink);display:grid;place-items:center;font:500 12px/1 var(--latin);color:var(--ink)}
:where(body[data-v4~="pages_services"]) .chain .ic{padding:9px;box-sizing:border-box;--ic-bg:#fff}
:where(body[data-v4~="pages_services"]) .chain b{font-weight:500;font-size:18px;line-height:1.45;color:var(--ink)}
:where(body[data-v4~="pages_services"]) .chain p{font-size:15px;line-height:1.7;padding-right:12px}
:where(body[data-v4~="pages_services"]) .chain .chip{height:24px;font-size:12px}

/* three-step concept flow */
:where(body[data-v4~="pages_services"]) .flow-card{min-height:0}
:where(body[data-v4~="pages_services"]) .flow3{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--col-gap)}
:where(body[data-v4~="pages_services"]) .flow3 li{display:grid;gap:9px;align-content:start;position:relative;padding-right:24px}
:where(body[data-v4~="pages_services"]) .flow3 li+li::before{content:"";position:absolute;left:-18px;top:3px;width:9px;height:9px;border-top:1.5px solid var(--orange);border-right:1.5px solid var(--orange);transform:rotate(45deg)}
:where(body[data-v4~="pages_services"]) .flow3 .n{font:500 12px/1 var(--latin);color:var(--orange)}
:where(body[data-v4~="pages_services"]) .flow3 b{font-weight:500;font-size:21px;color:var(--ink)}
:where(body[data-v4~="pages_services"]) .flow3 span:last-child{font-size:15px}

/* spec sheet */
:where(body[data-v4~="pages_services"]) .spec-card{min-height:0;gap:30px}
:where(body[data-v4~="pages_services"]) .spec-hi{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--col-gap)}
:where(body[data-v4~="pages_services"]) .spec-hi>div{display:grid;gap:9px;align-content:start}
:where(body[data-v4~="pages_services"]) .sl{font-size:12px;color:var(--muted);font-weight:500}
:where(body[data-v4~="pages_services"]) .sv{font:500 clamp(21px,2.1vw,30px)/1.35 var(--latin);color:var(--ink)}
:where(body[data-v4~="pages_services"]) .spec-more{max-width:none}

/* bars (execution time) */
:where(body[data-v4~="pages_services"]) .bars-card{min-height:0}
:where(body[data-v4~="pages_services"]) .bars-cap,:where(body[data-v4~="pages_services"]) .bars li{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr) minmax(0,1fr);gap:var(--col-gap);align-items:center}
:where(body[data-v4~="pages_services"]) .bars-cap{font-size:12px;color:var(--muted);font-weight:500}
:where(body[data-v4~="pages_services"]) .bars-cap span:last-child{text-align:right}
:where(body[data-v4~="pages_services"]) .bars{list-style:none;margin:0;padding:0}
:where(body[data-v4~="pages_services"]) .bars li{padding:21px 0;border-top:1px solid var(--line)}
:where(body[data-v4~="pages_services"]) .bars li:first-child{margin-top:12px}
:where(body[data-v4~="pages_services"]) .bl{font-size:15px}:where(body[data-v4~="pages_services"]) .bl b{display:block;color:var(--ink);font-weight:500;font-size:18px}
:where(body[data-v4~="pages_services"]) .bar{height:12px;border-radius:12px;background:var(--warm);overflow:hidden}
:where(body[data-v4~="pages_services"]) .bar i{display:block;height:100%;border-radius:12px;background:var(--orange)}
:where(body[data-v4~="pages_services"]) .bars li:not(:first-child) .bar i{background:var(--ink)}
:where(body[data-v4~="pages_services"]) .bt{font:500 21px/1.2 var(--latin);color:var(--ink);text-align:right;white-space:nowrap}

/* ---------- service cards + draggable rail ---------- */
:where(body[data-v4~="pages_services"]) .svc{position:relative;border-radius:24px;padding:30px;display:flex;flex-direction:column;gap:12px;min-height:420px;color:var(--body);transition:background-color .2s ease}
:where(body[data-v4~="pages_services"]) .svc h3{font-size:clamp(24px,2.1vw,30px);line-height:1.3}
:where(body[data-v4~="pages_services"]) .svc>p{font-size:15px;line-height:1.7;max-width:22em}
:where(body[data-v4~="pages_services"]) .svc-b{margin-top:auto;display:flex;justify-content:space-between;align-items:flex-end;gap:12px}
:where(body[data-v4~="pages_services"]) .svc-n{display:grid;gap:6px;justify-items:start}
:where(body[data-v4~="pages_services"]) .svc .kv{font-size:clamp(39px,3.6vw,57px)}
:where(body[data-v4~="pages_services"]) .svc-n .u{margin-top:9px}
:where(body[data-v4~="pages_services"]) .svc .chip{align-self:flex-start;background:#fff;height:27px}
:where(body[data-v4~="pages_services"]) .svc.t-line .chip{background:var(--warm)}
:where(body[data-v4~="pages_services"]) .u{font-size:15px;font-weight:500;color:var(--ink);border-bottom:1px solid currentColor;padding-bottom:2px}
:where(body[data-v4~="pages_services"]) .arr{flex:none;width:48px;height:48px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;transition:background-color .2s ease,transform .2s ease}
:where(body[data-v4~="pages_services"]) .arr svg{width:15px;height:15px}
@media (hover:hover) and (pointer:fine){:where(body[data-v4~="pages_services"]) .svc:hover .arr,:where(body[data-v4~="pages_services"]) a.bc:hover .arr,:where(body[data-v4~="pages_services"]) .svc-l:hover .arr{background:var(--orange)}:where(body[data-v4~="pages_services"]) .svc:hover .u,:where(body[data-v4~="pages_services"]) .svc-l:hover .u{color:var(--orange)}}
:where(body[data-v4~="pages_services"]) .svc-l{display:inline-flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;align-self:stretch}
:where(body[data-v4~="pages_services"]) a.svc:active,:where(body[data-v4~="pages_services"]) a.bc:active{transform:scale(.99)}
:where(body[data-v4~="pages_services"]) .rail-w{position:relative}
:where(body[data-v4~="pages_services"]) .rail{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 11*var(--col-gap))/12*4 + 3*var(--col-gap));gap:var(--col-gap);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;cursor:grab}
:where(body[data-v4~="pages_services"]) .rail::-webkit-scrollbar{display:none}
:where(body[data-v4~="pages_services"]) .rail.drag{cursor:grabbing;scroll-snap-type:none;user-select:none}
:where(body[data-v4~="pages_services"]) .rail.drag a{pointer-events:none}
:where(body[data-v4~="pages_services"]) .rail>.svc{scroll-snap-align:start}
:where(body[data-v4~="pages_services"]) .rail-c{display:flex;gap:12px;justify-content:flex-end;margin-top:24px}
:where(body[data-v4~="pages_services"]) .rb{width:48px;height:48px;border-radius:50%;border:1px solid var(--ink);background:#fff;color:var(--ink);cursor:pointer;display:grid;place-items:center;transition:background-color .15s ease,color .15s ease,opacity .15s ease}
:where(body[data-v4~="pages_services"]) .rb svg{width:15px;height:15px}:where(body[data-v4~="pages_services"]) .rb[data-dir="-1"] svg{transform:rotate(180deg)}
:where(body[data-v4~="pages_services"]) .rb:hover{background:var(--ink);color:#fff}:where(body[data-v4~="pages_services"]) .rb:disabled{opacity:.3;cursor:default;background:#fff;color:var(--ink)}
:where(body[data-v4~="pages_services"]) .rail-w.fits .rail-c{display:none}
:where(body[data-v4~="pages_services"]) .rel .svc{min-height:360px}

/* category groups: chip label + v1 line + rail */
:where(body[data-v4~="pages_services"]) .cat+.cat{margin-top:57px}
:where(body[data-v4~="pages_services"]) .cat-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:9px 18px;margin-bottom:24px}
:where(body[data-v4~="pages_services"]) .chip.on{background:var(--orange);color:#fff;height:33px;padding:0 15px;font-size:15px}
:where(body[data-v4~="pages_services"]) .cat-p{font-size:15px;line-height:1.8;max-width:48em;margin:0}
:where(body[data-v4~="pages_services"]) .cat-p b{color:var(--ink);font-weight:500;margin-right:9px}

/* brand / path cards */
:where(body[data-v4~="pages_services"]) .brand-card{gap:9px}
:where(body[data-v4~="pages_services"]) .brand-ill{height:240px;display:flex;align-items:center;justify-content:center;margin-bottom:15px}
:where(body[data-v4~="pages_services"]) .brand-ill svg{max-height:240px;width:auto;max-width:100%}
:where(body[data-v4~="pages_services"]) .brand-card .n{font:500 12px/1 var(--latin);color:var(--muted)}
:where(body[data-v4~="pages_services"]) .bname{font:500 clamp(27px,2.6vw,36px)/1.2 var(--latin);color:var(--ink)}
:where(body[data-v4~="pages_services"]) .brole{font-size:15px;color:var(--orange-t,#B94016);font-weight:500;margin-bottom:9px}
:where(body[data-v4~="pages_services"]) .brand-card .open{margin-bottom:15px}
:where(body[data-v4~="pages_services"]) a.path{min-height:360px}
:where(body[data-v4~="pages_services"]) a.path h3.big{font-size:clamp(27px,2.6vw,36px);line-height:1.25;margin-top:auto}
:where(body[data-v4~="pages_services"]) a.path p{max-width:30em}
:where(body[data-v4~="pages_services"]) .hero-kpi{display:flex;flex-wrap:wrap;gap:9px 27px;font-size:15px;color:var(--body)}
:where(body[data-v4~="pages_services"]) .hero-kpi b{font:500 27px/1 var(--latin);color:var(--ink);margin-right:6px}

/* faq split */
:where(body[data-v4~="pages_services"]) .faq-split .faq-h{display:grid;gap:18px}

/* ---------- responsive ---------- */
@media (max-width:1101px){
 :where(body[data-v4~="pages_services"]) .bento>.span-3{grid-column:span 6}
 :where(body[data-v4~="pages_services"]) .bento>.span-4{grid-column:span 6}
 :where(body[data-v4~="pages_services"]) .bento>.span-4:last-child:nth-child(odd){grid-column:1/-1}
 :where(body[data-v4~="pages_services"]) .bento>.span-6.r2,:where(body[data-v4~="pages_services"]) .bento>.flip{grid-column:1/-1;grid-row:auto}
 :where(body[data-v4~="pages_services"]) .bento>.tall{grid-row:auto}
 :where(body[data-v4~="pages_services"]) .ill-card svg{max-height:390px}
 :where(body[data-v4~="pages_services"]) .rail{grid-auto-columns:calc((100% - var(--col-gap))/2.2)}
 :where(body[data-v4~="pages_services"]) .chain{grid-template-columns:repeat(4,minmax(0,1fr));row-gap:30px}
}
@media (max-width:759px){
 :where(body[data-v4~="pages_services"]) .bento>*{grid-column:1/-1!important}
 :where(body[data-v4~="pages_services"]) .bento>.num-card{grid-column:span 6!important}
 :where(body[data-v4~="pages_services"]) .bento>.num-card:last-child:nth-child(odd),:where(body[data-v4~="pages_services"]) .bento>.cmp{grid-column:1/-1!important}
 :where(body[data-v4~="pages_services"]) .bc{padding:24px;min-height:0;gap:15px}
 :where(body[data-v4~="pages_services"]) .num-card{min-height:180px}
 :where(body[data-v4~="pages_services"]) .bc .ic{width:39px;height:39px}
 :where(body[data-v4~="pages_services"]) .bc h3{font-size:18px}
 :where(body[data-v4~="pages_services"]) .kv{font-size:45px}
 :where(body[data-v4~="pages_services"]) .ill-card{padding:21px}:where(body[data-v4~="pages_services"]) .ill-card svg{max-height:270px}
 :where(body[data-v4~="pages_services"]) .chain{grid-template-columns:1fr;row-gap:0}
 :where(body[data-v4~="pages_services"]) .chain li{grid-template-columns:42px minmax(0,1fr);align-items:center;gap:15px;padding:9px 0}
 :where(body[data-v4~="pages_services"]) .chain li::after{left:21px;right:auto;top:0;bottom:0;width:0;border-top:0;border-left:1.5px dashed var(--orange)}
 :where(body[data-v4~="pages_services"]) .chain li:first-child::after{top:30px}:where(body[data-v4~="pages_services"]) .chain li:last-child::after{bottom:auto;height:30px;width:0}
 :where(body[data-v4~="pages_services"]) .chain .chip{grid-column:2}
 :where(body[data-v4~="pages_services"]) .chain b{font-size:15px}
 :where(body[data-v4~="pages_services"]) .flow3{grid-template-columns:1fr;gap:21px}:where(body[data-v4~="pages_services"]) .flow3 li+li::before{display:none}
 :where(body[data-v4~="pages_services"]) .spec-hi{grid-template-columns:1fr;gap:18px}
 :where(body[data-v4~="pages_services"]) .bars-cap{display:none}
 :where(body[data-v4~="pages_services"]) .bars li{grid-template-columns:minmax(0,1fr) auto;gap:9px 15px}:where(body[data-v4~="pages_services"]) .bars .bar{grid-column:1/-1;grid-row:2}
 :where(body[data-v4~="pages_services"]) .rail{grid-auto-columns:84%}
 :where(body[data-v4~="pages_services"]) .svc{min-height:360px;padding:24px}
 :where(body[data-v4~="pages_services"]) .brand-ill{height:189px}:where(body[data-v4~="pages_services"]) .brand-ill svg{max-height:189px}
 :where(body[data-v4~="pages_services"]) .case-ill{height:150px}:where(body[data-v4~="pages_services"]) .case-ill svg{max-height:150px}
 :where(body[data-v4~="pages_services"]) .rail-c{display:none}
}
/* line breaking: headings keep phrases whole on desktop (wbr hints in markup); phones fall back to normal CJK breaking */
@media (max-width:759px){:where(body[data-v4~="pages_services"]) main .h1,:where(body[data-v4~="pages_services"]) main .h2,:where(body[data-v4~="pages_services"]) main h3,:where(body[data-v4~="pages_services"]) main .cta h2,:where(body[data-v4~="pages_services"]) main summary{overflow-wrap:anywhere}}
:where(body[data-v4~="pages_services"]) .faq summary,:where(body[data-v4~="pages_services"]) .kl,:where(body[data-v4~="pages_services"]) .ks,:where(body[data-v4~="pages_services"]) .bd-b p,:where(body[data-v4~="pages_services"]) .svc>p{text-wrap:pretty}

:where(body[data-v4~="pages_services"]) *,:where(body[data-v4~="pages_services"]) *::before,:where(body[data-v4~="pages_services"]) *::after{letter-spacing:0!important}
:where(body[data-v4~="pages_services"]) .faq-split{align-items:start}
/* v2.4.1 fixes */
:where(body[data-v4~="pages_services"]) .faq-split>.stick{align-self:start}
:where(body[data-v4~="pages_services"]) .chain li:first-child::after{left:21px}
:where(body[data-v4~="pages_services"]) main :is(.h1,.h2,h3,.lead,p,summary,b){overflow-wrap:anywhere}
:where(body[data-v4~="pages_services"]) .bc.span-6 .ic,:where(body[data-v4~="pages_services"]) .bc.span-8 .ic{width:57px;height:57px}
:where(body[data-v4~="pages_services"]) .bc.span-6>.bd h3,:where(body[data-v4~="pages_services"]) .bc.span-8>.bd h3{font-size:24px}
/* v2.4.2 · copy always open: titles align across a row (content from the top) */
:where(body[data-v4~="pages_services"]) .bc>.bd{margin-top:18px}
:where(body[data-v4~="pages_services"]) .ic-card{gap:0}
:where(body[data-v4~="pages_services"]) .ic-card .bc-top+.bd,:where(body[data-v4~="pages_services"]) .ic-card .bc-top+h3{margin-top:39px}
:where(body[data-v4~="pages_services"]) .num-card>.open{margin-top:12px}
:where(body[data-v4~="pages_services"]) .cat-legend{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--col-gap);margin-bottom:39px}
:where(body[data-v4~="pages_services"]) .cat-legend>div{display:grid;gap:12px;align-content:start;justify-items:start}
:where(body[data-v4~="pages_services"]) .cat-legend .span-3{grid-column:span 3}:where(body[data-v4~="pages_services"]) .cat-legend .span-4{grid-column:span 4}:where(body[data-v4~="pages_services"]) .cat-legend .span-6{grid-column:span 6}:where(body[data-v4~="pages_services"]) .cat-legend .span-12{grid-column:1/-1}
@media (max-width:981px){:where(body[data-v4~="pages_services"]) .cat-legend>div{grid-column:1/-1!important}}
