/* Collection scenarios — Figma 767:7793. */
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios{padding:110px 0 128px;background:linear-gradient(#fff 30%,#ffffffd9),url('../img/developers/background.png') center bottom/cover;}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios>.container{max-width:1300px;width:calc(100% - 64px);padding:0}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-heading{text-align:center;max-width:none;margin:0 0 48px}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-eyebrow{display:inline-flex;align-items:center;gap:8px;border:4px solid #f9fafc;border-radius:33px;padding:2px 10px;background:white;box-shadow:0 0 0 1px #e6e7e9;font-size:14px;line-height:20px;font-weight:400;letter-spacing:0;color:#495057;margin:0 0 18px}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-eyebrow:before{content:"";width:18px;height:18px;background:url('../img/collection/scenario-badge.svg') center/contain}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios h2{font-size:48px;line-height:1.2;letter-spacing:-2.4px;font-weight:400;color:#000000d9;max-width:none;margin:0 0 16px;white-space:normal}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-intro{max-width:740px;margin:0 auto;font-size:14px;line-height:25.2px;color:#000000a6}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector{display:block;border:1px solid #d3d3d6;border-radius:0;background:#ececee;margin:0 20px;padding:60px;overflow:visible}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector-controls{display:flex;flex-direction:row;justify-content:flex-start;flex-wrap:wrap;gap:2px;width:fit-content;padding:4px;background:#ffffff80;border:0;border-radius:100px;margin-bottom:24px}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector-controls[hidden]{display:none}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector-controls button{flex:none;width:auto;padding:6px 12px;border:0;border-radius:100px;font-size:14px;line-height:21px;letter-spacing:-.28px;font-weight:400;color:#1c1c1cbf;background:transparent}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector-controls button[aria-selected="true"]{color:white;background:#16171c;box-shadow:0 3px 3px #0000000d}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector-controls svg{display:none}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-scenario-panel{display:grid;grid-template-columns:25% minmax(0,1fr) 20%;gap:12px;padding:12px;border:1px solid #0000001a;border-radius:16px;background:#fff;min-height:240px;align-items:stretch;animation:collection-scenario-in .4s ease}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-scenario-panel[hidden]{display:none}
.collection-scenario-visual{position:relative;display:grid;place-items:center;min-height:214px;background:#fafbfc;border-radius:16px 0 0 16px}
.scenario-platform,.scenario-chip{position:absolute;width:138px;height:138px;border:1px solid #a1a1aa;border-radius:12px;background:#fafafa;transform:rotateX(55deg) rotateZ(45deg);box-shadow:5px 5px 0 #e4e4e7,6px 6px 0 #a1a1aa}
.scenario-platform{top:84px}
.scenario-chip{top:12px;display:grid;place-items:center;border:10px double #d4d4d8;background:#fff;box-shadow:12px 12px 0 #e4e4e7,13px 13px 0 #a1a1aa}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-panel-label{transform:rotate(-90deg);font-size:12px;line-height:1.4;color:#00000073;text-align:center;max-width:94px;margin:0;font-weight:400}
.collection-scenario-message{display:grid;align-items:center;padding:24px;background:#eaf5fa url('../img/collection/scenario-wash.svg') center/cover;border-radius:0 16px 16px 0;margin-left:-12px;min-width:0}
.collection-scenario-message>div{position:relative;transform:rotate(-4deg);padding:16px;border:10px solid white;border-radius:16px;background:#f3f5f8;box-shadow:12px 20px 0 #d3e2e9}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-scenario-panel h3{font-size:20px;line-height:1.35;color:#000000d9;font-weight:500;letter-spacing:0;margin:0 0 6px}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-detail{font-size:14px;line-height:22px;color:#00000073;margin:0}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-output{margin:0;padding:20px 16px;border:1px solid #0000001a;border-radius:16px;background:#fafbfc;display:flex;flex-direction:column;justify-content:center;gap:8px}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-output .ss-label{font-size:14px;font-weight:400;color:#667185}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-output p{font-size:16px;line-height:1.4;color:#000;margin:0}
@keyframes collection-scenario-in{from{opacity:.2;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(max-width:1100px){body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector{padding:32px;margin:0}body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios h2{font-size:38px}.collection-scenario-message{padding:16px}.scenario-platform,.scenario-chip{width:110px;height:110px}}
@media(max-width:760px){body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios{padding:64px 0}body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios>.container{width:calc(100% - 40px)}body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios h2{font-size:32px;letter-spacing:-1px}body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector{padding:16px}body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector-controls{border-radius:16px}body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-scenario-panel{grid-template-columns:1fr}.collection-scenario-visual{min-height:190px}.collection-scenario-message{margin:0;padding:24px 16px 38px;border-radius:16px}body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-output{padding:24px}}
@media(prefers-reduced-motion:reduce){body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-scenario-panel{animation:none}}

/* Figma background order: 767:7794, 774:8066, 767:7797, then content. */
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios{position:relative;isolation:isolate;background:#f5f5f5}
.collection-scenario-bg{position:absolute;inset:0;pointer-events:none}
.collection-scenario-bg-base{z-index:0;background:linear-gradient(0deg,transparent 2.8602%,white 37.776%)}
.collection-scenario-bg-base:before{content:"";position:absolute;inset:0;background:url('../img/developers/background.png') center/cover;opacity:.05;z-index:-1}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios>.container{position:relative;z-index:auto}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector{position:relative;background:none;border-color:transparent}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector:before{content:"";position:absolute;inset:-20px;z-index:1;background:url('../img/collection/scenario-layer2.svg') center/100% 100% no-repeat;pointer-events:none}
.collection-scenario-bg-lines{z-index:2;background:transparent;isolation:isolate}
.collection-scenario-bg-lines:before{content:"";position:absolute;inset:0;background:url('../../img/global-presence/texture.png') left top/16.8px 16.8px repeat;opacity:.05;z-index:0;mask-image:linear-gradient(to bottom,transparent,#000 85.294%);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 85.294%)}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-heading,
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector-controls,
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector-panels{position:relative;z-index:3}

/* Original Figma artwork with a localized label on its upper plane. */
.scenario-figma-icon{position:relative;width:196px;height:190px;flex:none}
.scenario-figma-icon>img{display:block;width:196px;height:190px}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .scenario-figma-icon .ss-panel-label{position:absolute;left:54px;top:51px;width:66px;height:58px;max-width:none;margin:0;display:flex;align-items:center;justify-content:center;transform-origin:0 0;transform:matrix(.866025,-.5,.866025,.5,0,0);font-size:11px;line-height:1.15;overflow-wrap:normal;text-align:center;color:#00000073}

/* Bottom background: Figma 767:7796, image at 5% beneath its white fade. */
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-bg-base{z-index:0;isolation:isolate;background:none}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-bg-base:before{z-index:0;background:url('../img/developers/background.png') center/cover no-repeat;opacity:.05}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-bg-base:after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(-.06024465deg,rgba(255,255,255,0) 2.8602%,#fff 37.776%);pointer-events:none}

/* Theme-blue tab feedback for pointer and keyboard interaction. */
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector-controls button{transition:background-color .25s ease,color .25s ease,box-shadow .25s ease,transform .25s ease}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector-controls button[aria-selected="true"]{background:#1177ff;color:#fff;box-shadow:0 3px 10px #1177ff26}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector-controls button:focus-visible{background:#1177ff;color:#fff;outline:2px solid #1177ff;outline-offset:3px}
@media(hover:hover){body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector-controls button:hover{background:#1177ff;color:#fff;transform:translateY(-2px);box-shadow:0 5px 14px #1177ff33}}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector-controls button:active{transform:translateY(0)}
@media(prefers-reduced-motion:reduce){body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector-controls button{transition:none;transform:none}}

/* Figma 771:8054 — original text plane, typography and wrapping. */
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .scenario-figma-icon .ss-panel-label{left:54px;top:50.9238px;width:51.848px;height:51.944px;display:block;font-family:'PingFang TC','PingFang SC',sans-serif;font-size:12px;font-weight:400;line-height:17px;letter-spacing:0;text-align:left;color:rgba(0,0,0,.45);white-space:normal;overflow-wrap:break-word;word-break:normal;transform:matrix(.866025,-.5,.866025,.5,0,0);transform-origin:0 0}

/* Figma 771:8016: pale card surface with 5% diagonal texture. */
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-visual{isolation:isolate;background:#fafbfc;border:1px solid rgba(0,0,0,.1);border-right:0;border-radius:16px 0 0 16px;overflow:hidden}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-visual:before{content:"";position:absolute;inset:0;background:url('../../img/global-presence/texture.png') left top/16.8px 16.8px repeat;opacity:.05;pointer-events:none;z-index:-1}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-message{border:1px solid rgba(0,0,0,.1);border-left:0}
@media(max-width:760px){body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-visual{border-right:1px solid rgba(0,0,0,.1);border-radius:16px}body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-message{border-left:1px solid rgba(0,0,0,.1)}}

/* Figma 772:8056: mirrored diagonal texture on the next-step card. */
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-output{position:relative;isolation:isolate;overflow:hidden;background:#fafbfc;border:1px solid rgba(0,0,0,.1);border-radius:16px}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-output:before{content:"";position:absolute;inset:0;z-index:-1;background:url('../../img/global-presence/texture.png') left top/16.8px 16.8px repeat;opacity:.05;transform:scaleX(-1);pointer-events:none}

/* Selected tabs inherit the Book a Demo button treatment. */
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector-controls button[aria-selected="true"]{position:relative;isolation:isolate;background:#16171c;color:#fff;box-shadow:0 3px 10px #1177ff26}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector-controls button[aria-selected="true"]:before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:conic-gradient(from var(--demo-angle),#277bff,#b3caff,#8675ff,#277bff);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;animation:demo-edge 5s linear infinite}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector-controls button[aria-selected="true"]:is(:hover,:focus-visible){background:linear-gradient(91.1408deg,#1177ff .21879%,#6881f1 99.752%);color:#fff}
@media(prefers-reduced-motion:reduce){body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector-controls button[aria-selected="true"]:before{animation:none}}

/* Figma 771:8017 — original blue diagonal-texture background. */
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-message{background:#eaf5fa url('../img/collection/scenario-message-771-8017.png') center/100% 100% no-repeat}

/* Keep mobile frame spacing equal on all four sides without stretching SVG margins. */
@media(max-width:760px){
 body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector{padding:28px}
 body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .ss-selector:before{inset:0;background:#ececee;border:1px solid #d3d3d6}
}

/* Keep the square-pattern base perceptible beneath the fine diagonal texture. */
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-bg-base:before{opacity:.18;background-position:center bottom;background-size:cover}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-bg-base:after{background:linear-gradient(to bottom,#fff 0%,rgba(255,255,255,.9) 30%,rgba(255,255,255,.25) 65%,transparent 100%)}

/* The exported background already contains its outline; avoid a second CSS stroke. */
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-message{border:0;background-origin:border-box;background-clip:border-box;overflow:hidden}

/* Exact export of the complete Figma background group; no duplicate overlays. */
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-bg-base{background:url('../img/collection/scenarios-background-767-7794.svg') center/100% 100% no-repeat}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-bg-base:before,
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-bg-base:after,
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-bg-lines{display:none}

/* Figma 770:7892 — separately rotated backing and inset face. */
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-message{padding:30px 54px 44px;overflow:hidden}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-message>div{box-sizing:border-box;width:100%;max-width:466px;min-height:104px;margin:auto;isolation:isolate;transform:rotate(-4deg);border:0;border-radius:16px;padding:26px;background:transparent;box-shadow:none}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-message>div:before{content:"";position:absolute;inset:30px -14px -20px 14px;z-index:-2;border-radius:16px;background:#d3e2e9;transform:rotate(6.24deg);pointer-events:none}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-message>div:after{content:"";position:absolute;inset:0;z-index:-1;border:10px solid white;border-radius:16px;background:#f3f5f8;box-shadow:0 1px 1px #3b3b3b0a,0 3px 3px #3b3b3b08,0 6px 4px #3b3b3b05,0 11px 4px #3b3b3b03,0 32px 24px -12px #3b3b3b0f,0 0 0 1px #3b3b3b0a;pointer-events:none}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-message h3{font-size:20px;line-height:28px;font-weight:500;margin:0 0 2px}
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-message .ss-detail{font-size:14px;line-height:22px;color:rgba(0,0,0,.45)}
@media(max-width:1100px){body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-message{padding:28px 28px 44px}}
@media(max-width:760px){body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-message{padding:32px 22px 46px}body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-message>div{padding:24px}}

/* Reuse the homepage operating-rhythm background directly. */
body:is([data-page="collection"],[data-page="customer-services"],[data-page="telemarketing"],[data-page="info-checker-kyc"],[data-page="banking-finance"],[data-page="telecommunication"]) #scenarios .collection-scenario-bg-base{background:url('../img/operations/background-449-85-latest.png') center/100% 100% no-repeat}

/* Text-only viewport reveals, matching the follow-up section timing. */
@media(prefers-reduced-motion:no-preference){
 #scenarios .scenario-copy-motion{opacity:0;translate:0 var(--scenario-exit-y,20px);transition:opacity .38s ease,translate .48s cubic-bezier(.22,1,.36,1)}
 #scenarios .scenario-copy-motion.is-in-view{opacity:1;translate:0 0;transition-duration:.75s,.85s;transition-delay:var(--scenario-delay,0ms)}
}

/* Banking scenarios — Figma 846:11388. */
html body[data-page="banking-finance"] #scenarios .ss-selector{display:grid;grid-template-columns:minmax(0,343fr) minmax(0,509fr);gap:16px;width:100%;max-width:900px;margin:0 auto;padding:16px;border:1px solid #eaecf0;border-radius:24px;background:#fff;box-sizing:border-box}
html body[data-page="banking-finance"] #scenarios .ss-selector:before,html body[data-page="banking-finance"] #scenarios .ss-selector:after{display:none}
html body[data-page="banking-finance"] #scenarios .ss-selector-controls{display:flex;flex-direction:column;flex-wrap:nowrap;gap:0;width:100%;box-sizing:border-box;padding:10px;margin:0;background:#f7f7f7;border:1px solid #e0e0e0;border-radius:20px;justify-content:center}
html body[data-page="banking-finance"] #scenarios .ss-selector-controls button{display:flex;align-items:center;gap:6px;width:100%;min-height:72px;padding:14px 14px;border:0;border-radius:16px;background:transparent;color:#1c1c1c;font-size:17px;line-height:1.5;letter-spacing:-.68px;text-align:left;box-shadow:none;transform:none;white-space:normal}
html body[data-page="banking-finance"] #scenarios .ss-selector-controls button[aria-selected="true"]{background:#fff;color:#1c1c1c;box-shadow:none}
html body[data-page="banking-finance"] #scenarios .ss-selector-controls button:before{content:"";width:24px;height:24px;flex:0 0 24px;background-position:center;background-size:contain;background-repeat:no-repeat}
html body[data-page="banking-finance"] #scenarios .ss-selector-panels{min-width:0}
html body[data-page="banking-finance"] #scenarios .ss-scenario-panel{position:relative;display:grid;grid-template-columns:140px minmax(0,1fr);grid-template-rows:minmax(210px,auto) auto;gap:12px 0;padding:0;background:transparent;border:0;border-radius:0;min-height:308px}
html body[data-page="banking-finance"] #scenarios .ss-scenario-panel:before{content:"";position:absolute;inset:0 0 auto;height:210px;border:1px solid #e0e0e0;border-radius:20px;pointer-events:none;box-sizing:border-box}
html body[data-page="banking-finance"] #scenarios .collection-scenario-visual{grid-column:1;grid-row:1;min-height:210px;background:transparent;border:0;border-radius:0}
html body[data-page="banking-finance"] #scenarios .scenario-figma-icon{width:113px;height:127px;background:url("../img/voice-overview/contact-cards-843.png") center/196px 168px no-repeat}
html body[data-page="banking-finance"] #scenarios .scenario-figma-icon>*{display:none}
html body[data-page="banking-finance"] #scenarios .collection-scenario-message{grid-column:2;grid-row:1;background:none;margin:0;padding:26px 24px 26px 14px;border:0;border-radius:0}
html body[data-page="banking-finance"] #scenarios .collection-scenario-message>div{transform:none;padding:0;border:0;background:none;box-shadow:none;isolation:auto}
html body[data-page="banking-finance"] #scenarios .collection-scenario-message>div:before,html body[data-page="banking-finance"] #scenarios .collection-scenario-message>div:after{display:none}
html body[data-page="banking-finance"] #scenarios .ss-output{grid-column:1/-1;grid-row:2;min-height:86px;box-sizing:border-box;border:1px solid #e0e0e0;border-radius:20px;padding:13px 26px;background:#ffffff80;gap:6px}
html body[data-page="banking-finance"] #scenarios .ss-scenario-panel h3{font-size:20px;line-height:1.35;margin:0 0 16px}
html body[data-page="banking-finance"] #scenarios .ss-output p{font-size:16px;line-height:1.4}
html body[data-page="banking-finance"] #scenarios .ss-selector-controls button:nth-child(1):before{background-image:url("../img/collection/banking-tab-0.svg")}
html body[data-page="banking-finance"] #scenarios .ss-selector-controls button:nth-child(2):before{background-image:url("../img/collection/banking-tab-1.svg")}
html body[data-page="banking-finance"] #scenarios .ss-selector-controls button:nth-child(3):before{background-image:url("../img/collection/banking-tab-2.svg")}
html body[data-page="banking-finance"] #scenarios .ss-selector-controls button:nth-child(4):before{background-image:url("../img/collection/banking-tab-3.svg")}
@media(max-width:760px){html body[data-page="banking-finance"] #scenarios .ss-selector{grid-template-columns:1fr}html body[data-page="banking-finance"] #scenarios .ss-selector-controls button{min-height:56px}html body[data-page="banking-finance"] #scenarios .ss-scenario-panel{grid-template-columns:115px minmax(0,1fr)}html body[data-page="banking-finance"] #scenarios .collection-scenario-message{padding:22px 16px 22px 8px}}
html body[data-page="banking-finance"] #scenarios .ss-selector-controls button{justify-content:flex-start}
html body[data-page="banking-finance"] #scenarios .ss-selector-controls button:before{position:static;inset:auto;opacity:1;transform:none;border:0;border-radius:0;box-shadow:none}
html body[data-page="banking-finance"] #scenarios .scenario-figma-icon .ss-panel-label{display:none}
html body[data-page="banking-finance"] #scenarios .collection-scenario-visual:before,html body[data-page="banking-finance"] #scenarios .collection-scenario-visual:after{display:none}

/* Consistent semantic icons, including the selected state. */
html body[data-page="banking-finance"] #scenarios .ss-selector-controls button[aria-selected="true"]{background:#16171c;color:#fff;box-shadow:0 3px 10px #16171c14}
html body[data-page="banking-finance"] #scenarios .ss-selector-controls button:before,html body[data-page="banking-finance"] #scenarios .ss-selector-controls button[aria-selected="true"]:before{position:static;inset:auto;padding:0;border:0;border-radius:0;animation:none;mask:none;-webkit-mask:none;background-color:transparent;background-size:24px 24px;background-position:center;background-repeat:no-repeat;opacity:1;flex:0 0 24px;width:24px;height:24px}
html body[data-page="banking-finance"] #scenarios .ss-selector-controls button[aria-selected="true"]:before{filter:brightness(0) invert(1)}
html body[data-page="banking-finance"] #scenarios .scenario-figma-icon{position:relative;background:url("../img/voice-overview/contact-reui-stack.svg") center/113px 127px no-repeat}
html body[data-page="banking-finance"] #scenarios .scenario-figma-icon:after{content:"";position:absolute;left:71%;top:58%;width:22px;height:22px;padding:10px;border:1px solid #e4e4e7;border-radius:50%;background-color:#fff;background-size:22px 22px;background-position:center;background-repeat:no-repeat;box-shadow:0 1px 3px #0000000d;transform:translate(-50%,-50%) scaleX(.9) skewY(-26deg)}
html body[data-page="banking-finance"] #scenarios .ss-selector-controls button:nth-child(1):before,html body[data-page="banking-finance"] #scenarios .ss-selector-controls button:nth-child(1)[aria-selected="true"]:before{background-image:url("../img/collection/banking-semantic-0.svg")}
html body[data-page="banking-finance"] #scenarios #ss-panel-0 .scenario-figma-icon:after{background-image:url("../img/collection/banking-semantic-0.svg")}
html body[data-page="banking-finance"] #scenarios .ss-selector-controls button:nth-child(2):before,html body[data-page="banking-finance"] #scenarios .ss-selector-controls button:nth-child(2)[aria-selected="true"]:before{background-image:url("../img/collection/banking-semantic-1.svg")}
html body[data-page="banking-finance"] #scenarios #ss-panel-1 .scenario-figma-icon:after{background-image:url("../img/collection/banking-semantic-1.svg")}
html body[data-page="banking-finance"] #scenarios .ss-selector-controls button:nth-child(3):before,html body[data-page="banking-finance"] #scenarios .ss-selector-controls button:nth-child(3)[aria-selected="true"]:before{background-image:url("../img/collection/banking-semantic-2.svg")}
html body[data-page="banking-finance"] #scenarios #ss-panel-2 .scenario-figma-icon:after{background-image:url("../img/collection/banking-semantic-2.svg")}
html body[data-page="banking-finance"] #scenarios .ss-selector-controls button:nth-child(4):before,html body[data-page="banking-finance"] #scenarios .ss-selector-controls button:nth-child(4)[aria-selected="true"]:before{background-image:url("../img/collection/banking-semantic-3.svg")}
html body[data-page="banking-finance"] #scenarios #ss-panel-3 .scenario-figma-icon:after{background-image:url("../img/collection/banking-semantic-3.svg")}

/* Align the scene artwork with the 26px inset of the next-step copy. */
html body[data-page="banking-finance"] #scenarios .collection-scenario-visual{justify-items:start;padding-left:26px;box-sizing:border-box}
@media(max-width:760px){html body[data-page="banking-finance"] #scenarios .ss-scenario-panel{grid-template-columns:140px minmax(0,1fr)}}
/* Match white hover labels with white semantic icons. */
@media(hover:hover){html body[data-page="banking-finance"] #scenarios .ss-selector-controls button:hover:before{filter:brightness(0) invert(1)}}
html body[data-page="banking-finance"] #scenarios .ss-selector-controls button:focus-visible:before{filter:brightness(0) invert(1)}