html body[data-page="aicc"] #channels{background:#fff url('../img/aicc-channels/background.svg') center/100% 100% no-repeat;padding:90px 0 122px}
html body[data-page="aicc"] #channels>.container{max-width:1300px;width:calc(100% - 64px);padding:0;margin:auto}
html body[data-page="aicc"] #channels .p9-heading{display:block;text-align:center;margin:0 0 48px}
html body[data-page="aicc"] #channels .product-section-icon{display:none}
html body[data-page="aicc"] #channels .p9-eyebrow{display:inline-flex;align-items:center;gap:6px;margin:0 0 12px;background:#fff;border:4px solid #f9fafc;border-radius:99px;box-shadow:0 1px 3px #0002;padding:2px 10px;color:#495057;font:400 14px/20px Arial,sans-serif;letter-spacing:0}
html body[data-page="aicc"] #channels .p9-eyebrow:before{content:"";width:18px;height:18px;background:url('../img/aicc-channels/capabilities.svg') center/contain}
html body[data-page="aicc"] #channels h2{font-size:48px;line-height:1.2;letter-spacing:-2.4px;font-weight:400;white-space:normal;max-width:none;width:100%;margin:0 0 12px;color:#000000d9}
html body[data-page="aicc"] #channels .p9-intro{max-width:744px;margin:auto;font-size:14px;line-height:25px;color:#000a}
html body[data-page="aicc"] #channels .aicc-channels-shell{display:grid;grid-template-columns:minmax(0,936fr) minmax(0,318fr);gap:12px;padding:16px;background:#e7e7e9;border:1px solid #eaecf0;border-radius:24px}
html body[data-page="aicc"] #channels .p9-call-primary{display:flex;flex-direction:column;position:relative;min-width:0;padding:0 30px 30px;border:1px solid #eaecf0;border-radius:24px;background:white;margin:0;gap:0;overflow:hidden}
html body[data-page="aicc"] #channels .p9-call-intro{display:block;padding:0;text-align:center;background:url('../img/aicc-channels/hero.svg') center 86px/calc(100% - 2px) 147px no-repeat}
html body[data-page="aicc"] #channels .p9-call-label{display:flex;align-items:center;gap:12px;height:58px;margin:0 -30px 28px;padding:0 24px;border-bottom:1px solid #e7e7e7;color:#000;background:#fff;text-align:left}
html body[data-page="aicc"] #channels .p9-call-label p{font-size:16px;font-weight:400;letter-spacing:0;margin:0}
html body[data-page="aicc"] #channels .channel-window-dots{display:flex;gap:8px;width:auto}
html body[data-page="aicc"] #channels .channel-window-dots i{width:12px;height:12px;border-radius:50%;background:#ff535b}
html body[data-page="aicc"] #channels .channel-window-dots i:nth-child(2){background:#ffbd2e}
html body[data-page="aicc"] #channels .channel-window-dots i:nth-child(3){background:#00c84b}
html body[data-page="aicc"] #channels .channel-window-chevron{display:grid;place-items:center;width:38px;height:38px;border:1px solid #e7e7e7;border-radius:12px}
html body[data-page="aicc"] #channels #managed-ai-call{font-size:48px;line-height:67px;letter-spacing:-1px;color:#000000d9;font-weight:500;margin:0 0 6px}
html body[data-page="aicc"] #channels .p9-call-description{font-size:12px;line-height:16px;color:#000a;max-width:576px;margin:0 auto 40px}
html body[data-page="aicc"] #channels .p9-call-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:auto 0 0;padding:0;list-style:none}
html body[data-page="aicc"] #channels .p9-call-points li{position:relative;isolation:isolate;display:flex;align-items:center;gap:12px;min-height:88px;padding:16px 18px;border:0;border-radius:16px;overflow:hidden;color:#000000d9;font-size:16px;font-weight:600;line-height:24px}
html body[data-page="aicc"] #channels .p9-call-points li:before{content:"";position:absolute;inset:0;z-index:-1;background:url('../img/aicc-channels/one.png') center/cover;opacity:.4}
html body[data-page="aicc"] #channels .p9-call-points li:nth-child(2):before{background-image:url('../img/aicc-channels/two.png');opacity:.5}
html body[data-page="aicc"] #channels .p9-call-points li:nth-child(3):before{background-image:url('../img/aicc-channels/three.png');opacity:.5}
html body[data-page="aicc"] #channels .p9-number{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;border:1px solid #ffffff80;border-radius:10px;background:transparent}
html body[data-page="aicc"] #channels .p9-call-support{display:grid;grid-template-columns:1fr;gap:12px;margin:0;padding:0;border:0}
html body[data-page="aicc"] #channels .p9-call-support article{display:flex;align-items:flex-start;gap:14px;min-width:0;margin:0;min-height:178px;padding:20px 24px;border:1px solid #efe7f8;border-radius:20px;background:#fff}
html body[data-page="aicc"] #channels .p9-call-support-icon{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;border:1px solid #e2e2e2;border-radius:10px;color:#000;font-size:20px}
html body[data-page="aicc"] #channels .p9-call-support h3{font-size:20px;line-height:44px;margin:0 0 4px;font-weight:500;color:#000}
html body[data-page="aicc"] #channels .p9-call-support p{font-size:16px;line-height:1.4;color:rgba(0,0,0,.45);margin:0}
@media(max-width:1200px){html body[data-page="aicc"] #channels .aicc-channels-shell{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}html body[data-page="aicc"] #channels .p9-call-points{grid-template-columns:1fr}html body[data-page="aicc"] #channels .p9-call-support article{align-items:center}html body[data-page="aicc"] #channels .p9-call-description{margin-bottom:24px}}
@media(max-width:760px){html body[data-page="aicc"] #channels{padding:64px 0}html body[data-page="aicc"] #channels>.container{width:calc(100% - 32px)}html body[data-page="aicc"] #channels h2{font-size:32px;letter-spacing:-1px}html body[data-page="aicc"] #channels .aicc-channels-shell{grid-template-columns:1fr;padding:12px}html body[data-page="aicc"] #channels .p9-call-primary{padding:0 18px 20px}html body[data-page="aicc"] #channels .p9-call-label{margin-left:-18px;margin-right:-18px;padding:0 16px;gap:8px}html body[data-page="aicc"] #channels .p9-call-label p{font-size:12px}html body[data-page="aicc"] #channels .p9-call-support article{min-height:0;padding:20px}html body[data-page="aicc"] #channels .p9-call-support p{font-size:14px}}
html body[data-page="aicc"] #channels .p9-call-intro{width:100%;max-width:none;margin:0}
/* Fade only the AI Call intro artwork, preserving full-opacity copy. */
html body[data-page="aicc"] #channels .p9-call-intro{position:relative;isolation:isolate;background:none}
html body[data-page="aicc"] #channels .p9-call-intro:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:url('../img/aicc-channels/hero.svg') center 86px/calc(100% - 2px) 147px no-repeat;opacity:.5}
/* Figma 743:94 — raised tab outline, keeping the tab geometry at narrow widths. */
html body[data-page="aicc"] #channels .p9-call-label{position:relative;isolation:isolate;border-bottom:0;background:#fff;padding:14px 24px 0;height:58px;box-sizing:border-box;gap:12px}
html body[data-page="aicc"] #channels .p9-call-label:before{content:"";position:absolute;left:0;right:0;bottom:0;height:44px;z-index:-1;pointer-events:none;background:url('../img/aicc-channels/toolbar-743-94.svg') left bottom/931.5px 44px no-repeat}
html body[data-page="aicc"] #channels .p9-call-label p{width:166px;flex:0 0 166px;text-align:center;line-height:22px;white-space:nowrap;margin:0;font-size:16px}
html body[data-page="aicc"] #channels .channel-window-dots{flex:0 0 52px}
html body[data-page="aicc"] #channels .channel-window-chevron{flex:0 0 38px;box-sizing:border-box}
@media(max-width:760px){html body[data-page="aicc"] #channels .p9-call-label{padding-left:16px;gap:12px}html body[data-page="aicc"] #channels .p9-call-label p{width:182px;flex-basis:182px;font-size:14px}}

/* Exact grouped window controls from Figma 749:7164. */
html body[data-page="aicc"] #channels .channel-window-controls{display:block;width:102px;height:38px;flex:0 0 102px;object-fit:contain}
/* Let the raised tab follow localized copy, with 12px on each side. */
html body[data-page="aicc"] #channels .p9-call-label:before{height:1px;background:#e7e7e7}
html body[data-page="aicc"] #channels .p9-call-label p{position:relative;align-self:stretch;display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:auto;flex:0 0 auto;padding:0 12px;border:1px solid #e7e7e7;border-bottom:0;border-radius:12px 12px 0 0;background:#fff;line-height:22px}
/* Keep the dotted section artwork at 50% without fading its content. */
html body[data-page="aicc"] #channels{position:relative;isolation:isolate;background:#fff}
html body[data-page="aicc"] #channels:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:url('../img/aicc-channels/background.svg') center/100% 100% no-repeat;opacity:.5}
/* Rounded 12px shoulders where the raised tab joins the toolbar baseline. */
html body[data-page="aicc"] #channels .p9-call-label p:before,
html body[data-page="aicc"] #channels .p9-call-label p:after{content:"";position:absolute;bottom:0;width:12px;height:12px;background:#fff;pointer-events:none;box-sizing:border-box}
html body[data-page="aicc"] #channels .p9-call-label p:before{left:-12px;border-right:1px solid #e7e7e7;border-bottom:1px solid #e7e7e7;border-bottom-right-radius:12px;box-shadow:4px 4px 0 3px #fff}
html body[data-page="aicc"] #channels .p9-call-label p:after{right:-12px;border-left:1px solid #e7e7e7;border-bottom:1px solid #e7e7e7;border-bottom-left-radius:12px;box-shadow:-4px 4px 0 3px #fff}
html body[data-page="aicc"] #channels .p9-call-points .p9-number img{display:block;width:24px;height:24px;max-width:none;object-fit:contain;flex:none}
html body[data-page="aicc"] #channels .channel-window-controls{transform:translateY(-6px)}
