/* Figma 590:3065 — shared by the localized AI Voice Agent pages. */
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related{position:relative;isolation:isolate;background:#f9f9f9;padding:90px 0 120px;overflow:hidden}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related:before{content:"";position:absolute;inset:0;z-index:-1;background:url('../../img/global-presence/texture.png') repeat;opacity:.05;pointer-events:none}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related>.container{width:calc(100% - 64px);max-width:1300px;margin:auto;padding:0}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-heading{display:flex;flex-direction:column;align-items:center;text-align:center;gap:16px;margin:0 0 48px}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .product-section-icon{display:none}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-eyebrow{display:inline-flex;align-items:center;gap:6px;margin:0 0 16px;padding:2px 10px;border:4px solid #f9fafc;outline:1px solid #e6e7e9;border-radius:33px;background:white;color:#495057;font-size:14px;font-weight:400;line-height:20px;letter-spacing:0}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-eyebrow:before{content:"";width:18px;height:18px;background:url('../../img/global-presence/badge.svg') center/contain no-repeat}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related h2{margin:0;font-size:48px;line-height:1.2;font-weight:400;letter-spacing:-2.4px;color:rgb(0 0 0 / 85%)}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-intro{max-width:740px;margin:0;font-size:14px;line-height:25.202px;color:rgb(0 0 0 / 65%)}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article){position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:flex-start;gap:34px;grid-column:span 2;min-height:212px;padding:24px;border:0;border-radius:16px;background:#fff;overflow:hidden;color:#000;box-sizing:border-box;transition:box-shadow .25s}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article):nth-child(n+4){grid-column:span 3}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article):before{content:"";position:absolute;inset:0;z-index:-2;background:url('../img/developers/background.png') left top/787.2px 787.2px repeat;opacity:.05;pointer-events:none}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article):after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(211.41059315312157deg,rgba(255,255,255,0) 6.5934%,#fff 52.713%);pointer-events:none}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .voice-related-icon{display:grid;place-items:center;width:44px;height:44px;box-sizing:border-box;border:1px solid #e2e2e2;border-radius:10px;background:#fff}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .voice-related-arrow{position:absolute;right:24px;top:30px;display:grid;place-items:center;width:52px;height:32px;border:1px solid white;border-radius:99px;background:#f6f7f8;box-shadow:0 1px 3px #0000000a}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .voice-related-arrow img{transition:transform .25s}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links h3{font-size:20px;line-height:1.3;font-weight:500;margin:0 0 8px;color:#000}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links p{font-size:16px;line-height:1.4;color:#667185;margin:0}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article):hover{box-shadow:0 8px 24px #00000008}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article):hover .voice-related-arrow img{transform:translateX(3px)}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article):focus-visible{outline:2px solid #2563eb;outline-offset:3px}
@media(max-width:1000px){body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links{grid-template-columns:repeat(2,minmax(0,1fr))}body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article),body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article):nth-child(n+4){grid-column:span 1}body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article):last-child{grid-column:1/-1}}
@media(max-width:600px){body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related{padding:64px 0}body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related>.container{width:calc(100% - 40px)}body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related h2{font-size:34px;letter-spacing:-1.4px}body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links{grid-template-columns:1fr}body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-heading{margin-bottom:32px}}
@media(prefers-reduced-motion:reduce){body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article),body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .voice-related-arrow img{transition:none}}

/* Match the existing icon weight; invert the whole card on hover/focus. */
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article){transition:background-color .25s,box-shadow .25s}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article):after{transition:opacity .25s}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links p,body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .voice-related-icon{transition:color .25s,background-color .25s,border-color .25s}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article):is(:hover,:focus-visible){background:#fff;box-shadow:0 24px 40px #0213441a,0 25px 18px #0213440a}

body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article):is(:hover,:focus-visible) h3{color:#fff}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article):is(:hover,:focus-visible) p{color:rgb(255 255 255 / 72%)}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article):is(:hover,:focus-visible) .voice-related-icon{background:#171717;border-color:#ffffff40}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article):is(:hover,:focus-visible) .voice-related-icon img{filter:invert(1)}
@media(prefers-reduced-motion:reduce){body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article),body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article):after,body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links p,body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .voice-related-icon{transition:none}}

