/* MS Facility Solutions — v67 (11/09/2026): process steps as drawn scenes, vendor-file scenes, platform logos, brand slider. Loads last. */
/* process steps */
.v2-flow-row.v67-row{gap:18px;max-width:1240px;align-items:stretch}
.v2-flow-row.v67-row:before,.v2-flow-row.v67-row:after{display:none}
.v2-flow-row.v67-row.n4{grid-template-columns:repeat(4,1fr)}
.v2-flow-row.v67-row.n5{grid-template-columns:repeat(5,1fr)}
.v2-flow-step.v67-step{text-align:left;display:flex;flex-direction:column;overflow:visible!important}
body .v2-flow-step .dot.v67-dot,body.h9 .v2-flow-step .dot.v67-dot,body.h9 .v2-flow-step.on .dot.v67-dot{width:auto!important;height:auto!important;border-radius:16px!important;border:0!important;background:none!important;box-shadow:none!important;transform:none!important;margin:10px 0 16px!important;padding:0!important;display:block!important;position:relative;color:inherit;font:inherit}
.v67-dot .il-wrap{transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .4s}
.v67-step.on .v67-dot .il-wrap{border-color:rgba(91,147,232,.75);box-shadow:0 22px 44px -22px rgba(47,111,209,.7);transform:translateY(-3px)}
.v67-dot em{position:absolute;left:12px;top:-10px;z-index:2;font:800 .74rem/1 var(--head);font-style:normal;letter-spacing:.06em;color:#fff;background:var(--v2-grad);padding:6px 10px;border-radius:999px;box-shadow:0 8px 18px -8px rgba(47,111,209,.8),inset 0 0 0 1px rgba(255,255,255,.18)}
.v67-step:not(:last-child):after{content:"";position:absolute;z-index:3;right:-13px;top:var(--arr,74px);width:8px;height:8px;margin-top:-4px;border-top:2.5px solid var(--accent);border-right:2.5px solid var(--accent);transform:rotate(45deg);opacity:.7}
.v67-step time{margin-top:0}
.v67-step b{margin-top:4px}
@media(max-width:1100px){.v2-flow-row.v67-row.n5,.v2-flow-row.v67-row.n4{grid-template-columns:repeat(2,1fr);gap:26px 18px}.v67-step:after{display:none!important}}
@media(max-width:620px){
  .v2-flow-row.v67-row.n5,.v2-flow-row.v67-row.n4{grid-template-columns:1fr;gap:18px}
  .v2-flow-step.v67-step{display:grid;grid-template-columns:136px 1fr;column-gap:14px;align-items:start}
  body.h9 .v2-flow-step .dot.v67-dot,body .v2-flow-step .dot.v67-dot{grid-row:1/span 3;margin:0!important}
  .v67-dot em{left:8px;top:-8px;padding:4px 7px;font-size:.66rem}
  .v67-step p{margin-top:4px}
}
/* vendor-file cards */
.v57-doc.v67-doc{padding:12px 12px 22px}
.v67-doc .il-wrap{margin-bottom:8px}
.v67-doc>b,.v67-doc>span,.v67-doc>em{margin-left:12px;margin-right:12px}
.v67-doc:hover .il-wrap{border-color:rgba(91,147,232,.6)}
/* platform logos */
.b2b-proc .logos.v67-logos div,.v67-logos>div{background:#fff;min-height:118px;gap:9px;padding:22px 18px;border-color:var(--line)}
.v67-logos img{display:block;width:auto;height:auto;max-width:158px;max-height:38px;object-fit:contain}
.v67-logos .sap{display:flex;align-items:center;gap:9px}
.v67-logos .sap img{max-height:34px}
.v67-logos .sap b{font:800 1.3rem/1 var(--head);letter-spacing:-.02em;color:#0a1f44}
.b2b-proc .logos.v67-logos small,.v67-logos small{color:#6b7787;font-size:.7rem;font-weight:600;letter-spacing:.02em}
[data-theme="dark"] .b2b-proc .logos.v67-logos div,[data-theme="dark"] .v67-logos>div{background:#eef1f6;border-color:transparent}
/* brand slider: exact loop (cell+margin = one period), compositor-only, no hover lift on moving cells */
.bm-track{gap:0!important;animation-name:bm67!important;transform:translate3d(0,0,0);backface-visibility:hidden;-webkit-backface-visibility:hidden}
.bm-cell{margin-right:14px;transition:box-shadow .25s,border-color .25s!important}
.bm-cell:hover{transform:none!important}
.bm-cell img{backface-visibility:hidden}
@keyframes bm67{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
@media(max-width:620px){.bm-cell{margin-right:10px}}
@media (prefers-reduced-motion: reduce){.bm-track{animation:none!important;transform:none}}
.v67-logos img[alt="SupplierGATEWAY"]{max-width:190px}
.bm-cell{padding:12px 16px!important}
.bm-cell img{max-width:150px!important;max-height:64px!important;object-fit:contain}
@media(max-width:620px){.bm-cell{padding:10px 12px!important}.bm-cell img{width:auto!important;height:auto!important;max-width:112px!important;max-height:50px!important}}
/* door problems auto-play: a thin progress line on the active problem */
.dx-opt{position:relative;overflow:hidden}
.dx-opt.dx-run:before{content:"";position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--v2-grad,linear-gradient(90deg,#3b7de0,#7aa8ff));transform-origin:left;animation:dx67 3.6s linear forwards}
@keyframes dx67{from{transform:scaleX(0)}to{transform:scaleX(1)}}
/* homepage coverage card: map runs full height and fades into the copy side, no hard seam */
body.h9 .cov-card{align-items:stretch}
body.h9 .cov-card .cov-copy{z-index:2}
body.h9 .cov-card .cov-map{height:auto!important;align-self:stretch;z-index:0;background:transparent!important}
@media(min-width:961px){
  body.h9 .cov-card .cov-map{margin-left:-110px;-webkit-mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.4) 12%,#000 26%);mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.4) 12%,#000 26%)}
}
@media(max-width:960px){
  body.h9 .cov-card .cov-map{height:400px!important;margin-top:-50px;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 22%);mask-image:linear-gradient(180deg,transparent 0,#000 22%)}
}
/* v67.4 brand slider: no mask on the moving strip (masks repaint every frame and stutter); fades are fixed overlays instead */
.brand-marquee{-webkit-mask-image:none!important;mask-image:none!important;position:relative;background:transparent!important;isolation:isolate;border:0!important;border-radius:0!important;box-shadow:none!important}
.brand-marquee:before,.brand-marquee:after{content:"";position:absolute;top:0;bottom:0;width:110px;z-index:2;pointer-events:none}
.brand-marquee:before{left:0;background:linear-gradient(90deg,#f5f7fb,rgba(245,247,251,0))}
.brand-marquee:after{right:0;background:linear-gradient(270deg,#f5f7fb,rgba(245,247,251,0))}
:root[data-theme="dark"] .brand-marquee:before{background:linear-gradient(90deg,#0b1017,rgba(11,16,23,0))}
:root[data-theme="dark"] .brand-marquee:after{background:linear-gradient(270deg,#0b1017,rgba(11,16,23,0))}
.bm-track{will-change:transform;animation-duration:60s!important}
.bm-cell{box-shadow:none!important;transition:none!important;contain:paint}
.bm-cell.spot:before,.bm-cell.spot:after{display:none!important}
@media(max-width:620px){.brand-marquee:before,.brand-marquee:after{width:40px}.bm-track{animation-duration:45s!important}}
/* v67.4 additional services: scene cards */
body.h9 .mini.v67-mini a{flex-direction:column;align-items:stretch;gap:12px;padding:12px 12px 18px}
body.h9 .mini.v67-mini a>span:last-child{padding:0 8px}
body.h9 .mini.v67-mini .il-wrap{display:block}
body.h9 .mini.v67-mini a:hover .il-wrap{border-color:rgba(91,147,232,.6)}
/* v67.5 pause animations in sections that are off screen */
.v67-off,.v67-off *,.v67-off *:before,.v67-off *:after{animation-play-state:paused!important}
.bm-track{transform:translateZ(0)}
/* v67.5 call button pulse: transform + opacity (no box-shadow repaint every frame) */
.msf-fab .msf-fab-ring{animation:msf67ring 2.4s ease-out infinite;box-shadow:none!important;border:2px solid rgba(31,157,87,.55);will-change:transform,opacity}
@keyframes msf67ring{0%{transform:scale(1);opacity:.9}70%{transform:scale(1.45);opacity:0}100%{transform:scale(1.45);opacity:0}}
@media (prefers-reduced-motion: reduce){.msf-fab .msf-fab-ring{animation:none}}
/* v67.6 brand strip is moved by script (frame-locked), not by a CSS animation */
.bm-track.bm-js{animation:none!important;will-change:transform}
/* v67.7 "first call to a door that works": dark stage with glow, a scene per step */
body.h9 .v67-job .v2-jobgrid{background:radial-gradient(70% 90% at 0% 0%,rgba(47,111,209,.42),transparent 60%),radial-gradient(60% 80% at 100% 100%,rgba(34,179,214,.22),transparent 60%),linear-gradient(160deg,#121a28,#0b1017);border:0;color:#fff;box-shadow:0 40px 90px -40px rgba(11,16,23,.55);position:relative;overflow:hidden;grid-template-areas:"ph st" "ph ch";grid-template-rows:1fr auto;row-gap:22px}
body.h9 .v67-job .v2-jobgrid:before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.07) 1px,transparent 1px);background-size:18px 18px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 40%);mask-image:linear-gradient(90deg,transparent,#000 40%);pointer-events:none}
body.h9 .v67-job .dv-phone{grid-area:ph;position:relative;z-index:1;filter:drop-shadow(0 30px 50px rgba(47,111,209,.35))}
body.h9 .v67-job .v2-steps{grid-area:st;position:relative;z-index:1;display:grid;gap:8px}
body.h9 .v67-job .jt67-chips{grid-area:ch;position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:8px}
body.h9 .v67-job .jt67-chips span{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:#d6e2f5;font:600 .8rem var(--head)}
body.h9 .v67-job .jt67-chips i{width:8px;height:8px;border-radius:50%;background:#57d38c;box-shadow:0 0 0 4px rgba(87,211,140,.18)}
body.h9 .v67-job .v2-steps:before{background:rgba(255,255,255,.12)}
body.h9 .v67-job .v2-steps:after{content:"";position:absolute;left:11px;top:14px;width:2px;height:var(--prog,0%);background:linear-gradient(180deg,#5b93e8,#22b3d6);box-shadow:0 0 12px rgba(91,147,232,.8);transition:height .9s var(--ease)}
body.h9 .v67-job .v2-steps li{display:grid;grid-template-columns:132px 1fr;gap:16px;align-items:center;padding:10px 14px 10px 44px;border:1px solid transparent;border-radius:18px;transition:background .4s,border-color .4s,transform .4s var(--ease)}
body.h9 .v67-job .v2-steps li:before{background:#0b1017;border-color:rgba(255,255,255,.22)}
body.h9 .v67-job .v2-steps li.on,body.h9 .v67-job .v2-steps li:hover{background:rgba(255,255,255,.06);border-color:rgba(124,166,240,.35)}
body.h9 .v67-job .v2-steps li.on{transform:translateX(6px);box-shadow:0 18px 40px -24px rgba(47,111,209,.9)}
body.h9 .v67-job .v2-steps li.on:before{border-color:#7aa8ff;background:#5b93e8;box-shadow:0 0 0 6px rgba(91,147,232,.25),0 0 18px rgba(91,147,232,.8)}
body.h9 .v67-job .jt67{display:block;border-radius:12px;opacity:.55;filter:saturate(.7);transition:opacity .4s,filter .4s,transform .4s var(--ease),border-color .4s}
body.h9 .v67-job li.on .jt67,body.h9 .v67-job li:hover .jt67{opacity:1;filter:none;border-color:rgba(124,166,240,.6)}
body.h9 .v67-job li.on .jt67{transform:scale(1.04)}
body.h9 .v67-job .v2-steps time{color:#8fa3bd}
body.h9 .v67-job .v2-steps li.on time{color:#9fc4ff}
body.h9 .v67-job .v2-steps b{color:#fff}
body.h9 .v67-job .v2-steps p{color:#aebbd0}
@media(max-width:960px){body.h9 .v67-job .v2-jobgrid{grid-template-areas:"ph" "st" "ch";grid-template-rows:auto;padding:28px 18px}}
@media(max-width:620px){body.h9 .v67-job .v2-steps li{grid-template-columns:1fr;gap:10px;padding:12px 12px 12px 40px}body.h9 .v67-job .jt67{max-width:240px}body.h9 .v67-job .v2-jobgrid{padding:22px 12px}}
/* v67.10 state silhouettes (left) + big abbreviation (right) */
a:has(>.sh67),span:has(>.sh67){display:flex!important;align-items:center;gap:12px}
.sh67{flex:none!important;width:36px!important;height:36px!important;margin:0!important;display:grid;place-items:center;font-style:normal}
.sh67 svg{width:36px!important;height:36px!important;min-width:36px;display:block!important;opacity:1!important;fill:var(--c);stroke:rgba(255,255,255,.9);stroke-width:1.1;stroke-linejoin:round;paint-order:stroke;filter:drop-shadow(0 3px 5px rgba(15,23,42,.22));transition:transform .3s var(--ease)}
a:hover>.sh67 svg{transform:scale(1.12) rotate(-3deg)}
.st67{margin-left:auto;flex:none;font:800 1.02rem/1 var(--head);font-style:normal;letter-spacing:.06em;color:color-mix(in srgb,var(--c) 72%,#0b1017);background:color-mix(in srgb,var(--c) 13%,transparent);border:1px solid color-mix(in srgb,var(--c) 30%,transparent);padding:7px 9px;border-radius:10px;min-width:44px;text-align:center}
.nm67{font-weight:inherit}
:root[data-theme="dark"] .st67{background:color-mix(in srgb,var(--c) 22%,transparent)}
:root[data-theme="dark"] .st67{color:color-mix(in srgb,var(--c) 70%,#fff)}
/* v67.11 value cards with scenes */
.b2b-card.v67-card{padding:12px 12px 24px!important;display:flex;flex-direction:column;gap:8px}
.b2b-card.v67-card>.il-wrap{display:block;margin-bottom:8px}
.b2b-card.v67-card>.ey,.b2b-card.v67-card>h3,.b2b-card.v67-card>p{margin-left:12px;margin-right:12px}
.b2b-card.v67-card:before,.b2b-card.v67-card:after{display:none!important}
.b2b-card.v67-card:hover>.il-wrap{border-color:rgba(91,147,232,.6)}
.b2b-card p a svg,.b2b-card a>svg:not(.il),.v57-doc a svg{width:14px!important;height:14px!important;display:inline-block!important;vertical-align:-2px;margin-left:2px}
/* v67.12 state cloud as state tiles */
.b2b-statecloud:has(.sc67){display:grid!important;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}
.b2b-statecloud a.sc67{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:14px;background:var(--card);border:1px solid var(--line);color:var(--ink);text-decoration:none;font-weight:600;transition:transform .25s var(--ease),box-shadow .25s,border-color .25s}
.b2b-statecloud a.sc67:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:var(--line-2)}
:root[data-theme="dark"] .b2b-statecloud a.sc67{background:#121a26;border-color:#232d3b;color:#fff}
/* v67.13 city lists grouped by state */
.cg67{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;align-items:start}
.cg67-st{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px 16px 14px;box-shadow:var(--shadow-xs);position:relative;overflow:hidden}
.cg67-st:before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:var(--c)}
.cg67-st h3{display:flex;align-items:center;gap:12px;margin:0 0 12px;font:800 1.08rem/1.2 var(--head);letter-spacing:-.01em;color:var(--ink)}
.cg67-st h3 .sh67,.cg67-st h3 .sh67 svg{width:44px!important;height:44px!important}
.cg67-st h3 small{display:block;font:600 .72rem var(--body);color:var(--soft);letter-spacing:.02em;margin-top:3px}
.cg67-st h3 span{display:flex;flex-direction:column}
.cg67-st h3 em.st67{font-size:1.1rem}
.cg67-grid{display:flex;flex-wrap:wrap;gap:6px}
.cg67-grid a{display:inline-flex;align-items:center;padding:7px 11px;border-radius:999px;background:color-mix(in srgb,var(--c) 8%,var(--card));border:1px solid color-mix(in srgb,var(--c) 22%,transparent);color:var(--ink);font-size:.88rem;font-weight:600;text-decoration:none;transition:background .2s,transform .2s}
.cg67-grid a:hover{background:color-mix(in srgb,var(--c) 18%,var(--card));transform:translateY(-2px)}
:root[data-theme="dark"] .cg67-st{background:#121a26;border-color:#232d3b}
:root[data-theme="dark"] .cg67-grid a{color:#e8eef7}
.cg67{display:block!important;columns:3 300px;column-gap:16px}.cg67-st{break-inside:avoid;display:block;margin:0 0 16px}
/* v67.14 scene cards on Guarantee / Case studies / Sustainability / FAQ / Contact */
.ph.v67-ph{position:relative;padding:12px 12px 0;background:none!important;aspect-ratio:auto!important;height:auto!important}
.ph.v67-ph .il-wrap{display:block}
.ph.v67-ph .pill{position:absolute;right:20px;top:20px;z-index:2}
.fcard.v67-fcard{padding:12px 12px 22px!important}
.fcard.v67-fcard .il-wrap{display:block;margin-bottom:14px}
.fcard.v67-fcard>h3,.fcard.v67-fcard>p{margin-left:10px;margin-right:10px}
.qa.v67-qa{padding:12px 12px 20px!important;display:flex;flex-direction:column}
.qa.v67-qa .il-wrap{display:block;margin-bottom:14px}
.qa.v67-qa>h3,.qa.v67-qa>p{margin-left:10px;margin-right:10px}
.qa-grid:has(.v67-qa){display:grid!important;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.v67-next-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.v67-next-c{background:var(--card);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow-xs);padding:12px 12px 22px;display:flex;flex-direction:column;gap:8px}
.v67-next-c .n{font:800 .74rem var(--head);letter-spacing:.12em;color:var(--accent);margin:6px 10px 0}
.v67-next-c h3,.v67-next-c p{margin:0 10px}
.v67-next-c p{color:var(--muted);font-size:.93rem}
:root[data-theme="dark"] .v67-next-c{background:#121a26;border-color:#232d3b}
@media(max-width:1000px){.v67-next-grid{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.v67-next-grid{grid-template-columns:1fr}}
.ph.v67-ph .pill{display:none!important}
/* v67.15 picture chips */
.v2-chips:has(.v67-chip){display:grid!important;grid-template-columns:repeat(3,1fr);gap:10px}
.v2-chip.v67-chip{display:flex!important;flex-direction:column;align-items:stretch;gap:8px;padding:8px 8px 10px!important;border-radius:16px!important;height:auto!important;text-align:left;white-space:normal}
.v2-chip.v67-chip .il-wrap{display:block;border-radius:11px}
.v2-chip.v67-chip b{font:700 .86rem var(--head);padding:0 4px}
.v2-chip.v67-chip:hover .il-wrap{border-color:rgba(91,147,232,.6)}
.v2-chip.v67-chip.on,.v2-chip.v67-chip.active,.v2-chip.v67-chip[aria-pressed="true"]{box-shadow:0 0 0 2px var(--accent),0 14px 30px -16px rgba(47,111,209,.7)}
@media(max-width:620px){.v2-chips:has(.v67-chip){grid-template-columns:1fr 1fr}}
/* schedule steps with scenes */
.v2-steplist li.v67-sl{display:grid!important;grid-template-columns:130px 1fr;gap:14px;align-items:center}
.v2-steplist li.v67-sl:before{display:none!important}
.v2-steplist li.v67-sl .il-wrap{display:block;border-radius:12px}
@media(max-width:620px){.v2-steplist li.v67-sl{grid-template-columns:96px 1fr}}
/* booking frame: skeleton then fade */
.wz-card.wz67{position:relative;background:linear-gradient(100deg,#eef2f7 30%,#f8fafc 50%,#eef2f7 70%);background-size:300% 100%;animation:wz67sh 1.4s linear infinite}
.wz-card.wz67 .wz-frame{opacity:0;transition:opacity .6s ease}
.wz-card.wz67.wz67-ready{animation:none;background:transparent}
.wz-card.wz67.wz67-ready .wz-frame{opacity:1}
@keyframes wz67sh{from{background-position:100% 0}to{background-position:-100% 0}}
:root[data-theme="dark"] .wz-card.wz67{background:linear-gradient(100deg,#121a26 30%,#1a2433 50%,#121a26 70%);background-size:300% 100%}
/* v67.16 live chat band + keep the chat bubble above the call button */
button[aria-label="Chat with us"]{bottom:96px!important;right:22px!important}
.v67-chatcard{display:grid;grid-template-columns:1.1fr 1fr;gap:28px;align-items:center;padding:28px;border-radius:28px;color:#fff;background:radial-gradient(70% 90% at 0% 0%,rgba(47,111,209,.45),transparent 60%),linear-gradient(160deg,#121a28,#0b1017);box-shadow:0 40px 90px -40px rgba(11,16,23,.55)}
.v67-chatcard h2{color:#fff;margin:6px 0 10px}
.v67-chatcard p{color:#b9c6d8;margin:0 0 18px}
.v67-chatcard .ey{color:#9fc4ff}
@media(max-width:860px){.v67-chatcard{grid-template-columns:1fr}}
/* v67.19 language picker */
.lg67{position:relative;display:inline-flex}
.lg67-btn{display:inline-flex;align-items:center;gap:6px;background:none;border:0;color:inherit;font:inherit;cursor:pointer;padding:0}
.lg67-btn:hover{color:var(--accent)}
.lg67-menu{display:none;position:absolute;right:0;top:calc(100% + 10px);z-index:300;min-width:200px;max-height:70vh;overflow:auto;background:var(--card,#fff);border:1px solid var(--line);border-radius:14px;box-shadow:0 20px 50px -18px rgba(15,23,42,.35);padding:6px;grid-template-columns:1fr 1fr;gap:2px}
.lg67.open .lg67-menu{display:grid}
.lg67-menu button{background:none;border:0;text-align:left;padding:8px 10px;border-radius:9px;font:600 .82rem var(--head);color:var(--ink);cursor:pointer;white-space:nowrap}
.lg67-menu button:hover{background:var(--accent-soft,#eef4ff);color:var(--accent)}
:root[data-theme="dark"] .lg67-menu{background:#121a26;border-color:#232d3b}
:root[data-theme="dark"] .lg67-menu button{color:#e8eef7}
/* Google's translator bar stays hidden; the page does not shift */
.goog-te-banner-frame,iframe.skiptranslate,#goog-gt-tt,.goog-te-balloon-frame,.VIpgJd-ZVi9od-ORHb-OEVmcd,.VIpgJd-ZVi9od-aZ2wEe-wOHMyf{display:none!important}
html.lg67-on body{top:0!important;position:static!important}
font[style*="background-color"]{background:none!important;box-shadow:none!important}