/* Nexo — landing page comercial (Vorek).
   Tokens da marca: marinho/azul do logo Vorek e Nexo; as telas de produto usam o tema escuro real do sistema. */

:root {
  --giz: #f3f6fb;
  --papel: #ffffff;
  --marinho: #11264a;
  --marinho-fundo: #0b1a33;
  --azul: #2f7bff;
  --azul-acao: #2260d8;
  --azul-acao-hover: #1a4fb8;
  --ciano: #00c6ff;
  --linha: #d9e1ee;
  --texto: #11264a;
  --texto-2: #475874;
  --texto-claro: #c3cfe3;

  --fonte-titulo: "Manrope", "DM Sans", system-ui, sans-serif;
  --fonte-corpo: "DM Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --largura: 1200px;
  --gutter: clamp(1rem, 4vw, 2.5rem);
  --secao: clamp(4rem, 8vw, 7.5rem);
  --raio-janela: 14px;
  --raio-botao: 10px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 5.5rem; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--giz);
  color: var(--texto);
  font-family: var(--fonte-corpo);
  font-size: 1.0625rem;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
img, svg { display: block; max-width: 100%; }
a { color: inherit; }
h1, h2, h3, h4 { font-family: var(--fonte-titulo); margin: 0; line-height: 1.08; letter-spacing: -0.02em; text-wrap: balance; }
p { margin: 0; text-wrap: pretty; }
ul { margin: 0; padding: 0; list-style: none; }
button, input, textarea { font: inherit; color: inherit; }

:focus-visible { outline: 3px solid var(--azul); outline-offset: 3px; border-radius: 4px; }

.ic {
  display: inline-block; flex: none;
  width: 1.15em; height: 1.15em;
  background: currentColor;
  -webkit-mask: var(--i) center / contain no-repeat;
          mask: var(--i) center / contain no-repeat;
}