/* Same circular fill and arrow exchange as the hero buttons. */
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article)>.voice-related-fill{position:absolute;inset:0;z-index:0;pointer-events:none;background:#000;clip-path:circle(0 at calc(100% - 50px) 46px);transition:clip-path .55s cubic-bezier(.22,1,.36,1)}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article)>span:not(.voice-related-fill):not(.voice-related-arrow):not(.voice-related-background){position:relative;z-index:2}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .voice-related-arrow{z-index:1;overflow:hidden}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article):is(:hover,:focus-visible)>.voice-related-fill{clip-path:circle(150% at calc(100% - 50px) 46px)}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links h3,body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links p{transition:color .35s ease}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .voice-related-arrow img{transition:transform .4s cubic-bezier(.22,1,.36,1),opacity .25s}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .voice-related-arrow:after{content:"";position:absolute;width:14px;height:12px;background:url('../img/hero-arrow.svg') center/14px 12px no-repeat;transform:translateX(-28px);opacity:0;transition:transform .4s cubic-bezier(.22,1,.36,1),opacity .25s}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article):is(:hover,:focus-visible) .voice-related-arrow img{transform:translateX(28px);opacity:0}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article):is(:hover,:focus-visible) .voice-related-arrow:after{transform:translateX(0);opacity:1}
@media(prefers-reduced-motion:reduce){body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article)>.voice-related-fill,body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .voice-related-arrow:after,body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .voice-related-arrow img,body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links h3,body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links p{transition:none}}

/* Explicit background layer on every card, above its white base. */
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article):before,body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article):after{content:none}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article)>.voice-related-background{position:absolute;inset:0;z-index:0;pointer-events:none;border-radius:inherit;overflow:hidden;background:#fff}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .voice-related-background:before{content:"";position:absolute;inset:0;background:url('../img/developers/background.png') left top/787.2px 787.2px repeat;opacity:.05}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .voice-related-background:after{content:"";position:absolute;inset:0;background:linear-gradient(211.41059315312157deg,rgba(255,255,255,0) 6.5934%,#fff 52.713%)}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article)>.voice-related-fill{z-index:1}
body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .p9-links>:is(a,article)>span:not(.voice-related-fill):not(.voice-related-background){z-index:2}

/* Keep the requested image visibly present beneath the card copy. */
html body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .voice-related-background:before{opacity:1}
html body:is([data-page="ai-voice-agent"],[data-page="ai-chat-agent"],[data-page="aicc"],[data-page="botlab"],[data-page="blog"]) #related .voice-related-background:after{background:linear-gradient(211.41059315312157deg,rgba(255,255,255,0) 6.5934%,rgba(255,255,255,.94) 72%)}

/* Six editorial cards retain article semantics and an even three-column grid. */
body[data-page="blog"] #related .p9-links>article,body[data-page="blog"] #related .p9-links>article:nth-child(n+4){grid-column:span 2;box-shadow:none;transform:none}
body[data-page="blog"] #related .blog-card-top{display:flex;align-items:center;gap:12px;position:relative;z-index:2}
body[data-page="blog"] #related .blog-card-copy{position:relative;z-index:2}
body[data-page="blog"] #related .tag{font-size:12px;line-height:20px;padding:2px 10px;border-radius:99px;background:#f3f5f8;color:#667185}
body[data-page="blog"] #related article:hover .tag{background:#ffffff1f;color:#fff}
@media(max-width:1000px){body[data-page="blog"] #related .p9-links>article,body[data-page="blog"] #related .p9-links>article:nth-child(n+4),body[data-page="blog"] #related .p9-links>article:last-child{grid-column:span 1}}
/* PaaS related solutions: base color only; retain the line texture overlay. */
html body[data-page="botlab"] #related{background-color:#ebebed}
