/* Figma 566:2184: scoped to the Voice Agent overview. */
:is(#voiceOverview,#qa-challenges.voice-overview){padding:90px 0 120px;background:linear-gradient(rgb(255 255 255 / 95%),rgb(255 255 255 / 95%)),url('../../img/global-presence/texture.png') repeat;background-size:auto,9.6px 9.6px;}
.voice-overview-shell{width:calc(100% - 64px);max-width:1300px;margin:auto;}
.voice-overview-heading{text-align:center;}
.voice-overview-eyebrow{display:inline-flex;align-items:center;gap:8px;padding:5px 12px;border:1px solid #e5e5e5;border-radius:30px;background:#fff;color:#1c1c1c;font-size:12px;line-height:20px;letter-spacing:.5px;}
.voice-overview-heading h2{margin:14px 0 16px;font-size:48px;font-weight:400;line-height:1.2;letter-spacing:-2.4px;color:#17181c;}
.voice-overview-heading>p{max-width:740px;margin:0 auto;color:#667185;font-size:14px;line-height:25.2px;}
.voice-overview-stage{display:grid;grid-template-columns:40.615% 1fr;align-items:center;margin-top:48px;}
.voice-overview-art{height:352px;border:1px solid rgb(0 0 0 / 10%);border-radius:32px;background:#fafbfc;display:grid;place-items:center;}
.voice-overview-art img{display:block;width:304px;max-width:85%;height:auto;}
.voice-overview-cards{margin-left:-66px;position:relative;z-index:1;display:grid;}
.voice-overview-card{grid-area:1/1;padding:40px 48px;min-height:188px;box-sizing:border-box;border-radius:14px;background:#fff;position:relative;isolation:isolate;box-shadow:0 1px 1px rgb(59 59 59 / 4%),0 3px 3px rgb(59 59 59 / 3%),0 6px 4px rgb(59 59 59 / 2%),0 11px 4px rgb(59 59 59 / 1%),0 32px 24px -12px rgb(59 59 59 / 6%),0 0 0 1px rgb(59 59 59 / 4%);animation:voiceOverviewIn .35s ease both;}
.voice-overview-card[hidden]{display:none!important;}
.voice-overview-card h3{position:relative;z-index:1;margin:0 0 12px;color:#000;font-size:20px;font-weight:500;line-height:24px;}
.voice-overview-card p{position:relative;z-index:1;margin:0;color:#667185;font-size:16px;line-height:22.4px;}
.voice-overview-dots{display:flex;justify-content:center;gap:8px;margin-top:-24px;position:relative;z-index:2;}
.voice-overview-dots button{appearance:none;box-sizing:content-box;width:7px;height:7px;border:4px solid transparent;background:#d9d9d9;background-clip:padding-box;border-radius:50%;padding:0;cursor:pointer;transition:background-color .2s;}
.voice-overview-dots button[aria-selected="true"]{background-color:#1c1c1c;}
.voice-overview-dots button:focus-visible{outline:2px solid #1177ff;outline-offset:3px;}
@keyframes voiceOverviewIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:900px){.voice-overview-card{padding:28px 30px}.voice-overview-cards{margin-left:-35px}.voice-overview-heading h2{font-size:38px;letter-spacing:-1.5px}.voice-overview-dots{margin-top:20px}}
@media(max-width:600px){:is(#voiceOverview,#qa-challenges.voice-overview){padding:64px 0}.voice-overview-shell{width:calc(100% - 40px)}.voice-overview-heading h2{font-size:32px;letter-spacing:-1px}.voice-overview-stage{grid-template-columns:1fr;margin-top:32px}.voice-overview-art{height:300px}.voice-overview-art img{width:260px}.voice-overview-cards{margin:-28px 12px 0}.voice-overview-card{padding:28px 24px;min-height:220px}.voice-overview-card h3{font-size:19px}.voice-overview-card p{font-size:15px}}
@media(prefers-reduced-motion:reduce){.voice-overview-card{animation:none}.voice-overview-dots button{transition:none}}

/* Figma 567:2480: 8px active dot with 16px outline; 6px inactive dots. */
:is(#voiceOverview,#qa-challenges.voice-overview) .voice-overview-dots{gap:12px;align-items:center;}
:is(#voiceOverview,#qa-challenges.voice-overview) .voice-overview-dots button{position:relative;box-sizing:border-box;width:16px;height:16px;padding:0;border:0;background:none;border-radius:50%;box-shadow:none;}
:is(#voiceOverview,#qa-challenges.voice-overview) .voice-overview-dots button::before{content:"";position:absolute;width:6px;height:6px;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;background:#d5d5d5;}
:is(#voiceOverview,#qa-challenges.voice-overview) .voice-overview-dots button[aria-selected="true"]{border:1px solid rgb(0 0 0 / 45%);background:none;}
:is(#voiceOverview,#qa-challenges.voice-overview) .voice-overview-dots button[aria-selected="true"]::before{width:8px;height:8px;background:rgb(0 0 0 / 85%);}
:is(#voiceOverview,#qa-challenges.voice-overview) .voice-overview-dots button:focus:not(:focus-visible){outline:none;}
:is(#voiceOverview,#qa-challenges.voice-overview) .voice-overview-art{position:relative;}
:is(#voiceOverview,#qa-challenges.voice-overview) .voice-overview-scene{grid-area:1/1;animation:voiceOverviewIn .35s ease both;}
:is(#voiceOverview,#qa-challenges.voice-overview) .voice-overview-scene[hidden]{display:none!important;}
:is(#voiceOverview,#qa-challenges.voice-overview) .voice-overview-generated{width:400px;height:400px;max-width:none;object-fit:contain;position:absolute;left:50%;top:50%;translate:-50% -50%;}
@media(max-width:900px){:is(#voiceOverview,#qa-challenges.voice-overview) .voice-overview-generated{width:350px;height:350px;}}
@media(max-width:600px){:is(#voiceOverview,#qa-challenges.voice-overview) .voice-overview-generated{width:340px;height:340px;max-width:110%;}}
@media(prefers-reduced-motion:reduce){:is(#voiceOverview,#qa-challenges.voice-overview) .voice-overview-scene{animation:none;}}

/* Position the intent-and-promises scene within its existing panel. */
:is(#voiceOverview,#qa-challenges.voice-overview) .voice-overview-generated[data-scene="1"]{left:calc(50% - 40px);top:calc(50% - 20px);}

/* The selected outer ring fills clockwise in sync with the 3-second carousel. */
:is(#voiceOverview,#qa-challenges.voice-overview) .voice-overview-dots button[aria-selected="true"]{border:0;}
:is(#voiceOverview,#qa-challenges.voice-overview) .voice-overview-ring{display:none;position:absolute;inset:0;width:16px;height:16px;overflow:visible;transform:rotate(-90deg);pointer-events:none;}
:is(#voiceOverview,#qa-challenges.voice-overview) [aria-selected="true"] .voice-overview-ring{display:block;}
:is(#voiceOverview,#qa-challenges.voice-overview) .voice-overview-ring circle{fill:none;stroke-width:1;}
:is(#voiceOverview,#qa-challenges.voice-overview) .voice-overview-ring-track{stroke:rgb(0 0 0 / 10%);}
:is(#voiceOverview,#qa-challenges.voice-overview) .voice-overview-ring-progress{stroke:rgb(0 0 0 / 45%);stroke-dasharray:100;stroke-dashoffset:100;stroke-linecap:round;}

:is(#voiceOverview,#qa-challenges.voice-overview) .voice-overview-scene[data-scene="0"]{position:absolute;left:16.666667%;top:40px;width:304px;height:278px;max-width:none;translate:none;}
@media(max-width:900px){:is(#voiceOverview,#qa-challenges.voice-overview) .voice-overview-scene[data-scene="0"]{left:8%;width:84%;height:auto;max-width:304px;}}
@media(max-width:600px){:is(#voiceOverview,#qa-challenges.voice-overview) .voice-overview-scene[data-scene="0"]{left:calc(50% - 145px);top:30px;width:260px;height:auto;}}
:is(#voiceOverview,#qa-challenges.voice-overview) .voice-overview-generated[data-scene="2"]{left:calc(50% - 40px);top:calc(50% - 10px);}

/* Exact quotation ornaments from Figma 576:2754. */
.voice-overview-card::before,.voice-overview-card::after{content:"";position:absolute;width:69.116px;height:34.78px;background-repeat:no-repeat;background-size:100% 100%;pointer-events:none;z-index:0;}
.voice-overview-card::before{left:24.2px;top:22.56px;background-image:url('../img/aicc-operating/quote.svg');}
.voice-overview-card::after{right:26.194px;bottom:23.56px;background-image:url('../img/aicc-operating/quote.svg');transform:rotate(180deg);}
@media(max-width:600px){.voice-overview-card::before{left:12px;top:14px;width:48px;height:24px}.voice-overview-card::after{right:12px;bottom:14px;width:48px;height:24px}}

.voice-overview-filter-defs{position:absolute;pointer-events:none;overflow:hidden;}
#qa-challenges.voice-overview .voice-overview-scene[data-scene]{position:absolute;left:45%;top:50%;translate:-50% -50%;width:304px;height:304px;max-width:85%;object-fit:contain}
@media(max-width:600px){#qa-challenges.voice-overview .voice-overview-scene[data-scene]{left:50%;width:260px;height:260px}}
@media(hover:hover){:is(#voiceOverview,#qa-challenges.voice-overview) .voice-overview-scene:hover{filter:url(#voice-overview-hover-blue);}}

/* Radial orbital interaction for the chat product, using its existing content. */
html body[data-page="ai-chat-agent"] #voiceOverview .chat-orbital-stage{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:40px;min-height:450px}
html body[data-page="ai-chat-agent"] #voiceOverview .chat-orbital-stage .voice-overview-art,html body[data-page="ai-chat-agent"] #voiceOverview .voice-overview-dots{display:none}
html body[data-page="ai-chat-agent"] #voiceOverview .chat-orbital-stage .voice-overview-cards{position:relative;inset:auto;width:auto;transform:none;margin:0}
html body[data-page="ai-chat-agent"] #voiceOverview .chat-orbital-stage .voice-overview-card{position:relative;inset:auto;width:100%;box-sizing:border-box;transform:none}
.chat-orbit{position:relative;height:450px;width:100%;background:radial-gradient(circle,#edf0ff 0,transparent 62%)}
.chat-orbit-ring{position:absolute;width:min(64%,310px);aspect-ratio:1;left:50%;top:50%;transform:translate(-50%,-50%);border:1px solid #d8dce8;border-radius:50%}
.chat-orbit-ring:before,.chat-orbit-ring:after{content:'';position:absolute;inset:28px;border:1px dashed #e1e4ee;border-radius:50%}.chat-orbit-ring:after{inset:-28px;border-style:solid;opacity:.45}
.chat-orbit-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:76px;height:76px;border-radius:50%;border:8px solid #eef0fa;background:#16171c;color:white;font-size:22px;box-shadow:0 0 0 14px #e9edf680,0 8px 30px #6881f133;cursor:pointer;z-index:2}
.chat-orbit-node{position:absolute;left:50%;top:50%;display:flex;align-items:center;flex-direction:column;gap:8px;width:180px;padding:0;background:none;border:0;cursor:pointer;z-index:3;color:#667185;font:inherit}
.chat-orbit-badge{display:grid;place-items:center;width:48px;height:48px;background:white;border:1px solid #d9deeb;border-radius:50%;box-shadow:0 4px 16px #2222220a;font-size:14px;transition:background .25s,color .25s,box-shadow .25s}
.chat-orbit-label{max-width:180px;padding:4px 9px;border-radius:8px;background:#ffffffed;font-size:13px;line-height:1.4;text-align:center}
.chat-orbit-node[aria-pressed="true"] .chat-orbit-badge{background:#16171c;color:#fff;box-shadow:0 0 0 6px #6881f11a}
.chat-orbit-node:hover .chat-orbit-badge{box-shadow:0 0 0 7px #6881f126}
.chat-orbit-node:focus-visible,.chat-orbit-core:focus-visible{outline:2px solid #6881f1;outline-offset:5px}
@media(max-width:760px){html body[data-page="ai-chat-agent"] #voiceOverview .chat-orbital-stage{grid-template-columns:1fr;gap:12px}.chat-orbit{height:380px}.chat-orbit-label{max-width:130px}.chat-orbit-node{width:140px}}

/* Centered orbital canvas with node-attached detail, matching the reference layout. */
html body[data-page="ai-chat-agent"] #voiceOverview .chat-orbital-stage{display:block;position:relative;min-height:580px;max-width:1100px;margin:0 auto}
html body[data-page="ai-chat-agent"] #voiceOverview .chat-orbit{height:580px;max-width:520px;margin:auto}
html body[data-page="ai-chat-agent"] #voiceOverview .chat-orbital-stage .voice-overview-cards{display:none;position:absolute;left:calc(50% + var(--detail-x,0px));top:calc(50% + var(--detail-y,0px) + 48px);width:340px;max-width:calc(100% - 32px);transform:translateX(-50%);z-index:6}
html body[data-page="ai-chat-agent"] #voiceOverview .orbit-expanded .voice-overview-cards{display:block}
html body[data-page="ai-chat-agent"] #voiceOverview .chat-orbital-stage .voice-overview-card{padding:24px;border:1px solid #e0e3ec;border-radius:16px;background:#fff;box-shadow:0 16px 48px #1b25451a}
html body[data-page="ai-chat-agent"] #voiceOverview .chat-orbital-stage .voice-overview-card:before,html body[data-page="ai-chat-agent"] #voiceOverview .chat-orbital-stage .voice-overview-card:after{display:none}
html body[data-page="ai-chat-agent"] #voiceOverview .chat-orbital-stage .voice-overview-card h3{font-size:18px;margin-bottom:10px}
html body[data-page="ai-chat-agent"] #voiceOverview .chat-orbital-stage .voice-overview-card p{font-size:14px;line-height:1.65}
@media(max-width:760px){html body[data-page="ai-chat-agent"] #voiceOverview .chat-orbital-stage{min-height:650px}html body[data-page="ai-chat-agent"] #voiceOverview .chat-orbit{height:380px}html body[data-page="ai-chat-agent"] #voiceOverview .chat-orbital-stage .voice-overview-cards{left:50%;top:390px;width:340px}}

/* Expanded node: attached detail, workflow progress and connected-node navigation. */
html body[data-page="ai-chat-agent"] #voiceOverview .orbit-expanded .voice-overview-cards:before{content:'';position:absolute;left:50%;top:-20px;height:20px;border-left:1px solid #c9cedb}
html body[data-page="ai-chat-agent"] #voiceOverview .orbit-expanded .voice-overview-card{background:#fffffff5;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-color:#ccd2df;box-shadow:0 12px 36px #171d3420}
.orbit-detail-meta{font-size:11px;letter-spacing:1px;color:#737b8c;margin-bottom:14px}
.orbit-detail-progress{height:3px;background:#e9ebf2;margin:20px 0;border-radius:4px;overflow:hidden}.orbit-detail-progress span{display:block;height:100%;background:linear-gradient(90deg,#6881f1,#9770de);transition:width .3s}
.orbit-related-title{font-size:11px!important;letter-spacing:1px;color:#737b8c;margin:0 0 10px!important}
.orbit-related-links{display:flex;gap:6px;flex-wrap:wrap}.orbit-related-links button{padding:6px 9px;border:1px solid #dce0e9;background:transparent;border-radius:5px;color:#495365;font:inherit;font-size:12px;text-align:left;cursor:pointer}.orbit-related-links button:hover{background:#eef1fb;border-color:#9ba9d5}
.orbit-expanded .chat-orbit-node[aria-pressed="false"]{opacity:.45}.orbit-expanded .chat-orbit-node[aria-pressed="true"]{z-index:7}
/* Chat overview: copy on the left and the interactive orbit on the right. */
html body[data-page="ai-chat-agent"] #voiceOverview .voice-overview-shell{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:56px}
html body[data-page="ai-chat-agent"] #voiceOverview .voice-overview-heading{text-align:left;margin:0;max-width:none}
html body[data-page="ai-chat-agent"] #voiceOverview .voice-overview-heading h2{max-width:560px;margin-left:0;margin-right:0}
html body[data-page="ai-chat-agent"] #voiceOverview .voice-overview-heading>p{max-width:540px;margin-left:0;margin-right:0;text-align:left}
html body[data-page="ai-chat-agent"] #voiceOverview .chat-orbital-stage{width:100%;min-width:0;margin:0;min-height:580px}
@media(max-width:900px){html body[data-page="ai-chat-agent"] #voiceOverview .voice-overview-shell{grid-template-columns:1fr;gap:24px}html body[data-page="ai-chat-agent"] #voiceOverview .voice-overview-heading h2,html body[data-page="ai-chat-agent"] #voiceOverview .voice-overview-heading>p{max-width:none}}
html body[data-page="ai-chat-agent"] #voiceOverview{padding-top:0;padding-bottom:0}

html body[data-page="ai-chat-agent"] #voiceOverview .chat-orbit-label{border:1px solid #F9FAFC;box-sizing:border-box}
html body[data-page="ai-chat-agent"] #voiceOverview .chat-orbit-core{display:grid;place-items:center;padding:0}
html body[data-page="ai-chat-agent"] #voiceOverview .chat-orbit-core img{display:block;width:28px;height:28px;filter:brightness(0) invert(1)}
/* Dark orbital detail, with clear space below the selected node label. */
html body[data-page="ai-chat-agent"] #voiceOverview .chat-orbital-stage .voice-overview-cards{top:calc(50% + var(--detail-y,0px) + 82px)}
html body[data-page="ai-chat-agent"] #voiceOverview .orbit-expanded .voice-overview-card{background:#16171c;border-color:#33343e;box-shadow:0 12px 36px #16171c26;color:#fff}
html body[data-page="ai-chat-agent"] #voiceOverview .orbit-expanded .voice-overview-card h3{color:#fff}
html body[data-page="ai-chat-agent"] #voiceOverview .orbit-expanded .voice-overview-card p{color:#ffffffb8}
@media(max-width:760px){html body[data-page="ai-chat-agent"] #voiceOverview .chat-orbital-stage .voice-overview-cards{top:400px}}


/* Contact Center: vertical icon timeline inspired by How It Works 2. */
html body[data-page="aicc"] #voiceOverview .voice-overview-stage{display:block;min-height:0;height:auto;margin-top:56px}
html body[data-page="aicc"] #voiceOverview .voice-overview-art,html body[data-page="aicc"] #voiceOverview .voice-overview-dots{display:none}
html body[data-page="aicc"] #voiceOverview .voice-overview-cards{position:relative;inset:auto;width:100%;max-width:1000px;margin:0 auto;transform:none;display:flex;flex-direction:column;gap:0}
html body[data-page="aicc"] #voiceOverview .voice-overview-card{display:block;position:relative;inset:auto;width:100%;min-height:0;box-sizing:border-box;padding:0 0 52px 88px;margin:0;background:transparent;border:0;border-radius:0;box-shadow:none;transform:none;overflow:visible}
html body[data-page="aicc"] #voiceOverview .voice-overview-card:last-child{padding-bottom:0}
html body[data-page="aicc"] #voiceOverview .voice-overview-card:before{content:'';position:absolute;left:27px;top:62px;bottom:0;width:1px;height:auto;background:#e1e1e1;opacity:1;transform:none;border-radius:0}
html body[data-page="aicc"] #voiceOverview .voice-overview-card:last-child:before,html body[data-page="aicc"] #voiceOverview .voice-overview-card:after{display:none}
html body[data-page="aicc"] #voiceOverview .voice-overview-card h3{font-size:24px;line-height:1.35;font-weight:600;color:#171717;margin:0 0 12px}
html body[data-page="aicc"] #voiceOverview .voice-overview-card p{font-size:17px;line-height:1.65;color:#737373;margin:0;max-width:none}
.contact-step-symbol{position:absolute;left:0;top:0;display:grid;place-items:center;width:56px;height:56px;background:#f5f5f5;border:1px solid #e2e2e2;box-sizing:border-box}.contact-step-symbol img{width:24px;height:24px}
@media(max-width:760px){html body[data-page="aicc"] #voiceOverview .voice-overview-card{padding-left:72px;padding-bottom:36px}html body[data-page="aicc"] #voiceOverview .voice-overview-card h3{font-size:20px}html body[data-page="aicc"] #voiceOverview .voice-overview-card p{font-size:15px}}

/* Figma 843:11028: three illustration cards, 425 × 460 with 12px gutters. */
html body[data-page="aicc"] #voiceOverview .voice-overview-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:1300px}
html body[data-page="aicc"] #voiceOverview .voice-overview-card{padding:0 0 26px;min-height:460px;border:1.21px solid #e0e0e0;border-radius:19.366px;overflow:hidden;background:transparent;text-align:center}
html body[data-page="aicc"] #voiceOverview .voice-overview-card:last-child{padding-bottom:26px}
html body[data-page="aicc"] #voiceOverview .voice-overview-card:before,html body[data-page="aicc"] #voiceOverview .voice-overview-card:after{display:none}
.contact-card-art{height:276px;position:relative;overflow:hidden;background:#fff url('../img/voice-overview/contact-texture-843.png') center/cover;border-bottom:1.21px solid #e0e0e0}
.contact-card-crop{position:absolute;width:229px;height:256px;left:50%;top:10px;transform:translateX(-50%);overflow:hidden}
.contact-card-crop img{position:absolute;max-width:none;width:173.16%;height:132.08%;left:-36.74%;top:-13.76%}
html body[data-page="aicc"] #voiceOverview .voice-overview-card h3{font-size:20px;line-height:1.2;font-weight:500;letter-spacing:-.2px;color:#313540;margin:24px 24px 14px;text-align:center}
html body[data-page="aicc"] #voiceOverview .voice-overview-card p{font-size:14px;line-height:1.5;letter-spacing:-.28px;color:#667085;margin:0 24px;text-align:center}
@media(max-width:900px){html body[data-page="aicc"] #voiceOverview .voice-overview-cards{grid-template-columns:1fr;max-width:425px}}

/* Figma 843:11386: numbered navigation and browser detail. */
.aicc-outcomes{display:grid;grid-template-columns:521fr 732fr;gap:16px;padding:16px;background:#fff;border:1px solid #eaecf0;border-radius:24px;max-width:1300px;box-sizing:border-box;margin:auto}
.aicc-outcome-nav{background:#f7f7f7;border:1px solid #efe7f8;border-radius:20px;min-height:323px;padding:24px;display:flex;flex-direction:column;justify-content:center;gap:32px;box-sizing:border-box}
.aicc-outcome-nav button{position:relative;display:flex;align-items:center;gap:14px;padding:0;border:0;background:none;text-align:left;color:#313540a6;font:400 20px/1.2 Arial,sans-serif;cursor:pointer}
.aicc-outcome-nav button>span:first-child{display:grid;place-items:center;width:44px;height:44px;flex:none;border:1px solid #e2e2e2;border-radius:10px;color:#000a}
.aicc-outcome-nav button[aria-selected="true"]{color:#313540;font-weight:500}
.aicc-outcome-nav button[aria-selected="true"]:after{content:'';position:absolute;left:0;right:0;bottom:-16px;height:2px;background:linear-gradient(90deg,#646464, #16171c 45%,#e5e5e8 60%)}
.aicc-outcome-nav button:focus-visible{outline:2px solid #6881f1;outline-offset:6px;border-radius:8px}
.aicc-outcome-browser{border:1px solid #e0e0e0;border-radius:20px;overflow:hidden;min-width:0;background:white}
.aicc-browser-bar{height:59px;display:flex;align-items:center;border-bottom:1px solid #eaecf0;padding:0 24px;gap:22px}
.aicc-browser-lights{display:flex;gap:8px;flex:none}.aicc-browser-lights i{width:10px;height:10px;border-radius:50%;background:#ff5656}.aicc-browser-lights i:nth-child(2){background:#ffbd35}.aicc-browser-lights i:nth-child(3){background:#00c448}
.aicc-browser-title{font-size:14px;color:#313540a6;padding:10px 14px;border:1px solid #eaecf0;border-radius:12px 12px 0 0;align-self:end;max-width:100%}
.aicc-browser-body{display:flex;align-items:center;gap:24px;min-height:260px;padding:24px;box-sizing:border-box;background:radial-gradient(#dfe2e9 .65px,transparent .8px) center/9px 9px}
.aicc-browser-art{position:relative;flex:0 0 166px;height:186px;overflow:hidden;mix-blend-mode:multiply}.aicc-browser-art img{position:absolute;width:173.16%;height:132.08%;max-width:none;left:-36.74%;top:-13.76%}
.aicc-browser-body p{font-size:16px;line-height:1.5;letter-spacing:-.32px;color:rgba(0,0,0,.85);margin:0}
@media(max-width:1000px){.aicc-outcome-nav button{font-size:17px}.aicc-browser-art{flex-basis:120px;height:150px}.aicc-browser-body{gap:16px;padding:20px}}
@media(max-width:760px){.aicc-outcomes{grid-template-columns:1fr}.aicc-outcome-nav{min-height:0;gap:32px}.aicc-browser-body{min-height:240px}.aicc-browser-bar{padding-inline:16px;gap:10px}}

/* Calling PaaS: Figma 843:11028, independent three-column cards. */
html body[data-page="botlab"] #voiceOverview .voice-overview-stage{display:block;height:auto;min-height:0}
html body[data-page="botlab"] #voiceOverview .voice-overview-art,html body[data-page="botlab"] #voiceOverview .voice-overview-dots{display:none}
html body[data-page="botlab"] #voiceOverview .voice-overview-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;position:relative;inset:auto;transform:none;width:100%;max-width:1300px;margin:0 auto}
html body[data-page="botlab"] #voiceOverview .voice-overview-card{grid-area:auto;position:relative;inset:auto;transform:none;width:100%;box-sizing:border-box;min-height:460px;padding:0 0 26px;border:1.21px solid #e0e0e0;border-radius:19.366px;overflow:hidden;background:transparent;box-shadow:none;text-align:center}
html body[data-page="botlab"] #voiceOverview .voice-overview-card:before,html body[data-page="botlab"] #voiceOverview .voice-overview-card:after{display:none}
html body[data-page="botlab"] #voiceOverview .voice-overview-card h3{font-size:20px;line-height:1.2;font-weight:500;letter-spacing:-.2px;color:#313540;margin:24px 24px 14px;text-align:center}
html body[data-page="botlab"] #voiceOverview .voice-overview-card p{font-size:14px;line-height:1.5;letter-spacing:-.28px;color:#667085;margin:0 24px;text-align:center}
@media(max-width:900px){html body[data-page="botlab"] #voiceOverview .voice-overview-cards{grid-template-columns:1fr;max-width:425px}}

/* Figma 843:11387: Contact Center overview background is 782px tall. */
@media(min-width:901px){html body[data-page="aicc"] #voiceOverview{box-sizing:border-box;min-height:782px;padding-top:70px;padding-bottom:100px}}

/* Semantic outcome icons and elapsed-time carousel indicator. */
.aicc-outcome-nav button>span:first-child svg{width:24px;height:24px;display:block}
.aicc-outcome-nav button[aria-selected="true"]:before{content:'';position:absolute;left:0;right:0;bottom:-16px;height:2px;background:#e5e5e8}
.aicc-outcome-nav button[aria-selected="true"]:after{background:#16171c;transform:scaleX(var(--outcome-progress,0));transform-origin:left}

/* Figma 843:11336: original faded dot artwork and lavender wash. */
.aicc-browser-body{position:relative;isolation:isolate;background:#fff}
.aicc-browser-body:before{content:'';position:absolute;z-index:-1;pointer-events:none;left:32px;right:32px;top:50%;height:192px;transform:translateY(-50%);border-radius:16px;background:linear-gradient(90deg,rgba(237,238,248,0),rgba(237,238,248,.2) 51.442%,rgba(237,238,248,0)) left top/calc(100% - 9px) 147px no-repeat,url('../img/voice-overview/contact-background-843-11336.svg') -39px -87.5px/949px 450px no-repeat}
@media(max-width:760px){.aicc-browser-body:before{left:16px;right:16px}}

/* Outcome navigation uses the site brand blue on hover. */
@media(hover:hover){
 .aicc-outcome-nav button:hover{color:var(--blue,#1177ff)}
 .aicc-outcome-nav button:hover>span:first-child{color:var(--blue,#1177ff);border-color:var(--blue,#1177ff);background:#edf4ff}
 .aicc-outcome-nav button[aria-selected="true"]:hover:after{background:var(--blue,#1177ff)}
}

/* Figma 843:11340: continuous browser-tab outline with curved lower corners. */
.aicc-browser-bar{position:relative;border-bottom:0;background:url('../img/voice-overview/contact-tab-line-843-11340.svg') left bottom/100% 44px no-repeat}
.aicc-browser-title{position:absolute;left:17.84%;bottom:1px;width:32.67%;height:42px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;text-align:center;padding:3px 10px;border:0;border-radius:0;line-height:16px}
@media(max-width:1000px){.aicc-browser-title{font-size:12px;line-height:14px;padding-inline:4px}.aicc-browser-lights{gap:5px}.aicc-browser-lights i{width:8px;height:8px}}

/* Outcome-specific artwork: consistent layered white cards and semantic glyphs. */
.aicc-browser-art.aicc-semantic-art{display:grid;place-items:center;overflow:visible;isolation:isolate;mix-blend-mode:normal}
.aicc-semantic-art:before,.aicc-semantic-art:after{content:'';position:absolute;width:108px;height:130px;border:1px solid #e0e2e6;border-radius:18px;background:linear-gradient(145deg,#fff,#f5f6f8);transform:translate(-12px,-7px) rotate(-12deg);box-shadow:0 5px 12px #252b3606;z-index:-1}
.aicc-semantic-art:after{transform:translate(-5px,-3px) rotate(-6deg)}
.aicc-browser-art.aicc-semantic-art img{position:static;box-sizing:content-box;width:52px;height:52px;padding:39px 28px;max-width:none;border:1px solid #d9dde4;border-radius:18px;background:linear-gradient(145deg,#fff,#f8f9fb);box-shadow:0 8px 20px #252b360a}
@media(max-width:1000px){.aicc-browser-art.aicc-semantic-art{transform:scale(.8)}}

/* Generated PaaS illustrations share one centered square canvas. */
html body[data-page="botlab"] #voiceOverview .contact-card-crop{width:276px;height:276px;top:0;max-width:100%}
html body[data-page="botlab"] #voiceOverview .contact-card-crop img{width:100%;height:100%;left:0;top:0;object-fit:contain}

/* Contact Center copy enters and leaves without moving the surrounding layout. */
.aicc-browser-title,.aicc-browser-body>p{opacity:1;transform:translateY(0);transition:opacity .32s ease,transform .32s cubic-bezier(.22,1,.36,1)}
.aicc-copy-leaving .aicc-browser-title,.aicc-copy-leaving .aicc-browser-body>p{opacity:0;transform:translateY(-7px);transition-duration:.18s}
.aicc-heading-motion>*{opacity:0;transform:translateY(16px);transition:opacity .4s ease,transform .5s cubic-bezier(.22,1,.36,1)}
.aicc-heading-visible>*{opacity:1;transform:translateY(0)}
.aicc-heading-visible>:nth-child(2){transition-delay:.07s}
.aicc-heading-visible>:nth-child(3){transition-delay:.14s}
@media(prefers-reduced-motion:reduce){.aicc-heading-motion>*,.aicc-browser-title,.aicc-browser-body>p{opacity:1;transform:none;transition:none}}

/* ReUI IconStack variant 4: isometric layers and a circular front badge. */
.aicc-browser-art.aicc-semantic-art{background:url('../img/voice-overview/contact-reui-stack.svg') center/144px 162px no-repeat}
.aicc-semantic-art:before,.aicc-semantic-art:after{display:none}
.aicc-browser-art.aicc-semantic-art img{position:absolute;left:calc(50% + 30px);top:calc(50% + 13px);width:28px;height:28px;padding:14px;border-radius:50%;border:1px solid #e4e4e7;background:#fff;box-shadow:0 1px 3px #0000000d;transform:translate(-50%,-50%) scaleX(.9) skewY(-26deg)}

/* Reduce all three Contact Center icon stacks uniformly. */
html body[data-page="aicc"] .aicc-browser-art.aicc-semantic-art{transform:scale(.8);transform-origin:center}
@media(max-width:1000px){html body[data-page="aicc"] .aicc-browser-art.aicc-semantic-art{transform:scale(.64)}}
/* PaaS cards: a single continuous outline, with the artwork clipped inside it. */
html body[data-page="botlab"] #voiceOverview .voice-overview-card{border:1px solid #e0e0e0;border-radius:20px}
html body[data-page="botlab"] #voiceOverview .contact-card-art{box-sizing:border-box;width:100%;background:#fff;border:0;border-bottom:1px solid #e0e0e0;border-radius:19px 19px 0 0;overflow:hidden}