/* =========================================================
   AI Agents — product page
   Loaded after /index.css (palette, fonts, nav, footer, --u).
   Every class is prefixed ag- : several short names used by
   this page (.hero, .insights, .card, .voice, .badge, .bars)
   already mean something on the homepage.
   ========================================================= */

.ag {
  --pad: calc(67 * var(--u));
  --ui-line:  #eaeaea;
  --ui-line2: #dcdcd6;
  --ui-soft:  #f6f6f3;
  --ui-soft2: #f0f0ec;
  --ui-text:  #2a2a2a;
  --ui-muted: #6d6d6d;
  --ui-faint: #9a9a9a;
  --lime-tint: #effcb5;
  --lime-wash: #f8fde6;
  --lime-line: #d6ef9c;
  --lime-ink:  #3f5a00;
  --amber:      #fff1d2;
  --amber-ink:  #8a5600;
  --amber-line: #f2dea9;
  --r-sm: calc(8 * var(--u));
  --r:    calc(12 * var(--u));
  --r-lg: calc(18 * var(--u));
  --r-xl: calc(24 * var(--u));
  --sh:    0 1px 2px rgba(17, 19, 24, .04), 0 calc(12 * var(--u)) calc(30 * var(--u)) calc(-14 * var(--u)) rgba(17, 19, 24, .14);
  --sh-lg: 0 1px 2px rgba(17, 19, 24, .04), 0 calc(34 * var(--u)) calc(72 * var(--u)) calc(-36 * var(--u)) rgba(17, 19, 24, .28);
  --ease: cubic-bezier(.22, .8, .26, 1);
  --mono: ui-monospace, "SF Mono", "Cascadia Mono", Menlo, Consolas, monospace;
  display: block;
  color: var(--ink);
}
.ag *, .ag *::before, .ag *::after { box-sizing: border-box; }
.ag h1, .ag h2, .ag h3, .ag p, .ag ul, .ag ol, .ag dl, .ag dd, .ag figure { margin: 0; }
.ag ul, .ag ol { padding: 0; list-style: none; }
.ag [hidden] { display: none !important; }
.ag section[id] { scroll-margin-top: calc(24 * var(--u)); }
.ag .i { width: calc(18 * var(--u)); height: calc(18 * var(--u)); flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ag .sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- type ---------- */
.ag-eyebrow {
  display: inline-flex; align-items: center; gap: calc(10 * var(--u));
  margin: 0 0 calc(22 * var(--u));
  font-size: calc(15 * var(--u)); font-weight: 700; letter-spacing: .09em; text-transform: uppercase;
  color: var(--lime-ink);
}
.ag-eyebrow::before { content: ""; width: calc(9 * var(--u)); height: calc(9 * var(--u)); border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 calc(3 * var(--u)) var(--lime-tint); }
.ag-eyebrow .num { color: var(--ink); }
.ag-h1, .ag-h2, .ag-h3 { font-family: var(--font-head); font-weight: 500; color: var(--ink); }
.ag-h1 { font-size: calc(80 * var(--u)); line-height: calc(86 * var(--u)); letter-spacing: -.04em; }
.ag-h1, .ag-h2, .ag-h3 { text-wrap: balance; }
.ag-statement, .ag-body, .ag-principle { text-wrap: pretty; }
.ag-h2 { font-size: calc(56 * var(--u)); line-height: calc(63 * var(--u)); letter-spacing: -.035em; }
.ag-h3 { font-size: calc(36 * var(--u)); line-height: calc(44 * var(--u)); letter-spacing: -.03em; }
.ag .dim { color: #8c8c8c; }
.ag-lead { font-size: calc(21 * var(--u)); line-height: calc(31 * var(--u)); font-weight: 500; letter-spacing: -.015em; color: var(--ink); }
.ag-body { margin-top: calc(18 * var(--u)); font-size: calc(18 * var(--u)); line-height: calc(29 * var(--u)); color: var(--muted); }
.ag-statement {
  margin-top: calc(30 * var(--u)); padding-left: calc(18 * var(--u));
  border-left: calc(3 * var(--u)) solid var(--lime);
  font-family: var(--font-head); font-size: calc(24 * var(--u)); line-height: calc(32 * var(--u)); font-weight: 500; letter-spacing: -.02em;
}
.ag-statement.sm { font-size: calc(21 * var(--u)); line-height: calc(29 * var(--u)); margin-top: calc(24 * var(--u)); }
.ag-label { display: inline-flex; align-items: center; gap: calc(8 * var(--u)); font-size: calc(13.5 * var(--u)); font-weight: 600; color: var(--ui-text); }
.ag-label .i { width: calc(16 * var(--u)); height: calc(16 * var(--u)); color: var(--lime-ink); }
.ag-mono { font-family: var(--mono); font-size: calc(12.5 * var(--u)); color: var(--ui-faint); letter-spacing: 0; }
.ag-mono b { color: var(--ink); font-weight: 600; }
.ag-k { display: block; font-size: calc(11.5 * var(--u)); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ui-faint); }

/* ---------- buttons & links (on top of the site's .btn) ---------- */
.ag .btn .i { width: calc(20 * var(--u)); height: calc(20 * var(--u)); transition: transform .25s var(--ease); }
.ag .btn:hover .i { transform: translateX(2px); }
.ag-link {
  display: inline-flex; align-items: center; gap: calc(10 * var(--u));
  padding-bottom: calc(3 * var(--u)); border-bottom: 1px solid currentColor;
  font-size: calc(19 * var(--u)); font-weight: 500; color: var(--ink);
}
.ag-link .play { display: grid; place-items: center; width: calc(26 * var(--u)); height: calc(26 * var(--u)); border-radius: 50%; background: var(--ink); color: var(--lime); }
.ag-link .play .i { width: calc(11 * var(--u)); height: calc(11 * var(--u)); fill: currentColor; stroke: none; }
.ag-cta { display: flex; flex-wrap: wrap; align-items: center; gap: calc(18 * var(--u)) calc(32 * var(--u)); }
.ag-cta.center { justify-content: center; }
.ag-mini-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: calc(6 * var(--u));
  height: calc(34 * var(--u)); padding: 0 calc(13 * var(--u)); border-radius: calc(9 * var(--u));
  border: 1px solid var(--ui-line2); background: #fff;
  font: inherit; font-size: calc(13 * var(--u)); font-weight: 600; color: var(--ink); white-space: nowrap;
}
.ag-mini-btn .i { width: calc(13 * var(--u)); height: calc(13 * var(--u)); }
.ag-mini-btn.dark { background: var(--ink); border-color: var(--ink); color: var(--lime); }
.ag-mini-btn.lime { background: var(--lime); border-color: var(--lime); color: var(--ink); }

/* ---------- small UI ---------- */
.ag-live { display: inline-flex; align-items: center; gap: calc(7 * var(--u)); height: calc(26 * var(--u)); padding: 0 calc(11 * var(--u)); border-radius: 999px; background: var(--lime-tint); color: var(--lime-ink); font-size: calc(12.5 * var(--u)); font-weight: 700; }
.ag-pulse { width: calc(7 * var(--u)); height: calc(7 * var(--u)); border-radius: 50%; background: var(--lime-ink); animation: agPulse 2.4s var(--ease) infinite; }
@keyframes agPulse { 0% { box-shadow: 0 0 0 0 rgba(122, 170, 20, .45); } 70% { box-shadow: 0 0 0 7px rgba(122, 170, 20, 0); } 100% { box-shadow: 0 0 0 0 rgba(122, 170, 20, 0); } }
.ag-st { display: inline-flex; align-items: center; gap: calc(5 * var(--u)); height: calc(25 * var(--u)); padding: 0 calc(10 * var(--u)); border-radius: 999px; border: 1px solid transparent; font-size: calc(12.5 * var(--u)); font-weight: 600; white-space: nowrap; }
.ag-st .i { width: calc(13 * var(--u)); height: calc(13 * var(--u)); stroke-width: 2.4; }
.ag-st.ok { background: var(--lime-tint); color: var(--lime-ink); border-color: var(--lime-line); }
.ag-st.esc { background: var(--amber); color: var(--amber-ink); border-color: var(--amber-line); }
.ag-st.wait { background: var(--ui-soft2); color: var(--ui-text); border-color: var(--ui-line); }
.ag-av { display: grid; place-items: center; flex: none; width: calc(36 * var(--u)); height: calc(36 * var(--u)); border-radius: 50%; border: 1px solid var(--ui-line); background: var(--ui-soft2); color: var(--ui-text); font-size: calc(13.5 * var(--u)); font-weight: 700; }
.ag-av.sm { width: calc(30 * var(--u)); height: calc(30 * var(--u)); font-size: calc(11.5 * var(--u)); }
.ag-av.dr { background: var(--ink); border-color: var(--ink); color: var(--lime); }
.ag-agent { display: grid; place-items: center; flex: none; width: calc(34 * var(--u)); height: calc(34 * var(--u)); border-radius: calc(10 * var(--u)); background: var(--ink); color: var(--lime); }
.ag-agent .i { width: calc(17 * var(--u)); height: calc(17 * var(--u)); }
.ag-agent.sm { width: calc(24 * var(--u)); height: calc(24 * var(--u)); border-radius: calc(7 * var(--u)); }
.ag-agent.sm .i { width: calc(13 * var(--u)); height: calc(13 * var(--u)); }
.ag-agent.xs { width: calc(21 * var(--u)); height: calc(21 * var(--u)); border-radius: calc(6 * var(--u)); }
.ag-agent.xs .i { width: calc(12 * var(--u)); height: calc(12 * var(--u)); }
.ag-dots { display: inline-flex; gap: calc(6 * var(--u)); }
.ag-dots i { width: calc(10 * var(--u)); height: calc(10 * var(--u)); border-radius: 50%; background: var(--ui-line2); }
.ag-chip { display: inline-flex; align-items: center; height: calc(28 * var(--u)); padding: 0 calc(11 * var(--u)); border-radius: calc(8 * var(--u)); border: 1px solid var(--ui-line); background: var(--ui-soft); font-size: calc(13 * var(--u)); font-weight: 500; color: var(--ui-text); white-space: nowrap; }
.ag-chips { display: flex; flex-wrap: wrap; gap: calc(6 * var(--u)); }
.ag-badge { display: inline-flex; align-items: center; gap: calc(7 * var(--u)); height: calc(32 * var(--u)); padding: 0 calc(13 * var(--u)); border-radius: calc(9 * var(--u)); border: 1px solid var(--lime-line); background: var(--lime-tint); color: var(--lime-ink); font-size: calc(14 * var(--u)); font-weight: 600; }
.ag-badge .i { width: calc(15 * var(--u)); height: calc(15 * var(--u)); }
.ag-code { margin-left: calc(6 * var(--u)); padding: calc(2 * var(--u)) calc(8 * var(--u)); border-radius: calc(6 * var(--u)); background: var(--ui-soft2); font-family: var(--mono); font-size: calc(12.5 * var(--u)); color: var(--ui-text); }
.ag-spin { width: calc(13 * var(--u)); height: calc(13 * var(--u)); border-radius: 50%; border: 2px solid var(--ui-line2); border-top-color: var(--ui-text); animation: agSpin .8s linear infinite; }
@keyframes agSpin { to { transform: rotate(360deg); } }

