/* Interactive examples stay deliberately separate from real platform accounts. */
.automation-example{padding-block:38px;border-bottom:1px solid #e5d4ba;scroll-margin-top:112px;color:#282722}
.automation-example-heading{max-width:780px;margin-bottom:21px}
.automation-example h2{font:600 clamp(25px,2.65vw,34px)/1.2 var(--sans);letter-spacing:-.03em;margin:9px 0 0}
.automation-example-heading>p:last-child{font-size:16px;line-height:1.65;color:#555b65;margin-top:12px}
.automation-demo-notice{display:flex;align-items:start;gap:13px;background:#f5edde;border:1px solid #e5d4ba;border-radius:5px;padding:16px 18px;font-size:14px;line-height:1.65;color:#625741}
.automation-example .automation-notice-icon{width:24px;height:24px;flex:none;color:#b38a49}
.automation-demo-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin:26px 0;padding:0;list-style:none}
[data-automation-demo="bots"] .automation-demo-steps{grid-template-columns:repeat(3,minmax(0,1fr))}
.automation-demo-steps li{display:flex;gap:12px;align-items:center;position:relative;min-width:0;font-size:14px;font-weight:500;line-height:1.45}
.automation-demo-steps li:not(:last-child)::after{content:'→';position:absolute;right:-17px;color:#b38a49;font-weight:400}
.automation-example .automation-step-icon{width:29px;height:29px;flex:none;color:#b38a49}
.automation-demo-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:32px;align-items:start}
.automation-example h3{font:600 19px/1.4 var(--sans);letter-spacing:-.02em;margin:0}
.automation-fixture{min-width:0;background:#fffefa;border:1px solid #e5d4ba;padding:22px;border-radius:6px}
.automation-fixture dl{margin:18px 0 22px}
.automation-fixture dl>div{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.2fr);gap:14px;padding:12px 0;border-bottom:1px solid #eee4d5}
.automation-fixture dt{font-size:12px;line-height:1.6;color:#796546}
.automation-fixture dd{margin:0;font-size:14px;line-height:1.6;color:#444c57;overflow-wrap:anywhere}
.automation-actions{display:grid;gap:9px}
.automation-action,.automation-reset{font:500 14px/1.5 var(--sans);min-height:46px;cursor:pointer;touch-action:manipulation}
.automation-action{width:100%;border:1px solid #d9c19b;border-radius:4px;background:#fbf8f3;color:#443a2b;padding:11px 15px;text-align:left}
.automation-action-primary{background:#25251f;border-color:#25251f;color:#fffdfa}
.automation-action:not(:disabled):hover{background:#f2e7d3}
.automation-action-primary:not(:disabled):hover{background:#424237;color:#fffdfa}
.automation-action:disabled,.automation-reset:disabled{opacity:.45;cursor:default}
.automation-reset{background:none;border:0;border-bottom:1px solid #d9c19b;color:#7e6034;padding:9px 0;margin-top:13px}
.automation-action:focus-visible,.automation-reset:focus-visible,.automation-reference a:focus-visible{outline:2px solid #96703a;outline-offset:4px}
.automation-demo-output{min-width:0}
.automation-output-heading{display:flex;justify-content:space-between;align-items:center;gap:15px;border-bottom:1px solid #e5d4ba;padding-bottom:15px}
.automation-output-heading>span{font-size:12px;line-height:1.5;color:#796546;text-align:right}
.automation-output-heading strong{display:inline-block;font:600 18px/1.4 var(--sans);margin-left:8px;color:#282722}
.automation-event-log{padding:0;margin:18px 0;list-style:none;display:grid;gap:12px}
.automation-event{font-size:14px;line-height:1.7;color:#555b65;background:#fffefa;border:1px solid #e5d4ba;border-radius:4px;padding:15px 17px}
.automation-event-handoff,.automation-event-created,.automation-event-completed{border-left:3px solid #b38a49}
.automation-event-invalid{border-left:3px solid #a46e42;background:#fbf3e8}
.automation-event-duplicate{border-left:3px solid #9c8c71;background:#f7f2e9}
.automation-result{background:#f5edde;padding:18px;border-radius:5px;border:1px solid #e5d4ba}
.automation-result .eyebrow{font-size:10px;color:#967139;margin:0}
.automation-result>p:last-child{font-size:15px;line-height:1.65;margin-top:9px;color:#443a2b}
.automation-live-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.automation-no-js{font-size:14px;line-height:1.7;padding:18px;border:1px solid #d9c19b;margin-top:20px}
.automation-reference{font-size:12px;line-height:1.8;color:#667080;margin-top:20px}
.automation-reference a{text-decoration:underline;text-underline-offset:3px}
/* A live chat surface and an event trail, with the original demo controls. */
.automation-example{padding-block:clamp(38px,6vw,72px);color:#151412}
.automation-example-content{min-width:0}
.automation-example-heading .eyebrow{line-height:1.65}
.automation-example-heading>p:last-child{color:#655e52}
.automation-demo-notice{margin-top:0;background:#fbf8f3;color:#625b50;border-color:#dfd3c0;font-size:13px}
.automation-demo-steps{border-block:1px solid #e5d8c3;padding-block:20px;margin:24px 0;gap:20px}
.automation-demo-steps li{font-size:13px}
.automation-demo-steps li:not(:last-child)::after{right:-14px}
.automation-demo-layout{gap:24px;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
.automation-fixture{border-radius:4px;background:#fffefa;padding:21px}
.automation-fixture-heading{display:flex;align-items:center;gap:12px}
.automation-fixture-heading .concept-icon{width:26px;height:26px}
.automation-fixture-heading h3{font-size:18px}
.automation-fixture dl>div{grid-template-columns:minmax(0,1fr);gap:5px;padding-block:11px}
.automation-fixture dt{color:#655e52;font-size:12px}
.automation-fixture dd{color:#151412;font-size:14px}
.automation-action{border-radius:4px;font-size:14px}
.automation-action:disabled,.automation-reset:disabled{opacity:.6}
.automation-demo-output{border:1px solid #dfd3c0;border-radius:7px;background:#fff;box-shadow:0 8px 25px #46351a07;padding:0 17px 17px;overflow:hidden}
.automation-output-heading{margin-inline:-17px;padding:15px 17px;align-items:start;background:#fffdf9}
.automation-output-heading h3{display:flex;align-items:center;gap:9px;font-size:16px}
.automation-output-heading h3 .concept-icon{width:24px;height:24px}
.automation-output-heading>span{font-size:10px;max-width:96px;color:#655e52}
.automation-output-heading strong{font-size:16px;margin-left:5px}
.automation-event{color:#514a3e;background:#fbf8f3;border-color:#e5d8c3;font-size:14px}
.automation-example-bots .automation-event-log{gap:14px}
.automation-example-bots .automation-event{border-radius:11px 11px 11px 2px;margin-right:12px}
.automation-example-bots .automation-event-needs{margin-right:0;margin-left:14px;background:#f2f1ed;border-radius:11px 11px 2px 11px}
.automation-example-bots .automation-event-handoff{background:#fbf1dd;border-color:#ddc496}
.automation-example-crm .automation-event-log{padding-left:17px;gap:0}
.automation-example-crm .automation-event{position:relative;border:0;border-left:1px solid #d8c7a9;border-radius:0;background:none;margin:0;padding:7px 0 22px 20px}
.automation-example-crm .automation-event:before{content:'';position:absolute;width:8px;height:8px;border:2px solid #b38a49;border-radius:50%;background:#fff;left:-6px;top:12px}
.automation-example-crm .automation-event-invalid:before{border-style:dashed}
.automation-example-crm .automation-event-duplicate{color:#736650}
.automation-result{background:#f8efdf;border-color:#ddc496;border-radius:4px}
.automation-result .eyebrow{font-size:10px;color:#705629}
.automation-result>p:last-child{margin-bottom:0;font-size:14px;color:#443a2b}
.automation-reference{font-size:13px;color:#625b50}
@media(min-width:1200px){.automation-example{display:grid;grid-template-columns:minmax(0,.65fr) minmax(0,1.75fr);gap:42px;align-items:start}.automation-example-heading{margin:0}.automation-example h2{font-size:33px;line-height:1.17}.automation-fixture{padding:19px}.automation-demo-layout{gap:20px}}
@media(max-width:1000px){.automation-demo-layout{gap:23px}.automation-fixture{padding:19px}.automation-demo-steps{gap:20px}.automation-demo-steps li{font-size:13px;gap:9px}}
@media(max-width:760px){.automation-example{padding-block:30px;scroll-margin-top:24px}.automation-example h2{font-size:27px}.automation-example-heading>p:last-child{font-size:15px}.automation-demo-layout{grid-template-columns:1fr;gap:27px}.automation-demo-steps,[data-automation-demo="bots"] .automation-demo-steps{grid-template-columns:1fr 1fr;gap:20px 27px}.automation-demo-steps li:nth-child(2n)::after{display:none}.automation-fixture{padding:20px}.automation-output-heading{align-items:start}.automation-demo-notice{padding:14px}.automation-event{padding:14px}.automation-output-heading h3{font-size:18px}}
@media(max-width:359px){.automation-fixture{padding:17px}.automation-fixture dl>div{grid-template-columns:1fr;gap:4px}.automation-demo-steps,[data-automation-demo="bots"] .automation-demo-steps{grid-template-columns:1fr;gap:15px}.automation-demo-steps li::after{display:none}.automation-output-heading{flex-wrap:wrap}.automation-output-heading>span{text-align:left}}
@media(max-width:760px){.automation-example h2{font-size:29px}.automation-example-heading>p:last-child{font-size:16px}.automation-demo-output{padding:0 16px 16px}.automation-output-heading{margin-inline:-16px;padding:15px 16px}.automation-output-heading h3{font-size:16px}.automation-fixture dl>div{grid-template-columns:minmax(0,.7fr) minmax(0,1.2fr);gap:14px}.automation-demo-steps li{font-size:14px}.automation-demo-notice{font-size:13px}.automation-reference{font-size:13px}.automation-example-bots .automation-event{margin-right:0}.automation-example-bots .automation-event-needs{margin-left:8px}}
@media(max-width:420px){.automation-fixture dl>div{grid-template-columns:minmax(0,1fr);gap:4px}.automation-output-heading>span{max-width:88px}.automation-demo-steps,[data-automation-demo="bots"] .automation-demo-steps{grid-template-columns:minmax(0,1fr);gap:15px}.automation-demo-steps li::after{display:none}.automation-output-heading{flex-wrap:wrap}.automation-output-heading>span{max-width:none;text-align:left}.automation-output-heading>span strong{margin-left:8px}}
