/* SLJ-28.27.0 — seção "Veja funcionando" (rádio, disparo em massa, marketing automático) */
.sec.dm{background:linear-gradient(180deg,#0b1740 0%,#16296a 100%);color:#fff}
.dm .cab h2{color:#fff}
.dm .cab p{color:#c9d4f2}
.dm .olho{color:var(--am)}
.dm-tabs{display:flex;justify-content:center;gap:10px;margin:-14px 0 26px;flex-wrap:wrap}
.dm-tabs button{padding:11px 18px;border-radius:999px;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);color:#fff;font:700 14.5px Inter,sans-serif;cursor:pointer;transition:background .2s,color .2s}
.dm-tabs button[aria-selected="true"]{background:var(--am);border-color:var(--am);color:var(--nv)}
.dm-palco{position:relative}
.dm-cena{display:none}
.dm-cena.is-on{display:block;animation:dmIn .4s ease}
.dm .jan{color:var(--tx)}
.dm-ctrl{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:22px}
.dm-ctrl button{padding:10px 16px;border-radius:12px;border:1px solid rgba(255,255,255,.3);background:transparent;color:#fff;font:700 14px Inter,sans-serif;cursor:pointer}
.dm-ctrl .dm-som[aria-pressed="true"]{background:#fff;color:var(--nv)}
.dm-ctrl small{width:100%;text-align:center;color:#8fa5d8;font-size:12.5px}
.dm-ctrl .dm-som[hidden]{display:none}

/* passos: começam escondidos (só com JS) */
.js .dm .dm-p{transition:opacity .45s ease,transform .45s ease}
.js .dm .dm-p:not(.vis){opacity:0;transform:translateY(10px)}

/* ---------- cena 1: rádio ---------- */
.dm-rua{border-radius:var(--r) var(--r) 0 0;overflow:hidden;line-height:0;box-shadow:0 30px 70px -36px rgba(0,0,0,.6)}
.dm-svg{width:100%;height:auto;display:block}
.dm-paineis{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.dm-ao{display:inline-flex;align-items:center;gap:6px;color:#d33!important;font-weight:700}
.dm-ao i{width:8px;height:8px;border-radius:50%;background:#e53935;animation:dmPisca 1.2s infinite}
.rd-lista{display:grid;gap:10px;padding:16px;background:#f7f9fd;min-height:260px;align-content:start}
.rd-msg{display:flex;gap:10px;align-items:flex-start;max-width:92%}
.rd-av{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#fff4cc;font-size:18px}
.rd-msg>div{padding:10px 12px;border-radius:14px;background:#fff;border:1px solid var(--bd);border-top-left-radius:4px}
.rd-msg b{display:block;font-size:12.5px;color:var(--tx3)}
.rd-msg em{display:block;margin-top:4px;font-style:normal;font-size:14px;line-height:1.4;color:var(--tx)}
.rd-msg small{align-self:flex-end;color:var(--tx3);font-size:11.5px}
.rd-loja{justify-self:end;flex-direction:row-reverse}
.rd-loja .rd-av{background:#e8f0ff}
.rd-loja>div{background:var(--az);border-color:var(--az);border-radius:14px;border-top-right-radius:4px}
.rd-loja b{color:#c9d8ff}.rd-loja em{color:#fff}
.onda{display:flex;align-items:center;gap:2px;height:18px;margin-top:4px}
.onda i{width:3px;height:30%;border-radius:2px;background:currentColor;opacity:.55}
.rd-moto .onda{color:var(--az)}.rd-loja .onda{color:#fff}
.onda i:nth-child(3n){height:70%}.onda i:nth-child(4n+1){height:50%}.onda i:nth-child(5n+2){height:90%}
.rd-msg.tocando .onda i{animation:dmOnda .5s ease-in-out infinite alternate}
.rd-msg.tocando .onda i:nth-child(2n){animation-delay:.15s}.rd-msg.tocando .onda i:nth-child(3n){animation-delay:.3s}
.dm-dica{justify-self:center;padding:6px 12px;border-radius:999px;background:#fff4cc;color:#7a5a00;font-size:12.5px;font-weight:700}
.dm-atend .chat{min-height:260px;align-content:start}
.dm-atend .bal small{display:block;margin-top:4px;font-size:11px;opacity:.75}
.dm-status{justify-self:center;padding:8px 14px;border-radius:999px;background:#e7f8ee;color:#137a3a;font-weight:800;font-size:13.5px}
.dm-digitando{display:inline-flex;gap:4px;padding:12px 14px;border-radius:16px;background:#fff;border:1px solid var(--bd);width:max-content}
.dm-digitando i{width:7px;height:7px;border-radius:50%;background:#9aa6c2;animation:dmPula .9s infinite}
.dm-digitando i:nth-child(2){animation-delay:.15s}.dm-digitando i:nth-child(3){animation-delay:.3s}

/* moto e entrega no SVG */
.dm-moto{transform:translateX(-460px)}
.dm-cena.f-chega .dm-moto{transform:none;transition:transform 2s cubic-bezier(.2,.7,.3,1)}
.dm-cena:not(.f-chega) .dm-moto{transition:none}
.dm-moto .luz{opacity:0}
.dm-moto .roda{transform-box:fill-box;transform-origin:center}
.dm-cena.f-chega .dm-moto .roda{animation:dmGira .5s linear 4}
.dm-ondas{opacity:0;transition:opacity .2s}
.dm-cena.falando .dm-ondas{opacity:1;animation:dmPisca 1s infinite}
.dm-cli{opacity:0;transition:opacity .6s}
.dm-cena.f-entrega .dm-cli{opacity:1}
.dm-caixa{opacity:0;transform:translate(322px,128px) scale(.6)}
.dm-cena.f-entrega .dm-caixa{animation:dmCaixa 2.4s ease forwards .5s}
.dm-ok{opacity:0;transition:opacity .5s 2.4s}
.dm-cena.f-entrega .dm-ok{opacity:1}

/* ---------- cena 2: disparo em massa ---------- */
.dm-dupla{display:grid;grid-template-columns:1.2fr .8fr;gap:26px;align-items:center}
.dm-form{padding:18px 20px;display:grid;gap:8px}
.dm-form label{font-size:12.5px;font-weight:800;color:var(--tx3);letter-spacing:.04em;text-transform:uppercase;margin-top:4px}
.dm-sel{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-radius:12px;border:1.5px solid var(--bd);font-weight:600;font-size:14.5px}
.dm-sel b{padding:3px 10px;border-radius:999px;background:#e8f0ff;color:var(--az);font-size:13px}
.dm-canais{display:flex;gap:8px;flex-wrap:wrap}
.dm-canais span{padding:8px 12px;border-radius:999px;border:1.5px solid var(--bd);font-weight:700;font-size:13.5px}
.js .dm .dm-canais .dm-p:not(.vis){opacity:.35;transform:none}
.dm-canais .vis{border-color:var(--az);background:#e8f0ff;color:var(--az)}
.dm-txt{padding:12px 14px;border-radius:12px;background:#f7f9fd;border:1px solid var(--bd);font-size:14.5px;line-height:1.45}
.dm-disparar{margin-top:8px;width:100%;pointer-events:none}
.js .dm .dm-disparar:not(.vis){opacity:1;transform:none}
.dm-disparar.vis{animation:dmClique .5s ease}
.dm-barra{position:relative;height:30px;border-radius:10px;background:#eef2fb;overflow:hidden}
.dm-barra i{position:absolute;inset:0 auto 0 0;width:0;background:linear-gradient(90deg,#2056d8,#3d7bff);transition:width 2.4s ease}
.dm-barra.vis i{width:100%}
.dm-barra span{position:relative;display:block;line-height:30px;text-align:center;font-size:12.5px;font-weight:700;color:var(--nv)}
.dm-barra.vis span{color:#fff}
.dm-cel{justify-self:center;width:min(290px,100%);padding:12px;border-radius:40px;background:#0b1533;box-shadow:0 40px 80px -30px rgba(0,0,0,.7)}
.dm-tela{min-height:430px;border-radius:30px;padding:18px 12px;background:linear-gradient(160deg,#3d7bff,#16296a);display:grid;gap:10px;align-content:start}
.dm-hora{text-align:center;color:#fff;font:800 44px/1 Sora,sans-serif;margin:8px 0 14px}
.dm-not{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:16px;background:rgba(255,255,255,.92);color:var(--tx)}
.dm-not span{font-size:18px}
.dm-not b{display:block;font-size:12.5px}
.dm-not small{font-size:12.5px;color:var(--tx2);line-height:1.35}
.dm-ped{background:#ffc928}
.dm-ped small{color:var(--nv)}

/* ---------- cena 3: automático ---------- */
.dm-autos ul{list-style:none;margin:0;padding:8px 0}
.dm-autos li{display:flex;align-items:center;gap:12px;padding:12px 20px}
.dm-autos li>span{font-size:22px}
.dm-autos li div{flex:1}
.dm-autos b{display:block;font-size:15px}
.dm-autos small{color:var(--tx3);font-size:13px}
.dm-chave{width:42px;height:24px;border-radius:999px;background:#16a34a;position:relative;flex:none}
.dm-chave:after{content:"";position:absolute;top:3px;right:3px;width:18px;height:18px;border-radius:50%;background:#fff}
.dm-foco{background:#fff8dc}
.dm-fluxo{display:grid;gap:14px;position:relative}
.dm-passo{display:flex;gap:14px;align-items:flex-start;padding:16px 18px;border-radius:18px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18)}
.js .dm .dm-passo.dm-p:not(.vis){opacity:.25;transform:none}
.dm-passo.vis{background:#fff;color:var(--tx);border-color:#fff}
.dm-passo>span{flex:none;display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:#fff4cc;font-size:20px}
.dm-passo b{display:block;font-size:15.5px}
.dm-passo small{color:inherit;opacity:.75;font-size:13.5px;line-height:1.4}
.dm-ok2.vis{background:#e7f8ee;border-color:#e7f8ee}

@keyframes dmIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes dmPisca{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes dmOnda{from{transform:scaleY(.4)}to{transform:scaleY(1.6)}}
@keyframes dmPula{0%,60%,100%{transform:none}30%{transform:translateY(-5px)}}
@keyframes dmGira{to{transform:rotate(360deg)}}
@keyframes dmCaixa{0%{opacity:0;transform:translate(322px,128px) scale(.6)}25%{opacity:1;transform:translate(330px,108px) scale(1)}75%,100%{opacity:1;transform:translate(422px,140px) scale(1)}}
@keyframes dmClique{0%{transform:scale(1)}40%{transform:scale(.95)}100%{transform:scale(1)}}

@media (max-width:860px){
  .dm-paineis,.dm-dupla{grid-template-columns:1fr}
  .dm-svg{width:180%;margin-left:-78%}
  .dm-tabs{justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;margin-left:-16px;margin-right:-16px;padding:0 16px 4px}
  .dm-tabs button{flex:none}
  .rd-lista,.dm-atend .chat{min-height:0}
  .dm-tela{min-height:0}
  .dm-hora{font-size:34px}
}
/* SLJ-28.33.0 — cenas Rota inteligente e Gestor inteligente */
.dm-rt ul.rt-peds{list-style:none;margin:0;padding:12px 16px;display:grid;gap:8px}
.rt-peds li{display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:12px;background:#f4f7fd;font-size:14px}
.rt-peds b{color:#2056d8}
.rt-bt,.gi-bt{display:block;margin:4px 16px 12px;padding:12px;border-radius:12px;background:#2056d8;color:#fff;font-weight:800;text-align:center}
.js .dm .rt-bt:not(.vis),.js .dm .gi-bt:not(.vis){opacity:1;transform:none}
.rt-bt.vis,.gi-bt.vis{animation:dmClique .5s ease}
.rt-rotas{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0 16px}
.rt-rota{padding:12px;border-radius:14px;border:2px solid #2056d8;background:#fff}
.rt-rota:nth-child(2){border-color:#ffc928}
.rt-rota b{display:block;font-size:14.5px}.rt-rota small{color:#46526b;font-size:12.5px}
.rt-rota ol{margin:8px 0 0;padding-left:18px;font-size:13.5px}
.rt-ok{margin:12px 16px 16px;padding:10px 12px;border-radius:12px;background:#e7f8ee;color:#137a3a;font-weight:800;font-size:14px}
.rt-mapa{position:relative}
.rt-mapa svg{width:100%;height:auto;display:block;filter:drop-shadow(0 30px 50px rgba(0,0,0,.35))}
.rt-mapa path.dm-p{stroke-dasharray:420;stroke-dashoffset:0;transition:stroke-dashoffset 1.6s ease}
.js .dm .rt-mapa path.dm-p:not(.vis){opacity:1;transform:none;stroke-dashoffset:420}
.rt-app{position:absolute;right:-6px;bottom:-14px;max-width:250px;box-shadow:0 18px 40px -14px rgba(0,0,0,.5)}
.gi-lista{display:grid;gap:10px;padding:14px 16px 16px}
.gi-ins,.gi-res{display:flex;gap:10px;align-items:flex-start;padding:12px;border-radius:14px;background:#f4f7fd}
.gi-ins span,.gi-res span{font-size:20px}
.gi-ins b,.gi-res b{display:block;font-size:14.5px}.gi-ins small,.gi-res small{color:#46526b;font-size:13px}
.gi-rec{padding:14px;border-radius:16px;background:#fff8dc;border:1px solid #ffe08a}
.gi-rec p{margin:6px 0;font-size:14.5px;line-height:1.45}.gi-rec small{color:#7a5a00;font-size:12.5px}
.gi-rec .gi-bt{margin:10px 0 0;background:#16a34a}
.gi-res{background:#e7f8ee}
.gi-auto ul{list-style:none;margin:0;padding:8px 0}
.gi-auto li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:13px 18px;font-size:14.5px;font-weight:600;border-top:1px solid #eef1f7}
.gi-auto li:first-child{border-top:0}
.gi-auto em{font-style:normal;font-weight:800;color:#2056d8;background:#e8f0ff;border-radius:999px;padding:4px 10px}
@media(max-width:860px){.rt-rotas{grid-template-columns:1fr}.rt-app{position:static;margin-top:10px;max-width:none}}
@media (prefers-reduced-motion:reduce){.dm *{animation:none!important;transition:none!important}}
