/* Secretária Virtual — rodada 6 (03/10/2026) · squad sites · sessão agendas-sites-r6.
   Pedido dele: o site vende o SVSuite — todos os canais num lugar só, IA + gente de verdade e, se quiser, o time interno;
   e a página da franquia no mesmo visual. Acréscimos por cima do v6.css + sv.css (nada deles é alterado aqui):
   o herói com três chips, o "fluxo" (canais → SVSuite → quem atende), os três jeitos de usar e as peças da página da franquia. */

/* ---------- menu: sete itens sem quebrar linha ---------- */
.menu a{white-space:nowrap}
.topo .marca{flex:none}
@media (min-width:1081px) and (max-width:1320px){.menu{gap:18px}.menu a{font-size:15px}.topo-acoes .ln{display:none}}

/* ---------- herói: três chips (IA · secretárias · o seu time) ---------- */
.heroi .dois b svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.heroi .dois li:nth-child(3) b{background:linear-gradient(135deg,#B9A6FF,var(--roxo));color:#fff;box-shadow:0 8px 18px rgba(124,92,255,.35)}
@media (min-width:1081px){.heroi .dois.tres li{flex:1 1 0;padding-right:12px}.heroi .dois.tres small{font-size:12.5px}}

/* ---------- o fluxo: canais → SVSuite → quem atende ---------- */
.hub{background:
  radial-gradient(760px 440px at 50% 38%,rgba(76,176,234,.20),transparent 68%),
  radial-gradient(520px 400px at 4% 96%,rgba(124,92,255,.18),transparent 65%),
  radial-gradient(520px 380px at 98% 4%,rgba(255,138,91,.10),transparent 65%),
  linear-gradient(170deg,#061436,#040E2B);color:#fff;overflow:hidden}
.hub .olho{color:var(--ciano)}
.hub .cab h2{color:#fff}
.hub .cab p{color:rgba(255,255,255,.80)}
.hub :focus-visible{outline-color:var(--ciano)}
.fluxo{display:grid;grid-template-columns:minmax(170px,220px) minmax(40px,1fr) 210px minmax(40px,1fr) minmax(300px,390px);align-items:stretch;min-height:420px}
.fluxo ul{list-style:none;margin:0;padding:0}
.fluxo .canais{display:grid;grid-template-rows:repeat(5,1fr);align-items:center}
.fluxo .canais li{display:flex;align-items:center;gap:12px;padding:11px 16px 11px 11px;border-radius:16px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);font-weight:600;font-size:16px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.fluxo .ic{width:38px;height:38px;flex:none;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,var(--ciano),#0B6DAE)}
.fluxo .ic svg{width:19px;height:19px;stroke:#04122F;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.fluxo .canais li:nth-child(2) .ic{background:linear-gradient(135deg,#6BE3A6,#1DAA61)}
.fluxo .canais li:nth-child(3) .ic{background:linear-gradient(135deg,#FFB46B,#E8508F)}
.fluxo .canais li:nth-child(4) .ic{background:linear-gradient(135deg,#B9A6FF,#7C5CFF)}
.fluxo .canais li:nth-child(5) .ic{background:linear-gradient(135deg,#9BD6F6,#4D9FFF)}
.fios{position:relative;min-width:0}
.fios svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.fios path{fill:none;stroke:rgba(155,214,246,.26);stroke-width:1.6;vector-effect:non-scaling-stroke}
.fios path.luz{stroke:#9BD6F6;stroke-width:2.2;stroke-linecap:round;stroke-dasharray:14 190;animation:fio 3.4s linear infinite;filter:drop-shadow(0 0 5px rgba(155,214,246,.9))}
.fios path.luz:nth-of-type(2n){animation-delay:-1.1s}
.fios path.luz:nth-of-type(3n){animation-delay:-2.2s}
.fios.saida path.luz{stroke:#FFC79E;filter:drop-shadow(0 0 5px rgba(255,180,107,.9))}
@keyframes fio{from{stroke-dashoffset:204}to{stroke-dashoffset:0}}
.nucleo{position:relative;align-self:center;display:flex;flex-direction:column;align-items:center;text-align:center;padding:18px 14px 20px;border-radius:26px;background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.04));border:1px solid rgba(155,214,246,.34);box-shadow:0 30px 80px rgba(0,0,0,.45),0 0 0 8px rgba(76,176,234,.06),0 0 70px rgba(76,176,234,.25)}
.nucleo img{width:132px;height:auto;margin:-48px 0 2px;filter:drop-shadow(0 22px 30px rgba(0,0,0,.5))}
.nucleo b{font-family:'Plus Jakarta Sans','Jakarta reserva',Inter,sans-serif;font-size:24px;letter-spacing:-.02em;line-height:1.1}
.nucleo small{margin-top:6px;font-size:13.5px;line-height:1.4;color:rgba(255,255,255,.76)}
.fluxo .quem{display:grid;grid-template-rows:repeat(3,1fr);gap:14px}
.fluxo .quem li{display:grid;grid-template-columns:54px 1fr;gap:14px;align-items:center;padding:16px 18px 16px 14px;border-radius:20px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.fluxo .quem li.forte{background:linear-gradient(135deg,rgba(255,138,91,.20),rgba(255,255,255,.06));border-color:rgba(255,180,107,.5)}
.fluxo .quem .v3d{width:54px;height:54px;filter:drop-shadow(0 10px 16px rgba(0,0,0,.45))}
.fluxo .quem .rosto{width:50px;height:50px;border-radius:50%;border:2px solid rgba(255,255,255,.75);justify-self:center}
.fluxo .quem .ic{width:50px;height:50px;border-radius:15px;justify-self:center;background:linear-gradient(135deg,#B9A6FF,#7C5CFF)}
.fluxo .quem .ic svg{width:24px;height:24px;stroke:#fff}
.fluxo .quem h3{font-size:18px;letter-spacing:-.01em;line-height:1.2}
.fluxo .quem p{font-size:14.5px;line-height:1.45;color:rgba(255,255,255,.78);margin-top:3px}
.fluxo .quem small{display:inline-block;margin-top:7px;font-size:12.5px;font-weight:600;color:#FFC79E}
.obs-hub{margin-top:26px;text-align:center;font-size:14px;color:rgba(255,255,255,.62)}

/* ---------- três jeitos de usar ---------- */
.jeitos{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:56px}
.jeito{padding:24px 24px 22px;border-radius:20px;background:#fff;color:var(--tinta);box-shadow:0 24px 60px rgba(0,0,0,.30)}
.hub .jeito .olho{font-size:12px;color:var(--ciano-esc)}
.jeito h3{font-size:20px;letter-spacing:-.015em;line-height:1.2;margin:8px 0 8px}
.jeito p{font-size:15.5px;color:var(--cinza);line-height:1.5}

/* ---------- franquia: os dois caminhos, o perfil, o retorno ---------- */
.elo.ou span{font-weight:800;color:var(--azul2);font-size:17px}
.passo2 .preco-linha{position:relative;margin:2px 0 0;font-size:15px;color:var(--cinza)}
.passo2 .preco-linha b{font-family:'Plus Jakarta Sans','Jakarta reserva',Inter,sans-serif;font-size:30px;letter-spacing:-.03em;color:var(--tinta);margin-right:6px}
.passo2.gente2 .preco-linha{color:rgba(255,255,255,.78)}
.passo2.gente2 .preco-linha b{color:#fff}
.passo2 .btn-borda{border-color:#B9C8E8}
.aviso-negocio{max-width:900px;margin:26px auto 0;padding:14px 18px;border-radius:14px;background:#FFF6EF;border:1px solid #F3D9C8;text-align:center;font-size:16px;color:var(--tinta)}
.tempo{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:22px}
.tempo div{padding:26px 24px;border-radius:var(--raio);background:#fff;border:1px solid var(--linha)}
.tempo b{display:block;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--ciano-esc)}
.tempo strong{display:block;font-family:'Plus Jakarta Sans','Jakarta reserva',Inter,sans-serif;font-size:26px;letter-spacing:-.025em;line-height:1.15;margin:8px 0 6px;color:var(--tinta)}
.tempo p{font-size:15.5px;color:var(--cinza)}
.invest{display:grid;grid-template-columns:.9fr 1.1fr;gap:20px;align-items:stretch}
.invest .plano{margin:0}
.invest .extras{margin:0}
.nota-franquia{margin-top:18px;font-size:14.5px;color:var(--cinza2)}

/* ---------- telas menores ---------- */
@media (max-width:1080px){
  .fluxo{grid-template-columns:1fr;min-height:0;max-width:560px;margin:0 auto}
  .fluxo .canais{grid-template-rows:none;grid-template-columns:1fr 1fr;gap:10px}
  .fluxo .canais li:first-child{grid-column:1/-1}
  .fios{height:64px}
  .fios svg{display:none}
  .fios:before{content:"";position:absolute;left:50%;top:6px;bottom:6px;width:2px;margin-left:-1px;background:rgba(155,214,246,.28)}
  .fios:after{content:"";position:absolute;left:50%;top:6px;bottom:6px;width:4px;margin-left:-2px;border-radius:4px;background:linear-gradient(180deg,transparent,#9BD6F6,transparent);background-size:100% 45%;background-repeat:no-repeat;animation:desce 2.6s ease-in-out infinite}
  .fios.saida:after{background-image:linear-gradient(180deg,transparent,#FFC79E,transparent)}
  .nucleo{justify-self:center;width:230px;margin-top:34px}
  .fluxo .quem{grid-template-rows:none}
  .jeitos{grid-template-columns:1fr;margin-top:40px}
  .tempo{grid-template-columns:1fr}
  .invest{grid-template-columns:1fr}
}
@media (max-width:720px){
  .fluxo .canais li{font-size:15px;padding:9px 12px 9px 9px;gap:10px}
  .fluxo .ic{width:34px;height:34px;border-radius:10px}
  .fluxo .quem li{padding:14px 14px 14px 12px}
  .jeito{padding:20px 18px}
}
@media (prefers-reduced-motion:reduce){.fios path.luz,.fios:after{animation:none}.fios path.luz{display:none}}

/* ---------- cabeçalho BRANCO (pedido dele, 03/10/2026 01:4x: "o logo da secretária virtual ficou bem apagado") ----------
   O logo oficial tem azul e ciano: no fundo escuro some. O topo do site da SV passa a ser branco; o resto da página não muda. */
.topo,.topo.rolou{background:#fff;color:var(--tinta);border-bottom:1px solid var(--linha);-webkit-backdrop-filter:none;backdrop-filter:none}
.topo.rolou{box-shadow:0 10px 30px rgba(8,30,90,.10)}
.topo .menu{color:var(--cinza)}
.topo .menu a:hover{color:var(--azul)}
.topo .menu a:after{background:var(--azul2)}
.topo-acoes .ln,.topo-acoes .ln:hover{color:var(--azul)}
.topo-acoes .ln svg.i{stroke:var(--azul2)}
.topo .hamb{color:var(--azul)}
.topo :focus-visible{outline-color:var(--azul2)}
.marca-sv .logo-sv{height:52px}
@media (max-width:1080px){
  .topo .gaveta.aberta{background:#fff;border-top:1px solid var(--linha)}
  .topo .gaveta a{color:var(--tinta);border-bottom:1px solid var(--linha)}
  .topo .gaveta a.gaveta-cta{color:var(--cta)}
}
@media (max-width:720px){.marca-sv .logo-sv{height:42px}}