.contido { width: min(100% - 2 * var(--gutter), var(--largura)); margin-inline: auto; }
.so-leitor { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.pular { position: absolute; left: 1rem; top: -4rem; z-index: 100; background: var(--marinho); color: #fff; padding: .6rem 1rem; border-radius: 8px; }
.pular:focus { top: 1rem; }

/* ---------- Botões ---------- */
.botao {
  display: inline-flex; align-items: center; justify-content: center; gap: .55rem;
  padding: .85rem 1.35rem; border-radius: var(--raio-botao);
  font-weight: 600; font-size: 1rem; text-decoration: none; cursor: pointer;
  border: 1.5px solid transparent; transition: background-color .15s, border-color .15s, color .15s;
  min-height: 3rem;
}
.botao--primario { background: var(--azul-acao); color: #fff; }
.botao--primario:hover { background: var(--azul-acao-hover); }
.botao--contorno { border-color: var(--marinho); color: var(--marinho); background: transparent; }
.botao--contorno:hover { background: var(--marinho); color: #fff; }
.botao--claro { background: #fff; color: var(--marinho); }
.botao--claro:hover { background: var(--giz); }

/* ---------- Cabeçalho ---------- */
.topo { position: sticky; top: 0; z-index: 50; background: color-mix(in srgb, var(--giz) 88%, transparent); backdrop-filter: blur(10px); border-bottom: 1px solid var(--linha); }
.topo__linha { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-height: 4.5rem; }
.topo__marca img { height: 2rem; width: auto; display: block; }
.menu { display: flex; align-items: center; gap: 2rem; }
.menu a { text-decoration: none; font-weight: 500; font-size: .98rem; color: var(--texto-2); padding: .4rem 0; border-bottom: 2px solid transparent; }
.menu a:hover { color: var(--marinho); border-bottom-color: var(--azul); }
.menu .botao { color: #fff; border-bottom: 1.5px solid transparent; padding: .6rem 1.1rem; min-height: 2.6rem; }
.menu .botao:hover { color: #fff; border-bottom-color: transparent; }
.menu__entrar[hidden] { display: none; }
.topo__botao { display: none; background: none; border: 1.5px solid var(--linha); border-radius: 10px; width: 2.9rem; height: 2.9rem; align-items: center; justify-content: center; cursor: pointer; font-size: 1.4rem; }
/* Seletor de idioma (EN | PT): sempre à vista, ao lado do menu no desktop e do botão do menu no celular. */
.topo__linha .menu { margin-left: auto; }
.idioma { display: inline-flex; flex: none; padding: 2px; border: 1.5px solid var(--linha); border-radius: 999px; background: var(--papel); }
.idioma__op { appearance: none; border: 0; background: transparent; cursor: pointer; padding: .3rem .75rem; min-height: 2rem; border-radius: 999px; font-size: .875rem; font-weight: 700; letter-spacing: .04em; color: var(--texto-2); }
.idioma__op:hover { color: var(--marinho); }
.idioma__op[aria-pressed="true"] { background: var(--marinho); color: #fff; }

/* ---------- Hero ---------- */
.hero { padding-block: clamp(2.5rem, 6vw, 5rem) var(--secao); }
.hero__grade { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 4vw, 4rem); align-items: center; }
.hero h1 { font-size: clamp(2.2rem, 3.7vw, 3.35rem); font-weight: 700; line-height: 1.04; letter-spacing: -0.025em; }
/* Selo do produto: o Nexo aparece aqui como produto da Vorek (a marca do site é a Vorek). */
.hero__produto { display: inline-flex; align-items: center; gap: .6rem; margin-bottom: 1.1rem; padding: .35rem .9rem .35rem .5rem; border: 1.5px solid var(--linha); border-radius: 999px; background: var(--papel); font-size: .95rem; color: var(--texto-2); }
.hero__produto img { height: 1.7rem; width: auto; }
.hero__produto b { color: var(--marinho); font-family: var(--fonte-titulo, inherit); letter-spacing: .03em; }
.hero__texto { margin-top: 1.4rem; font-size: 1.15rem; color: var(--texto-2); max-width: 34rem; }
.hero__acoes { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 2rem; }

.faixa { margin-top: clamp(3rem, 6vw, 4.5rem); border-top: 1px solid var(--linha); padding-top: 1.4rem; display: flex; flex-wrap: wrap; gap: .5rem 2.5rem; color: var(--texto-2); font-size: .98rem; }
.faixa strong { color: var(--marinho); font-weight: 700; }

/* Cena do hero: e-mail → trabalho */
.cena { position: relative; padding-top: 7.5rem; }
.cena__ligacao { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; overflow: visible; z-index: 3; }
.cena__ligacao path { fill: none; stroke: var(--ciano); stroke-width: 2.5; stroke-linecap: round; }
.cena__ligacao circle { fill: var(--ciano); }
.cena__ligacao .halo { fill: none; stroke: var(--ciano); stroke-width: 2; opacity: .5; }

.cartao-flutua {
  position: absolute; z-index: 4; background: var(--papel); color: var(--marinho);
  border: 1px solid var(--linha); border-radius: 12px; padding: .85rem 1rem;
  box-shadow: 0 18px 40px -18px rgba(17, 38, 74, .45);
  font-size: .86rem; line-height: 1.4;
}
.cartao-flutua--email { left: 0; top: 0; width: min(17rem, 52%); }
.cartao-flutua--zap { right: -.5rem; bottom: -2.4rem; width: min(16rem, 50%); }
.win--hero .win__corpo, .win--icones .win__corpo { grid-template-columns: 3rem minmax(0, 1fr); }
.win--hero .win__menu, .win--icones .win__menu { padding-inline: .35rem; }
.win--hero .win__menu span, .win--icones .win__menu span { font-size: 0; gap: 0; justify-content: center; }
.win--icones .win__menu .grupo { display: none; }
.cartao-flutua header { display: flex; align-items: center; gap: .5rem; font-weight: 700; font-size: .8rem; color: var(--texto-2); margin-bottom: .4rem; }
.cartao-flutua header .ic { color: var(--azul-acao); font-size: 1.1rem; }
.cartao-flutua b { display: block; font-size: .92rem; margin-bottom: .15rem; }
.cartao-flutua p { color: var(--texto-2); }
.cartao-flutua__acao { margin-top: .6rem; display: inline-flex; align-items: center; gap: .35rem; font-weight: 600; font-size: .8rem; color: #fff; background: var(--azul-acao); border-radius: 7px; padding: .3rem .6rem; }
.cartao-flutua--zap header .ic { color: #1fa855; }
.cartao-flutua__etiqueta { display: inline-flex; margin-top: .5rem; font-size: .72rem; font-weight: 600; background: #e6f6ee; color: #12683c; border-radius: 99px; padding: .15rem .55rem; }

/* sequência única do hero (carregamento) */
@media (prefers-reduced-motion: no-preference) {
  .cena--anima .win--hero { animation: entra-janela .7s cubic-bezier(.2, .7, .2, 1) both; }
  .cena--anima .cartao-flutua--email { animation: entra-cartao .6s .5s cubic-bezier(.2, .7, .2, 1) both; }
  .cena--anima .cartao-flutua--zap { animation: entra-cartao .6s 1.9s cubic-bezier(.2, .7, .2, 1) both; }
  .cena--anima .cena__ligacao path { stroke-dasharray: var(--comp, 600); stroke-dashoffset: var(--comp, 600); animation: desenha .9s 1.1s ease-out forwards; }
  .cena--anima .cena__ligacao circle { opacity: 0; animation: aparece .3s 1.1s forwards; }
  .cena--anima .cena__ligacao .no-fim { animation-delay: 1.95s; }
  .cena--anima .cena__ligacao .halo { opacity: 0; animation: pulsa 1s 1.95s ease-out 1 forwards; transform-box: fill-box; transform-origin: center; }
  .cena--anima .k-novo { animation: card-novo .6s 1.95s cubic-bezier(.2, .7, .2, 1) both; }
  .cena--anima .k-novo .chip { animation: aparece .4s 2.3s both; }
}
@keyframes entra-janela { from { opacity: 0; transform: translateY(14px); } }
@keyframes entra-cartao { from { opacity: 0; transform: translateY(-10px); } }
@keyframes desenha { to { stroke-dashoffset: 0; } }
@keyframes aparece { to { opacity: 1; } from { opacity: 0; } }
@keyframes pulsa { 0% { opacity: .7; transform: scale(.6); } 100% { opacity: 0; transform: scale(2.4); } }
@keyframes card-novo { from { opacity: 0; transform: translateY(-8px) scale(.97); } }

/* ---------- Seções ---------- */
.secao { padding-block: var(--secao); }
.secao--papel { background: var(--papel); border-block: 1px solid var(--linha); }
.secao--marinho { background: var(--marinho); color: #fff; }
.secao__cabeca { max-width: 46rem; margin-bottom: clamp(2rem, 4vw, 3.5rem); }
.secao__cabeca h2 { font-size: clamp(1.9rem, 3.6vw, 3rem); font-weight: 700; }
.secao__cabeca p { margin-top: 1rem; font-size: 1.1rem; color: var(--texto-2); }
.secao--marinho .secao__cabeca p { color: var(--texto-claro); }

/* Valor — três colunas tipográficas separadas por filetes */
.valores { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 2px solid var(--marinho); }
.valores > li { padding: 1.8rem clamp(1rem, 2.2vw, 2rem) .5rem 0; }
.valores > li + li { padding-left: clamp(1rem, 2.2vw, 2rem); border-left: 1px solid var(--linha); }
.valores h3 { font-size: 1.45rem; font-weight: 650; margin-bottom: .8rem; }
.valores p { color: var(--texto-2); }

/* ---------- Tour do produto ---------- */
.tour { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(1.5rem, 3.5vw, 3.5rem); align-items: start; }
.tour__abas { display: flex; flex-direction: column; border-top: 1px solid var(--linha); }
.tour__aba { text-align: left; background: none; border: 0; border-bottom: 1px solid var(--linha); padding: 1.05rem 0 1.05rem 1.1rem; cursor: pointer; position: relative; display: grid; grid-template-columns: auto 1fr; column-gap: .8rem; align-items: center; color: var(--texto-2); }
.tour__aba::before { content: ""; position: absolute; left: 0; top: .9rem; bottom: .9rem; width: 3px; border-radius: 3px; background: transparent; }
.tour__aba .ic { font-size: 1.35rem; }
.tour__aba strong { font-family: var(--fonte-titulo); font-size: 1.2rem; font-weight: 650; letter-spacing: -.015em; }
.tour__aba:hover { color: var(--marinho); }
.tour__aba[aria-selected="true"] { color: var(--marinho); }
.tour__aba[aria-selected="true"]::before { background: var(--azul); }
.tour__aba[aria-selected="true"] .ic { color: var(--azul-acao); }
.tour__detalhe { grid-column: 2; display: none; padding: .6rem 0 .2rem; font-size: .98rem; }
.tour__aba[aria-selected="true"] .tour__detalhe { display: block; }
.tour__detalhe ul { display: grid; gap: .55rem; margin-top: .3rem; }
.tour__detalhe li { position: relative; padding-left: 1.1rem; }
.tour__detalhe li::before { content: ""; position: absolute; left: 0; top: .62em; width: .4rem; height: .4rem; border-radius: 50%; background: var(--ciano); }
.tour__painel[hidden] { display: none; }
.tour__legenda { margin-top: .9rem; font-size: .88rem; color: var(--texto-2); }
@media (prefers-reduced-motion: no-preference) {
  .tour__painel:not([hidden]) { animation: troca .35s ease both; }
}
@keyframes troca { from { opacity: 0; transform: translateY(8px); } }

/* ---------- Índice de módulos ---------- */
.indice { border-top: 2px solid var(--marinho); }
.indice__grupo { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 9fr); gap: clamp(1rem, 3vw, 3rem); padding-block: 1.8rem; border-bottom: 1px solid var(--linha); }
.indice__grupo h3 { font-size: 1.45rem; font-weight: 650; }
.indice__grupo > div > p { margin-top: .5rem; font-size: .95rem; color: var(--texto-2); max-width: 19rem; }
.indice dl { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.1rem clamp(1.2rem, 3vw, 2.8rem); }
.indice dt { display: flex; align-items: center; gap: .55rem; font-weight: 700; }
.indice dt .ic { color: var(--azul-acao); font-size: 1.2rem; }
.indice dd { margin: .15rem 0 0 1.75rem; color: var(--texto-2); font-size: .98rem; line-height: 1.5; }
.nota { margin-top: 1.5rem; font-size: .95rem; color: var(--texto-2); }

/* ---------- Automação ---------- */
.automacao { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 4vw, 4rem); align-items: center; }
.automacao h2 { font-size: clamp(1.9rem, 3.6vw, 3rem); font-weight: 700; }
.automacao__texto > p { margin-top: 1rem; color: var(--texto-2); font-size: 1.08rem; }
.automacao__lista { margin-top: 1.6rem; display: grid; gap: 1.2rem; }
.automacao__lista h3 { font-size: 1.15rem; font-weight: 650; }
.automacao__lista p { color: var(--texto-2); margin-top: .25rem; font-size: .98rem; }
.fluxo { background: var(--marinho-fundo); border-radius: var(--raio-janela); padding: clamp(1rem, 2.5vw, 1.8rem); border: 1px solid #1b3158; }
.fluxo svg { width: 100%; height: auto; }
.fluxo text { font-family: var(--fonte-corpo); }
.fluxo__dica { display: none; margin-top: .8rem; font-size: .85rem; color: var(--texto-claro); }
@media (max-width: 640px) { .fluxo__dica { display: block; } }

/* ---------- Controle (marinho) ---------- */
.controle { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(2rem, 5vw, 5rem); border-top: 1px solid #2a4373; }
.controle li { display: grid; grid-template-columns: auto 1fr; align-content: start; gap: .2rem 1rem; padding-block: 1.5rem; border-bottom: 1px solid #2a4373; }
.controle .ic { color: var(--ciano); font-size: 1.5rem; margin-top: .15rem; grid-row: span 2; }
.controle h3 { font-size: 1.2rem; font-weight: 650; color: #fff; }
.controle p { color: var(--texto-claro); font-size: .98rem; }

/* ---------- Para quem ---------- */
.perfis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.perfis > li { padding: 0 clamp(1rem, 2.4vw, 2.2rem); }
.perfis > li:first-child { padding-left: 0; }
.perfis > li + li { border-left: 1px solid var(--linha); }
.perfis h3 { font-size: 1.4rem; font-weight: 650; }
.perfis > li > p { margin-top: .7rem; color: var(--texto-2); }
.perfis ul { margin-top: 1.1rem; display: grid; gap: .5rem; font-size: .96rem; }
.perfis ul li { display: flex; gap: .55rem; align-items: baseline; }
.perfis ul .ic { color: var(--azul-acao); font-size: 1rem; translate: 0 .15em; }

/* ---------- Contato ---------- */
.contato { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; }
.contato h2 { font-size: clamp(2rem, 4vw, 3.3rem); font-weight: 700; }
.contato__texto > p { margin-top: 1.1rem; color: var(--texto-claro); font-size: 1.08rem; max-width: 32rem; }
.formulario { background: var(--papel); color: var(--texto); border-radius: var(--raio-janela); padding: clamp(1.2rem, 3vw, 2rem); display: grid; gap: 1rem; }
.campo { display: grid; gap: .35rem; }
.campo label { font-weight: 600; font-size: .92rem; }
.campo input, .campo textarea { width: 100%; border: 1.5px solid var(--linha); border-radius: 9px; padding: .7rem .85rem; background: var(--giz); min-height: 2.9rem; }
.campo textarea { min-height: 7rem; resize: vertical; }
.campo input:focus, .campo textarea:focus { outline: 3px solid color-mix(in srgb, var(--azul) 45%, transparent); border-color: var(--azul); }
.campo--duplo { grid-template-columns: 1fr 1fr; gap: 1rem; }
.formulario__estado { min-height: 1.4rem; font-size: .92rem; color: var(--texto-2); }
.formulario__estado[data-tipo="erro"] { color: #a32d3d; }
.formulario__estado[data-tipo="ok"] { color: #12683c; }

/* ---------- Rodapé ---------- */
.rodape { background: var(--marinho-fundo); color: var(--texto-claro); padding-block: 3rem 2rem; }
.rodape__linha { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2rem; align-items: flex-start; }
.rodape__marca img { height: 5rem; width: auto; }
.rodape__marca p { margin-top: 1rem; max-width: 22rem; font-size: .95rem; }
.rodape nav { display: grid; gap: .55rem; font-size: .96rem; }
.rodape nav a { text-decoration: none; }
.rodape nav a:hover { color: #fff; text-decoration: underline; }
.rodape__base { margin-top: 2.5rem; padding-top: 1.4rem; border-top: 1px solid #1f3560; display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between; align-items: center; font-size: .9rem; }
.assinatura { display: inline-flex; align-items: center; gap: .6rem; }
.assinatura img { height: 1.7rem; width: auto; }

/* =====================================================================
   Janelas do produto (tema escuro real do Nexo)
   ===================================================================== */
.win {
  --d-bg: #0d1117; --d-bg2: #10151d; --d-surf: #171d28; --d-suave: #141922;
  --d-linha: #2b3544; --d-texto: #f2f5f9; --d-texto2: #a8b3c4; --d-mudo: #6f7d91;
  --d-pri: #4f8cff; --d-pri-h: #6aa0ff; --d-pri-s: rgba(79, 140, 255, .14);
  --d-ok: #19c98b; --d-warn: #f2b84b; --d-err: #f05d6f;
  background: var(--d-bg); color: var(--d-texto);
  border-radius: var(--raio-janela); border: 1px solid #243044; overflow: hidden;
  box-shadow: 0 30px 60px -28px rgba(11, 26, 51, .6), 0 2px 0 rgba(255, 255, 255, .05) inset;
  font-size: .8rem; line-height: 1.35; text-align: left;
}
.win .ic { font-size: 1rem; }
.win__barra { display: flex; align-items: flex-end; gap: .25rem; background: var(--d-bg2); border-bottom: 1px solid var(--d-linha); padding: .45rem .6rem 0; }
.win__pontos { display: flex; gap: .3rem; padding: 0 .5rem .55rem 0; align-self: center; }
.win__pontos i { width: .55rem; height: .55rem; border-radius: 50%; background: #2b3544; }
.win__aba { display: inline-flex; align-items: center; gap: .4rem; padding: .45rem .8rem; border-radius: 8px 8px 0 0; color: var(--d-texto2); font-size: .76rem; }
.win__aba--ativa { background: var(--d-bg); color: var(--d-texto); border: 1px solid var(--d-linha); border-bottom-color: var(--d-bg); margin-bottom: -1px; }
.win__corpo { display: grid; grid-template-columns: 8.4rem minmax(0, 1fr); min-height: 21rem; }
.win__corpo--sem-menu { grid-template-columns: minmax(0, 1fr); }
.win__menu { background: var(--d-bg2); border-right: 1px solid var(--d-linha); padding: .7rem .5rem; display: grid; gap: .15rem; align-content: start; }
.win__menu span { display: flex; align-items: center; gap: .5rem; padding: .4rem .5rem; border-radius: 7px; color: var(--d-texto2); white-space: nowrap; }
.win__menu span.on { background: var(--d-pri-s); color: var(--d-pri-h); box-shadow: inset 0 0 0 1px rgba(79, 140, 255, .28); }
.win__menu .grupo { color: var(--d-mudo); font-size: .68rem; padding: .7rem .5rem .2rem; }
.win__conteudo { padding: .8rem; min-width: 0; overflow: hidden; }
.win__titulo { display: flex; align-items: center; justify-content: space-between; gap: .6rem; margin-bottom: .7rem; }
.win__titulo h4 { font-size: 1rem; font-weight: 650; letter-spacing: -.01em; }
.win__botao { background: var(--d-pri); color: #fff; border-radius: 7px; padding: .3rem .65rem; font-weight: 600; font-size: .74rem; display: inline-flex; gap: .3rem; align-items: center; white-space: nowrap; }
.win__botao--sec { background: transparent; border: 1px solid var(--d-linha); color: var(--d-texto2); }
.chip { display: inline-flex; align-items: center; gap: .25rem; font-size: .66rem; font-weight: 600; padding: .1rem .45rem; border-radius: 99px; background: var(--d-pri-s); color: var(--d-pri-h); white-space: nowrap; }
.chip--ok { background: rgba(25, 201, 139, .14); color: var(--d-ok); }
.chip--warn { background: rgba(242, 184, 75, .14); color: var(--d-warn); }
.avatar { width: 1.5rem; height: 1.5rem; border-radius: 50%; display: grid; place-items: center; font-size: .62rem; font-weight: 700; color: #0d1117; flex: none; }
.av1 { background: #7fb2ff; } .av2 { background: #7fe0c0; } .av3 { background: #f2c27a; } .av4 { background: #e3a1c5; }

/* Kanban */
.kanban { display: grid; grid-template-columns: repeat(4, minmax(7.4rem, 1fr)); gap: .6rem; }
.kanban--3 { grid-template-columns: repeat(3, minmax(7rem, 1fr)); }
.k-col { background: var(--d-suave); border: 1px solid var(--d-linha); border-radius: 10px; padding: .5rem; display: grid; gap: .45rem; align-content: start; min-width: 0; }
.k-col header { display: flex; justify-content: space-between; align-items: center; font-weight: 700; font-size: .74rem; padding: .1rem .15rem; }
.k-col header span { color: var(--d-mudo); font-weight: 500; }
.k-card { background: var(--d-surf); border: 1px solid var(--d-linha); border-radius: 8px; padding: .5rem .55rem; display: grid; gap: .3rem; }
.k-card b { font-size: .76rem; font-weight: 650; }
.k-card small { color: var(--d-texto2); font-size: .68rem; }
.k-card footer { display: flex; justify-content: space-between; align-items: center; gap: .3rem; margin-top: .1rem; }
.k-card .valor { color: var(--d-texto); font-weight: 650; font-size: .72rem; }
.k-col .total { border-top: 1px dashed var(--d-linha); padding: .35rem .15rem 0; color: var(--d-texto2); display: flex; justify-content: space-between; gap: .3rem; font-size: .66rem; white-space: nowrap; }
.k-card--aten { border-color: rgba(242, 184, 75, .55); }
.k-novo { border-color: var(--ciano); box-shadow: 0 0 0 1px var(--ciano), 0 0 18px -4px rgba(0, 198, 255, .55); }

/* E-mail */
.mail { display: grid; grid-template-columns: 6.6rem minmax(0, 1fr) minmax(0, 1.25fr); gap: 0; min-height: 21rem; }
.mail__caixas { border-right: 1px solid var(--d-linha); padding: .7rem .5rem; display: grid; gap: .1rem; align-content: start; background: var(--d-bg2); }
.mail__caixas span { display: flex; justify-content: space-between; padding: .38rem .5rem; border-radius: 7px; color: var(--d-texto2); }
.mail__caixas span.on { background: var(--d-pri-s); color: var(--d-pri-h); }
.mail__lista { border-right: 1px solid var(--d-linha); display: grid; align-content: start; }
.mail__item { padding: .6rem .7rem; border-bottom: 1px solid var(--d-linha); display: grid; gap: .1rem; }
.mail__item b { font-size: .76rem; display: flex; justify-content: space-between; gap: .3rem; }
.mail__item small { color: var(--d-texto2); font-size: .7rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mail__item.on { background: var(--d-pri-s); }
.mail__item .quando { color: var(--d-mudo); font-weight: 500; font-size: .66rem; }
.mail__leitura { padding: .8rem; display: grid; gap: .7rem; align-content: start; min-width: 0; }
.mail__leitura h5 { margin: 0; font-size: .9rem; font-family: var(--fonte-corpo); letter-spacing: 0; }
.mail__de { display: flex; gap: .5rem; align-items: center; color: var(--d-texto2); }
.mail__corpo { color: var(--d-texto2); line-height: 1.5; }
.mail__acoes { display: flex; flex-wrap: wrap; gap: .4rem; }
.mail__vinculo { border: 1px dashed var(--d-linha); border-radius: 8px; padding: .5rem .6rem; display: flex; gap: .5rem; align-items: center; color: var(--d-texto2); }
.mail__vinculo .ic { color: var(--d-pri-h); }

/* WhatsApp */
.zap { display: grid; grid-template-columns: 12.5rem minmax(0, 1fr) 8rem; min-height: 21rem; }
.zap__lista { border-right: 1px solid var(--d-linha); background: var(--d-bg2); display: grid; grid-template-columns: minmax(0, 1fr); align-content: start; min-width: 0; overflow: hidden; }
.zap__busca { white-space: nowrap; margin: .6rem; padding: .4rem .6rem; border-radius: 8px; background: var(--d-surf); border: 1px solid var(--d-linha); color: var(--d-mudo); display: flex; gap: .4rem; align-items: center; }
.zap__abas { display: flex; gap: .25rem; padding: 0 .6rem .5rem; font-size: .66rem; overflow: hidden; flex-wrap: nowrap; white-space: nowrap; }
.zap__abas span { padding: .12rem .45rem; border-radius: 99px; border: 1px solid var(--d-linha); color: var(--d-texto2); }
.zap__abas span.on { background: var(--d-pri-s); color: var(--d-pri-h); border-color: transparent; }
.zap__conv { display: flex; gap: .5rem; padding: .55rem .6rem; align-items: center; border-top: 1px solid var(--d-linha); }
.zap__conv.on { background: var(--d-pri-s); }
.zap__conv div { min-width: 0; }
.zap__conv b { display: block; font-size: .74rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.zap__conv small { color: var(--d-texto2); font-size: .66rem; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.zap__fio { padding: .7rem; display: flex; flex-direction: column; gap: .5rem; justify-content: flex-end; background: var(--d-bg); min-width: 0; }
.zap__dia { align-self: center; margin-bottom: auto; font-size: .62rem; color: var(--d-mudo); background: var(--d-surf); border: 1px solid var(--d-linha); border-radius: 99px; padding: .1rem .65rem; }
.balao { max-width: 82%; padding: .45rem .65rem; border-radius: 10px; background: var(--d-surf); border: 1px solid var(--d-linha); color: var(--d-texto); }
.balao small { display: block; color: var(--d-mudo); font-size: .62rem; margin-top: .15rem; text-align: right; }
.balao--eu { align-self: flex-end; background: #1d3b6e; border-color: #2a5199; }
.balao--eu em { display: block; font-style: normal; color: var(--d-pri-h); font-size: .62rem; margin-top: .2rem; }
.zap__digita { display: flex; gap: .4rem; align-items: center; border: 1px solid var(--d-linha); border-radius: 9px; padding: .4rem .6rem; color: var(--d-mudo); background: var(--d-surf); }
.zap__info { border-left: 1px solid var(--d-linha); padding: .8rem .7rem; display: grid; gap: .6rem; align-content: start; background: var(--d-bg2); }
.zap__info dl { margin: 0; display: grid; gap: .5rem; }
.zap__info dt { color: var(--d-mudo); font-size: .66rem; }
.zap__info dd { margin: 0; }

/* Calendário */
.cal { display: grid; gap: .6rem; }
.cal__topo { display: flex; justify-content: space-between; align-items: center; gap: .6rem; flex-wrap: wrap; }
.cal__marca { display: inline-flex; align-items: center; gap: .4rem; color: var(--d-texto2); }
.cal__marca i { width: .85rem; height: .85rem; border-radius: 3px; background: var(--d-pri); display: inline-block; box-shadow: inset 0 0 0 2px var(--d-bg); outline: 1px solid var(--d-pri); }
.cal__grade { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border: 1px solid var(--d-linha); border-radius: 10px; overflow: hidden; }
.cal__dia { min-height: 3.9rem; border-right: 1px solid var(--d-linha); border-bottom: 1px solid var(--d-linha); padding: .25rem .3rem; font-size: .66rem; color: var(--d-texto2); display: grid; gap: .15rem; align-content: start; }
.cal__dia:nth-child(7n) { border-right: 0; }
.cal__dia--cab { min-height: 0; background: var(--d-bg2); font-weight: 600; text-align: center; padding: .3rem; }
.cal__dia--hoje > span { color: #fff; background: var(--d-pri); border-radius: 99px; width: 1.15rem; height: 1.15rem; display: grid; place-items: center; }
.ev { display: block; font-size: .62rem; padding: .08rem .3rem; border-radius: 4px; background: var(--d-pri-s); color: var(--d-pri-h); border-left: 2px solid var(--d-pri); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ev--trab { background: rgba(242, 184, 75, .14); color: var(--d-warn); border-left-color: var(--d-warn); }
.ev--ok { background: rgba(25, 201, 139, .14); color: var(--d-ok); border-left-color: var(--d-ok); }

/* Sites */
.site { display: grid; grid-template-columns: 8.2rem minmax(0, 1fr) 7.6rem; min-height: 21rem; }
.site__blocos { border-right: 1px solid var(--d-linha); padding: .7rem .55rem; background: var(--d-bg2); display: grid; gap: .3rem; align-content: start; }
.site__blocos h5 { margin: .3rem 0 .15rem; font-family: var(--fonte-corpo); color: var(--d-mudo); font-size: .66rem; font-weight: 600; letter-spacing: 0; }
.site__blocos span { padding: .35rem .5rem; border: 1px solid var(--d-linha); border-radius: 7px; background: var(--d-surf); color: var(--d-texto2); }
.site__tela { background: #e9eef6; padding: .8rem; display: grid; align-content: start; min-width: 0; }
.pagina { background: #fff; color: #11264a; border-radius: 8px; overflow: hidden; display: grid; box-shadow: 0 8px 22px -12px rgba(0, 0, 0, .5); }
.pagina__nav { display: flex; justify-content: space-between; align-items: center; padding: .5rem .8rem; border-bottom: 1px solid #e3e9f2; font-weight: 700; font-size: .72rem; }
.pagina__nav span { color: #475874; font-weight: 500; font-size: .66rem; }
.pagina__hero { padding: 1.3rem .9rem; background: linear-gradient(135deg, #11264a, #1f4a94); color: #fff; display: grid; gap: .4rem; }
.pagina__hero b { font-family: var(--fonte-titulo); font-size: 1.15rem; line-height: 1.1; }
.pagina__hero small { color: #c3d2ec; font-size: .7rem; }
.pagina__hero em { font-style: normal; background: #2f7bff; border-radius: 6px; padding: .22rem .6rem; font-size: .66rem; font-weight: 600; justify-self: start; margin-top: .2rem; }
.pagina__imoveis { display: grid; grid-template-columns: repeat(3, 1fr); gap: .45rem; padding: .7rem .8rem; }
.pagina__imoveis div { border: 1px solid #e3e9f2; border-radius: 6px; overflow: hidden; font-size: .62rem; }
.pagina__imoveis i { display: block; height: 2.4rem; background: linear-gradient(135deg, #b8cdee, #86a7da); }
.pagina__imoveis div:nth-child(2) i { background: linear-gradient(135deg, #cfe3d8, #8fbba4); }
.pagina__imoveis div:nth-child(3) i { background: linear-gradient(135deg, #ecd9bf, #cfa971); }
.pagina__imoveis p { padding: .25rem .35rem; font-weight: 600; }
.pagina__form { margin: 0 .8rem .8rem; border: 1px dashed #b9c6dc; border-radius: 6px; padding: .5rem .6rem; font-size: .66rem; color: #475874; display: flex; justify-content: space-between; align-items: center; gap: .5rem; }
.site__props { border-left: 1px solid var(--d-linha); padding: .8rem .65rem; background: var(--d-bg2); display: grid; gap: .55rem; align-content: start; }
.site__props label { color: var(--d-mudo); font-size: .64rem; display: block; margin-bottom: .15rem; }
.site__props div > span { display: block; padding: .3rem .45rem; border: 1px solid var(--d-linha); border-radius: 6px; background: var(--d-surf); }

/* =====================================================================
   Responsivo
   ===================================================================== */
@media (max-width: 1060px) {
  .hero__grade { grid-template-columns: minmax(0, 1fr); }
  .hero__texto { max-width: 40rem; }
  .tour { grid-template-columns: minmax(0, 1fr); }
  .tour__abas { flex-direction: row; overflow-x: auto; border-top: 0; border-bottom: 1px solid var(--linha); gap: 1.4rem; scrollbar-width: thin; }
  .tour__aba { border-bottom: 0; padding: .8rem 0 .8rem 0; grid-template-columns: auto auto; flex: none; }
  .tour__aba::before { top: auto; bottom: 0; left: 0; right: 0; width: auto; height: 3px; }
  .tour__aba[aria-selected="true"] .tour__detalhe { display: none; }
  .tour__resumo { display: block !important; }
  .automacao { grid-template-columns: minmax(0, 1fr); }
  .contato { grid-template-columns: minmax(0, 1fr); }
}
.tour__resumo { display: none; margin-bottom: 1.2rem; font-size: 1rem; }
.tour__resumo ul { display: grid; gap: .5rem; margin-top: .6rem; }
.tour__resumo li { position: relative; padding-left: 1.1rem; }
.tour__resumo li::before { content: ""; position: absolute; left: 0; top: .62em; width: .4rem; height: .4rem; border-radius: 50%; background: var(--ciano); }

@media (max-width: 860px) {
  .topo__botao { display: inline-flex; order: 3; }
  .idioma { order: 2; margin-left: auto; }
  .topo__linha { gap: 1rem; }
  .menu { position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; align-items: stretch; gap: 0; background: var(--giz); border-bottom: 1px solid var(--linha); padding: .5rem var(--gutter) 1.2rem; display: none; }
  .menu[data-aberto="true"] { display: flex; }
  .menu a { padding: .85rem 0; border-bottom: 1px solid var(--linha); }
  .menu .botao { margin-top: 1rem; border-bottom: 1.5px solid transparent; }
  .valores, .perfis { grid-template-columns: minmax(0, 1fr); }
  .valores > li, .valores > li + li { padding: 1.5rem 0; border-left: 0; }
  .valores > li + li { border-top: 1px solid var(--linha); }
  .perfis > li, .perfis > li:first-child { padding: 1.6rem 0; }
  .perfis > li + li { border-left: 0; border-top: 1px solid var(--linha); }
  .indice__grupo { grid-template-columns: minmax(0, 1fr); }
  .indice__grupo > div > p { max-width: none; }
  .controle { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 760px) {
  /* mockups: só o essencial, legível */
  .win .win__corpo, .win--hero .win__corpo, .win--icones .win__corpo { grid-template-columns: minmax(0, 1fr); }
  .win .win__menu { display: none; }
  .win .mail { grid-template-columns: minmax(0, 1fr); }
  .mail__caixas, .mail__lista { display: none; }
  .zap { grid-template-columns: minmax(0, 1fr); }
  .zap__lista, .zap__info { display: none; }
  .site { grid-template-columns: minmax(0, 1fr); }
  .site__blocos, .site__props { display: none; }
  .kanban, .kanban--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kanban > :nth-child(n + 3) { display: none; }
  .cal__dia { min-height: 3.2rem; }
  .cal__dia .ev:nth-of-type(n + 2) { display: none; }

  /* cena do hero: empilha, sem posição absoluta */
  .cena { padding-top: 0; display: grid; gap: 0; }
  .cartao-flutua { position: relative; width: auto; max-width: 100%; z-index: 4; }
  .cartao-flutua--email { order: 1; width: 100%; }
  .win--hero { order: 2; margin-top: 2.6rem; }
  .cartao-flutua--zap { order: 3; right: auto; bottom: auto; margin-top: -1rem; margin-left: 1.5rem; margin-right: -.3rem; }
  .campo--duplo { grid-template-columns: 1fr; }
  .faixa { gap: .4rem 1.5rem; }
}

@media (max-width: 420px) {
  body { font-size: 1rem; }
  .botao { width: 100%; }
  .hero__acoes { display: grid; }
  .kanban, .kanban--3 { grid-template-columns: minmax(0, 1fr); }
  .kanban > :nth-child(n + 2) { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { animation: none !important; transition: none !important; }
}

/* =====================================================================
   Formulário: campos extras (telefone, aceite, isca anti-robô)
   ===================================================================== */
.campo__opcional { font-weight: 400; color: var(--texto-2); }
.campo__isca, .campo__isca * { position: absolute; width: 1px; height: 1px; margin: 0; padding: 0; border: 0; overflow: hidden; white-space: nowrap; }
.campo__isca { margin: -1px; clip: rect(0 0 0 0); clip-path: inset(50%); opacity: 0; pointer-events: none; }
.campo__aceite { display: grid; grid-template-columns: auto 1fr; gap: .7rem; align-items: start; font-size: .92rem; line-height: 1.45; color: var(--texto-2); cursor: pointer; }
.campo__aceite input { width: 1.2rem; height: 1.2rem; margin: .15rem 0 0; accent-color: var(--azul-acao); cursor: pointer; }
.campo__aceite a { color: var(--azul-acao); font-weight: 600; }
.rodape nav + nav { padding-left: clamp(0rem, 4vw, 3rem); }

/* =====================================================================
   Páginas legais (Privacidade e Termos)
   ===================================================================== */
.legal { padding-block: clamp(2.5rem, 6vw, 4.5rem) var(--secao); }
.legal__cabeca { max-width: 52rem; margin-bottom: clamp(2rem, 4vw, 3rem); padding-bottom: 1.6rem; border-bottom: 2px solid var(--marinho); }
.legal__tipo { font-size: .82rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--azul-acao); }
.legal__cabeca h1 { margin-top: .5rem; font-size: clamp(2.2rem, 4.4vw, 3.6rem); font-weight: 700; line-height: 1.04; }
.legal__meta { margin-top: 1rem; display: flex; flex-wrap: wrap; gap: .4rem 1.6rem; font-size: .95rem; color: var(--texto-2); }
.legal__meta a { color: var(--azul-acao); font-weight: 600; }
.legal__grade { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 9fr); gap: clamp(1.5rem, 4vw, 4rem); align-items: start; }
.legal__indice { position: sticky; top: 6rem; font-size: .92rem; }
.legal__indice p { font-size: .78rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--texto-2); margin-bottom: .6rem; }
.legal__indice ol { list-style: none; margin: 0; padding: 0; display: grid; gap: .1rem; border-left: 1px solid var(--linha); }
.legal__indice a { display: block; padding: .32rem 0 .32rem .9rem; margin-left: -1px; border-left: 2px solid transparent; color: var(--texto-2); text-decoration: none; line-height: 1.35; }
.legal__indice a:hover { color: var(--marinho); border-left-color: var(--azul); }
.legal__texto { max-width: 46rem; min-width: 0; }
.legal__texto > section { padding-bottom: 2rem; scroll-margin-top: 6rem; }
.legal__texto h2 { font-size: clamp(1.45rem, 2.4vw, 1.9rem); font-weight: 650; margin-bottom: .8rem; }
.legal__texto h3 { font-size: 1.1rem; font-weight: 650; margin: 1.3rem 0 .4rem; font-family: var(--fonte-corpo); letter-spacing: -.01em; }
.legal__texto p { margin-bottom: .9rem; color: var(--texto-2); }
.legal__texto p strong, .legal__texto li strong { color: var(--texto); }
.legal__texto ul, .legal__texto ol.legal__passos { margin: 0 0 1rem; padding-left: 1.3rem; display: grid; gap: .4rem; color: var(--texto-2); }
.legal__texto ul { list-style: disc; }
.legal__texto ol.legal__passos { list-style: decimal; }
.legal__texto a { color: var(--azul-acao); text-underline-offset: 3px; }
.legal__texto code { font-size: .9em; background: var(--papel); border: 1px solid var(--linha); border-radius: 5px; padding: .05rem .35rem; overflow-wrap: anywhere; }
.legal__resumo { background: var(--papel); border: 1px solid var(--linha); border-left: 4px solid var(--azul); border-radius: 10px; padding: 1.1rem 1.3rem 1.1rem 1.4rem; margin-bottom: 2.2rem; }
.legal__resumo h2 { font-size: 1.2rem; margin-bottom: .6rem; }
.legal__resumo ul { margin-bottom: 0; }
.legal__tabela { overflow-x: auto; margin: 0 0 1.2rem; border: 1px solid var(--linha); border-radius: 10px; background: var(--papel); }
.legal__tabela table { width: 100%; border-collapse: collapse; font-size: .92rem; min-width: 34rem; }
.legal__tabela caption { text-align: left; padding: .8rem 1rem 0; font-weight: 700; color: var(--texto); }
.legal__tabela th, .legal__tabela td { text-align: left; vertical-align: top; padding: .7rem 1rem; border-top: 1px solid var(--linha); color: var(--texto-2); }
.legal__tabela thead th { border-top: 0; font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; color: var(--texto); background: var(--giz); }
.legal__tabela td:first-child { color: var(--texto); font-weight: 600; width: 36%; }
.legal__destaque { background: color-mix(in srgb, var(--ciano) 12%, var(--papel)); border: 1px solid color-mix(in srgb, var(--ciano) 45%, var(--linha)); border-radius: 10px; padding: 1rem 1.2rem; margin-bottom: 1.2rem; color: var(--texto); }
.legal__destaque p { color: var(--texto); margin-bottom: 0; }
/* Cada página legal traz os dois idiomas; <html data-idioma> (definido por i18n.js) escolhe qual aparece. Sem JavaScript, fica o inglês. */
html[data-idioma="pt"] [data-lang-bloco="en"],
html:not([data-idioma="pt"]) [data-lang-bloco="pt"] { display: none; }
@media (max-width: 1060px) {
  .legal__grade { grid-template-columns: minmax(0, 1fr); }
  .legal__indice { position: static; border: 1px solid var(--linha); border-radius: 10px; padding: 1rem 1.2rem; background: var(--papel); }
  .legal__indice ol { border-left: 0; columns: 2; column-gap: 2rem; }
  .legal__indice a { border-left: 0; padding-left: 0; margin-left: 0; }
}
@media (max-width: 640px) {
  .legal__indice ol { columns: 1; }
  .rodape nav + nav { padding-left: 0; }
}