.ag-panel { position: relative; border: 1px solid var(--ui-line); border-radius: var(--r-lg); background: #fff; box-shadow: var(--sh); }
.ag-panel-head { display: flex; align-items: center; justify-content: space-between; gap: calc(12 * var(--u)); padding: calc(15 * var(--u)) calc(20 * var(--u)); border-bottom: 1px solid var(--ui-line); }

.ag-msg { position: relative; max-width: 88%; padding: calc(11 * var(--u)) calc(14 * var(--u)); border-radius: calc(15 * var(--u)); font-size: calc(14.5 * var(--u)); line-height: 1.45; letter-spacing: -.01em; }
.ag-msg p { margin: 0; }
.ag-msg time { display: block; margin-top: calc(3 * var(--u)); font-size: calc(11.5 * var(--u)); color: var(--ui-faint); text-align: right; }
.ag-msg.in { align-self: flex-start; background: var(--ui-soft2); border-bottom-left-radius: calc(4 * var(--u)); }
.ag-msg.out { align-self: flex-end; background: var(--ink); color: #fff; border-bottom-right-radius: calc(4 * var(--u)); }
.ag-msg.out b { color: var(--lime); font-weight: 600; }
.ag-msg-slots { display: flex; flex-wrap: wrap; gap: calc(5 * var(--u)); margin-top: calc(8 * var(--u)); }
.ag-msg-slots span { padding: calc(3 * var(--u)) calc(8 * var(--u)); border-radius: calc(6 * var(--u)); border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.1); font-size: calc(12.5 * var(--u)); }
.ag-msg-slots span:first-child { border-color: var(--lime); background: rgba(199, 243, 104, .22); color: var(--lime); }
.ag-typing { align-self: flex-end; display: inline-flex; gap: calc(4 * var(--u)); padding: calc(12 * var(--u)) calc(14 * var(--u)); border-radius: calc(15 * var(--u)); background: var(--ui-soft2); }
.ag-typing i { width: calc(5 * var(--u)); height: calc(5 * var(--u)); border-radius: 50%; background: var(--ui-faint); animation: agType 1.1s infinite; }
.ag-typing i:nth-child(2) { animation-delay: .15s; }
.ag-typing i:nth-child(3) { animation-delay: .3s; }
@keyframes agType { 0%, 60%, 100% { transform: none; opacity: .5; } 30% { transform: translateY(-3px); opacity: 1; } }
@keyframes agIn { from { opacity: 0; transform: translateY(8px) scale(.98); } to { opacity: 1; transform: none; } }

.ag-kv > div { display: flex; align-items: center; justify-content: space-between; gap: calc(16 * var(--u)); padding: calc(9 * var(--u)) 0; }
.ag-kv > div + div { border-top: 1px solid var(--ui-line); }
.ag-kv dt { font-size: calc(13.5 * var(--u)); color: var(--ui-muted); white-space: nowrap; }
.ag-kv dd { display: inline-flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: calc(6 * var(--u)); font-size: calc(14.5 * var(--u)); font-weight: 600; text-align: right; }
.ag-kv dd .i { width: calc(15 * var(--u)); height: calc(15 * var(--u)); }

/* ---------- section scaffolding ---------- */
.ag-sec { position: relative; padding: calc(136 * var(--u)) var(--pad); border-top: 1px solid var(--rule); }
.ag-sec.soft::before { content: ""; position: absolute; inset: 0 auto 0 50%; width: 100vw; transform: translateX(-50%); background: #fafaf8; z-index: -1; }
.ag-sec.soft { isolation: isolate; }
.ag-sec.soft::after { content: ""; position: absolute; top: 0; bottom: 0; left: -1px; right: -1px; border-left: 1px solid var(--rule); border-right: 1px solid var(--rule); pointer-events: none; }
.ag-head { display: grid; grid-template-columns: minmax(0, 1fr) calc(480 * var(--u)); column-gap: calc(80 * var(--u)); align-items: end; margin-bottom: calc(64 * var(--u)); }
.ag-head .ag-body { margin-top: 0; }
.ag-head.center { display: block; text-align: center; }
.ag-head.center .ag-h2 { max-width: calc(900 * var(--u)); margin: 0 auto; }
.ag-head.center .ag-body { max-width: calc(720 * var(--u)); margin: calc(22 * var(--u)) auto 0; }

/* =========================================================
   HERO
   ========================================================= */
.ag-hero { position: relative; padding: calc(104 * var(--u)) var(--pad) calc(96 * var(--u)); }
.ag-hero__grid {
  position: absolute; top: 0; left: 0; right: 0; height: calc(560 * var(--u)); pointer-events: none;
  background-image: linear-gradient(to right, var(--grid-line) 1px, transparent 1px), linear-gradient(to bottom, var(--grid-line) 1px, transparent 1px);
  background-size: calc(100% / 11) calc(560 * var(--u) / 5); background-position: -1px -1px;
  -webkit-mask-image: linear-gradient(#000 50%, transparent); mask-image: linear-gradient(#000 50%, transparent);
}
.ag-hero__copy { position: relative; }
.ag-hero__row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; column-gap: calc(64 * var(--u)); margin-top: calc(34 * var(--u)); }
.ag-hero__row .ag-body { margin: 0; max-width: calc(760 * var(--u)); font-size: calc(20 * var(--u)); line-height: calc(31 * var(--u)); }

.ag-stage { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) calc(318 * var(--u)); column-gap: calc(12 * var(--u)); align-items: end; margin-top: calc(84 * var(--u)); }
.ag-ws { position: relative; z-index: 2; overflow: hidden; border: 1px solid var(--ui-line); border-radius: var(--r-xl); background: #fff; box-shadow: var(--sh-lg); }
.ag-ws-bar { display: flex; align-items: center; gap: calc(16 * var(--u)); height: calc(56 * var(--u)); padding: 0 calc(18 * var(--u)); border-bottom: 1px solid var(--ui-line); background: var(--ui-soft); }
.ag-ws-title { display: inline-flex; align-items: center; gap: calc(9 * var(--u)); font-size: calc(14.5 * var(--u)); font-weight: 600; }
.ag-replay { margin-left: auto; display: inline-flex; align-items: center; gap: calc(6 * var(--u)); height: calc(32 * var(--u)); padding: 0 calc(12 * var(--u)); border: 1px solid var(--ui-line); border-radius: calc(8 * var(--u)); background: #fff; font: inherit; font-size: calc(13 * var(--u)); font-weight: 500; color: var(--ui-text); cursor: pointer; transition: border-color .2s; }
.ag-replay:hover { border-color: var(--ink); }
.ag-replay .i { width: calc(14 * var(--u)); height: calc(14 * var(--u)); }
.ag-ws-grid { display: grid; grid-template-columns: 1.1fr 1fr 1fr; min-height: calc(470 * var(--u)); }
.ag-ws-col { min-width: 0; padding: calc(20 * var(--u)); }
.ag-ws-col + .ag-ws-col { border-left: 1px solid var(--ui-line); }
.ag-col-head { display: flex; align-items: center; justify-content: space-between; gap: calc(10 * var(--u)); min-height: calc(54 * var(--u)); margin-bottom: calc(14 * var(--u)); padding-bottom: calc(14 * var(--u)); border-bottom: 1px solid var(--ui-line); }
.ag-chat .ag-col-head { justify-content: flex-start; }
.ag-col-id b { display: block; font-size: calc(15 * var(--u)); line-height: 1.2; }
.ag-col-id span { display: inline-flex; align-items: center; gap: calc(5 * var(--u)); font-size: calc(12.5 * var(--u)); color: var(--ui-muted); }
.ag-col-id .i { width: calc(13 * var(--u)); height: calc(13 * var(--u)); }
.ag-status { display: inline-flex; align-items: center; gap: calc(6 * var(--u)); font-size: calc(12.5 * var(--u)); font-weight: 600; color: var(--ui-muted); white-space: nowrap; }
.ag-status::before { content: ""; width: calc(7 * var(--u)); height: calc(7 * var(--u)); border-radius: 50%; background: var(--ui-line2); }
.ag-status.is-busy::before { background: var(--lime-ink); animation: agPulse 1.6s infinite; }
.ag-status.is-done { color: var(--lime-ink); }
.ag-status.is-done::before { background: var(--lime); }
.ag-count { font-size: calc(12.5 * var(--u)); color: var(--ui-muted); font-variant-numeric: tabular-nums; }
.ag-count b { color: var(--ink); }

.ag-chat-body { display: flex; flex-direction: column; justify-content: flex-end; gap: calc(10 * var(--u)); height: calc(360 * var(--u)); overflow: hidden; }
.ag-js [data-h] { display: none; }
.ag-js [data-h].is-shown { display: block; animation: agIn .45s var(--ease) both; }
.ag-js .ag-typing[data-h].is-shown { display: inline-flex; }

.ag-activity { position: relative; display: grid; gap: calc(4 * var(--u)); }
.ag-activity li { position: relative; display: flex; gap: calc(12 * var(--u)); padding: calc(10 * var(--u)); border-radius: calc(10 * var(--u)); transition: background .3s; }
.ag-activity li:not(:last-child)::after { content: ""; position: absolute; left: calc(22 * var(--u)); top: calc(38 * var(--u)); bottom: calc(-8 * var(--u)); width: 1px; background: var(--ui-line); }
.ag-activity li.is-done:not(:last-child)::after { background: var(--lime-line); }
.ag-activity .st { position: relative; z-index: 1; display: grid; place-items: center; flex: none; width: calc(24 * var(--u)); height: calc(24 * var(--u)); border: 1.5px solid var(--ui-line2); border-radius: 50%; background: #fff; transition: background .3s, border-color .3s; }
.ag-activity .st .i { width: calc(13 * var(--u)); height: calc(13 * var(--u)); stroke-width: 2.6; color: var(--ink); opacity: 0; transform: scale(.5); transition: opacity .3s, transform .35s var(--ease); }
.ag-activity .ag-k { margin-bottom: calc(2 * var(--u)); }
.ag-activity .v { display: block; font-size: calc(14 * var(--u)); font-weight: 500; line-height: 1.35; color: var(--ui-faint); transition: color .3s; }
.ag-activity li.is-run { background: var(--ui-soft); }
.ag-activity li.is-run .st { border-color: var(--lime-ink); border-top-color: transparent; animation: agSpin .8s linear infinite; }
.ag-activity li.is-run .v, .ag-activity li.is-done .v { color: var(--ink); }
.ag-activity li.is-done .st { background: var(--lime); border-color: var(--lime); }
.ag-activity li.is-done .st .i { opacity: 1; transform: none; }
.ag-activity li.is-done .ag-k { color: var(--lime-ink); }
.ag-ctx-chips { display: flex; flex-wrap: wrap; gap: calc(6 * var(--u)); margin-top: calc(16 * var(--u)); padding-top: calc(14 * var(--u)); border-top: 1px dashed var(--ui-line); }
.ag-ctx-chips span { padding: calc(3 * var(--u)) calc(9 * var(--u)); border: 1px solid var(--ui-line); border-radius: calc(6 * var(--u)); background: var(--ui-soft); font-size: calc(12 * var(--u)); color: var(--ui-text); }

.ag-done { display: grid; gap: calc(6 * var(--u)); }
.ag-done li { display: flex; align-items: center; gap: calc(10 * var(--u)); padding: calc(10 * var(--u)); border: 1px solid var(--ui-line); border-radius: calc(10 * var(--u)); background: #fff; font-size: calc(14 * var(--u)); font-weight: 500; color: var(--ui-faint); transition: color .3s, border-color .3s, background .3s; }
.ag-done .ck { display: grid; place-items: center; flex: none; width: calc(21 * var(--u)); height: calc(21 * var(--u)); border: 1.5px dashed var(--ui-line2); border-radius: calc(6 * var(--u)); transition: background .3s, border-color .3s; }
.ag-done .ck .i { width: calc(12 * var(--u)); height: calc(12 * var(--u)); stroke-width: 2.8; color: var(--ink); opacity: 0; transform: scale(.4); transition: opacity .25s, transform .35s var(--ease); }
.ag-done .t { flex: 1; min-width: 0; }
.ag-done .sys { font-size: calc(11.5 * var(--u)); color: var(--ui-faint); white-space: nowrap; }
.ag-done li.is-done { color: var(--ink); border-color: var(--lime-line); background: linear-gradient(90deg, var(--lime-wash), #fff 70%); }
.ag-done li.is-done .ck { background: var(--lime); border: 1.5px solid var(--lime); }
.ag-done li.is-done .ck .i { opacity: 1; transform: none; }
.ag-result { display: flex; align-items: center; gap: calc(9 * var(--u)); margin-top: calc(12 * var(--u)); padding: calc(12 * var(--u)); border-radius: calc(10 * var(--u)); background: var(--ink); color: #fff; font-size: calc(13 * var(--u)); opacity: 0; transform: translateY(6px); transition: opacity .5s var(--ease), transform .5s var(--ease); }
.ag-result .i { width: calc(16 * var(--u)); height: calc(16 * var(--u)); color: var(--lime); stroke-width: 2.4; }
.ag-result b { font-weight: 600; }
.ag-result.is-shown { opacity: 1; transform: none; }

/* the care coordinator, with the conversation leaving her phone */
.ag-person { position: relative; z-index: 3; height: calc(610 * var(--u)); pointer-events: none; }
.ag-person img { position: absolute; left: calc(-62 * var(--u)); bottom: 0; width: calc(382 * var(--u)); max-width: none; height: auto; -webkit-mask-image: linear-gradient(#000 80%, transparent); mask-image: linear-gradient(#000 80%, transparent); }
.ag-bubbles { position: absolute; left: calc(-4 * var(--u)); top: calc(-40 * var(--u)); z-index: 2; display: grid; gap: calc(8 * var(--u)); width: calc(280 * var(--u)); }
.ag-b { justify-self: start; max-width: 100%; padding: calc(9 * var(--u)) calc(13 * var(--u)) calc(10 * var(--u)); border: 1px solid var(--ui-line); border-radius: calc(15 * var(--u)); background: #fff; box-shadow: var(--sh); font-size: calc(14 * var(--u)); font-weight: 500; line-height: 1.4; }
.ag-b .who { display: flex; align-items: center; gap: calc(5 * var(--u)); margin-bottom: calc(1 * var(--u)); font-size: calc(11 * var(--u)); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ui-faint); }
.ag-b .who .i { width: calc(12 * var(--u)); height: calc(12 * var(--u)); color: var(--lime-ink); stroke-width: 2.2; }
.ag-b.in { border-bottom-left-radius: calc(4 * var(--u)); }
.ag-b.out { justify-self: end; border-bottom-right-radius: calc(4 * var(--u)); }
.ag-b.ok { justify-self: end; border-color: var(--lime-line); border-bottom-right-radius: calc(4 * var(--u)); }
.ag-b.ok .who { color: var(--lime-ink); }
.ag-js .ag-b { opacity: 0; transform: translate(34px, 46px) scale(.92); transform-origin: 80% 100%; transition: opacity .9s var(--ease), transform 1.1s var(--ease); }
.ag-js .ag-b.is-shown { opacity: 1; transform: none; }
.ag-link-path { position: absolute; left: 0; top: 0; z-index: 1; width: calc(318 * var(--u)); height: calc(610 * var(--u)); overflow: visible; }
.ag-link-path path { fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-dasharray: 3 5; }
.ag-link-path .base { stroke: var(--ui-line2); }
.ag-link-path .flow { stroke: var(--lime-ink); opacity: 0; transition: opacity .6s var(--ease); }
.ag-link-path circle { fill: var(--lime-ink); opacity: 0; transition: opacity .4s; }
.ag-link-path.is-flow .flow { opacity: 1; animation: agDash 1.2s linear infinite; }
.ag-link-path.is-flow circle { opacity: 1; }
@keyframes agDash { to { stroke-dashoffset: -16; } }
.ag-principle { margin-top: calc(56 * var(--u)); text-align: center; font-family: var(--font-head); font-size: calc(24 * var(--u)); line-height: 1.35; letter-spacing: -.02em; color: var(--ui-muted); }
.ag-principle b { font-weight: 500; color: var(--ink); }

/* storyline strip */
.ag-storyline { position: relative; display: flex; align-items: center; justify-content: space-between; gap: calc(12 * var(--u)); padding: calc(26 * var(--u)) var(--pad); border-top: 1px solid var(--rule); }
.ag-storyline a { font-family: var(--font-head); font-size: calc(20 * var(--u)); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--ink); white-space: nowrap; transition: color .2s; }
.ag-storyline a:hover { color: var(--lime-ink); }
.ag-storyline span { font-size: calc(20 * var(--u)); color: var(--lime-ink); }

/* =========================================================
   PINNED STORIES — scroll moves each section through its steps
   ========================================================= */
.ag-story { position: relative; height: calc(100vh + var(--len) * 52vh); border-top: 1px solid var(--rule); }
.ag-pin { position: sticky; top: 0; display: flex; align-items: center; height: 100vh; overflow: hidden; padding: 0 var(--pad); }
.ag-story-grid { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1fr); column-gap: calc(96 * var(--u)); align-items: center; width: 100%; }
.ag-copy .ag-body { font-size: calc(18 * var(--u)); }
.ag-visual { position: relative; }

.ag-steps { display: grid; gap: calc(2 * var(--u)); max-width: calc(400 * var(--u)); margin-top: calc(28 * var(--u)); }
.ag-steps li { position: relative; padding: calc(8 * var(--u)) 0 calc(8 * var(--u)) calc(24 * var(--u)); font-size: calc(16 * var(--u)); font-weight: 500; color: var(--ui-faint); transition: color .35s var(--ease); }
.ag-steps li::before { content: ""; position: absolute; left: 0; top: 50%; width: calc(9 * var(--u)); height: calc(9 * var(--u)); margin-top: calc(-4.5 * var(--u)); border: 1.5px solid var(--ui-line2); border-radius: 50%; background: #fff; transition: all .35s var(--ease); }
.ag-steps li.is-done { color: var(--ui-text); }
.ag-steps li.is-done::before { background: var(--ui-text); border-color: var(--ui-text); }
.ag-steps li.is-active { color: var(--ink); }
.ag-steps li.is-active::before { background: var(--lime); border-color: var(--lime-ink); box-shadow: 0 0 0 calc(4 * var(--u)) var(--lime-tint); }

.ag-js .ag-fx { opacity: 0; transform: translateY(10px); transition: opacity .55s var(--ease), transform .6s var(--ease); }
.ag-js .ag-fx.x { transform: translateX(18px); }
.ag-js .ag-fx.on { opacity: 1; transform: none; transition-delay: calc(var(--d, 0) * 80ms); }

/* ---- 01 understand ---- */
.ag-und { padding-bottom: calc(20 * var(--u)); }
.ag-swap { position: relative; display: inline-grid; font-size: calc(12.5 * var(--u)); font-weight: 600; }
.ag-swap > span { grid-area: 1 / 1; display: inline-flex; align-items: center; justify-content: center; gap: calc(5 * var(--u)); height: calc(28 * var(--u)); padding: 0 calc(12 * var(--u)); border-radius: 999px; white-space: nowrap; transition: opacity .4s var(--ease), transform .4s var(--ease); }
.ag-swap .off { background: var(--ui-soft2); color: var(--ui-text); }
.ag-swap .on-s { background: var(--lime); color: var(--ink); opacity: 0; transform: scale(.9); }
.ag-swap .i { width: calc(13 * var(--u)); height: calc(13 * var(--u)); stroke-width: 2.6; }
.ag-swap.on .off { opacity: 0; transform: scale(.9); }
.ag-swap.on .on-s { opacity: 1; transform: none; }
.ag-und-msg { display: flex; align-items: center; gap: calc(12 * var(--u)); margin: calc(18 * var(--u)) calc(20 * var(--u)) 0; padding: calc(13 * var(--u)) calc(15 * var(--u)); border-radius: var(--r); background: var(--ui-soft2); }
.ag-und-msg p { font-size: calc(16 * var(--u)); font-weight: 500; }
.ag-bus { width: 2px; height: calc(24 * var(--u)); margin: 0 auto; background: repeating-linear-gradient(to bottom, var(--ui-line2) 0 3px, transparent 3px 6px); }
.ag-bus.on { background-image: repeating-linear-gradient(to bottom, var(--lime-ink) 0 3px, transparent 3px 6px); animation: agBus .5s linear infinite; }
@keyframes agBus { to { background-position: 0 6px; } }
.ag-ctx-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: calc(8 * var(--u)); padding: 0 calc(20 * var(--u)); }
.ag-ctx { position: relative; display: flex; flex-direction: column; gap: calc(7 * var(--u)); padding: calc(12 * var(--u)); border: 1px solid var(--ui-line); border-radius: calc(12 * var(--u)); background: #fff; transition: opacity .55s var(--ease), transform .6s var(--ease), border-color .4s; }
.ag-ctx b { display: block; font-size: calc(13.5 * var(--u)); line-height: 1.25; }
.ag-ctx div span { display: block; margin-top: calc(2 * var(--u)); font-size: calc(12 * var(--u)); line-height: 1.4; color: var(--ui-muted); }
.ag-ctx-ic { display: grid; place-items: center; width: calc(28 * var(--u)); height: calc(28 * var(--u)); border-radius: calc(8 * var(--u)); background: var(--ui-soft2); color: var(--ui-text); transition: background .4s, color .4s; }
.ag-ctx-ic .i { width: calc(15 * var(--u)); height: calc(15 * var(--u)); }
.ag-ctx .dot { position: absolute; top: calc(11 * var(--u)); right: calc(11 * var(--u)); width: calc(7 * var(--u)); height: calc(7 * var(--u)); border-radius: 50%; background: var(--ui-line2); transition: background .4s; }
.ag-story[data-step="2"] .ag-ctx, .ag-story[data-step="3"] .ag-ctx { border-color: var(--lime-line); }
.ag-story[data-step="2"] .ag-ctx-ic, .ag-story[data-step="3"] .ag-ctx-ic { background: var(--lime-tint); color: var(--lime-ink); }
.ag-story[data-step="2"] .ag-ctx .dot, .ag-story[data-step="3"] .ag-ctx .dot { background: var(--lime-ink); animation: agPulse 2.4s infinite; }
.ag-req { margin: 0 calc(20 * var(--u)); padding: calc(4 * var(--u)) calc(15 * var(--u)); border: 1px dashed var(--ui-line2); border-radius: var(--r); transition: border-color .4s, background .4s, box-shadow .4s; }
.ag-req.on { border-style: solid; border-color: var(--lime-line); }
.ag-req .ag-kv dd { border-radius: calc(6 * var(--u)); transition: color .45s var(--ease), background .45s var(--ease); transition-delay: calc(var(--d, 0) * 90ms); }
.ag-req .act { color: var(--lime-ink); }
.ag-js .ag-req:not(.on) .ag-kv dd { color: transparent; background: var(--ui-soft2); }
.ag-js .ag-req:not(.on) .ag-kv dd .i { opacity: 0; }
.ag-story[data-step="3"] .ag-req { background: linear-gradient(180deg, var(--lime-wash), #fff 60%); box-shadow: 0 0 0 calc(4 * var(--u)) rgba(199, 243, 104, .25); }

/* ---- 02 decide ---- */
.ag-dec-block, .ag-dec-row { padding: calc(17 * var(--u)) calc(22 * var(--u)); }
.ag-dec-block + .ag-dec-row, .ag-dec-row + .ag-dec-row, .ag-dec-row + .ag-dec-block { border-top: 1px solid var(--ui-line); }
.ag-dec-block .ag-k { margin-bottom: calc(10 * var(--u)); }
.ag-dec-row { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: calc(16 * var(--u)); }
.ag-bubble { display: inline-block; padding: calc(13 * var(--u)) calc(16 * var(--u)); border-radius: calc(15 * var(--u)) calc(15 * var(--u)) calc(15 * var(--u)) calc(4 * var(--u)); background: var(--ui-soft2); font-size: calc(16 * var(--u)); font-weight: 500; }
.ag-slots { display: grid; gap: calc(8 * var(--u)); }
.ag-slot { display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: calc(12 * var(--u)); padding: calc(12 * var(--u)) calc(15 * var(--u)); border: 1px solid var(--ui-line); border-radius: calc(12 * var(--u)); font-size: calc(15 * var(--u)); }
.ag-slot .i { width: calc(17 * var(--u)); height: calc(17 * var(--u)); color: var(--lime-ink); }
.ag-slot span { font-weight: 500; font-variant-numeric: tabular-nums; }
.ag-slot em { font-style: normal; font-size: calc(13 * var(--u)); color: var(--ui-faint); }
.ag-decision { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: calc(16 * var(--u)); margin: calc(4 * var(--u)) calc(14 * var(--u)) calc(14 * var(--u)); padding: calc(15 * var(--u)) calc(17 * var(--u)); border: 1px solid var(--ui-line); border-radius: var(--r); background: var(--ui-soft); transition: background .45s var(--ease), border-color .45s var(--ease); }
.ag-decision b { display: block; margin-top: calc(3 * var(--u)); font-size: calc(16 * var(--u)); }
.ag-state { display: inline-grid; }
.ag-state > span { grid-area: 1 / 1; display: inline-flex; align-items: center; gap: calc(7 * var(--u)); height: calc(34 * var(--u)); padding: 0 calc(14 * var(--u)); border-radius: 999px; font-size: calc(13.5 * var(--u)); font-weight: 600; white-space: nowrap; transition: opacity .4s var(--ease), transform .4s var(--ease); }
.ag-state .off { border: 1px solid var(--ui-line); background: #fff; color: var(--ui-muted); }
.ag-state .on-s { background: var(--lime); color: var(--ink); opacity: 0; transform: scale(.92); }
.ag-state .on-s .i { width: calc(15 * var(--u)); height: calc(15 * var(--u)); stroke-width: 2.6; }
.ag-decision.on { background: var(--lime-wash); border-color: var(--lime-line); }
.ag-decision.on .off { opacity: 0; transform: scale(.92); }
.ag-decision.on .on-s { opacity: 1; transform: none; }

/* ---- 03 act ---- */
.ag-acts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: calc(10 * var(--u)) calc(22 * var(--u)); max-width: calc(500 * var(--u)); margin-top: calc(28 * var(--u)); }
.ag-acts li { display: flex; align-items: center; gap: calc(10 * var(--u)); font-size: calc(16 * var(--u)); font-weight: 500; color: var(--ui-faint); transition: color .35s; }
.ag-acts .ck { display: grid; place-items: center; flex: none; width: calc(22 * var(--u)); height: calc(22 * var(--u)); border: 1.5px solid var(--ui-line2); border-radius: 50%; transition: background .35s, border-color .35s; }
.ag-acts .ck .i { width: calc(12 * var(--u)); height: calc(12 * var(--u)); stroke-width: 3; color: var(--ink); opacity: 0; transform: scale(.4); transition: opacity .3s, transform .35s var(--ease); }
.ag-acts li.on { color: var(--ink); }
.ag-acts li.on .ck { background: var(--lime); border-color: var(--lime); }
.ag-acts li.on .ck .i { opacity: 1; transform: none; }
.ag-flow { padding: calc(10 * var(--u)) calc(20 * var(--u)) calc(6 * var(--u)); }
.ag-flow li { position: relative; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: calc(14 * var(--u)); padding: calc(7 * var(--u)) 0; }
.ag-flow li:not(:last-child)::after { content: ""; position: absolute; left: calc(14 * var(--u)); top: calc(38 * var(--u)); bottom: calc(-8 * var(--u)); width: 2px; background: var(--ui-line); transition: background .4s; }
.ag-flow li.is-done:not(:last-child)::after { background: var(--lime); }
.ag-node { position: relative; z-index: 1; display: grid; place-items: center; width: calc(30 * var(--u)); height: calc(30 * var(--u)); border: 1.5px solid var(--ui-line2); border-radius: 50%; background: #fff; transition: background .35s, border-color .35s, box-shadow .35s; }
.ag-node .i { width: calc(15 * var(--u)); height: calc(15 * var(--u)); stroke-width: 2.6; color: var(--ink); opacity: 0; transform: scale(.4); transition: opacity .3s, transform .35s var(--ease); }
.ag-flow .ag-k { font-size: calc(11 * var(--u)); }
.ag-flow .v { display: block; font-size: calc(15 * var(--u)); font-weight: 500; line-height: 1.35; color: var(--ui-faint); transition: color .35s; }
.ag-sys { padding: calc(3 * var(--u)) calc(9 * var(--u)); border: 1px solid var(--ui-line); border-radius: calc(6 * var(--u)); background: var(--ui-soft); font-size: calc(12 * var(--u)); font-weight: 500; color: var(--ui-faint); white-space: nowrap; transition: color .35s; }
.ag-flow li.is-active .ag-node { border-color: var(--lime-ink); box-shadow: 0 0 0 calc(5 * var(--u)) var(--lime-tint); }
.ag-flow li.is-active .ag-node::before { content: ""; position: absolute; width: calc(9 * var(--u)); height: calc(9 * var(--u)); border-radius: 50%; background: var(--lime-ink); }
.ag-flow li.is-active .v, .ag-flow li.is-done .v { color: var(--ink); }
.ag-flow li.is-active .ag-sys { color: var(--ui-text); }
.ag-flow li.is-done .ag-node { background: var(--lime); border-color: var(--lime); }
.ag-flow li.is-done .ag-node .i { opacity: 1; transform: none; }
.ag-flow-done { display: flex; align-items: center; gap: calc(10 * var(--u)); margin: calc(6 * var(--u)) calc(14 * var(--u)) calc(14 * var(--u)); padding: calc(13 * var(--u)) calc(15 * var(--u)); border: 1px dashed var(--ui-line2); border-radius: var(--r); background: var(--ui-soft); font-size: calc(15 * var(--u)); color: var(--ui-faint); transition: all .45s var(--ease); }
.ag-flow-done .i { width: calc(17 * var(--u)); height: calc(17 * var(--u)); stroke-width: 2.4; }
.ag-flow-done span { margin-left: auto; font-size: calc(13 * var(--u)); }
.ag-flow-done.on { border: 1px solid var(--ink); background: var(--ink); color: #fff; }
.ag-flow-done.on .i { color: var(--lime); }
.ag-flow-done.on span { color: rgba(255, 255, 255, .6); }

/* ---- one agent, many jobs ---- */
.ag-jobs-wrap { display: grid; gap: calc(34 * var(--u)); width: 100%; }
.ag-jobs-head { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: calc(64 * var(--u)); align-items: end; }
.ag-jobs-head .ag-eyebrow { margin-bottom: calc(14 * var(--u)); }
.ag-jobs-head .ag-body { justify-self: end; max-width: calc(560 * var(--u)); margin: 0; }
.ag-jobs-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr) minmax(0, 1fr); column-gap: calc(60 * var(--u)); align-items: center; }
.ag-jobs-col { display: grid; gap: calc(12 * var(--u)); }
.ag-job { position: relative; display: flex; align-items: center; gap: calc(12 * var(--u)); width: 100%; padding: calc(13 * var(--u)) calc(15 * var(--u)); border: 1px solid var(--ui-line); border-radius: calc(15 * var(--u)); background: #fff; font: inherit; text-align: left; cursor: pointer; transition: transform .55s var(--ease), border-color .4s var(--ease), box-shadow .4s var(--ease); }
.ag-job:hover { border-color: var(--ui-line2); }
.ag-job .n { min-width: calc(20 * var(--u)); font-family: var(--mono); font-size: calc(12.5 * var(--u)); color: var(--ui-faint); }
.ag-job .ic { display: grid; place-items: center; flex: none; width: calc(36 * var(--u)); height: calc(36 * var(--u)); border-radius: calc(10 * var(--u)); background: var(--ui-soft2); color: var(--ui-text); transition: background .4s, color .4s; }
.ag-job .ic .i { width: calc(17 * var(--u)); height: calc(17 * var(--u)); }
.ag-job .txt { display: grid; flex: 1; min-width: 0; }
.ag-job .verb { font-size: calc(11.5 * var(--u)); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--ui-faint); transition: color .4s; }
.ag-job .title { font-size: calc(16 * var(--u)); font-weight: 600; line-height: 1.3; color: var(--ui-text); }
.ag-job .chk { display: grid; place-items: center; flex: none; width: calc(22 * var(--u)); height: calc(22 * var(--u)); border-radius: 50%; background: var(--lime); color: var(--ink); opacity: 0; transform: scale(.5); transition: opacity .35s, transform .4s var(--ease); }
.ag-job .chk .i { width: calc(12 * var(--u)); height: calc(12 * var(--u)); stroke-width: 3; }
.ag-job .wire { position: absolute; top: 50%; width: calc(60 * var(--u)); height: 2px; background: var(--lime-ink); transform: scaleX(0); transition: transform .5s var(--ease), opacity .4s; pointer-events: none; }
.ag-job.l .wire { left: 100%; transform-origin: left; }
.ag-job.r .wire { right: 100%; transform-origin: right; }
.ag-job.is-done .n { color: var(--lime-ink); }
.ag-job.is-active { border-color: var(--lime-ink); box-shadow: 0 0 0 calc(4 * var(--u)) var(--lime-tint), var(--sh); }
.ag-job.l.is-active { transform: translateX(10px); }
.ag-job.r.is-active { transform: translateX(-10px); }
.ag-job.is-active .ic { background: var(--lime); color: var(--ink); }
.ag-job.is-active .verb, .ag-job.is-active .n { color: var(--lime-ink); }
.ag-job.is-active .title { color: var(--ink); }
.ag-job.is-active .wire { transform: scaleX(.85); }
.ag-jobs-story[data-step="4"] .ag-job { border-color: var(--lime-line); }
.ag-jobs-story[data-step="4"] .ag-job .chk { opacity: 1; transform: none; }
.ag-jobs-story[data-step="4"] .ag-job .wire { transform: scaleX(.85); opacity: .45; }

.ag-core { position: relative; z-index: 1; display: grid; align-content: start; gap: calc(14 * var(--u)); min-height: calc(540 * var(--u)); padding: calc(17 * var(--u)) calc(19 * var(--u)) calc(19 * var(--u)); border: 1px solid var(--ui-line2); border-radius: var(--r-xl); background: #fff; box-shadow: var(--sh-lg); transition: border-color .4s; }
.ag-core.is-complete { border-color: var(--lime-line); }
.ag-core-head { display: flex; align-items: center; gap: calc(9 * var(--u)); padding-bottom: calc(12 * var(--u)); border-bottom: 1px solid var(--ui-line); }
.ag-core-head > b { font-family: var(--font-head); font-size: calc(16 * var(--u)); font-weight: 600; letter-spacing: -.01em; }
.ag-core-status { margin-left: auto; display: inline-flex; align-items: center; gap: calc(7 * var(--u)); height: calc(28 * var(--u)); padding: 0 calc(11 * var(--u)); border: 1px solid var(--lime-line); border-radius: 999px; background: var(--lime-tint); font-size: calc(12.5 * var(--u)); font-weight: 600; color: var(--lime-ink); white-space: nowrap; transition: background .35s, color .35s, border-color .35s; }
.ag-core-status .i { display: none; width: calc(13 * var(--u)); height: calc(13 * var(--u)); stroke-width: 2.6; }
.ag-core-status.is-done { background: var(--lime); border-color: var(--lime); color: var(--ink); }
.ag-core-status.is-done .ag-pulse { display: none; }
.ag-core-status.is-done .i { display: block; }
.ag-core-task { display: flex; align-items: center; gap: calc(12 * var(--u)); transition: opacity .25s var(--ease), transform .3s var(--ease); }
.ag-core-num { display: grid; place-items: center; flex: none; width: calc(38 * var(--u)); height: calc(38 * var(--u)); border-radius: calc(10 * var(--u)); background: var(--ink); color: var(--lime); font-family: var(--mono); font-size: calc(13 * var(--u)); }
.ag-core-task b { display: block; font-family: var(--font-head); font-size: calc(20 * var(--u)); font-weight: 600; line-height: 1.2; letter-spacing: -.02em; }
.ag-core-task .ag-k { color: var(--lime-ink); }
.ag-core-body { display: grid; align-content: start; gap: calc(10 * var(--u)); transition: opacity .25s var(--ease), transform .3s var(--ease); }
.ag-core.is-out .ag-core-body, .ag-core.is-out .ag-core-task { opacity: 0; transform: translateY(6px); }
.ag-core.is-final .ag-core-task { display: none; }
.ag-core-body .ag-msg { max-width: 92%; }
.ag-js .ag-core-body [data-s] { opacity: 0; transform: translateY(6px); transition: opacity .45s var(--ease), transform .45s var(--ease); }
.ag-js .ag-core-body [data-s].is-shown { opacity: 1; transform: none; }
.ag-cb-flow { display: grid; margin-top: calc(4 * var(--u)); }
.ag-cb-flow li { position: relative; display: flex; align-items: center; gap: calc(10 * var(--u)); padding: calc(4 * var(--u)) 0; font-size: calc(14.5 * var(--u)); font-weight: 500; color: var(--ui-text); }
.ag-cb-flow li:not(:last-child)::after { content: ""; position: absolute; left: calc(9.5 * var(--u)); top: calc(26 * var(--u)); height: calc(100% - 22 * var(--u)); width: 1.5px; background: var(--ui-line); transition: background .35s; }
.ag-cb-dot { position: relative; z-index: 1; display: grid; place-items: center; flex: none; width: calc(20 * var(--u)); height: calc(20 * var(--u)); border: 1.5px solid var(--lime-ink); border-radius: 50%; background: #fff; transition: background .3s, border-color .3s; }
.ag-cb-dot .i { width: calc(11 * var(--u)); height: calc(11 * var(--u)); stroke-width: 3; color: var(--ink); opacity: 0; transform: scale(.4); transition: opacity .25s, transform .35s var(--ease); }
.ag-cb-flow li.is-done .ag-cb-dot { background: var(--lime); border-color: var(--lime); }
.ag-cb-flow li.is-done .ag-cb-dot .i { opacity: 1; transform: none; }
.ag-cb-flow li.is-done:not(:last-child)::after { background: var(--lime); }
.ag-cb-flow li.fin { font-weight: 600; }
.ag-cb-flow li.fin.is-done { color: var(--lime-ink); }
.ag-qa-list { display: grid; gap: calc(6 * var(--u)); }
.ag-qa { display: flex; align-items: center; justify-content: space-between; gap: calc(10 * var(--u)); padding: calc(8 * var(--u)) calc(11 * var(--u)); border: 1px solid var(--ui-line); border-radius: calc(10 * var(--u)); font-size: calc(13.5 * var(--u)); }
.ag-qa .q { font-weight: 500; color: var(--ui-text); }
.ag-qa .a { padding: calc(2 * var(--u)) calc(9 * var(--u)); border-radius: calc(6 * var(--u)); background: var(--lime-tint); color: var(--lime-ink); font-size: calc(12.5 * var(--u)); font-weight: 600; white-space: nowrap; opacity: 0; transition: opacity .35s .45s; }
.ag-qa.is-shown .a { opacity: 1; }
.ag-voice { display: flex; align-items: center; gap: calc(12 * var(--u)); padding: calc(13 * var(--u)); border: 1px solid var(--ui-line); border-radius: calc(15 * var(--u)); background: var(--ui-soft); }
.ag-voice-mic { display: grid; place-items: center; flex: none; width: calc(40 * var(--u)); height: calc(40 * var(--u)); border-radius: 50%; background: var(--ink); color: var(--lime); }
.ag-voice-mic .i { width: calc(18 * var(--u)); height: calc(18 * var(--u)); }
.ag-voice-card.is-live .ag-voice-mic { animation: agPulse 1.4s infinite; }
.ag-voice-main { flex: 1; min-width: 0; }
.ag-voice-top { display: flex; align-items: center; justify-content: space-between; gap: calc(8 * var(--u)); }
.ag-voice-state { font-size: calc(12.5 * var(--u)); font-weight: 600; color: var(--lime-ink); }
.ag-wave { display: flex; align-items: center; gap: calc(3 * var(--u)); height: calc(28 * var(--u)); margin: calc(4 * var(--u)) 0 calc(2 * var(--u)); }
.ag-wave i { width: calc(3 * var(--u)); height: 30%; border-radius: 2px; background: var(--lime-ink); transition: height .3s var(--ease); }
.ag-voice-card.is-live .ag-wave i { animation: agWave 1s ease-in-out infinite; animation-delay: calc(var(--w) * -73ms); }
.ag-voice-card.is-captured .ag-wave i { height: calc(18% + var(--h) * 1%); background: var(--ui-text); opacity: .35; }
@keyframes agWave { 0%, 100% { height: 20%; } 50% { height: calc(30% + var(--h) * 1%); } }
.ag-voice-text { font-size: calc(14.5 * var(--u)); font-weight: 500; line-height: 1.45; opacity: 0; transition: opacity 1.4s var(--ease); }
.ag-voice-card.is-live .ag-voice-text, .ag-voice-card.is-captured .ag-voice-text { opacity: 1; }
.ag-vsum { display: none; padding: calc(13 * var(--u)) calc(15 * var(--u)); border: 1px solid var(--lime-line); border-radius: calc(15 * var(--u)); background: #fff; }
.ag-voice-card.is-summary .ag-voice { display: none; }
.ag-voice-card.is-summary .ag-vsum { display: block; animation: agIn .5s var(--ease) both; }
.ag-vsum-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: calc(8 * var(--u)); }
.ag-vsum-head .ag-k { color: var(--lime-ink); }
.ag-vsum-tag { display: inline-flex; align-items: center; gap: calc(5 * var(--u)); padding: calc(2 * var(--u)) calc(9 * var(--u)); border-radius: 999px; background: var(--ui-soft2); font-size: calc(12 * var(--u)); font-weight: 600; color: var(--ui-text); }
.ag-vsum-tag .i { width: calc(13 * var(--u)); height: calc(13 * var(--u)); color: var(--lime-ink); }
.ag-vsum-title { display: block; margin-top: calc(8 * var(--u)); font-size: calc(14.5 * var(--u)); }
.ag-vsum-list { display: grid; gap: calc(3 * var(--u)); margin-top: calc(4 * var(--u)); }
.ag-vsum-list li { position: relative; padding-left: calc(15 * var(--u)); font-size: calc(14 * var(--u)); color: var(--ui-text); }
.ag-vsum-list li::before { content: ""; position: absolute; left: calc(2 * var(--u)); top: calc(9 * var(--u)); width: calc(6 * var(--u)); height: calc(6 * var(--u)); border-radius: 50%; background: var(--lime-ink); }
.ag-vsum-foot { display: flex; align-items: center; gap: calc(6 * var(--u)); margin-top: calc(10 * var(--u)); padding-top: calc(9 * var(--u)); border-top: 1px solid var(--ui-line); font-size: calc(13.5 * var(--u)); font-weight: 600; color: var(--lime-ink); }
.ag-vsum-foot .i { width: calc(14 * var(--u)); height: calc(14 * var(--u)); stroke-width: 2.6; }
.ag-pt { display: flex; align-items: center; gap: calc(11 * var(--u)); padding: calc(12 * var(--u)) calc(13 * var(--u)); border: 1px solid var(--ui-line); border-radius: var(--r); background: var(--ui-soft); }
.ag-pt-ic { display: grid; place-items: center; flex: none; width: calc(34 * var(--u)); height: calc(34 * var(--u)); border: 1px solid var(--ui-line); border-radius: calc(9 * var(--u)); background: #fff; color: var(--lime-ink); }
.ag-pt-ic .i { width: calc(16 * var(--u)); height: calc(16 * var(--u)); }
.ag-pt-main { display: grid; flex: 1; min-width: 0; }
.ag-pt-main b { font-size: calc(14.5 * var(--u)); }
.ag-pt-sub { font-size: calc(13 * var(--u)); color: var(--ui-muted); }
.ag-pt-btn { flex: none; padding: calc(6 * var(--u)) calc(11 * var(--u)); border-radius: calc(8 * var(--u)); background: var(--lime); color: var(--ink); font-size: calc(13 * var(--u)); font-weight: 600; white-space: nowrap; }
.ag-cf-stats { display: grid; grid-template-columns: 1fr 1fr; gap: calc(8 * var(--u)); }
.ag-cf-stats div { padding: calc(15 * var(--u)); border: 1px solid var(--ui-line); border-radius: var(--r); }
.ag-cf-stats b { display: block; font-family: var(--font-head); font-size: calc(36 * var(--u)); font-weight: 600; line-height: 1; letter-spacing: -.03em; color: var(--ink); }
.ag-cf-stats span { font-size: calc(13.5 * var(--u)); color: var(--ui-muted); }
.ag-cf-out { display: grid; gap: calc(6 * var(--u)); }
.ag-cf-out li { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: calc(10 * var(--u)); padding: calc(9 * var(--u)) calc(11 * var(--u)); border-radius: calc(10 * var(--u)); background: var(--ui-soft); font-size: calc(14 * var(--u)); }
.ag-cf-out .ag-cb-dot { background: var(--lime); border-color: var(--lime); }
.ag-cf-out .ag-cb-dot .i { opacity: 1; transform: none; }
.ag-cf-out b { font-size: calc(11.5 * var(--u)); letter-spacing: .1em; text-transform: uppercase; color: var(--ui-faint); }
.ag-cf-out span { font-weight: 600; color: var(--ink); text-align: right; }
.ag-cf-path { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: calc(6 * var(--u)); padding-top: calc(12 * var(--u)); border-top: 1px dashed var(--ui-line); font-size: calc(13.5 * var(--u)); font-weight: 600; }
.ag-cf-path span { padding: calc(3 * var(--u)) calc(10 * var(--u)); border: 1px solid var(--ui-line); border-radius: calc(6 * var(--u)); background: #fff; }
.ag-cf-path span:last-child { border-color: var(--lime); background: var(--lime); color: var(--ink); }
.ag-cf-path i { font-style: normal; color: var(--ui-faint); }
.ag-jobs-outro { text-align: center; font-family: var(--font-head); font-size: calc(24 * var(--u)); font-weight: 500; letter-spacing: -.02em; opacity: 0; transform: translateY(8px); transition: opacity .6s var(--ease), transform .6s var(--ease); }
.ag-jobs-outro .dim { color: #8c8c8c; }
.ag-jobs-outro.on { opacity: 1; transform: none; }

/* ---- 04 build ---- */
.ag-build-blocks { display: grid; gap: calc(12 * var(--u)); margin-top: calc(28 * var(--u)); }
.ag-build-block { padding: calc(19 * var(--u)) calc(21 * var(--u)); border: 1px solid var(--ui-line); border-radius: var(--r-lg); opacity: .5; transition: opacity .45s var(--ease), border-color .45s, box-shadow .45s; }
.ag-build-block h3 { display: flex; align-items: center; gap: calc(10 * var(--u)); font-family: var(--font-head); font-size: calc(21 * var(--u)); font-weight: 600; letter-spacing: -.015em; }
.ag-build-block h3 .i { width: calc(20 * var(--u)); height: calc(20 * var(--u)); color: var(--lime-ink); }
.ag-build-block > p { margin-top: calc(4 * var(--u)); font-size: calc(15.5 * var(--u)); color: var(--ui-muted); }
.ag-tags { display: flex; flex-wrap: wrap; gap: calc(6 * var(--u)); margin-top: calc(12 * var(--u)); }
.ag-tags li { padding: calc(4 * var(--u)) calc(11 * var(--u)); border: 1px solid var(--ui-line); border-radius: 999px; background: #fff; font-size: calc(13.5 * var(--u)); font-weight: 500; color: var(--ui-text); }
.ag-build-stmt { margin-top: calc(12 * var(--u)); font-size: calc(15.5 * var(--u)); font-weight: 600; }
.ag-build-block.is-active { opacity: 1; border-color: var(--lime-line); box-shadow: inset calc(3 * var(--u)) 0 0 var(--lime); }
.ag-build-stage { position: relative; min-height: min(calc(620 * var(--u)), calc(100vh - 140px)); }
.ag-mock { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: calc(16 * var(--u)); opacity: 0; transform: translateY(16px) scale(.98); transition: opacity .6s var(--ease), transform .7s var(--ease); pointer-events: none; }
.ag-mock.on { opacity: 1; transform: none; }
.ag-mock-cap { display: inline-flex; align-items: center; gap: calc(8 * var(--u)); padding: calc(6 * var(--u)) calc(13 * var(--u)); border: 1px solid var(--ui-line); border-radius: 999px; background: #fff; font-size: calc(13.5 * var(--u)); color: var(--ui-muted); }
.ag-mock-cap::before { content: ""; width: calc(7 * var(--u)); height: calc(7 * var(--u)); border-radius: 50%; background: var(--lime-ink); }
.ag-phone { position: relative; width: calc(310 * var(--u)); padding: calc(38 * var(--u)) calc(19 * var(--u)) calc(21 * var(--u)); border: 1px solid var(--ui-line2); border-radius: calc(40 * var(--u)); background: #fff; box-shadow: var(--sh-lg), 0 0 0 calc(7 * var(--u)) var(--ui-soft2); }
.ag-phone-notch { position: absolute; top: calc(13 * var(--u)); left: 50%; width: calc(88 * var(--u)); height: calc(21 * var(--u)); margin-left: calc(-44 * var(--u)); border-radius: 999px; background: var(--ink); }
.ag-pv-head { display: flex; align-items: center; justify-content: space-between; padding-bottom: calc(12 * var(--u)); border-bottom: 1px solid var(--ui-line); font-size: calc(15 * var(--u)); }
.ag-pv-head .back { font-size: calc(22 * var(--u)); line-height: 1; color: var(--ui-muted); }
.ag-pv-head .i { width: calc(15 * var(--u)); height: calc(15 * var(--u)); color: var(--lime-ink); }
.ag-pv-doc { display: flex; align-items: center; gap: calc(10 * var(--u)); margin-top: calc(14 * var(--u)); padding: calc(11 * var(--u)); border-radius: var(--r); background: var(--ui-soft); }
.ag-pv-doc b { display: block; font-size: calc(14 * var(--u)); line-height: 1.2; }
.ag-pv-doc span { font-size: calc(12.5 * var(--u)); color: var(--ui-muted); }
.ag-pv-label { margin: calc(14 * var(--u)) 0 calc(8 * var(--u)); font-size: calc(11.5 * var(--u)); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ui-faint); }
.ag-pv-dates { display: grid; grid-template-columns: repeat(5, 1fr); gap: calc(5 * var(--u)); }
.ag-pv-dates span { display: grid; place-items: center; padding: calc(6 * var(--u)) 0; border: 1px solid var(--ui-line); border-radius: calc(10 * var(--u)); font-size: calc(15 * var(--u)); font-weight: 600; line-height: 1.2; }
.ag-pv-dates em { font-style: normal; font-size: calc(10.5 * var(--u)); font-weight: 500; color: var(--ui-faint); }
.ag-pv-times { display: grid; grid-template-columns: repeat(3, 1fr); gap: calc(5 * var(--u)); }
.ag-pv-times span { padding: calc(7 * var(--u)) 0; border: 1px solid var(--ui-line); border-radius: calc(8 * var(--u)); font-size: calc(13.5 * var(--u)); font-weight: 500; text-align: center; font-variant-numeric: tabular-nums; }
.ag-pv-dates .sel, .ag-pv-times .sel { border-color: var(--ink); background: var(--ink); color: var(--lime); }
.ag-pv-dates .sel em { color: rgba(255, 255, 255, .65); }
.ag-pv-field { display: flex; justify-content: space-between; margin-top: calc(14 * var(--u)); padding: calc(11 * var(--u)) calc(13 * var(--u)); border: 1px solid var(--ui-line); border-radius: calc(10 * var(--u)); font-size: calc(13.5 * var(--u)); }
.ag-pv-field span { color: var(--ui-muted); }
.ag-pv-btn { display: grid; place-items: center; height: calc(44 * var(--u)); margin-top: calc(12 * var(--u)); border-radius: var(--r); background: var(--lime); color: var(--ink); font-size: calc(15 * var(--u)); font-weight: 600; }
.ag-dash { display: grid; grid-template-columns: calc(56 * var(--u)) 1fr; width: min(100%, calc(580 * var(--u))); overflow: hidden; border: 1px solid var(--ui-line); border-radius: var(--r-lg); background: #fff; box-shadow: var(--sh-lg); }
.ag-dash-side { display: flex; flex-direction: column; align-items: center; gap: calc(8 * var(--u)); padding: calc(16 * var(--u)) 0; border-right: 1px solid var(--ui-line); background: var(--ui-soft); }
.ag-dash-side img { width: calc(26 * var(--u)); height: auto; margin-bottom: calc(10 * var(--u)); }
.ag-dash-side i { display: grid; place-items: center; width: calc(34 * var(--u)); height: calc(34 * var(--u)); border-radius: calc(8 * var(--u)); color: var(--ui-faint); }
.ag-dash-side i .i { width: calc(17 * var(--u)); height: calc(17 * var(--u)); }
.ag-dash-side i.on { border: 1px solid var(--ui-line); background: #fff; color: var(--ink); }
.ag-dash-main { min-width: 0; padding: calc(19 * var(--u)); }
.ag-dash-top { display: flex; align-items: center; justify-content: space-between; gap: calc(10 * var(--u)); }
.ag-dash-top b { display: block; margin-top: calc(2 * var(--u)); font-family: var(--font-head); font-size: calc(19 * var(--u)); font-weight: 600; letter-spacing: -.02em; }
.ag-dash-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: calc(8 * var(--u)); margin: calc(16 * var(--u)) 0; }
.ag-dash-stats div { padding: calc(12 * var(--u)) calc(13 * var(--u)); border: 1px solid var(--ui-line); border-radius: calc(10 * var(--u)); }
.ag-dash-stats span { display: block; font-size: calc(12.5 * var(--u)); color: var(--ui-muted); }
.ag-dash-stats b { font-family: var(--font-head); font-size: calc(26 * var(--u)); font-weight: 600; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.ag-dash-stats b.hi { color: var(--lime-ink); }
.ag-dash-table { width: 100%; border-collapse: collapse; font-size: calc(14 * var(--u)); }
.ag-dash-table th { padding: calc(8 * var(--u)) calc(6 * var(--u)); border-bottom: 1px solid var(--ui-line); font-size: calc(11.5 * var(--u)); font-weight: 700; letter-spacing: .06em; text-align: left; text-transform: uppercase; color: var(--ui-faint); }
.ag-dash-table td { padding: calc(10 * var(--u)) calc(6 * var(--u)); border-bottom: 1px solid var(--ui-line); white-space: nowrap; }
.ag-dash-table tr:last-child td { border-bottom: 0; }
.ag-dash-table td:first-child { font-weight: 600; }

/* =========================================================
   EXPERIENCE BUILDER
   ========================================================= */
.ag-builder { overflow: hidden; border: 1px solid var(--ui-line); border-radius: var(--r-xl); background: #fff; box-shadow: var(--sh-lg); }
.ag-b-top { display: flex; flex-wrap: wrap; align-items: center; gap: calc(16 * var(--u)); padding: calc(13 * var(--u)) calc(19 * var(--u)); border-bottom: 1px solid var(--ui-line); background: var(--ui-soft); }
.ag-b-crumb { font-size: calc(14.5 * var(--u)); color: var(--ui-muted); }
.ag-b-crumb span { margin: 0 calc(4 * var(--u)); color: var(--ui-line2); }
.ag-b-crumb b { color: var(--ink); font-weight: 600; }
.ag-b-state { display: inline-grid; }
.ag-b-state > span { grid-area: 1 / 1; display: inline-flex; align-items: center; gap: calc(5 * var(--u)); height: calc(26 * var(--u)); padding: 0 calc(11 * var(--u)); border-radius: 999px; font-size: calc(12.5 * var(--u)); font-weight: 600; transition: opacity .4s, transform .4s var(--ease); }
.ag-b-state .off { border: 1px solid var(--ui-line); background: var(--ui-soft2); color: var(--ui-text); }
.ag-b-state .on-s { border: 1px solid var(--lime-line); background: var(--lime-tint); color: var(--lime-ink); opacity: 0; transform: scale(.9); }
.ag-b-state .i { width: calc(13 * var(--u)); height: calc(13 * var(--u)); stroke-width: 2.6; }
.ag-b-state.on .off { opacity: 0; }
.ag-b-state.on .on-s { opacity: 1; transform: none; }
.ag-b-buttons { display: flex; gap: calc(8 * var(--u)); margin-left: auto; }
.ag-b-test.is-active { border-color: var(--lime-ink); color: var(--lime-ink); box-shadow: 0 0 0 calc(4 * var(--u)) var(--lime-tint); }
.ag-js .ag-b-publish { opacity: .45; }
.ag-js .ag-b-publish.is-ready { opacity: 1; }
.ag-b-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); }
.ag-b-main { display: grid; align-content: start; gap: calc(22 * var(--u)); padding: calc(26 * var(--u)); }
.ag-b-preview { display: flex; flex-direction: column; border-left: 1px solid var(--ui-line); background: var(--ui-soft); }
.ag-b-label { display: flex; align-items: center; gap: calc(8 * var(--u)); margin-bottom: calc(8 * var(--u)); font-size: calc(13 * var(--u)); font-weight: 600; color: var(--ui-muted); }
.ag-b-label .n { padding: calc(1 * var(--u)) calc(8 * var(--u)); border-radius: 999px; background: var(--ui-soft2); font-size: calc(12 * var(--u)); color: var(--ui-text); font-variant-numeric: tabular-nums; }
.ag-b-input { display: flex; align-items: center; gap: calc(10 * var(--u)); min-height: calc(50 * var(--u)); padding: calc(8 * var(--u)) calc(15 * var(--u)); border: 1px solid var(--ui-line2); border-radius: calc(12 * var(--u)); background: #fff; font-size: calc(16 * var(--u)); }
.ag-caret { width: 1.5px; height: calc(19 * var(--u)); margin-left: calc(-8 * var(--u)); background: var(--lime-ink); opacity: 0; }
.ag-b-goal.is-typing .ag-caret { opacity: 1; animation: agBlink 1s steps(1) infinite; }
@keyframes agBlink { 50% { opacity: 0; } }
.ag-b-two { display: grid; grid-template-columns: 1fr 1fr; gap: calc(22 * var(--u)); }
.ag-b-know { display: grid; gap: calc(6 * var(--u)); }
.ag-b-know li { display: flex; align-items: center; gap: calc(10 * var(--u)); padding: calc(10 * var(--u)) calc(13 * var(--u)); border: 1px solid var(--ui-line); border-radius: calc(10 * var(--u)); background: #fff; font-size: calc(14.5 * var(--u)); font-weight: 500; }
.ag-b-know .i { width: calc(16 * var(--u)); height: calc(16 * var(--u)); color: var(--lime-ink); }
.ag-b-chips { display: flex; flex-wrap: wrap; gap: calc(6 * var(--u)); }
.ag-b-chips span { display: inline-flex; align-items: center; gap: calc(7 * var(--u)); height: calc(36 * var(--u)); padding: 0 calc(13 * var(--u)); border: 1px solid var(--ui-line); border-radius: calc(9 * var(--u)); background: #fff; font-size: calc(14.5 * var(--u)); font-weight: 500; }
.ag-b-chips .i { width: calc(16 * var(--u)); height: calc(16 * var(--u)); color: var(--ui-text); }
.ag-b-actions { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: calc(6 * var(--u)); }
.ag-b-actions li { display: flex; align-items: center; gap: calc(8 * var(--u)); padding: calc(11 * var(--u)); border: 1px solid var(--ui-line); border-radius: calc(10 * var(--u)); background: #fff; font-size: calc(13.5 * var(--u)); font-weight: 500; line-height: 1.25; }
.ag-b-actions .i { width: calc(15 * var(--u)); height: calc(15 * var(--u)); color: var(--ui-text); }
.ag-tgl { position: relative; flex: none; width: calc(28 * var(--u)); height: calc(17 * var(--u)); margin-left: auto; border-radius: 999px; background: var(--ui-line2); transition: background .3s; }
.ag-tgl::after { content: ""; position: absolute; top: calc(2 * var(--u)); left: calc(2 * var(--u)); width: calc(13 * var(--u)); height: calc(13 * var(--u)); border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, .2); transition: transform .3s var(--ease); }
.ag-b-actions li.on .ag-tgl { background: var(--ink); }
.ag-b-actions li.on .ag-tgl::after { background: var(--lime); transform: translateX(calc(11 * var(--u))); }
.ag-b-actions li.is-running { border-color: var(--lime-ink); box-shadow: 0 0 0 calc(3 * var(--u)) var(--lime-tint); }
.ag-b-actions li.is-running .i, .ag-b-actions li.is-used .i { color: var(--lime-ink); }
.ag-b-actions li.is-used { border-color: var(--lime-line); }
.ag-js [data-b] { opacity: 0; transform: translateY(8px); transition: opacity .45s var(--ease), transform .5s var(--ease), border-color .3s; }
.ag-js [data-b].in-b { opacity: 1; transform: none; }
.ag-b-prev-head { display: flex; align-items: center; justify-content: space-between; padding: calc(15 * var(--u)) calc(19 * var(--u)); border-bottom: 1px solid var(--ui-line); }
.ag-b-prev-body { display: flex; flex: 1; flex-direction: column; justify-content: flex-end; gap: calc(10 * var(--u)); min-height: calc(280 * var(--u)); padding: calc(19 * var(--u)); }
.ag-b-empty { max-width: 26ch; margin: auto; text-align: center; font-size: calc(14.5 * var(--u)); color: var(--ui-faint); }
.ag-b-prev-body .ag-msg.in { border: 1px solid var(--ui-line); background: #fff; }
.ag-b-trace { align-self: flex-end; display: inline-flex; align-items: center; gap: calc(6 * var(--u)); font-size: calc(12.5 * var(--u)); font-weight: 600; color: var(--lime-ink); }
.ag-b-trace .i { width: calc(13 * var(--u)); height: calc(13 * var(--u)); stroke-width: 2.6; }
.ag-js .ag-b-trace .tr { opacity: 0; transition: opacity .4s var(--ease); }
.ag-js .ag-b-trace .tr.is-shown { opacity: 1; }
.ag-js [data-bt] { display: none; }
.ag-js [data-bt].is-shown { display: block; animation: agIn .45s var(--ease) both; }
.ag-js .ag-b-trace[data-bt].is-shown { display: inline-flex; }
.ag-b-success { display: flex; align-items: center; gap: calc(12 * var(--u)); margin: 0 calc(19 * var(--u)) calc(19 * var(--u)); padding: calc(15 * var(--u)); border: 1px solid var(--lime-line); border-radius: var(--r); background: #fff; box-shadow: var(--sh); transition: opacity .5s var(--ease), transform .5s var(--ease); }
.ag-js .ag-b-success { opacity: 0; transform: translateY(10px); }
.ag-js .ag-b-success.is-shown { opacity: 1; transform: none; }
.ag-b-success .ck { display: grid; place-items: center; flex: none; width: calc(34 * var(--u)); height: calc(34 * var(--u)); border-radius: 50%; background: var(--lime); color: var(--ink); }
.ag-b-success .ck .i { width: calc(17 * var(--u)); height: calc(17 * var(--u)); stroke-width: 2.6; }
.ag-b-success b { display: block; font-size: calc(15.5 * var(--u)); }
.ag-b-success span { font-size: calc(13 * var(--u)); color: var(--ui-muted); }

/* =========================================================
   IMPROVE
   ========================================================= */
.ag-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ag-metric { display: flex; flex-direction: column; gap: calc(6 * var(--u)); padding: calc(26 * var(--u)); }
.ag-metric + .ag-metric { border-left: 1px solid var(--ui-line); }
.ag-metric .lbl { font-size: calc(14 * var(--u)); font-weight: 500; color: var(--ui-muted); }
.ag-metric .val { font-family: var(--font-head); font-size: calc(52 * var(--u)); font-weight: 600; line-height: 1.1; letter-spacing: -.035em; font-variant-numeric: tabular-nums; }
.ag-metric .val.hi { color: var(--lime-ink); }
.ag-metric .delta { font-size: calc(13 * var(--u)); color: var(--ui-muted); }
.ag-spark { width: 100%; height: calc(36 * var(--u)); margin: calc(6 * var(--u)) 0 calc(4 * var(--u)); overflow: visible; }
.ag-spark path { fill: none; stroke: var(--lime-ink); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ag-spark.muted path { stroke: var(--ui-text); }
.ag-js .ag-spark path { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1.6s var(--ease) .2s; }
.ag-js .in .ag-spark path { stroke-dashoffset: 0; }
.ag-meter { height: calc(9 * var(--u)); margin: calc(20 * var(--u)) 0 calc(12 * var(--u)); overflow: hidden; border-radius: 999px; background: var(--ui-soft2); }
.ag-meter i { display: block; width: var(--w); height: 100%; border-radius: inherit; background: var(--lime); }
.ag-js .ag-meter i { width: 0; transition: width 1.6s var(--ease) .2s; }
.ag-js .in .ag-meter i { width: var(--w); }
.ag-signals { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: calc(12 * var(--u)); margin-top: calc(12 * var(--u)); }
.ag-signal { display: flex; flex-direction: column; gap: calc(6 * var(--u)); padding: calc(21 * var(--u)); border: 1px solid var(--ui-line); border-radius: var(--r-lg); background: #fff; }
.ag-signal .lbl { display: inline-flex; align-items: center; gap: calc(6 * var(--u)); font-size: calc(11.5 * var(--u)); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ui-faint); }
.ag-signal .lbl .i { width: calc(14 * var(--u)); height: calc(14 * var(--u)); }
.ag-signal b { font-size: calc(17 * var(--u)); font-weight: 600; line-height: 1.35; letter-spacing: -.01em; }
.ag-signal.opp { border-color: var(--lime); background: var(--lime-wash); }
.ag-signal.opp .lbl { color: var(--lime-ink); }

/* =========================================================
   HUMAN + AI
   ========================================================= */
.ag-two { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: calc(88 * var(--u)); align-items: center; }
.ag-hflow { display: grid; justify-items: start; max-width: calc(600 * var(--u)); margin-top: calc(36 * var(--u)); }
.ag-hnode { display: inline-flex; align-items: center; gap: calc(9 * var(--u)); padding: calc(11 * var(--u)) calc(15 * var(--u)); border: 1px solid var(--ui-line); border-radius: calc(12 * var(--u)); background: #fff; box-shadow: 0 1px 2px rgba(17, 19, 24, .05); font-size: calc(15 * var(--u)); font-weight: 600; }
.ag-hnode .i { width: calc(17 * var(--u)); height: calc(17 * var(--u)); color: var(--ui-text); }
.ag-hnode.ai { border-color: var(--ink); background: var(--ink); color: #fff; }
.ag-hnode.ai .i { color: var(--lime); }
.ag-hnode.ok { border-color: var(--lime); background: var(--lime); color: var(--ink); }
.ag-hnode.ok .i { color: var(--ink); }
.ag-hnode.human .i { color: var(--lime-ink); }
.ag-harrow { position: relative; width: 2px; height: calc(24 * var(--u)); margin-left: calc(25 * var(--u)); background: var(--ui-line2); }
.ag-harrow::after { content: ""; position: absolute; left: -3px; bottom: -1px; border: 4px solid transparent; border-top: 5px solid var(--ui-line2); border-bottom: 0; }
.ag-hsplit { display: flex; align-items: flex-start; gap: calc(10 * var(--u)); }
.ag-hsplit .or { padding-top: calc(14 * var(--u)); font-size: calc(11.5 * var(--u)); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--ui-faint); }
.ag-hbranch { display: grid; justify-items: start; }
.ag-keypoints { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: calc(11 * var(--u)) calc(22 * var(--u)); max-width: calc(500 * var(--u)); margin-top: calc(32 * var(--u)); }
.ag-keypoints li { display: flex; align-items: center; gap: calc(9 * var(--u)); font-size: calc(16 * var(--u)); font-weight: 500; }
.ag-keypoints .i { width: calc(16 * var(--u)); height: calc(16 * var(--u)); stroke-width: 2.4; color: var(--lime-ink); }
.ag-handoff { overflow: hidden; }
.ag-ho-msgs { display: flex; flex-direction: column; gap: calc(8 * var(--u)); padding: calc(17 * var(--u)) calc(20 * var(--u)); }
.ag-ho-divider { position: relative; padding: calc(4 * var(--u)) calc(20 * var(--u)); text-align: center; }
.ag-ho-divider::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; border-top: 1px dashed var(--ui-line2); }
.ag-ho-divider span { position: relative; display: inline-flex; align-items: center; gap: calc(7 * var(--u)); padding: calc(5 * var(--u)) calc(13 * var(--u)); border: 1px solid var(--amber-line); border-radius: 999px; background: var(--amber); color: var(--amber-ink); font-size: calc(13 * var(--u)); font-weight: 600; }
.ag-ho-divider .i { width: calc(14 * var(--u)); height: calc(14 * var(--u)); }
.ag-ho-task { margin: calc(17 * var(--u)); padding: calc(4 * var(--u)) calc(17 * var(--u)) calc(15 * var(--u)); border: 1px solid var(--ui-line2); border-radius: calc(15 * var(--u)); background: #fff; box-shadow: var(--sh); }
.ag-ho-task-head { display: flex; align-items: center; justify-content: space-between; gap: calc(10 * var(--u)); padding: calc(13 * var(--u)) 0; border-bottom: 1px solid var(--ui-line); font-size: calc(15 * var(--u)); }
.ag-ho-task .ag-kv > div { align-items: flex-start; }
.ag-ho-task .ag-kv dd { max-width: 60%; font-weight: 500; }
.ag-ho-task .ag-kv dd b { font-weight: 600; }
.ag-ho-task .ag-kv dd b.hi { color: var(--lime-ink); }
.ag-mini-chips { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: calc(4 * var(--u)); width: 100%; }
.ag-mini-chips span { padding: calc(2 * var(--u)) calc(8 * var(--u)); border-radius: calc(6 * var(--u)); background: var(--lime-tint); color: var(--lime-ink); font-size: calc(12 * var(--u)); font-weight: 500; }
.ag-ho-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: calc(12 * var(--u)); padding-top: calc(13 * var(--u)); border-top: 1px solid var(--ui-line); }
.ag-assignee { display: inline-flex; align-items: center; gap: calc(9 * var(--u)); font-size: calc(13 * var(--u)); color: var(--ui-muted); }
.ag-assignee b { display: block; font-size: calc(14 * var(--u)); line-height: 1.2; color: var(--ink); }
.ag-ho-btns { display: flex; gap: calc(6 * var(--u)); }
.ag-js .ag-ho-s { opacity: 0; transform: translateY(12px); transition: opacity .6s var(--ease), transform .65s var(--ease); transition-delay: calc(var(--d, 0) * 420ms); }
.ag-js .ag-handoff.in .ag-ho-s { opacity: 1; transform: none; }

/* =========================================================
   USE CASES
   ========================================================= */
.ag-uc-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: calc(16 * var(--u)); }
.ag-uc { position: relative; overflow: hidden; padding: calc(28 * var(--u)); border: 1px solid var(--ui-line); border-radius: var(--r-lg); background: #fff; outline: none; transition: border-color .35s var(--ease), box-shadow .35s var(--ease); }
.ag-uc::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: calc(3 * var(--u)); background: var(--lime); transform: scaleX(0); transform-origin: left; transition: transform .45s var(--ease); }
.ag-uc:hover, .ag-uc:focus-visible { border-color: var(--ui-line2); box-shadow: var(--sh); }
.ag-uc:hover::before, .ag-uc:focus-visible::before { transform: scaleX(1); }
.ag-uc-ic { display: grid; place-items: center; width: calc(44 * var(--u)); height: calc(44 * var(--u)); margin-bottom: calc(20 * var(--u)); border-radius: calc(12 * var(--u)); background: var(--ui-soft2); color: var(--ink); transition: background .35s, color .35s; }
.ag-uc-ic .i { width: calc(20 * var(--u)); height: calc(20 * var(--u)); }
.ag-uc:hover .ag-uc-ic, .ag-uc:focus-visible .ag-uc-ic { background: var(--lime); }
.ag-uc h3 { font-family: var(--font-head); font-size: calc(22 * var(--u)); font-weight: 600; letter-spacing: -.02em; }
.ag-uc p { margin-top: calc(6 * var(--u)); font-size: calc(16 * var(--u)); line-height: 1.55; color: var(--ui-muted); }
.ag-uc-flow { display: flex; flex-wrap: wrap; align-items: center; gap: calc(5 * var(--u)); max-height: 0; margin-top: 0; overflow: hidden; opacity: 0; transition: max-height .5s var(--ease), opacity .4s var(--ease), margin-top .5s var(--ease); }
.ag-uc-flow span { padding: calc(3 * var(--u)) calc(9 * var(--u)); border: 1px solid var(--ui-line); border-radius: calc(6 * var(--u)); background: var(--ui-soft); font-size: calc(12.5 * var(--u)); font-weight: 500; white-space: nowrap; }
.ag-uc-flow span.g { border-color: var(--lime); background: var(--lime); color: var(--ink); }
.ag-uc-flow i { font-style: normal; font-size: calc(12 * var(--u)); color: var(--ui-faint); }
.ag-uc:hover .ag-uc-flow, .ag-uc:focus-visible .ag-uc-flow, .ag-uc:focus-within .ag-uc-flow { max-height: calc(96 * var(--u)); margin-top: calc(18 * var(--u)); opacity: 1; }

/* =========================================================
   CONTROL
   ========================================================= */
.ag-gov-list { display: grid; max-width: calc(560 * var(--u)); margin-top: calc(32 * var(--u)); border-top: 1px solid var(--ui-line); }
.ag-gov-list li { display: flex; gap: calc(14 * var(--u)); padding: calc(16 * var(--u)) 0; border-bottom: 1px solid var(--ui-line); }
.ag-g-ic { display: grid; place-items: center; flex: none; width: calc(38 * var(--u)); height: calc(38 * var(--u)); border: 1px solid var(--ui-line); border-radius: calc(10 * var(--u)); background: #fff; color: var(--ink); }
.ag-g-ic .i { width: calc(17 * var(--u)); height: calc(17 * var(--u)); }
.ag-gov-list b { display: block; font-size: calc(17 * var(--u)); font-weight: 600; }
.ag-gov-list span { font-size: calc(15.5 * var(--u)); color: var(--ui-muted); }
.ag-approve .ag-kv { padding: calc(6 * var(--u)) calc(20 * var(--u)); }
.ag-approve .ag-kv > div { padding: calc(13 * var(--u)) 0; }
.ag-approve .muted { font-size: calc(13 * var(--u)); font-weight: 500; color: var(--ui-muted); }
.ag-ap-status { display: inline-grid !important; }
.ag-ap-status > span { grid-area: 1 / 1; justify-self: end; transition: opacity .45s var(--ease), transform .45s var(--ease); }
.ag-ap-status .off { display: inline-flex; align-items: center; gap: calc(7 * var(--u)); font-size: calc(14 * var(--u)); font-weight: 500; color: var(--ui-muted); }
.ag-ap-status .on-s { opacity: 0; transform: scale(.92); }
.ag-approve.is-approved .ag-ap-status .off { opacity: 0; }
.ag-approve.is-approved .ag-ap-status .on-s { opacity: 1; transform: none; }
.ag-audit { margin: 0 calc(20 * var(--u)); padding: calc(15 * var(--u)) calc(17 * var(--u)); border: 1px solid var(--ui-line); border-radius: var(--r); background: var(--ui-soft); }
.ag-audit ol { display: grid; gap: calc(6 * var(--u)); margin-top: calc(10 * var(--u)); }
.ag-audit li { display: flex; gap: calc(12 * var(--u)); font-size: calc(14 * var(--u)); color: var(--ui-text); }
.ag-audit time { padding-top: 1px; font-family: var(--mono); font-size: calc(12.5 * var(--u)); color: var(--ui-faint); }
.ag-js .ag-au { opacity: 0; transform: translateX(-6px); transition: opacity .45s var(--ease), transform .45s var(--ease); transition-delay: calc(var(--d) * 160ms + 300ms); }
.ag-js .ag-approve.is-approved .ag-au { opacity: 1; transform: none; }
.ag-ap-pending { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: calc(12 * var(--u)); margin: calc(12 * var(--u)) calc(20 * var(--u)) calc(20 * var(--u)); padding: calc(13 * var(--u)) calc(15 * var(--u)); border: 1px dashed var(--ui-line2); border-radius: var(--r); }
.ag-ap-pending b { display: block; margin-top: calc(2 * var(--u)); font-size: calc(15 * var(--u)); }

/* =========================================================
   PLATFORM + CLOSING + FINAL CTA
   ========================================================= */
.ag-stack { display: grid; }
.ag-layer { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: calc(16 * var(--u)); padding: calc(19 * var(--u)) calc(21 * var(--u)); border: 1px solid var(--ui-line); border-radius: var(--r-lg); background: #fff; transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s; }
.ag-layer:hover { transform: translateY(-2px); border-color: var(--ui-line2); box-shadow: var(--sh); }
.ag-layer h3 { font-family: var(--font-head); font-size: calc(21 * var(--u)); font-weight: 600; letter-spacing: -.02em; }
.ag-layer p { font-size: calc(15.5 * var(--u)); color: var(--ui-muted); }
.ag-layer-ic { display: grid; place-items: center; width: calc(44 * var(--u)); height: calc(44 * var(--u)); border-radius: calc(12 * var(--u)); background: var(--ui-soft2); }
.ag-layer-ic .i { width: calc(20 * var(--u)); height: calc(20 * var(--u)); }
.ag-layer .n { font-family: var(--mono); font-size: calc(13 * var(--u)); color: var(--ui-faint); }
.ag-layer.focus { border-color: var(--ink); box-shadow: var(--sh-lg); }
.ag-layer.focus .ag-layer-ic { background: var(--ink); color: var(--lime); }
.ag-layer.focus .n { font-weight: 700; color: var(--lime-ink); }
.ag-stack-arrow { display: grid; place-items: center; height: calc(30 * var(--u)); color: var(--ui-line2); }
.ag-stack-arrow .i { width: calc(17 * var(--u)); height: calc(17 * var(--u)); }
.ag-closing { margin-top: calc(152 * var(--u)); text-align: center; }
.ag-closing .ag-h2 { max-width: calc(1000 * var(--u)); margin: 0 auto; font-size: calc(68 * var(--u)); line-height: calc(74 * var(--u)); }
.ag-closing .ag-body { max-width: calc(640 * var(--u)); margin: calc(22 * var(--u)) auto 0; font-size: calc(20 * var(--u)); }
.ag-closing .ag-cta { margin-top: calc(40 * var(--u)); }
.ag-final { position: relative; display: grid; grid-template-columns: minmax(0, 1.4fr) auto; align-items: end; column-gap: calc(56 * var(--u)); overflow: hidden; padding: calc(64 * var(--u)); border: 1px solid var(--ui-line); border-radius: var(--r-xl); background: #fff; box-shadow: var(--sh); }
.ag-final::before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: calc(5 * var(--u)); background: var(--lime); }
.ag-final .ag-body { max-width: calc(640 * var(--u)); }
.ag-final-actions { display: grid; justify-items: start; gap: calc(12 * var(--u)); }
.ag-final-note { font-size: calc(14 * var(--u)); color: var(--ui-muted); }

/* =========================================================
   REVEALS + LOAD-IN
   ========================================================= */
@media (prefers-reduced-motion: no-preference) {
  .ag-js .ag-rv { opacity: 0; transform: translateY(20px); transition: opacity .7s var(--ease), transform .75s var(--ease); transition-delay: calc(var(--i, 0) * 80ms); }
  .ag-js .ag-rv.in { opacity: 1; transform: none; }
  .ag-js [data-load] { opacity: 0; transform: translateY(22px); }
  .ag-js .ag-ws[data-load] { transform: translateY(28px) scale(.965); }
  .ag-js .ag-person[data-load] { transform: translateX(28px); }
  .ag-js .ag.loaded [data-load] { opacity: 1; transform: none; transition: opacity .8s var(--ease), transform .9s var(--ease); transition-delay: calc(var(--l, 0) * 110ms); }
  .ag-js .ag.loaded .ag-person[data-load] { transition-duration: 1.4s, 1.6s; }
}

/* =========================================================
   STATIC STORIES — touch widths, short viewports, reduced motion
   ========================================================= */
.ag-story.is-static { height: auto; }
.ag-story.is-static .ag-pin { position: relative; top: auto; height: auto; overflow: visible; padding-top: calc(136 * var(--u)); padding-bottom: calc(136 * var(--u)); }
.ag-story.is-static .ag-build-stage { display: grid; gap: calc(48 * var(--u)); min-height: 0; }
.ag-story.is-static .ag-mock { position: relative; inset: auto; opacity: 1; transform: none; }
.ag-story.is-static .ag-build-block { opacity: 1; }
@media (max-height: 860px) and (min-width: 1180px) {
  .ag-ctx div span { display: none; }
  .ag-steps { margin-top: calc(18 * var(--u)); }
  .ag-statement { margin-top: calc(20 * var(--u)); }
}

/* =========================================================
   BELOW 1180px
   ========================================================= */
@media (max-width: 1179px) {
  .ag { --pad: 22px; }
  .ag-eyebrow { font-size: 12px; margin-bottom: 14px; gap: 8px; }
  .ag-h1 { font-size: 40px; line-height: 44px; }
  .ag-h2 { font-size: 31px; line-height: 37px; }
  .ag-h3 { font-size: 24px; line-height: 31px; }
  .ag-h1 br, .ag-h2 br { display: none; }
  .ag-lead { font-size: 18px; line-height: 27px; }
  .ag-body, .ag-hero__row .ag-body, .ag-copy .ag-body { font-size: 16px; line-height: 26px; }
  .ag-statement { font-size: 19px; line-height: 27px; }
  .ag-link { font-size: 16px; }
  .ag .btn .i { width: 18px; height: 18px; }

  .ag-sec { padding: 64px 22px; }
  .ag-sec.soft::after { display: none; }
  .ag-head { display: block; margin-bottom: 36px; }
  .ag-head .ag-body { margin-top: 16px; }
  .ag-hero { padding: 44px 22px 56px; }
  .ag-hero__grid { display: none; }
  .ag-hero__row { display: block; margin-top: 18px; }
  .ag-hero__row .ag-cta { margin-top: 26px; }

  .ag-stage { display: block; margin-top: 44px; }
  .ag-person { display: grid; grid-template-columns: minmax(0, 1fr) 150px; align-items: center; gap: 8px; height: auto; min-height: 240px; margin-bottom: 14px; }
  .ag-person img { position: relative; left: auto; grid-column: 2; grid-row: 1; width: 100%; height: 250px; object-fit: cover; object-position: top; }
  .ag-bubbles { position: relative; left: auto; top: auto; grid-column: 1; grid-row: 1; justify-self: end; width: 100%; max-width: 300px; }
  .ag-b { font-size: 13px; }
  .ag-link-path { display: none; }
  .ag-ws-bar .ag-dots { display: none; }
  .ag-ws-grid { grid-template-columns: 1fr; min-height: 0; }
  .ag-ws-col + .ag-ws-col { border-left: 0; border-top: 1px solid var(--ui-line); }
  .ag-chat-body { height: 320px; }
  .ag-principle { font-size: 19px; margin-top: 36px; }
  .ag-storyline { overflow-x: auto; scrollbar-width: none; padding: 18px 22px; gap: 14px; }
  .ag-storyline::-webkit-scrollbar { display: none; }
  .ag-storyline a, .ag-storyline span { font-size: 15px; }

  .ag-story-grid, .ag-two { display: block; }
  .ag-visual, .ag-two > * + * { margin-top: 36px; }
  .ag-story.is-static .ag-pin { padding-top: 64px; padding-bottom: 64px; }
  .ag-ctx-grid { grid-template-columns: 1fr 1fr; }
  .ag-ctx div span { display: none; }
  .ag-slot { grid-template-columns: auto 1fr auto; }
  .ag-slot em { display: none; }
  .ag-flow .ag-sys { display: none; }
  .ag-flow li { grid-template-columns: auto 1fr; }
  .ag-acts, .ag-keypoints { grid-template-columns: 1fr; }

  .ag-jobs-head { display: block; }
  .ag-jobs-head .ag-body { margin-top: 16px; justify-self: start; }
  .ag-jobs-grid { display: grid; grid-template-columns: 1fr; gap: 12px; }
  .ag-jobs-grid .ag-core { order: -1; min-height: 560px; }
  .ag-jobs-col { grid-template-columns: 1fr 1fr; gap: 10px; }
  .ag-job .wire { display: none; }
  .ag-job.l.is-active, .ag-job.r.is-active { transform: none; }
  .ag-jobs-outro { font-size: 19px; }

  .ag-phone { width: 100%; max-width: 300px; }
  .ag-dash { grid-template-columns: 1fr; }
  .ag-dash-side { display: none; }

  .ag-b-grid { grid-template-columns: 1fr; }
  .ag-b-preview { border-left: 0; border-top: 1px solid var(--ui-line); }
  .ag-b-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ag-metrics { grid-template-columns: 1fr 1fr; }
  .ag-metric:nth-child(3) { border-left: 0; }
  .ag-metric:nth-child(n+3) { border-top: 1px solid var(--ui-line); }
  .ag-metric .val { font-size: 38px; }
  .ag-signals, .ag-uc-grid { grid-template-columns: 1fr 1fr; }
  .ag-uc-flow { max-height: 96px; margin-top: 18px; opacity: 1; }
  .ag-closing { margin-top: 72px; }
  .ag-closing .ag-h2 { font-size: 34px; line-height: 40px; }
  .ag-closing .ag-cta { flex-direction: column; }
  .ag-final { display: block; padding: 32px 26px; }
  .ag-final-actions { margin-top: 26px; }
}
@media (max-width: 640px) {
  .ag-ctx-grid { grid-template-columns: 1fr 1fr; }
  .ag-jobs-col, .ag-signals, .ag-uc-grid, .ag-b-two, .ag-metrics { grid-template-columns: 1fr; }
  .ag-metric + .ag-metric { border-left: 0; border-top: 1px solid var(--ui-line); }
  .ag-b-top { gap: 10px; }
  .ag-b-top .ag-dots { display: none; }
  .ag-b-buttons { width: 100%; margin-left: 0; }
  .ag-b-buttons .ag-mini-btn { flex: 1; }
  .ag-b-main { padding: 18px; }
  .ag-b-actions { grid-template-columns: 1fr; }
  .ag-dash-table th:nth-child(2), .ag-dash-table td:nth-child(2) { display: none; }
  .ag-ho-task .ag-kv > div { flex-direction: column; gap: 4px; }
  .ag-ho-task .ag-kv dd { max-width: 100%; justify-content: flex-start; text-align: left; }
  .ag-mini-chips { justify-content: flex-start; }
  .ag-kv dt { white-space: normal; }
  .ag-hsplit { flex-wrap: wrap; }
  .ag-layer { grid-template-columns: auto 1fr; }
  .ag-layer .n { display: none; }
  .ag-hero__row .ag-cta .btn { width: 100%; }
}