/* IA no WhatsApp: conversa interativa com bastidores, dia de mensagens sem IA x com IA, passagem para o humano. */
.ia{background:var(--o-ink)}

.i-hero{position:relative;overflow:hidden;padding:clamp(44px,6vw,88px) 0 clamp(64px,8vw,104px)}
.i-hero-bg{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 50% 60% at 72% 45%,rgba(37,211,102,.10),transparent 70%),radial-gradient(ellipse 40% 50% at 90% 10%,rgba(204,41,41,.22),transparent 70%)}
.i-hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,5vw,72px);align-items:center}
.i-hero h1{font-size:clamp(42px,5.8vw,80px);line-height:.98;letter-spacing:-.05em;margin-bottom:24px}
.i-hero .o-lede{margin-top:0}

.i-demo{position:relative;display:grid;grid-template-columns:minmax(0,330px) minmax(0,1fr);gap:18px;align-items:start}
.i-phone{position:relative;border-radius:30px;padding:8px;background:#1b1b20;box-shadow:0 50px 90px -45px rgba(0,0,0,.95),0 0 0 1px rgba(255,255,255,.08)}
.i-wa-head{display:flex;align-items:center;gap:10px;padding:14px 14px 12px;border-radius:22px 22px 0 0;background:#1f2c33;color:#fff}
.i-av{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#25D366}
.i-av svg{width:18px;height:18px}
.i-av svg path{fill:#fff}
.i-wa-head b{display:block;font-size:14.5px}
.i-wa-head small{display:block;font-size:12px;color:#8fd9a8}
.i-wa-body{position:relative;height:360px;overflow-y:auto;padding:12px;scroll-behavior:smooth;scrollbar-width:none;
  background:#0b141a radial-gradient(rgba(255,255,255,.035) 1px,transparent 1.2px) 0 0/16px 16px}
.i-wa-body::-webkit-scrollbar{display:none}
.i-wa-banner{width:max-content;margin:0 auto 10px;padding:5px 10px;border-radius:8px;background:rgba(255,199,0,.12);color:#f5d27a;font-size:11.5px}
.i-wa-list{list-style:none;display:flex;flex-direction:column;gap:6px}
.i-wa-list .i-wa-day{align-self:center;margin:6px 0}
.i-msg{position:relative;max-width:84%;padding:8px 10px 18px;border-radius:10px;font-size:13.5px;line-height:1.4;color:#e9edef;animation:o-in .35s var(--o-ease)}
.i-msg time{position:absolute;right:8px;bottom:4px;font-size:10px;color:rgba(233,237,239,.6)}
.i-msg.in{align-self:flex-start;background:#202c33;border-top-left-radius:2px}
.i-msg.out,.i-msg.human,.i-msg.typing{align-self:flex-end;background:#005c4b;border-top-right-radius:2px}
.i-msg.human{background:#0a4d7a}
.i-who{display:block;margin-bottom:2px;font-size:11px;font-weight:700;color:#7cc3ff}
.i-msg.typing{display:flex;gap:4px;padding:12px 14px}
.i-msg.typing time{display:none}
.i-msg.typing i{width:6px;height:6px;border-radius:50%;background:#bfe8d4;animation:i-dot 1s infinite}
.i-msg.typing i:nth-child(2){animation-delay:.15s}.i-msg.typing i:nth-child(3){animation-delay:.3s}
@keyframes i-dot{0%,60%,100%{opacity:.3;transform:none}30%{opacity:1;transform:translateY(-2px)}}
.i-choices{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end;align-content:flex-end;height:104px;padding:8px 10px 10px;border-radius:0 0 22px 22px;background:#0b141a;border-top:1px solid rgba(255,255,255,.06)}
.i-choices button{min-height:40px;padding:0 14px;border-radius:999px;border:1px solid rgba(37,211,102,.6);background:rgba(11,20,26,.92);color:#bff2d2;font-size:13.5px;font-weight:600;cursor:pointer;
  animation:o-in .3s var(--o-ease);transition:background-color var(--o-t1)}
.i-choices button:hover,.i-choices button:focus-visible{background:#005c4b;color:#fff}
.i-backstage{padding:20px;border-radius:var(--o-r-l);background:rgba(255,255,255,.03);border:1px solid var(--o-line-d)}
.i-events{list-style:none;display:grid;gap:8px}
.i-events li{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:12px;border:1px solid var(--o-line-d);font-size:14px;color:var(--o-faint-l);transition:all .4s}
.i-events svg{width:16px;height:16px;flex-shrink:0;padding:2px;border-radius:50%;border:1px solid var(--o-line-d);color:transparent;box-sizing:content-box;transition:inherit}
.i-events li.on{color:#fff;border-color:rgba(74,222,128,.35);background:rgba(34,197,94,.07)}
.i-events li.on svg{color:var(--o-ok-hi);border-color:rgba(74,222,128,.5)}
.i-events li:last-child.on{border-color:rgba(124,195,255,.5);background:rgba(10,77,122,.25)}
.i-replay{display:inline-flex;align-items:center;gap:8px;margin-top:14px;padding:10px 14px;border-radius:10px;border:1px solid var(--o-line-d);background:none;color:#e4e4e7;font-weight:600;cursor:pointer}
.i-replay[hidden]{display:inline-flex;visibility:hidden}
.i-replay svg{width:15px;height:15px}
.i-note{position:absolute;right:0;bottom:-26px;font-size:12px;color:var(--o-faint-l)}

/* um dia de mensagens */
.i-day{padding:clamp(20px,3vw,32px);border-radius:var(--o-r-l);background:var(--o-white);border:1px solid var(--o-line-l)}
.i-day-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;margin-bottom:24px}
.i-day-sum b{font-family:var(--font-head);font-size:clamp(18px,1.8vw,22px)}
.i-day[data-mode="sem"] [data-won],.i-day[data-mode="com"] [data-lost]{display:none}
[data-lost]{color:var(--o-red-ink)}
[data-won]{color:var(--o-ok)}
.i-strip{position:relative;height:150px;border-radius:14px;background:var(--o-paper)}
.i-shift{position:absolute;top:0;bottom:24px;left:var(--a);width:calc(var(--b) - var(--a));border-radius:10px;background:rgba(20,20,22,.07);border:1px dashed rgba(20,20,22,.2)}
.i-shift small{position:absolute;left:10px;top:8px;font-size:12px;font-weight:600;color:var(--o-muted-d)}
.i-dots i{position:absolute;left:var(--h);top:var(--r);width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--o-ok);transition:background-color .5s,transform .5s}
.i-dots{position:absolute;inset:16px 0 34px}
.i-day[data-mode="sem"] .i-dots i.out{background:var(--o-red);transform:scale(1.15)}
.i-hours{position:absolute;left:0;right:0;bottom:6px;display:flex;justify-content:space-between;padding:0 4px;font-size:11.5px;color:var(--o-muted-d)}
.i-cmp{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;margin-top:16px}
.i-cmp-col{padding:22px;border-radius:var(--o-r);background:var(--o-white);border:1px solid var(--o-line-l)}
.i-cmp-col.new{background:var(--o-ink);color:#fff;border-color:var(--o-ink)}
.i-cmp-col.new .o-kicker{color:#ff8a8a}
.i-cmp-col ul{list-style:none;display:grid;gap:10px}
.i-cmp-col li{display:flex;gap:10px;font-size:15.5px;line-height:1.45}
.i-cmp-col svg{width:17px;height:17px;flex-shrink:0;margin-top:3px;color:var(--o-muted-d)}
.i-cmp-col.new svg{color:var(--o-ok-hi)}

/* da mensagem ao fechamento */
.i-hand-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(32px,5vw,72px);align-items:center}
.i-hand-grid .o-head{margin-bottom:28px}
.i-hand{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.i-hand li{display:flex;flex-direction:column;gap:6px;padding:16px;border-radius:14px;background:#141418;border:1px solid var(--o-line-d)}
.i-hand li span{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:rgba(204,41,41,.16);color:#ff8a8a}
.i-hand li span svg{width:19px;height:19px}
.i-hand b{font-family:var(--font-head);font-size:15.5px}
.i-hand small{font-size:13.5px;line-height:1.45;color:var(--o-muted-l)}
.i-hand li:last-child{border-color:rgba(124,195,255,.4)}
.i-logos{list-style:none;display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:22px}
.i-logos li{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:#d4d4d8}
.i-logos svg{width:18px;height:18px}
.i-logos svg:not([stroke]) path{fill:#d4d4d8}
.i-hand-photo .o-img{aspect-ratio:4/5}

.ia .o-diag{display:none}
/* oferta no meio da página */
.i-offer{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.i-offer li{display:flex;flex-direction:column;gap:6px;padding:20px;border-radius:var(--o-r);background:var(--o-paper);border:1px solid var(--o-line-l)}
.i-offer svg{width:40px;height:40px;padding:10px;margin-bottom:6px;border-radius:12px;background:rgba(204,41,41,.1);color:var(--o-red-ink)}
.i-offer b{display:block;font-family:var(--font-head);font-size:16.5px}
.i-offer span{display:block;font-size:14.5px;line-height:1.5;color:var(--o-muted-d)}
.i-offer-cta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px;margin:28px 0 22px}
.i-offer-cta .o-micro-cta{margin:0}

/* implantação */
.i-impl{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;counter-reset:impl}
.i-impl li{display:flex;flex-direction:column;gap:6px;padding:20px;border-radius:var(--o-r);background:var(--o-white);border:1px solid var(--o-line-l)}
.i-impl i{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-family:var(--font-head);font-weight:700;font-size:15px;background:var(--o-ink);color:#fff}
.i-impl b{font-family:var(--font-head);font-size:16.5px}
.i-impl small{font-size:14.5px;line-height:1.5;color:var(--o-muted-d)}

@media (max-width:1100px){.i-demo{grid-template-columns:minmax(0,300px) minmax(0,1fr)}}
@media (max-width:960px){.i-hero-grid,.i-hand-grid{grid-template-columns:1fr}.i-offer,.i-impl{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.i-demo{max-width:640px}}
@media (max-width:760px){
  .i-demo{grid-template-columns:1fr}
  .i-wa-body{height:340px}
  .i-hand{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .i-hand-photo .o-img{aspect-ratio:16/9;object-fit:cover}
  .i-events li:not(.last){display:none}
  .i-events li{min-height:44px}
  .i-backstage{padding:14px 16px}
  .i-backstage .o-kicker::after{content:attr(data-n)}
  .i-replay{margin-top:10px}
  .i-cmp{display:none}
  .i-logos{display:none}
  .i-hand-photo figcaption{display:none}
  .i-impl li{display:grid;grid-template-columns:32px 1fr;column-gap:12px;row-gap:2px}
  .i-impl i{grid-row:1 / 3}
  .i-offer-sec .o-head .o-lede{display:none}
  .o-case-ctx > p:not(.o-case-seg){display:none}
  .i-offer,.i-impl{grid-template-columns:1fr;gap:8px}
  .i-offer li{display:grid;grid-template-columns:40px 1fr;gap:12px;padding:12px 14px}
  .i-offer svg{margin:0;width:40px;height:40px}
  .i-impl li{padding:12px 14px}
  .i-offer span,.i-impl small{font-size:13.5px;line-height:1.4}
  .i-hand small{display:none}
  .o-case-did{display:none}
  .i-cmp{grid-template-columns:1fr}
  .i-strip{height:170px}
}
@media (prefers-reduced-motion:reduce){.i-msg,.i-choices button{animation:none}.i-msg.typing i{animation:none}.i-dots i{transition:none}}