/* /ia-automacao — hero com motion mv (da pergunta à ação) e seções no padrão r2 (texto | motion).
   Motions próprios (prefixo ia-): trilha vertical, três lentes, notas de rodapé, confirmações + prévia,
   registro de execuções, árvore de atendimento, pilha de versões, uso que desce. Roteiros em page.js. */

/* ---------- Hero ---------- */
.ia-hero{padding-block:clamp(40px,5vw,88px) clamp(80px,9vw,150px)}
.ia-hero-g{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(40px,6vw,96px);align-items:center}
.ia-hero-copy{display:flex;flex-direction:column;align-items:flex-start;gap:28px}
.ia-hero-copy > *{margin:0}
.ia-hero-copy .lead{max-width:36ch}
.ia-hero-vis{min-width:0}
@media (max-width:900px){.ia-hero-g{grid-template-columns:minmax(0,1fr);gap:40px}}

/* ---------- Pessoas (foto) ---------- */
.photo.a-photo{aspect-ratio:21/9}
.a-people-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:28px clamp(40px,6vw,96px);align-items:end;margin-top:var(--space-head)}
.a-col-copy{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.a-col-copy .body + .body{margin-top:0}
@media (max-width:900px){.photo.a-photo{aspect-ratio:4/3}.a-people-grid{grid-template-columns:minmax(0,1fr);align-items:start}}
@media (max-width:520px){.photo.a-photo{aspect-ratio:1/1}.a-photo figcaption{max-width:none}}
@media (min-width:901px){
  #pessoas > .wrap{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(40px,6vw,96px);align-items:center}
  #pessoas .a-photo{margin:0;aspect-ratio:3/2}
  #pessoas .a-people-grid{display:flex;flex-direction:column;align-items:flex-start;gap:16px;margin:0}
  #pessoas .a-people-grid > .stack-m{order:-1}
  #pessoas .a-col-copy{gap:10px}
}

/* ---------- Fechamento ---------- */
#fechamento{padding-block:clamp(96px,10vw,176px)}
.ia-close-g{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(40px,6vw,96px);align-items:end}
.ia-close-g .h2{max-width:22ch}
.ia-close-g .r2-body{margin-top:16px;color:var(--ink-2);max-width:44ch}
@media (max-width:900px){.ia-close-g{grid-template-columns:minmax(0,1fr);gap:32px}}

/* ===================== Motions (mv) ===================== */

/* 0 · hero: trilha vertical da pergunta à ação */
.ia-tr{position:relative}
.ia-tr ol{display:flex;flex-direction:column;gap:16px}
.ia-tr li{position:relative;display:grid;grid-template-columns:84px minmax(0,1fr);gap:14px;align-items:start;padding-left:28px}
.ia-tr li::before{content:"";position:absolute;left:0;top:3px;width:14px;height:14px;border-radius:50%;background:var(--paper);border:2px solid var(--sx-blue);box-sizing:border-box}
.ia-tr li:last-child::before{background:var(--sx-blue)}
.ia-tr-rail{position:absolute;left:6px;top:12px;bottom:24px;width:2px;background:var(--sx-line2)}
.ia-tr-rail b{position:absolute;inset:0;background:var(--sx-blue);transform-origin:top;transform:scaleY(var(--p,0));transition:transform .5s var(--sx-ease)}
.sx:not(.is-armed) .ia-tr-rail b{transform:none}
.ia-tr-k{font-size:12.5px;font-weight:500;color:var(--sx-blue-t);line-height:20px}
.ia-tr-q{background:#fff;border:1px solid var(--sx-line);border-radius:6px 16px 16px 16px;padding:12px 14px;font-size:14.5px;line-height:1.45}
.ia-tr-q small{display:block;margin-top:4px;font-size:12px;color:var(--sx-ink3)}
.ia-tr-c{display:flex;flex-wrap:wrap;gap:6px}
.ia-tr-c .sx-badge:not(.blue){background:#fff;box-shadow:inset 0 0 0 1px var(--sx-line)}
.ia-tr-s{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border-radius:999px;background:#fff;border:1px solid var(--sx-line);font-size:12.5px}
.ia-tr-s svg{width:12px;height:12px;color:var(--sx-ok-t)}
.ia-tr-r{background:#fff;border:1px solid var(--sx-line);border-radius:14px;padding:12px 14px;font-size:13.5px;color:var(--sx-ink2)}
.ia-tr-r b{display:block;font-family:var(--f-brand);font-size:18px;font-weight:500;color:var(--ink)}

/* 1 · mesma pergunta, três lentes */
.ia-qm-who{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:18px}
.ia-qm-who li{display:flex;align-items:center;gap:10px;min-width:0;padding:10px 12px;border-radius:14px;background:#fff;border:1px solid var(--sx-line);transition:border-color .3s,box-shadow .3s}
.ia-qm-who li.on{border-color:rgba(0,122,255,.5);box-shadow:0 0 0 3px rgba(0,122,255,.12)}
.ia-qm-who .sx-av{width:32px;height:32px}
.ia-qm-q{display:flex;align-items:center;gap:10px;margin-bottom:12px;font-family:var(--f-brand);font-size:16px;letter-spacing:-.01em}
.ia-qm-res > ul{background:#fff;border:1px solid var(--sx-line);border-radius:16px;padding:4px 16px 6px}
.ia-qm-res li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:11px 0;border-top:1px solid var(--sx-line)}
.ia-qm-res li.ia-qm-sc{display:block;border-top:0;padding:10px 0 6px;font-size:12.5px;color:var(--sx-ink3)}

/* 2 · resposta com notas de rodapé */
.ia-fn-a{background:#fff;border:1px solid var(--sx-line);border-radius:16px;padding:16px 18px;margin-bottom:12px}
.ia-fn-k{display:flex;align-items:center;gap:10px;margin-bottom:10px;font-size:12.5px;color:var(--sx-ink3)}
.ia-fn-k .sx-ic{width:26px;height:26px}
.ia-fn-t{font-family:var(--f-brand);font-size:18px;line-height:1.55;letter-spacing:-.01em}
.ia-ref{border-radius:4px;box-shadow:inset 0 -2px 0 rgba(0,122,255,.3);transition:background .3s}
.ia-ref.on{background:rgba(0,122,255,.14)}
.ia-fn-t sup{font-family:var(--f-ui);font-size:12px;font-weight:600;color:var(--sx-blue-t);margin-left:1px}
.ia-fn-s{display:flex;flex-direction:column;gap:8px}
.ia-fn-s li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:center;padding:12px 14px;background:#fff;border:1px solid var(--sx-line);border-radius:14px;transition:opacity .4s var(--sx-ease),transform .4s var(--sx-ease),border-color .3s}
.sx.is-armed .ia-fn-s li:not(.in){opacity:0;transform:translateY(8px)}
.ia-fn-s li.on{border-color:rgba(0,122,255,.5)}
.ia-fn-n{width:24px;height:24px;border-radius:50%;background:var(--sx-blue-b);color:var(--sx-blue-t);font-size:12px;font-weight:600;display:grid;place-items:center}

/* 3 · confirmações + prévia (seção escura, cena clara) */
.ia-ac{display:flex;flex-direction:column;gap:12px}
.ia-ac-cf{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:16px;padding:14px 16px;color:var(--paper)}
.ia-ac-k{font-size:12.5px;font-weight:500;color:var(--paper-2);margin-bottom:6px}
.ia-ac-cf li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:6px 0;font-size:13.5px}
.ia-sw{position:relative;flex:none;width:36px;height:22px;border-radius:999px;background:rgba(255,255,255,.22)}
.ia-sw::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .25s var(--sx-ease)}
.ia-sw.on{background:var(--sx-blue)}
.ia-sw.on::after{transform:translateX(14px)}
.ia-ac-pv{background:#fff;border-radius:16px;padding:16px;color:var(--ink)}
.ia-ac-pv .ia-ac-k{color:var(--sx-ink3)}
.ia-ac-pv li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--sx-line)}
.ia-ac-pv li small{font-size:12.5px;color:var(--sx-ink3);white-space:nowrap}
.ia-ac-pv .mv-tick{opacity:1;transform:none;background:transparent;box-shadow:inset 0 0 0 1.5px var(--sx-line2);color:transparent;transition:background .25s,box-shadow .25s,color .25s}
.ia-ac-pv li.ok .mv-tick{background:var(--sx-ok);box-shadow:none;color:#fff}
.ia-ac-ft{display:flex;align-items:center;gap:8px;margin-top:4px;padding-top:12px;border-top:1px solid var(--sx-line)}
.ia-ac-w{flex:1;min-width:0;font-size:12.5px;color:var(--sx-ink3)}
.ia-ac-w.ok{color:var(--sx-ok-t);font-weight:500}

/* 4 · registro de execuções */
.ia-ex-r{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 12px;align-items:center;background:#fff;border:1px solid var(--sx-line);border-radius:16px;padding:14px 16px}
.ia-ex-tags{grid-column:2;display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.ia-ex-h{display:flex;justify-content:space-between;gap:12px;margin:18px 2px 8px;font-size:12.5px;color:var(--sx-ink3)}
.ia-ex-h b{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}
.ia-ex-win{--h:58px;height:calc(var(--h) * 4);overflow:hidden;background:#fff;border:1px solid var(--sx-line);border-radius:16px}
.ia-ex-l{--k:3;transform:translateY(calc(var(--k) * var(--h) * -1));transition:transform .5s var(--sx-ease)}
.ia-ex-l li{height:var(--h);display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:12px;align-items:center;padding:0 16px;border-bottom:1px solid var(--sx-line);transition:opacity .4s var(--sx-ease),background .6s}
.ia-ex-l li.new{background:rgba(0,122,255,.05)}
.sx.is-armed .ia-ex-l li:is([data-l="0"],[data-l="1"],[data-l="2"]):not(.in){opacity:0}
.ia-ex-l time{font-size:12.5px;color:var(--sx-ink3);font-variant-numeric:tabular-nums}

/* 5 · árvore do atendimento automatizado */
.ia-tree{position:relative;height:380px}
.ia-tree-l{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.ia-tree-l line{stroke:var(--sx-line2);stroke-width:1.5;vector-effect:non-scaling-stroke;transition:stroke .3s}
.ia-tree-l line.on{stroke:var(--sx-blue);stroke-width:2}
.ia-tn{position:absolute;left:var(--x);top:var(--y);z-index:1;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;text-align:center;padding:8px 14px;border-radius:14px;background:#fff;border:1px solid var(--sx-line);white-space:nowrap;transition:opacity .35s,border-color .3s,box-shadow .3s,background .3s}
.ia-tn b{font-family:var(--f-brand);font-size:13.5px;font-weight:500}
.ia-tn span{font-size:12px;color:var(--sx-ink3)}
.sx.is-armed .ia-tn:not(.on):not(.done):not(.ok){opacity:.55}
.ia-tn.on{border-color:var(--sx-blue);box-shadow:0 0 0 3px rgba(0,122,255,.14)}
.ia-tn.done{border-color:rgba(0,122,255,.35)}
.ia-tn.ok{border-color:rgba(52,199,89,.55);box-shadow:0 0 0 3px rgba(52,199,89,.14)}

/* 6 · pilha de versões do conhecimento */
.ia-vs-h{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.ia-vs-al{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:18px;font-size:13px;color:var(--sx-ink2)}
.ia-vs-st{display:grid;padding-top:40px}
.ia-vc{grid-area:1 / 1;display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:16px 18px;background:#fff;border:1px solid var(--sx-line);border-radius:16px;box-shadow:0 18px 36px -28px rgba(10,20,60,.4);transform-origin:top center;transition:transform .6s var(--sx-ease),opacity .5s var(--sx-ease)}
.ia-vc .sx-badge{margin-top:8px}
.ia-vc-v{font-size:12px;font-weight:500;color:var(--sx-ink3)}
.ia-vc b{font-family:var(--f-brand);font-size:17px;font-weight:500;letter-spacing:-.01em}
.ia-vc-r{font-size:12.5px;color:var(--sx-ink3)}
.ia-vc.v1{z-index:0;opacity:.7;transform:translateY(-20px) scale(.95)}
.ia-vc.v2{z-index:1}
.ia-vc.v3{z-index:2}
.sx.is-armed .ia-vs:not(.is-new) .ia-vc.v3{opacity:0;transform:translateY(16px)}
.ia-vs.is-new .ia-vc.v2{transform:translateY(-20px) scale(.95)}
.ia-vs.is-new .ia-vc.v1{opacity:.5;transform:translateY(-40px) scale(.9)}
.ia-vs-ft{display:flex;align-items:center;gap:10px;margin-top:16px;font-size:13px;color:var(--sx-ink2)}
.ia-vs-ft .sx-ic{width:26px;height:26px}

/* 7 · uso da Kyra e o que ela acessa (seção escura, cena clara) */
.ia-us{background:#fff;border-radius:18px;padding:22px;color:var(--ink)}
.ia-us-k{font-size:13px;font-weight:500;color:var(--sx-ink2)}
.ia-us .mv-big span{font-size:14px;color:var(--sx-ink3)}
.ia-us-bar{height:8px;margin:10px 0 8px;border-radius:999px;background:var(--sx-wash);overflow:hidden}
.ia-us-bar i{display:block;height:100%;background:var(--sx-blue);transform-origin:left;transform:scaleX(var(--u,1));transition:transform .9s var(--sx-ease)}
.ia-us-s{font-size:12.5px;color:var(--sx-ink3)}
.ia-us-k2{margin:20px 0 10px;padding-top:16px;border-top:1px solid var(--sx-line)}
.ia-us-l{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 16px}
.ia-us-l li{display:flex;align-items:center;gap:8px;font-size:13.5px}
.ia-us-l em{flex:none;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:var(--sx-ok-b);color:var(--sx-ok-t)}
.ia-us-l em svg{width:12px;height:12px}
.ia-us-l li.n{grid-column:1 / -1;color:var(--sx-ink3)}
.ia-us-l li.n em{background:var(--sx-wash);color:var(--sx-ink3)}
.ia-us-l li.n em svg{fill:none;stroke:currentColor;stroke-width:1.8}

@media (max-width:720px){
  .ia-tr li{grid-template-columns:minmax(0,1fr);gap:6px}
  .ia-tr-q{font-size:14px}
  .ia-qm-who li{padding:8px 10px}
  .ia-qm-who .sx-av{display:none}
  .ia-qm-res li{grid-template-columns:minmax(0,1fr)}
  .ia-qm-res li .sx-badge{justify-self:start}
  .ia-qm-res .mv-tt span{white-space:normal}
  .ia-fn-t{font-size:17px}
  .ia-fn-s .mv-tt span{white-space:normal}
  .ia-ac-pv li{grid-template-columns:auto minmax(0,1fr)}
  .ia-ac-pv li small{grid-column:2}
  .ia-ac-ft{flex-wrap:wrap}
  .ia-ac-w{flex:1 1 100%}
  .ia-ex-l li{grid-template-columns:40px minmax(0,1fr);padding:0 12px}
  .sx .ia-ex-l li .sx-badge.dot{display:none}
  .ia-tree{height:auto;display:flex;flex-direction:column;gap:8px}
  .ia-tree-l,.ia-tn[data-n="m2"],.ia-tn[data-n="m3"]{display:none}
  .ia-tn{position:static;transform:none;align-items:flex-start;text-align:left;white-space:normal}
  .ia-vc b{font-size:16px}
  .ia-us{padding:18px}
  .ia-us-l{grid-template-columns:minmax(0,1fr)}
}
/* celular: selo longo pode quebrar linha */
@media (max-width:720px){.sx .sx-badge.ia-tr-a{max-width:100%;min-width:0;height:auto;min-height:22px;padding-block:4px;white-space:normal;line-height:1.35}}
@media (max-width:720px){.ia-vs-al{display:grid;grid-template-columns:max-content minmax(0,1fr);justify-items:start}}
/* celular: versões antigas empilhadas atrás não deixam texto aparecer por cima da versão atual */
@media (max-width:720px){.ia-vs.is-new .ia-vc.v1 > *{visibility:hidden}}