/* AI selection section; independent from the legacy chat mockup. */
#agent{background:#edf0e7;padding-block:92px;overflow:hidden}
#agent .agent-layout{grid-template-columns:minmax(0,.95fr) minmax(0,1.15fr);gap:64px;align-items:center}
.agent-copy .eyebrow{font-size:9px;letter-spacing:.08em;margin-bottom:25px}
.agent-copy h2{font-size:clamp(64px,6.4vw,92px);line-height:.94;letter-spacing:-.055em;font-weight:500;margin-bottom:28px}
.agent-copy h2>span{color:var(--orange)}
.agent-lead{font-size:25px;line-height:1.25;letter-spacing:-.7px;font-family:var(--display);margin-bottom:16px}
.agent-intro{font-size:14px;line-height:1.8;color:#6b7463;max-width:440px}
.agent-benefits{display:grid;gap:21px;margin-top:29px;max-width:450px}
.agent-benefits>div{display:flex;gap:17px}.agent-benefits>div>span{font:10px var(--mono);color:#7a886a;padding-top:4px}
.agent-benefits h3{font-size:19px;letter-spacing:-.3px;margin-bottom:6px}.agent-benefits p{font-size:12px;line-height:1.7;color:#6b7463}
.agent-channels{border-top:1px solid #cfd7c4;margin-top:31px;padding-top:23px;max-width:450px}
.agent-channels>p{font:8px/1.6 var(--mono);letter-spacing:.07em;color:#738067;margin-bottom:20px}
.agent-channel-list{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;align-items:start}
.agent-channel{display:flex;align-items:center;flex-direction:column;gap:12px;font-size:12px}
.agent-channel img{width:48px;height:48px;object-fit:contain}
.agent-api{height:48px;display:grid;place-items:center;font:600 29px var(--mono);letter-spacing:-2px;color:#445534}
.agent-workspace{background:#fff;border:1px solid #d6ddcb;border-radius:19px;box-shadow:0 24px 70px -25px #3b4c2e35;overflow:hidden;min-width:0;transform:rotate(.4deg)}
.agent-windowbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:19px 24px;border-bottom:1px solid #e5eadf;background:#fcfdf9}
.agent-windowbar>b{font-family:var(--display);font-size:23px;font-weight:700;letter-spacing:-1px}.agent-windowbar>b>span{font:11px var(--mono);color:#78856d;letter-spacing:-.3px}
.agent-demo-label{font:7px var(--mono);letter-spacing:.05em;color:#6d7d5d;border:1px solid #d2dfc2;border-radius:20px;padding:6px 9px;white-space:nowrap}
.agent-network{height:154px;position:relative;background:radial-gradient(ellipse at 50% 50%,#e2f5b8 0%,#f3f8e9 51%,#fbfcf7 100%);overflow:hidden}
.agent-network:before{content:'';position:absolute;inset:0;background-image:radial-gradient(#a7b395 1px,transparent 1px);background-size:13px 13px;opacity:.2;mask-image:linear-gradient(90deg,transparent,#000 20%,#000 80%,transparent)}
.agent-connections{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#a5ba8b;stroke-width:1.3;stroke-dasharray:4 4}
.agent-node{position:absolute;background:#ffffffdc;border:1px solid #dce6cf;box-shadow:0 4px 12px #5a73310a;border-radius:7px;padding:9px 12px;font-size:10px;white-space:nowrap;display:flex;align-items:center;gap:9px;z-index:2}
.agent-node>span{font-size:16px;color:#69834c}.agent-node-a{left:5%;top:21px}.agent-node-b{left:5%;bottom:22px}.agent-node-c{right:5%;top:21px}.agent-node-d{right:5%;bottom:22px}
.agent-core{position:absolute;width:142px;height:142px;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center}
.agent-orbit{position:absolute;inset:8px;border:1px solid #9dbd6f66;border-radius:50%;transform:rotate(-25deg) scaleX(.72)}.agent-orbit-two{transform:rotate(40deg) scaleX(.72);inset:0}
.agent-orbit:after{content:'';position:absolute;top:8px;left:12px;width:7px;height:7px;border-radius:50%;background:#8caa61;box-shadow:0 0 0 5px #d8edb3}
.agent-core-center{width:83px;height:83px;background:radial-gradient(circle at 30% 15%,#617d47,#293c23 75%);border:1px solid #647b47;border-radius:26px;box-shadow:inset 0 2px 4px #cce7aa55,0 8px 22px #3b592b2a;display:flex;align-items:center;justify-content:center;gap:2px;color:#e5f7c6;transform:rotate(-8deg)}
.agent-core-center svg{width:33px;height:33px;fill:#d9f1aa}.agent-core-center b{font:500 25px var(--display);letter-spacing:-1px}
.agent-scenarios{display:flex;gap:6px;padding:17px 22px 0}.agent-scenarios button{flex:1;white-space:nowrap;border:1px solid #dce2d5;background:#fff;border-radius:7px;font-size:11px;padding:10px 6px;transition:background .15s,color .15s}.agent-scenarios button:hover{background:#eef3e7}.agent-scenarios button.active{background:#2f3d2b;border-color:#2f3d2b;color:#fff}
.agent-conversation{padding:19px 23px 17px}.agent-request{background:#f0f3eb;padding:13px 16px;border-radius:10px 10px 2px 10px;border:1px solid #e4eadc;margin-left:27px;min-height:91px}
.agent-message-label{display:flex;justify-content:space-between;gap:8px;font:7px var(--mono);letter-spacing:.04em;color:#748268;margin-bottom:8px}.agent-message-label>span{color:#87917e}.agent-request p{font-size:12px;line-height:1.6}
.agent-response{display:flex;gap:12px;margin:17px 0 15px;align-items:flex-start}.agent-response-mark{display:grid;place-items:center;flex:0 0 30px;height:30px;background:#e6f1d5;border-radius:8px;color:#506d34;font-size:25px;line-height:1}.agent-response b{font-size:13px;font-weight:600}.agent-response p{font-size:11px;line-height:1.6;color:#74806c;margin-top:5px}
.agent-workflow{display:flex;list-style:none;padding:0 0 16px;margin:0 0 14px;border-bottom:1px solid #e7ebdf;gap:10px;justify-content:space-between}
.agent-workflow li{display:flex;align-items:center;gap:5px;white-space:nowrap;font-size:8px;color:#909885}.agent-workflow li>span{font:7px var(--mono);width:17px;height:17px;display:grid;place-items:center;border-radius:50%;background:#f0f2ec;color:#8b957d}.agent-workflow .done{color:#62843f}.agent-workflow .done>span{background:#e1edcf;color:#507032}.agent-workflow .current{color:#b15b33}.agent-workflow .current>span{background:#f9e8d7;color:#b15b33}
.agent-parts-header{display:flex;justify-content:space-between;gap:8px;font:7px var(--mono);letter-spacing:.03em;color:#859077;margin-bottom:9px}.agent-parts-header>span:last-child{color:#526342;font-size:8px}
.agent-parts{display:flex;flex-direction:column;gap:7px;min-height:193px}.agent-part{display:grid;grid-template-columns:49px minmax(0,1fr) auto;align-items:center;gap:12px;border:1px solid #e4e9dc;border-radius:9px;padding:8px 12px 8px 8px;background:#fff}.agent-part-art{width:49px;height:43px;border-radius:6px;display:grid;place-items:center;background:#f1f3ed}.agent-part-art svg{width:43px;height:38px;fill:none;stroke:#67765a;stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round}.agent-part h4{font:500 13px var(--font);letter-spacing:-.2px;margin:0 0 4px}.agent-part p{font-size:9px;color:#8a937f}.agent-part-status{font:8px var(--mono);color:#6d7d5d;border:1px solid #e3e9d9;padding:5px 7px;border-radius:20px;white-space:nowrap}
.agent-parts[data-count="1"] .agent-part{flex:1;grid-template-columns:110px minmax(0,1fr);position:relative;padding:20px;column-gap:20px}.agent-parts[data-count="1"] .agent-part-art{width:110px;height:110px;background:#eef2e6}.agent-parts[data-count="1"] svg{width:96px;height:96px}.agent-parts[data-count="1"] h4{font-size:17px}.agent-parts[data-count="1"] p{font-size:11px;line-height:1.6}.agent-parts[data-count="1"] .agent-part-status{grid-column:2;width:max-content;margin-top:-35px}
.agent-footnote{font-size:8px;color:#8a9380;line-height:1.6;margin-top:12px;max-width:470px}
.agent-try{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:17px 24px;background:#f4f8ed;border-top:1px solid #e0e8d6;font-size:11px;font-weight:500}.agent-try>span{font-size:20px;color:#6d8850}.agent-try:hover{background:#e5efcf}
@media(min-width:1500px){#agent .agent-layout{gap:90px}}
@media(max-width:1150px){#agent .agent-layout{gap:32px;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}.agent-copy h2{font-size:67px}.agent-intro{font-size:13px}.agent-node{font-size:8px;padding:8px;gap:5px}.agent-core{width:124px;height:124px}.agent-demo-label{font-size:6px}.agent-scenarios{padding-inline:16px}.agent-conversation{padding-inline:17px}.agent-request{margin-left:15px}.agent-workflow{gap:6px}.agent-part{gap:9px}.agent-benefits h3{font-size:17px}}
@media(max-width:900px){#agent .agent-layout{grid-template-columns:1fr;gap:40px;max-width:690px}.agent-copy h2{font-size:80px}.agent-copy h2 br{display:none}.agent-copy h2>span:before{content:' '}.agent-lead br{display:none}.agent-intro,.agent-benefits,.agent-channels{max-width:none}.agent-copy .eyebrow{font-size:9px}.agent-benefits{grid-template-columns:1fr 1fr;gap:25px}.agent-channel-list{display:flex;gap:42px}.agent-workspace{transform:none}.agent-node{font-size:10px;padding:9px 12px}.agent-core{width:142px;height:142px}.agent-demo-label{font-size:7px}.agent-conversation{padding-inline:23px}.agent-scenarios{padding-inline:22px}.agent-request{margin-left:27px}.agent-part h4{font-size:14px}.agent-part p{font-size:10px}}
@media(max-width:600px){#agent{padding-block:55px}#agent .agent-layout{gap:33px}.agent-copy .eyebrow{font-size:7px;letter-spacing:.04em;margin-bottom:22px}.agent-copy h2{font-size:66px;margin-bottom:22px}.agent-copy h2 br{display:block}.agent-copy h2>span:before{content:none}.agent-lead{font-size:24px;max-width:280px}.agent-lead br{display:block}.agent-intro{font-size:13px;line-height:1.75}.agent-benefits{grid-template-columns:1fr;gap:20px;margin-top:24px}.agent-benefits h3{font-size:19px}.agent-benefits p{font-size:12px}.agent-channels{margin-top:25px;padding-top:20px}.agent-channels>p{font-size:7px}.agent-channel-list{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.agent-channel{font-size:11px}.agent-channel img{width:44px;height:44px}.agent-api{height:44px;font-size:28px}.agent-windowbar{padding:15px}.agent-windowbar>b{font-size:22px}.agent-windowbar>b>span{font-size:9px}.agent-demo-label{font-size:5.5px;padding:5px 6px}.agent-network{height:142px}.agent-node{font-size:7.5px;padding:7px;gap:4px}.agent-node>span{font-size:12px}.agent-node-a,.agent-node-b{left:3%}.agent-node-c,.agent-node-d{right:3%}.agent-node-a,.agent-node-c{top:23px}.agent-node-b,.agent-node-d{bottom:23px}.agent-core{width:110px;height:110px}.agent-core-center{width:66px;height:66px;border-radius:21px}.agent-core-center svg{width:27px;height:27px}.agent-core-center b{font-size:21px}.agent-orbit:after{width:5px;height:5px;box-shadow:0 0 0 3px #d8edb3}.agent-scenarios{padding:14px 12px 0;gap:4px}.agent-scenarios button{font-size:9px;padding:10px 3px}.agent-conversation{padding:15px 13px}.agent-request{margin-left:12px;padding:12px}.agent-message-label{font-size:6px}.agent-request p{font-size:11px}.agent-response{gap:9px}.agent-response b{font-size:12px}.agent-response p{font-size:10px}.agent-workflow{gap:5px}.agent-workflow li{font-size:6.5px;gap:3px}.agent-workflow li>span{width:14px;height:14px;font-size:6px}.agent-parts-header{font-size:6px}.agent-parts-header>span:last-child{font-size:7px}.agent-part{gap:8px;padding:7px;grid-template-columns:42px minmax(0,1fr) auto}.agent-part-art{width:42px;height:43px}.agent-part-art svg{width:38px}.agent-part h4{font-size:11px}.agent-part p{font-size:8px}.agent-part-status{font-size:6px;padding:4px 5px}.agent-parts[data-count="1"] .agent-part{grid-template-columns:85px minmax(0,1fr);padding:14px;gap:12px}.agent-parts[data-count="1"] .agent-part-art{width:85px;height:100px}.agent-parts[data-count="1"] svg{width:75px;height:75px}.agent-parts[data-count="1"] h4{font-size:15px}.agent-parts[data-count="1"] p{font-size:10px}.agent-footnote{font-size:7px}.agent-try{padding:15px;font-size:10px}}
@media(prefers-reduced-motion:reduce){.agent-scenarios button{transition:none}}

/* The customer request is the primary focal point of the messenger demo. */
#agent .agent-request{margin-left:0;min-height:180px;padding:23px 25px 25px;background:#fff3e7;border:1.5px solid #db9a72;border-left:4px solid var(--orange);border-radius:13px 13px 3px 13px;box-shadow:0 7px 22px #ac633315}
#agent .agent-message-label{align-items:center;flex-wrap:wrap;gap:10px;font:600 14px/1.4 var(--font);letter-spacing:0;color:#9d452b;margin-bottom:15px}
#agent .agent-message-label>span{font:8px/1.4 var(--mono);letter-spacing:.03em;color:#9b6852;border:1px solid #ead2bd;border-radius:20px;padding:5px 8px}
#agent .agent-request p{font-size:21px;line-height:1.55;letter-spacing:-.3px;color:#322e27;font-weight:500}
#agent .agent-network{filter:saturate(.55);opacity:.8}
#agent .agent-scenarios button.active{background:#e7ecdf;border-color:#c9d3bd;color:#4e5b42}
#agent .agent-response b,#agent .agent-part h4{color:#59634f}
#agent .agent-response-mark{background:#edf1e6;color:#7e8c6c}
#agent .agent-part{background:#fafbf8;border-color:#e9ece3}
#agent .agent-part-art{filter:saturate(.65)}
@media(max-width:600px){#agent .agent-request{min-height:208px;padding:18px 17px 21px}#agent .agent-message-label{font-size:13px;margin-bottom:13px;gap:8px}#agent .agent-message-label>span{font-size:7px;padding:4px 6px}#agent .agent-request p{font-size:18px;line-height:1.6;letter-spacing:-.2px}}
