/* AI Workflow Automation - aw-5 */
.aw-mkt{line-height:1.45;color-scheme:dark}
.aw-hero-flow{
  min-width:0;border:1px solid rgba(255,255,255,.16);background:#05080d;
  padding:16px;display:grid;gap:14px;align-content:start;position:relative;overflow:hidden
}
.aw-hero-flow:before{
  content:"";position:absolute;inset:-25% auto auto 30%;width:55%;height:50%;pointer-events:none;
  background:radial-gradient(ellipse at center,rgba(82,168,255,.16),transparent 70%)
}
.aw-hero-flow__chrome{position:relative;z-index:1;display:flex;justify-content:space-between;gap:12px;align-items:center}
.aw-hero-flow__kicker{
  margin:0;font:600 11px/1.3 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:#8ebef2
}
.aw-hero-flow__live{
  margin:0;display:inline-flex;align-items:center;gap:8px;padding:4px 10px;
  border:1px solid rgba(82,168,255,.35);background:rgba(82,168,255,.08);
  font:600 11px/1.3 var(--font-mono);letter-spacing:.04em;text-transform:uppercase;color:#cfe3ff
}
.aw-hero-flow__steps{
  position:relative;z-index:1;list-style:none;margin:0;padding:0;display:grid;gap:8px
}
.aw-hero-flow__steps li{
  margin:0;padding:12px 14px;border:1px solid rgba(255,255,255,.12);background:#0c121c;
  display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:10px;align-items:center
}
.aw-hero-flow__steps li span{
  width:28px;height:28px;display:grid;place-items:center;
  border:1px solid rgba(255,255,255,.2);font:600 12px/1 var(--font-mono);color:#8ebef2
}
.aw-hero-flow__steps li b{margin:0;font:600 14px/1.3 var(--font-sans);color:#f2f4f7}
.aw-hero-flow__steps li em{margin:0;font-style:normal;font-size:12.5px;color:#9aa6b4;justify-self:end}
.aw-hero-flow__steps li.is-done{border-color:rgba(80,200,120,.35)}
.aw-hero-flow__steps li.is-done span{border-color:rgba(80,200,120,.55);color:#b7f0c8}
.aw-hero-flow__steps li.is-hot{
  border-color:rgba(82,168,255,.55);box-shadow:inset 0 0 0 1px rgba(82,168,255,.16);
  animation:aw-hot .8s ease
}
.aw-hero-flow__steps li.is-hot span{border-color:#52a8ff;color:#cfe3ff;background:rgba(82,168,255,.12)}
.aw-hero-flow__note{position:relative;z-index:1;margin:0;font-size:12.5px;line-height:1.45;color:#9aa6b4}

.aw-demo-states{display:flex;flex-wrap:wrap;gap:8px}
.aw-demo-states button{
  min-height:40px;padding:8px 12px;border:1px solid rgba(255,255,255,.16);background:#0c121c;color:#d5dbe3;
  font:500 13px/1.3 var(--font-sans);cursor:pointer;touch-action:manipulation
}
.aw-demo-states button[aria-pressed="true"]{border-color:#52a8ff;box-shadow:inset 0 0 0 1px rgba(82,168,255,.25)}
.aw-demo-states button:focus-visible{outline:2px solid #52a8ff;outline-offset:2px}
.aw-demo-flow{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.aw-demo-flow li{
  margin:0;padding:10px 12px;border:1px solid rgba(255,255,255,.12);
  display:flex;justify-content:space-between;gap:12px;align-items:center;
  font-size:14px;color:#d5dbe3
}
.aw-demo-flow li.is-on{border-color:rgba(82,168,255,.45);background:rgba(82,168,255,.08)}
.aw-demo-flow li.is-fail{border-color:rgba(255,140,120,.45)}
.aw-demo-flow li.is-wait{border-color:rgba(255,200,100,.4)}
.aw-demo-flow b{font-weight:600;color:#f2f4f7}
.aw-demo-flow em{font-style:normal;font-size:12.5px;color:#9aa6b4}

.aw-when-not{
  margin-top:20px;padding:18px 20px;border:1px solid rgba(255,255,255,.14);background:#05080d;display:grid;gap:8px
}
.aw-when-not h3{margin:0;font:600 1.05rem/1.3 var(--font-sans);color:#f2f4f7}
.aw-when-not p{margin:0;font-size:15px;line-height:1.5;color:#d5dbe3}
.aw-when-not a{color:#8ebef2}

@keyframes aw-hot{
  from{background:rgba(82,168,255,.18)}
  to{background:#0c121c}
}
@media (prefers-reduced-motion:reduce){
  .aw-hero-flow__steps li.is-hot{animation:none}
}
@media (max-width:760px){
  .aw-hero-flow__steps li{grid-template-columns:28px minmax(0,1fr);grid-template-rows:auto auto}
  .aw-hero-flow__steps li em{justify-self:start;grid-column:2}
  .aw-demo-states button{flex:1 1 calc(50% - 8px)}
}