/* Blocos, cor e profundidade (16/09/2026).
 *
 * Carregar DEPOIS de landing-auditoria.css e movimento.css: esta folha redefine a aparência das seções
 * sem mexer em estrutura de oferta, preço ou formulário.
 *
 * O pedido foi "cada seção em um bloco com efeito leve 3D e bordas arredondadas", mais cor, mais
 * movimento e mais telas da plataforma. As regras que seguram isso dentro da marca:
 *
 *  - A cor sai SÓ da paleta oficial (petróleo, gelo, azul, vívido, ardósia). O que dá "mais cor" é a
 *    alternância das placas (clara, gelo, petróleo, gradiente) e luz azul difusa, não matiz nova.
 *  - O 3D é de profundidade, não de brinquedo: sombra em camadas, duas "folhas" aparecendo por baixo
 *    de cada placa (as duas últimas sombras de --sombra-placa) e inclinação pequena pelo ponteiro.
 *  - Todo movimento fica atrás de `.mov-ready` (JS ligado e sem movimento reduzido) ou `.pl-visivel`
 *    (placa já apareceu). Sem JavaScript a página é estática e completa.
 *  - A classe de seção é `.placa`, e não `.bloco`: `.bloco` já é o horário marcado dentro do mock da
 *    agenda, e reusar o nome pintaria cada consulta como uma seção inteira.
 */

:root{
  --gelo-suave:color-mix(in srgb,var(--gelo) 18%,var(--branco));
  --gelo-claro:color-mix(in srgb,var(--gelo) 35%,var(--branco));
  --gelo-medio:color-mix(in srgb,var(--gelo) 55%,var(--branco));
  --gelo-50:var(--gelo-suave);
  --gelo-100:var(--gelo-medio);
  --borda-azul:color-mix(in srgb,var(--azul) 15%,var(--linha));
  --folha-1:color-mix(in srgb,var(--azul) 18%,var(--linha));
  --folha-2:color-mix(in srgb,var(--linha) 60%,var(--branco));
  --folha-escura-1:color-mix(in srgb,var(--petroleo-luz) 70%,var(--azul-fundo));
  --pl-margem:clamp(8px,1.3vw,20px);
  --pl-espaco:clamp(16px,2vw,30px);
  --pl-raio:clamp(24px,2.8vw,44px);
  --pl-largura:1480px;
  --curva:cubic-bezier(.16,1,.3,1);
  --sombra-placa:
    0 1px 0 color-mix(in srgb,var(--branco) 95%,transparent) inset,
    0 0 0 1px color-mix(in srgb,var(--petroleo) 5%,transparent),
    0 2px 6px color-mix(in srgb,var(--petroleo) 4%,transparent),
    0 34px 60px -38px color-mix(in srgb,var(--petroleo) 30%,transparent),
    0 10px 0 -5px var(--folha-1),
    0 19px 0 -11px var(--folha-2);
  --sombra-placa-escura:
    0 1px 0 color-mix(in srgb,var(--gelo) 14%,transparent) inset,
    0 0 0 1px color-mix(in srgb,var(--petroleo) 25%,transparent),
    0 34px 60px -34px color-mix(in srgb,var(--petroleo) 55%,transparent),
    0 10px 0 -5px var(--folha-escura-1),
    0 19px 0 -11px var(--dim);
  --sombra-cartao:0 1px 2px color-mix(in srgb,var(--petroleo) 4%,transparent),0 18px 38px -24px color-mix(in srgb,var(--petroleo) 32%,transparent);
  --sombra-cartao-alta:0 2px 4px color-mix(in srgb,var(--petroleo) 5%,transparent),0 36px 64px -32px color-mix(in srgb,var(--petroleo) 42%,transparent);
}

body{background:linear-gradient(180deg,var(--pagina) 0%,color-mix(in srgb,var(--pagina) 50%,var(--offwhite)) 30%,var(--pagina) 100%)}

.sprite{position:absolute;width:0;height:0;overflow:hidden}
.ic{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- placas ---------- */
.placa{
  position:relative;
  width:calc(100% - 2 * var(--pl-margem));
  max-width:var(--pl-largura);
  margin:0 auto var(--pl-espaco);
  border-radius:var(--pl-raio);
  background:var(--branco);
  box-shadow:var(--sombra-placa);
  overflow:clip;
  isolation:isolate;
}
.placa > .wrap{padding-left:clamp(18px,4.8vw,92px);padding-right:clamp(18px,4.8vw,92px)}
.placa.sec{padding-block:clamp(48px,6vw,100px)}
/* Entrada das placas (blocos.js): a placa abaixo da tela espera inclinada e assenta por transição. */
.mov-ready .placa{transition:transform 1.1s var(--curva),opacity 1.1s var(--curva)}
.mov-ready .placa.pl-espera{opacity:.35;transform:perspective(1800px) rotateX(7deg) translateY(56px) scale(.97)}
@media print{.pl-espera{opacity:1!important;transform:none!important}}

.placa--gelo{
  background:
    radial-gradient(50% 45% at 100% 0%,color-mix(in srgb,var(--vivido) 13%,transparent),transparent 70%),
    radial-gradient(40% 40% at 0% 100%,color-mix(in srgb,var(--azul) 18%,transparent),transparent 70%),
    linear-gradient(180deg,var(--gelo-claro) 0%,var(--gelo-suave) 55%,var(--branco) 100%);
}
.placa--escuro,.placa--rodape{
  background:
    radial-gradient(55% 55% at 88% 0%,color-mix(in srgb,var(--vivido) 30%,transparent),transparent 65%),
    radial-gradient(45% 50% at 0% 100%,color-mix(in srgb,var(--azul) 20%,transparent),transparent 70%),
    linear-gradient(165deg,var(--petroleo) 0%,var(--petroleo-fundo) 100%);
  box-shadow:var(--sombra-placa-escura);
  color:var(--gelo);
}
.placa--marca{
  background:
    radial-gradient(50% 80% at 0% 0%,color-mix(in srgb,var(--branco) 80%,transparent),transparent 60%),
    radial-gradient(45% 80% at 100% 100%,color-mix(in srgb,var(--vivido) 42%,transparent),transparent 70%),
    linear-gradient(120deg,var(--gelo-medio) 0%,var(--gelo) 35%,color-mix(in srgb,var(--azul) 55%,var(--gelo)) 72%,color-mix(in srgb,var(--vivido) 55%,var(--gelo)) 100%);
}
.placa--rodape{margin-bottom:var(--pl-margem);padding-block:clamp(36px,4vw,52px)}

/* Cabeçalho das seções: número e rótulo viram uma pílula, e o título tem dois tons. */
.placa .sec__cab{display:flex;flex-direction:column;align-items:flex-start;gap:20px}
.sec__num{
  display:inline-flex;align-items:center;gap:10px;margin:0;
  padding:5px 16px 5px 5px;border-radius:999px;
  background:color-mix(in srgb,var(--branco) 75%,transparent);border:1px solid color-mix(in srgb,var(--azul) 38%,transparent);
  box-shadow:0 8px 20px -14px color-mix(in srgb,var(--petroleo) 35%,transparent);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
}
.sec__num .folio{
  display:grid;place-items:center;width:30px;height:30px;border-radius:50%;
  background:var(--marca);color:var(--petroleo);
  font:600 12.5px/1 var(--peso);letter-spacing:.02em;
}
.sec__num .kicker{font-size:12px;letter-spacing:.14em;color:var(--ardosia)}
.placa--escuro .sec__num{background:color-mix(in srgb,var(--gelo) 7%,transparent);border-color:color-mix(in srgb,var(--gelo) 20%,transparent);box-shadow:none}
.placa--escuro .sec__num .kicker,.ia .sec__num .kicker{color:var(--gelo)}
.ia .folio{color:var(--petroleo)}
.placa .sec__titulo,.placa .sec__titulo.direita{max-width:22ch}
.tom{color:var(--tom)}
.placa--escuro .tom{color:var(--dim)}

/* ---------- topo ---------- */
.topo{padding:18px 0 14px}

/* ---------- abertura ---------- */
.placa--abre{
  padding-block:clamp(34px,4.6vw,72px) clamp(40px,5vw,84px);
  background:
    radial-gradient(50% 65% at 100% 0%,color-mix(in srgb,var(--vivido) 30%,transparent),transparent 64%),
    radial-gradient(45% 60% at 0% 0%,color-mix(in srgb,var(--gelo) 100%,transparent),transparent 72%),
    radial-gradient(55% 55% at 72% 100%,color-mix(in srgb,var(--azul) 34%,transparent),transparent 70%),
    linear-gradient(180deg,var(--branco),var(--gelo-claro));
}
.placa--abre::after{
  content:"";position:absolute;z-index:-1;pointer-events:none;
  width:min(620px,60vw);aspect-ratio:1;border-radius:50%;left:-14%;bottom:-40%;
  background:radial-gradient(circle,color-mix(in srgb,var(--vivido) 16%,transparent),transparent 66%);
}
.mov-ready .placa--abre::after{animation:pl-deriva 16s ease-in-out infinite alternate}
.abre .g{align-items:center;row-gap:40px}
.abre__mensagem{grid-column:1/7}
.abre__palco{grid-column:7/13;min-width:0}
.abre .d1{font-size:clamp(38px,4.7vw,70px)}

.selo{
  display:inline-flex;align-items:center;gap:10px;margin:0 0 22px;
  padding:7px 14px 7px 10px;border-radius:999px;
  background:color-mix(in srgb,var(--branco) 78%,transparent);border:1px solid color-mix(in srgb,var(--azul) 42%,transparent);
  box-shadow:0 8px 20px -14px color-mix(in srgb,var(--petroleo) 30%,transparent);
  font:600 12px/1.3 var(--corpo);letter-spacing:.12em;text-transform:uppercase;color:var(--ardosia);
}
.selo__ponto{flex:none;width:8px;height:8px;border-radius:50%;background:var(--vivido);box-shadow:0 0 0 4px color-mix(in srgb,var(--vivido) 18%,transparent)}
.mov-ready .selo__ponto{animation:pl-pulso 2.4s ease-in-out infinite}

.abre .abre__vantagens{border-top:0;padding-top:0;margin-top:30px;gap:10px}
.abre__vantagens li{
  display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;
  background:color-mix(in srgb,var(--branco) 72%,transparent);border:1px solid var(--linha);font-size:14px;
}
.abre__vantagens li::before{margin-right:0;font-weight:700}

/* Palco: a tela Início inclinada, com três avisos flutuando em profundidades diferentes. */
.palco{position:relative;margin:0;perspective:1800px}
.palco__cena{position:relative;padding:36px 0 50px 26px}
.abre__palco{margin-right:calc(-1 * clamp(0px,2.4vw,40px))}
.janela{
  position:relative;font-size:clamp(9.5px,.86vw,12.5px);line-height:1.45;color:var(--ardosia);
  background:var(--branco);border-radius:18px;overflow:hidden;border:1px solid color-mix(in srgb,var(--gelo) 95%,transparent);
  box-shadow:0 2px 6px color-mix(in srgb,var(--petroleo) 5%,transparent),0 44px 80px -40px color-mix(in srgb,var(--petroleo) 48%,transparent),0 0 0 8px color-mix(in srgb,var(--branco) 50%,transparent);
  transform:perspective(1800px) rotateY(-10deg) rotateX(6deg) rotateZ(.6deg) translate3d(calc(var(--px,0) * -10px),calc(var(--py,0) * -8px),0);
  transform-origin:70% 50%;transition:transform .9s var(--curva);
}
.palco:hover .janela{transform:perspective(1800px) rotateY(-5deg) rotateX(3deg) rotateZ(0deg) translate3d(calc(var(--px,0) * -10px),calc(var(--py,0) * -8px),0)}
.janela__barra{
  display:flex;align-items:center;gap:6px;padding:.8em 1em;
  background:linear-gradient(180deg,var(--offwhite),color-mix(in srgb,var(--linha) 50%,var(--offwhite)));border-bottom:1px solid var(--linha);
}
.janela__barra i{flex:none;width:.75em;height:.75em;border-radius:50%;background:var(--trilho)}
.janela__url{
  min-width:0;margin-left:.8em;padding:.2em .9em;border-radius:999px;background:var(--branco);border:1px solid var(--linha);
  color:var(--cinza);font-size:.95em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.janela__app{display:grid;grid-template-columns:3.4em minmax(0,1fr)}
.rail{background:linear-gradient(180deg,var(--petroleo),var(--petroleo-fundo))}

.inicio{min-width:0;background:var(--offwhite);padding:1.2em 1.3em 1.4em}
.inicio__cab{display:flex;justify-content:space-between;align-items:baseline;gap:1em;margin-bottom:1em}
.inicio__titulo{font-family:var(--display);font-size:1.75em;line-height:1.1;color:var(--petroleo)}
.inicio__data{color:var(--cinza);white-space:nowrap}
.kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7em}
.kpi{
  display:flex;flex-direction:column;gap:.2em;min-width:0;padding:.85em .9em;
  background:var(--branco);border:1px solid var(--linha);border-radius:.9em;
  box-shadow:0 1px 2px color-mix(in srgb,var(--petroleo) 3%,transparent),0 8px 18px -14px color-mix(in srgb,var(--petroleo) 22%,transparent);
}
.kpi__rot{color:var(--cinza);font-size:.92em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kpi__valor{font-family:var(--peso);font-weight:600;font-size:1.75em;line-height:1.1;letter-spacing:-.01em;color:var(--petroleo);white-space:nowrap}
.kpi__meta{color:var(--azul-fundo);font-size:.9em}
.kpi__trilho{display:block;height:.42em;margin-top:.45em;border-radius:1em;background:var(--gelo-100);overflow:hidden}
.kpi__trilho i{display:block;width:75%;height:100%;border-radius:inherit;background:var(--marca);transform-origin:left}
.kpi--escuro{background:linear-gradient(160deg,var(--petroleo),var(--petroleo-luz));border-color:transparent}
.kpi--escuro .kpi__rot{color:var(--dim)}
.kpi--escuro .kpi__valor{color:var(--branco)}
.kpi--escuro .kpi__meta{color:var(--azul)}
.inicio__grade{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:.7em;margin-top:.7em}
.cartao{display:flex;flex-direction:column;gap:.6em;min-width:0;padding:.9em;background:var(--branco);border:1px solid var(--linha);border-radius:.9em}
.cartao__tit{font-family:var(--peso);font-weight:600;font-size:.86em;letter-spacing:.08em;text-transform:uppercase;color:var(--cinza)}
.proximos{display:flex;flex-direction:column}
.proximo{display:grid;grid-template-columns:3em minmax(0,1fr) auto;align-items:center;gap:.6em;padding:.45em 0;border-top:1px solid var(--linha)}
.proximo__hora{color:var(--cinza);font-variant-numeric:tabular-nums}
.proximo__pac{min-width:0}
.proximo__pac b{display:block;font-weight:600;color:var(--petroleo);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.proximo__pac small{display:block;font-size:.92em;color:var(--cinza)}
.barras{display:flex;align-items:flex-end;gap:.5em;height:6.5em;padding-top:.4em}
.barras i{flex:1;height:var(--h);border-radius:.4em .4em .15em .15em;background:linear-gradient(180deg,var(--azul),var(--gelo));transform-origin:bottom}
.barras i:nth-child(4){background:linear-gradient(180deg,var(--vivido),var(--azul))}
.barras__eixo{display:flex;justify-content:space-between;font-size:.85em;color:var(--cinza)}

.flutua{
  position:absolute;z-index:2;display:flex;align-items:center;gap:.7em;
  padding:.65em 1.05em .65em .65em;border-radius:16px;
  background:color-mix(in srgb,var(--branco) 90%,transparent);border:1px solid color-mix(in srgb,var(--branco) 95%,transparent);
  -webkit-backdrop-filter:blur(12px) saturate(1.2);backdrop-filter:blur(12px) saturate(1.2);
  box-shadow:0 1px 2px color-mix(in srgb,var(--petroleo) 5%,transparent),0 26px 46px -22px color-mix(in srgb,var(--petroleo) 45%,transparent);
  font-size:13px;line-height:1.3;white-space:nowrap;
  transform:translate3d(calc(var(--px,0) * var(--prof,16px)),calc(var(--py,0) * var(--prof,16px)),0);
  transition:transform .6s var(--curva);
}
.flutua__ic{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:10px;background:var(--gelo-100);color:var(--azul-fundo)}
.flutua__ic--luz{background:var(--marca);color:var(--petroleo)}
.flutua__txt b{display:block;font-weight:600;color:var(--petroleo)}
.flutua__txt small{display:block;font-size:12px;color:var(--cinza)}
.flutua--a{top:0;left:0;--prof:14px}
.flutua--b{bottom:26%;right:-4px;--prof:26px}
.flutua--c{bottom:10px;left:14%;--prof:18px}
.mov-ready .flutua{animation:pl-flutuar 7s ease-in-out infinite}
.mov-ready .flutua--b{animation-delay:-2.3s}
.mov-ready .flutua--c{animation-delay:-4.6s}
.palco__legenda{margin:0 0 0 26px;font-size:12.5px;color:var(--cinza)}

.pl-visivel .kpi__trilho i{animation:pl-largura 2.2s .3s var(--curva) both}
.pl-visivel .barras i{animation:pl-crescer 1.4s var(--curva) both}
.pl-visivel .barras i:nth-child(2){animation-delay:.08s}
.pl-visivel .barras i:nth-child(3){animation-delay:.16s}
.pl-visivel .barras i:nth-child(4){animation-delay:.24s}
.pl-visivel .barras i:nth-child(5){animation-delay:.32s}

/* ---------- faixa ---------- */
.mov-faixa{
  position:relative;
  width:calc(100% - 2 * var(--pl-margem));max-width:var(--pl-largura);
  margin:0 auto var(--pl-espaco);border:0;border-radius:999px;
  background:
    radial-gradient(40% 140% at 50% 0%,color-mix(in srgb,var(--vivido) 30%,transparent),transparent 70%),
    linear-gradient(90deg,var(--petroleo),var(--petroleo-fundo) 50%,var(--petroleo));
  box-shadow:0 22px 40px -26px color-mix(in srgb,var(--petroleo) 60%,transparent);
}
.mov-faixa::before,.mov-faixa::after{content:"";position:absolute;top:0;bottom:0;z-index:1;width:clamp(40px,8vw,120px);pointer-events:none}
.mov-faixa::before{left:0;background:linear-gradient(90deg,var(--petroleo),transparent)}
.mov-faixa::after{right:0;background:linear-gradient(270deg,var(--petroleo),transparent)}

/* ---------- inclinação pelo ponteiro (blocos.js) ----------
 * As variáveis são escritas pelo script em tempo de execução. O valor de repouso fica declarado aqui,
 * no escopo de quem as lê: é isso que o teste de tokens (design-system/tokens-consumidos) exige para
 * não confundir estas variáveis com token do design system que não existe. */
[data-tilt]{--rx:0deg;--ry:0deg;--mx:50%;--my:0%}
.palco{--px:0;--py:0}
.barras i,.vis-fin__barras i,.fin-par i{--h:50%}
.vis-ind__barra i{--w:50%}
.bento__card,.ganho,.plano,.adic,.seg__card,.passo{
  transform:perspective(1100px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));
  transition:transform .7s var(--curva),box-shadow .5s var(--curva),background-color .4s,border-color .4s;
}
.bento__card::after,.ganho::after,.plano::after,.adic::after,.seg__card::after,.passo::after{
  content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),color-mix(in srgb,var(--gelo) 55%,transparent),transparent 55%);
  opacity:0;transition:opacity .4s;
}
[data-tilt].inclinado{transition:transform .14s linear,box-shadow .5s var(--curva),background-color .4s,border-color .4s;box-shadow:var(--sombra-cartao-alta)}
[data-tilt].inclinado::after{opacity:1}

/* ---------- 01 plataforma: grade de recursos ---------- */
.bento{
  grid-column:1/13;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));
  gap:clamp(12px,1.4vw,20px);margin-top:clamp(30px,3.8vw,56px);
}
.bento__card{
  grid-column:span 6;position:relative;isolation:isolate;overflow:hidden;
  display:flex;flex-direction:column;min-width:0;
  padding:clamp(22px,2.3vw,34px);border-radius:26px;
  background:var(--branco);border:1px solid var(--linha);box-shadow:var(--sombra-cartao);
}
.bento__card:nth-child(1),.bento__card:nth-child(4),.bento__card:nth-child(5){grid-column:span 7}
.bento__card:nth-child(2),.bento__card:nth-child(3),.bento__card:nth-child(6){grid-column:span 5}
.bento__ic{
  display:grid;place-items:center;width:46px;height:46px;border-radius:14px;
  background:var(--branco);border:1px solid var(--linha);color:var(--azul-fundo);
  box-shadow:0 8px 18px -12px color-mix(in srgb,var(--petroleo) 35%,transparent);
}
.bento__ic .ic{width:22px;height:22px}
.bento__nome{margin-top:20px;font-family:var(--display);font-size:clamp(21px,1.9vw,26px);line-height:1.2;color:var(--petroleo)}
.bento__texto{margin-top:10px;max-width:46ch;font-size:16px;line-height:1.6;color:var(--cinza)}
.bento__visual{display:block;margin-top:auto;padding-top:26px}

.bento__card--gelo{background:linear-gradient(160deg,var(--gelo-claro) 0%,var(--branco) 72%);border-color:var(--borda-azul)}
.bento__card--luz{background:linear-gradient(150deg,var(--gelo-claro) 0%,var(--gelo-medio) 55%,color-mix(in srgb,var(--azul) 20%,var(--gelo)) 100%);border-color:var(--borda-azul)}
.bento__card--luz .bento__texto{color:var(--cinza-gelo)}
.bento__card--escuro{
  background:radial-gradient(80% 60% at 100% 0%,color-mix(in srgb,var(--vivido) 26%,transparent),transparent 60%),linear-gradient(160deg,var(--petroleo),var(--petroleo-fundo));
  border-color:transparent;
}
.bento__card--escuro .bento__nome{color:var(--branco)}
.bento__card--escuro .bento__texto{color:var(--apoio-escuro)}
.bento__card--escuro .bento__ic{background:color-mix(in srgb,var(--gelo) 8%,transparent);border-color:color-mix(in srgb,var(--gelo) 16%,transparent);color:var(--gelo);box-shadow:none}
.bento__card--escuro::after{background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),color-mix(in srgb,var(--azul) 20%,transparent),transparent 55%)}

.chip{
  display:inline-flex;align-items:center;padding:3px 9px;border-radius:999px;white-space:nowrap;
  background:var(--branco);border:1px solid var(--linha);font-size:12px;font-weight:600;color:var(--ardosia);
}
.chip--marca{background:var(--gelo);border-color:transparent;color:var(--petroleo)}
.av{
  display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:50%;
  background:var(--gelo);color:var(--petroleo);font:600 12px/1 var(--peso);letter-spacing:.02em;
}
.av--2{background:var(--petroleo);color:var(--gelo)}
.av--3{background:var(--marca);color:var(--petroleo)}

/* agenda */
.vis-agenda__dias,.vis-agenda__grade{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.vis-agenda__dias{margin-bottom:8px;text-align:center;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--cinza)}
.vis-agenda__grade{height:130px}
.vis-agenda__col{display:flex;flex-direction:column;gap:6px;padding:6px;border-radius:12px;background:color-mix(in srgb,var(--branco) 85%,transparent);border:1px solid var(--borda-azul)}
.vis-agenda__col i{flex:1.4;border-radius:7px;background:var(--branco);border:1px solid var(--borda-azul);border-left:3px solid var(--azul)}
.vis-agenda__col i.baixo{flex:.9}
.vis-agenda__col i.c2{border-left-color:var(--vivido);background:var(--gelo-claro)}
.vis-agenda__col i.c3{border-left-color:var(--petroleo);background:var(--gelo-claro)}
.vis-agenda__col i.livre{background:transparent;border:1px dashed color-mix(in srgb,var(--azul) 40%,var(--branco))}
.vis-agenda__col i.bloqueio{background:repeating-linear-gradient(135deg,var(--offwhite) 0 5px,var(--branco) 5px 10px);border:1px solid var(--linha);border-left:3px solid var(--trilho)}
.vis-agenda__col:nth-child(2){--c:1}
.vis-agenda__col:nth-child(3){--c:2}
.vis-agenda__col:nth-child(4){--c:3}
.vis-agenda__col:nth-child(5){--c:4}
.vis-agenda__col i:nth-child(2){--l:1}
.vis-agenda__col i:nth-child(3){--l:2}
.mov-ready .vis-agenda__col i:not(.livre):not(.bloqueio){animation:pl-realce 7.5s ease-in-out infinite;animation-delay:calc(var(--c,0) * 1.1s + var(--l,0) * .5s)}

/* histórico */
.vis-hist{position:relative;display:flex;flex-direction:column;gap:10px;padding-left:24px}
.vis-hist::before{content:"";position:absolute;left:7px;top:14px;bottom:14px;width:2px;border-radius:2px;background:linear-gradient(180deg,var(--vivido),var(--borda-azul))}
.vis-hist__item{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 12px;border-radius:14px;background:var(--offwhite);border:1px solid var(--linha)}
.vis-hist__item i{position:absolute;left:-23px;top:50%;width:14px;height:14px;margin-top:-7px;border-radius:50%;background:var(--branco);border:3px solid var(--azul)}
.vis-hist__item:first-child{background:var(--branco);box-shadow:0 12px 24px -20px color-mix(in srgb,var(--petroleo) 40%,transparent)}
.vis-hist__item:first-child i{border-color:var(--vivido);box-shadow:0 0 0 4px color-mix(in srgb,var(--vivido) 15%,transparent)}
.vis-hist__data{min-width:48px;font-size:12.5px;font-weight:600;color:var(--petroleo)}
.mov-ready .vis-hist__item:first-child i{animation:pl-pulso 2.4s ease-in-out infinite}

/* financeiro */
.vis-fin{position:relative;height:132px}
.vis-fin__barras{position:absolute;inset:0;display:flex;align-items:flex-end;gap:10px}
.vis-fin__barras i{flex:1;height:var(--h);border-radius:8px 8px 3px 3px;background:linear-gradient(180deg,color-mix(in srgb,var(--azul) 70%,transparent),color-mix(in srgb,var(--azul) 10%,transparent));transform-origin:bottom}
.vis-fin__barras i:nth-child(6){background:linear-gradient(180deg,var(--vivido),color-mix(in srgb,var(--vivido) 14%,transparent))}
.vis-fin__linha{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.vis-fin__linha path{fill:none;stroke:var(--gelo);stroke-width:2;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:0}
.pl-visivel .vis-fin__barras i{animation:pl-crescer 1.4s var(--curva) both}
.pl-visivel .vis-fin__barras i:nth-child(2){animation-delay:.07s}
.pl-visivel .vis-fin__barras i:nth-child(3){animation-delay:.14s}
.pl-visivel .vis-fin__barras i:nth-child(4){animation-delay:.21s}
.pl-visivel .vis-fin__barras i:nth-child(5){animation-delay:.28s}
.pl-visivel .vis-fin__barras i:nth-child(6){animation-delay:.35s}
.pl-visivel .vis-fin__barras i:nth-child(7){animation-delay:.42s}
.pl-visivel .vis-fin__linha path{animation:pl-tracar 2.2s .5s var(--curva) both}

/* relacionamento */
.vis-rel{display:flex;flex-direction:column;gap:10px}
.vis-rel__linha{
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;
  padding:12px 14px;border-radius:16px;background:var(--branco);border:1px solid var(--linha);
  box-shadow:0 12px 26px -22px color-mix(in srgb,var(--petroleo) 40%,transparent);
}
.vis-rel__linha:nth-child(2){margin-left:clamp(0px,3vw,28px)}
.vis-rel__txt{min-width:0}
.vis-rel__txt b{display:block;font-size:14px;font-weight:600;color:var(--petroleo);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vis-rel__txt small{display:block;font-size:12.5px;color:var(--cinza)}
.vis-rel__sino{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--gelo-100);color:var(--azul-fundo)}
.vis-rel__sino .ic{transform-origin:50% 15%}
.mov-ready .vis-rel__sino .ic{animation:pl-sino 4.5s ease-in-out infinite}

/* equipe */
.vis-eq{display:flex;flex-direction:column;gap:8px}
.vis-eq__pessoa{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:9px 12px;border-radius:14px;background:var(--offwhite);border:1px solid var(--linha)}
.vis-eq__txt{min-width:0}
.vis-eq__txt b{display:block;font-size:14px;font-weight:600;color:var(--petroleo)}
.vis-eq__txt small{display:block;font-size:12.5px;color:var(--cinza);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sw-mini{position:relative;flex:none;width:36px;height:20px;border-radius:999px;background:var(--trilho)}
.sw-mini i{position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:var(--branco);box-shadow:0 1px 3px color-mix(in srgb,var(--petroleo) 25%,transparent)}
.sw-mini.ligado{background:var(--azul)}
.sw-mini.ligado i{transform:translateX(16px)}
.mov-ready .sw-mini--anima{animation:pl-sw-fundo 5s ease-in-out infinite}
.mov-ready .sw-mini--anima i{animation:pl-sw-bola 5s ease-in-out infinite}

/* indicadores */
.vis-ind{
  display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:22px;
  padding:16px;border-radius:18px;background:color-mix(in srgb,var(--branco) 74%,transparent);border:1px solid color-mix(in srgb,var(--branco) 95%,transparent);
}
.vis-ind__rosca{position:relative;width:104px;height:104px}
.vis-ind__rosca svg{width:100%;height:100%;transform:rotate(-90deg)}
.vis-ind__rosca circle{fill:none;stroke-width:8}
.vis-ind__rosca .trilho{stroke:var(--borda-azul)}
.vis-ind__rosca .valor{stroke:var(--vivido);stroke-linecap:round;stroke-dasharray:75 100}
.vis-ind__pct{position:absolute;inset:0;display:grid;place-content:center;text-align:center;font:600 22px/1 var(--peso);color:var(--petroleo)}
.vis-ind__pct small{display:block;margin-top:4px;font:500 12px/1 var(--corpo);color:var(--cinza)}
.vis-ind__origem{display:flex;flex-direction:column;gap:8px;min-width:0}
.vis-ind__rot{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ardosia)}
.vis-ind__barra{display:grid;grid-template-columns:minmax(0,7.2em) minmax(0,1fr);align-items:center;gap:10px;font-size:13px;color:var(--ardosia)}
.vis-ind__barra i{display:block;width:var(--w);height:8px;border-radius:999px;background:linear-gradient(90deg,var(--azul),var(--vivido));transform-origin:left}
.pl-visivel .vis-ind__rosca .valor{animation:pl-rosca 2s .3s var(--curva) both}
.pl-visivel .vis-ind__barra i{animation:pl-largura 1.6s .4s var(--curva) both}

/* ---------- tour pelas telas ---------- */
.tour{
  grid-column:1/13;position:relative;isolation:isolate;overflow:hidden;
  margin-top:clamp(40px,5vw,76px);padding:clamp(18px,2.6vw,40px);border-radius:32px;
  background:
    radial-gradient(60% 70% at 100% 0%,color-mix(in srgb,var(--vivido) 14%,transparent),transparent 60%),
    radial-gradient(50% 60% at 0% 100%,color-mix(in srgb,var(--azul) 22%,transparent),transparent 70%),
    linear-gradient(180deg,var(--gelo-claro),var(--gelo-medio));
  border:1px solid var(--borda-azul);
}
.tour__cab{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 28px}
.tour__cab > div:first-child{min-width:0}
.tour__kicker{font:400 clamp(24px,2.4vw,32px)/1.15 var(--display);color:var(--petroleo)}
.tour__sub{margin-top:6px;font-size:15.5px;color:var(--cinza)}
.tour__abas{
  position:relative;display:flex;gap:4px;max-width:100%;padding:5px;border-radius:999px;
  background:color-mix(in srgb,var(--branco) 78%,transparent);border:1px solid color-mix(in srgb,var(--azul) 35%,transparent);
  box-shadow:0 10px 24px -18px color-mix(in srgb,var(--petroleo) 35%,transparent);
  overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
.tour__abas::-webkit-scrollbar{display:none}
.tour__abas button{
  position:relative;flex:none;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;
  border:0;border-radius:999px;background:transparent;cursor:pointer;white-space:nowrap;overflow:hidden;
  font:600 14.5px/1 var(--corpo);color:var(--ardosia);
  transition:background-color .3s,color .3s,box-shadow .3s;
}
.tour__abas button:hover{background:color-mix(in srgb,var(--gelo) 55%,transparent)}
.tour__abas button[aria-selected="true"]{background:var(--petroleo);color:var(--branco);box-shadow:0 8px 18px -10px color-mix(in srgb,var(--petroleo) 60%,transparent)}
.tour__abas button:focus-visible{outline-offset:-4px}
.tour__abas .ic{width:18px;height:18px}
.tour__progresso{position:absolute;left:16px;right:16px;bottom:5px;height:2px;border-radius:2px;overflow:hidden;opacity:0}
.tour__progresso::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--azul),var(--vivido));transform:scaleX(0);transform-origin:left}
.tour--auto .tour__abas button[aria-selected="true"] .tour__progresso{opacity:1;background:color-mix(in srgb,var(--gelo) 18%,transparent)}
.tour--auto .tour__abas button[aria-selected="true"] .tour__progresso::after{animation:pl-progresso 7s linear forwards}
.tour:hover .tour__progresso::after,.tour:focus-within .tour__progresso::after{animation-play-state:paused}

.tour__tela{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);align-items:center;gap:clamp(22px,3.4vw,56px);margin-top:clamp(40px,5vw,64px)}
.tour__cab + .tour__tela,.tour--ativo .tour__tela{margin-top:clamp(22px,2.6vw,36px)}
.tour__titulo{font:400 clamp(22px,2vw,28px)/1.2 var(--display);color:var(--petroleo)}
.tour__texto p{margin-top:12px;font-size:16px;line-height:1.6;color:var(--ardosia)}
.tour__pontos{display:flex;flex-direction:column;gap:10px;margin-top:18px}
.tour__pontos li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;align-items:start;font-size:15px;line-height:1.5;color:var(--ardosia)}
.tour__pontos li::before{
  content:"";width:22px;height:22px;border-radius:50%;
  background:var(--branco) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232F6E8C' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.2 4.2L19 7'/%3E%3C/svg%3E") center/12px no-repeat;
  box-shadow:0 0 0 1px var(--borda-azul);
}
.tour__moldura{
  position:relative;min-width:0;font-size:12px;border-radius:18px;overflow:hidden;background:var(--branco);
  border:1px solid color-mix(in srgb,var(--gelo) 95%,transparent);
  box-shadow:0 2px 6px color-mix(in srgb,var(--petroleo) 5%,transparent),0 44px 70px -44px color-mix(in srgb,var(--petroleo) 50%,transparent),0 0 0 7px color-mix(in srgb,var(--branco) 55%,transparent);
  transform:perspective(2000px) rotateY(-5deg) rotateX(2deg);transform-origin:0% 50%;
  transition:transform .9s var(--curva);
}
.tour__moldura:hover{transform:perspective(2000px) rotateY(0deg) rotateX(0deg)}
.tour__moldura .mock{border:0;border-radius:0;box-shadow:none}
.tour__legenda{margin-top:clamp(20px,2.4vw,30px)}

.mock-grade{display:grid;gap:1em}
@media (min-width:820px){.mock-grade{grid-template-columns:minmax(0,1fr) minmax(15em,.22fr)}}

/* prontuário */
.evos{display:flex;flex-direction:column;gap:.7em;min-width:0}
.evo{display:flex;flex-direction:column;gap:.45em;padding:.8em .9em;background:var(--branco);border:1px solid var(--linha);border-radius:.7em}
.evo--atual{border-color:color-mix(in srgb,var(--azul) 40%,var(--branco));box-shadow:0 0 0 3px color-mix(in srgb,var(--gelo) 55%,transparent)}
.evo__data{display:flex;align-items:center;gap:.5em;font-weight:600;color:var(--petroleo)}
.evo__data i{flex:none;width:.6em;height:.6em;border-radius:50%;background:var(--azul)}
.evo--atual .evo__data i{background:var(--vivido)}
.vitais{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.4em}
.vitais span{display:flex;flex-direction:column;padding:.35em .55em;border-radius:.45em;background:var(--offwhite);border:1px solid var(--linha);font-weight:600;color:var(--petroleo);white-space:nowrap}
.vitais small{font-size:.85em;font-weight:500;color:var(--cinza)}
.evo__campo{display:grid;grid-template-columns:1.6em minmax(0,1fr);gap:.55em;align-items:start;color:var(--ardosia)}
.evo__campo b{display:grid;place-items:center;width:1.6em;height:1.6em;border-radius:.35em;background:var(--gelo);color:var(--petroleo);font-family:var(--display);font-weight:400}
.evo__resumo{color:var(--cinza)}
.evo .chips{margin:.1em 0 0}
.pl-ativa .evo--atual .evo__campo{animation:pl-subir .7s var(--curva) both}
.pl-ativa .evo--atual .evo__campo:nth-of-type(2){animation-delay:.12s}
.pl-ativa .evo--atual .evo__campo:nth-of-type(3){animation-delay:.24s}
.pl-ativa .evo--atual .evo__campo:nth-of-type(4){animation-delay:.36s}

/* financeiro */
.fin-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.6em;margin-bottom:.9em}
.fin-kpi{display:flex;flex-direction:column;gap:.15em;min-width:0;padding:.7em .8em;background:var(--branco);border:1px solid var(--linha);border-radius:.7em}
.fin-kpi small{color:var(--cinza)}
.fin-kpi b{font-family:var(--peso);font-weight:600;font-size:1.3em;color:var(--petroleo);white-space:nowrap}
.fin-kpi--escuro{background:linear-gradient(160deg,var(--petroleo),var(--petroleo-luz));border-color:transparent}
.fin-kpi--escuro small{color:var(--dim)}
.fin-kpi--escuro b{color:var(--branco)}
.fin-grafico{display:flex;flex-direction:column;gap:.7em;min-width:0;padding:.9em;background:var(--branco);border:1px solid var(--linha);border-radius:.7em}
.fin-grafico__tit{font-weight:600;color:var(--petroleo)}
.fin-barras{display:flex;align-items:stretch;gap:.9em;height:12em;padding-top:.5em}
.fin-mes{flex:1;display:flex;flex-direction:column;align-items:center;gap:.4em;min-width:0}
.fin-par{flex:1;width:100%;display:flex;align-items:flex-end;justify-content:center;gap:.25em;border-bottom:1px solid var(--linha)}
.fin-par i{width:38%;max-width:1.6em;height:var(--h);border-radius:.35em .35em .1em .1em;transform-origin:bottom}
.fin-par i.r{background:linear-gradient(180deg,var(--vivido),var(--azul))}
.fin-par i.d{background:var(--trilho)}
.fin-mes em{font-style:normal;font-size:.88em;color:var(--cinza)}
.fin-legenda{display:flex;gap:1.2em;color:var(--cinza)}
.fin-legenda span{display:inline-flex;align-items:center;gap:.4em}
.fin-legenda i{width:.7em;height:.7em;border-radius:.2em}
.fin-legenda i.r{background:var(--vivido)}
.fin-legenda i.d{background:var(--trilho)}
.pl-ativa .fin-par i{animation:pl-crescer 1.2s var(--curva) both}
.pl-ativa .fin-mes:nth-child(2) i{animation-delay:.06s}
.pl-ativa .fin-mes:nth-child(3) i{animation-delay:.12s}
.pl-ativa .fin-mes:nth-child(4) i{animation-delay:.18s}
.pl-ativa .fin-mes:nth-child(5) i{animation-delay:.24s}
.pl-ativa .fin-mes:nth-child(6) i{animation-delay:.3s}

/* teleconsulta */
.sala{display:flex;flex-direction:column;gap:.7em;min-width:0}
.tele__video{position:relative;display:grid;place-items:center;aspect-ratio:16/10;border-radius:.9em;overflow:hidden;background:radial-gradient(60% 70% at 50% 40%,var(--petroleo-luz),var(--petroleo) 75%)}
.tele__avatar{position:relative;display:grid;place-items:center;width:7em;height:7em;border-radius:50%;background:linear-gradient(135deg,var(--gelo),var(--azul))}
.tele__avatar span{font:600 2.2em/1 var(--peso);color:var(--petroleo)}
.tele__avatar::before,.tele__avatar::after{content:"";position:absolute;inset:-.6em;border-radius:50%;border:2px solid color-mix(in srgb,var(--azul) 55%,transparent);opacity:0}
.mov-ready .tele__avatar::before{animation:pl-voz 2.4s ease-out infinite}
.mov-ready .tele__avatar::after{animation:pl-voz 2.4s 1.2s ease-out infinite}
.tele__nome,.tele__tempo{position:absolute;left:.8em;padding:.3em .75em;border-radius:999px;background:color-mix(in srgb,var(--petroleo) 55%,transparent);color:var(--branco);font-weight:600}
.tele__nome{bottom:.8em}
.tele__tempo{top:.8em;display:inline-flex;align-items:center;gap:.4em;font-variant-numeric:tabular-nums}
.tele__tempo i{width:.5em;height:.5em;border-radius:50%;background:var(--vivido)}
.tele__eu{position:absolute;right:.8em;bottom:.8em;display:flex;align-items:flex-end;width:24%;aspect-ratio:4/3;padding:.45em;border-radius:.6em;background:linear-gradient(160deg,var(--azul-fundo),var(--petroleo-luz));border:2px solid color-mix(in srgb,var(--branco) 60%,transparent);font-size:.85em;font-weight:600;color:var(--branco)}
.tele__controles{display:flex;justify-content:center;gap:.6em}
.tele__controles i{display:grid;place-items:center;width:2.6em;height:2.6em;border-radius:50%;background:var(--branco);border:1px solid var(--linha);color:var(--petroleo)}
.tele__controles i.tele__encerrar{width:3.6em;border-radius:999px;background:var(--petroleo);border-color:transparent;color:var(--branco)}
.tele__controles .ic{width:1.3em;height:1.3em}

/* termos */
.termo{display:grid;place-items:center;min-width:0;padding:1.2em;border-radius:.9em;background:linear-gradient(160deg,var(--gelo-claro),var(--gelo-medio))}
.termo__folha{display:flex;flex-direction:column;gap:.55em;width:min(100%,24em);padding:1.4em 1.4em 1.2em;background:var(--branco);border-radius:.6em;box-shadow:0 18px 36px -22px color-mix(in srgb,var(--petroleo) 45%,transparent);transform:rotate(-1.2deg)}
.termo__tit{margin-bottom:.3em;font-family:var(--display);font-size:1.2em;line-height:1.25;color:var(--petroleo)}
.termo__l{display:block;height:.5em;border-radius:.3em;background:var(--linha)}
.termo__l.curta{width:62%}
.termo__assina{display:flex;flex-direction:column;gap:.2em;margin-top:.8em;padding-top:.6em;border-top:1px dashed var(--trilho)}
.termo__assina svg{width:9em;height:2.4em;overflow:visible}
.termo__assina path{fill:none;stroke:var(--petroleo);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:100;stroke-dashoffset:0}
.termo__assina span{font-size:.9em;font-weight:600;color:var(--azul-fundo)}
.mov-ready .termo__assina path{animation:pl-assinar 6s ease-in-out infinite}
.etapas-caixa{min-width:0;padding:.9em;background:var(--branco);border:1px solid var(--linha);border-radius:.7em}
.etapas-caixa .tit{margin-bottom:.8em;font-family:var(--peso);font-weight:600;font-size:.92em;letter-spacing:.1em;text-transform:uppercase;color:var(--cinza)}
.etapas{position:relative;display:flex;flex-direction:column;gap:.9em;padding-left:1.9em}
.etapas::before{content:"";position:absolute;left:.5em;top:.5em;bottom:.6em;width:2px;background:linear-gradient(180deg,var(--azul),var(--vivido))}
.etapas li{position:relative;display:flex;flex-direction:column}
.etapas li::before{content:"";position:absolute;left:-1.9em;top:.1em;width:1.1em;height:1.1em;border-radius:50%;background:var(--branco);border:2px solid var(--azul)}
.etapas li.feito::before{
  border-color:var(--azul);
  background:var(--azul) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B1320' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.2 4.2L19 7'/%3E%3C/svg%3E") center/.7em no-repeat;
}
.etapas li.atual::before{background:var(--vivido);border-color:var(--branco);box-shadow:0 0 0 3px color-mix(in srgb,var(--vivido) 25%,transparent)}
.etapas b{font-weight:600;color:var(--petroleo)}
.etapas span{font-size:.92em;color:var(--cinza)}
.mov-ready .etapas li.atual::before{animation:pl-pulso 2s ease-in-out infinite}

/* ---------- 02 o que muda na rotina ---------- */
.ganhos__topo{
  grid-column:1/13;position:relative;isolation:isolate;overflow:hidden;
  display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);align-items:center;gap:clamp(20px,3vw,48px);
  min-height:clamp(300px,30vw,400px);padding:clamp(26px,3.6vw,56px);border-radius:30px;border:1px solid var(--borda-azul);
  background:
    radial-gradient(55% 80% at 0% 0%,color-mix(in srgb,var(--gelo) 95%,transparent),transparent 70%),
    radial-gradient(45% 75% at 100% 0%,color-mix(in srgb,var(--vivido) 26%,transparent),transparent 70%),
    radial-gradient(60% 60% at 60% 100%,color-mix(in srgb,var(--azul) 30%,transparent),transparent 70%),
    linear-gradient(180deg,var(--gelo-suave),var(--branco));
}
.ganhos__topo::after{content:"";position:absolute;inset:auto 0 0 0;z-index:-1;height:38%;background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--branco) 85%,transparent));pointer-events:none}
.ganhos__chamada{display:flex;flex-direction:column;align-items:flex-start;gap:18px;min-width:0}
.ganhos__chamada .d2{max-width:21ch}
.ganhos__chamada .apoio{max-width:44ch;font-size:17px}
.ganhos__leque{position:relative;height:clamp(240px,24vw,320px);perspective:1400px}
.leque{
  position:absolute;display:flex;flex-direction:column;gap:9px;padding:14px 16px;border-radius:18px;
  background:color-mix(in srgb,var(--branco) 92%,transparent);border:1px solid color-mix(in srgb,var(--branco) 95%,transparent);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  box-shadow:0 2px 4px color-mix(in srgb,var(--petroleo) 4%,transparent),0 30px 50px -26px color-mix(in srgb,var(--petroleo) 45%,transparent);font-size:13px;
}
.leque__tit{display:flex;align-items:center;gap:8px;font-weight:600;color:var(--petroleo)}
.leque__tit .ic{width:18px;height:18px;color:var(--azul-fundo)}
.leque--1{left:0;top:10%;width:min(300px,76%);transform:rotateY(14deg) rotateX(6deg) rotateZ(-3deg)}
.leque__linha{display:grid;grid-template-columns:3.2em minmax(0,1fr) auto;align-items:center;gap:8px;padding-top:8px;border-top:1px solid var(--linha)}
.leque__linha em{font-style:normal;color:var(--cinza);font-variant-numeric:tabular-nums}
.leque__linha b{font-weight:600;color:var(--petroleo);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.leque .tag{padding:.2em .6em;border-radius:.4em;font-size:12px}
.leque--2{right:0;top:0;width:min(220px,54%);transform:rotateY(-16deg) rotateX(4deg) rotateZ(3deg)}
.leque--2 .barras{height:84px}
.leque--3{right:8%;bottom:4%;flex-direction:row;align-items:center;gap:10px;white-space:nowrap;transform:rotateY(-10deg) rotateX(8deg) rotateZ(-2deg)}
.leque__check{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--marca);color:var(--petroleo)}
.mov-ready .leque{animation:pl-flutuar 8s ease-in-out infinite}
.mov-ready .leque--2{animation-delay:-2.6s}
.mov-ready .leque--3{animation-delay:-5.2s}

.ganhos__grade{grid-column:1/13;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:clamp(10px,1.4vw,20px)}
.ganho{
  position:relative;isolation:isolate;
  display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:". rot" "texto numero";
  column-gap:clamp(18px,2.4vw,40px);row-gap:10px;align-items:center;
  padding:clamp(26px,3vw,44px) clamp(18px,2.8vw,48px);border-radius:24px;
}
.ganho::before{content:"";position:absolute;left:clamp(18px,2.8vw,48px);right:clamp(18px,2.8vw,48px);bottom:0;height:1px;background:var(--linha)}
.ganho:nth-last-child(-n+2)::before{display:none}
.ganho.inclinado{background-color:var(--gelo-50)}
.ganho.inclinado::before{opacity:0}
.ganho__rot{grid-area:rot;justify-self:end;text-align:right;font:600 16px/1.3 var(--corpo);color:var(--petroleo)}
.ganho__texto{grid-area:texto;max-width:34ch;font-size:15.5px;line-height:1.55;color:var(--cinza)}
.ganho__numero{
  grid-area:numero;justify-self:end;margin:0;white-space:nowrap;
  font-family:var(--peso);font-weight:500;font-size:clamp(46px,5.2vw,78px);line-height:1;letter-spacing:-.035em;color:var(--petroleo);
}
.ganho__numero--palavra{font-size:clamp(34px,3.6vw,54px);letter-spacing:-.02em}
.ganho__valor{display:inline-block;text-align:right;font-variant-numeric:tabular-nums}
.ganho__seta{display:inline-block;margin:0 .1em;color:var(--azul-fundo)}
.ganho__depois,.ganho__revela{display:inline-block}
.ganho__seta,.ganho__depois,.ganho__revela{transition:opacity .7s var(--curva),transform .9s var(--curva)}
.ganho__unidade{margin-left:10px;font:600 15px/1 var(--corpo);letter-spacing:0;color:var(--cinza)}

.ganhos__rodape{grid-column:1/13;display:flex;flex-direction:column;align-items:center;gap:18px;margin-top:clamp(26px,3vw,44px);text-align:center}
.ganhos__rodape > p:first-child{max-width:54ch;font-size:16px;color:var(--cinza)}
.ganhos__acoes{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px 24px}

/* ---------- 03 preços ---------- */
.planos__quadro{gap:clamp(16px,2vw,28px)}
.plano{
  position:relative;isolation:isolate;overflow:hidden;
  border:1px solid var(--borda-azul);border-radius:28px;background:var(--branco);box-shadow:var(--sombra-cartao);
}
.plano::before{content:"";position:absolute;inset:0 0 auto 0;height:5px;background:linear-gradient(90deg,var(--gelo),var(--azul) 55%,var(--vivido))}
.plano--equipe{background:radial-gradient(70% 50% at 100% 0%,color-mix(in srgb,var(--vivido) 10%,transparent),transparent 70%),var(--branco)}
.plano__selo{border-color:transparent;background:var(--gelo-100);color:var(--azul-gelo)}
.plano__preco [data-preco-numero]{background:linear-gradient(135deg,var(--petroleo) 30%,var(--azul-fundo) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.planos__incluido,.planos__condicoes{
  padding:clamp(22px,2.4vw,32px);border:1px solid var(--borda-azul);border-radius:24px;
  background:color-mix(in srgb,var(--branco) 75%,transparent);
}
.fundador{
  position:relative;grid-column:1/13;max-width:none;
  padding:18px 24px 18px 28px;border-left:0;border-radius:20px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--gelo) 65%,transparent),color-mix(in srgb,var(--branco) 55%,transparent));
}
.fundador::before{content:"";position:absolute;left:12px;top:16px;bottom:16px;width:3px;border-radius:3px;background:linear-gradient(180deg,var(--azul),var(--vivido))}
.planos__rodape{justify-content:center}

/* ---------- 04 adicionais ---------- */
.adic__intro{grid-column:1/13;max-width:62ch;margin-top:clamp(20px,2.6vw,34px)}
.adicionais{grid-column:1/13;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.4vw,20px);margin-top:clamp(28px,3.4vw,48px)}
.adic{
  position:relative;isolation:isolate;display:flex;flex-direction:column;gap:10px;min-width:0;
  padding:clamp(20px,2vw,28px);border-radius:24px;border:1px solid var(--borda-azul);
  background:linear-gradient(170deg,var(--gelo-claro),var(--branco) 60%);box-shadow:var(--sombra-cartao);
}
.adic__topo{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.adic__ic{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:linear-gradient(160deg,var(--petroleo),var(--petroleo-luz));color:var(--gelo);box-shadow:0 10px 20px -12px color-mix(in srgb,var(--petroleo) 60%,transparent)}
.adic h3{font:600 18px/1.3 var(--peso);color:var(--petroleo)}
.adic p{font-size:15px;line-height:1.55;color:var(--cinza)}
.disponivel{
  display:inline-flex;align-items:center;gap:7px;padding:5px 11px;border-radius:999px;
  background:var(--gelo-100);color:var(--azul-gelo);font:600 12.5px/1.2 var(--corpo);letter-spacing:.02em;
}
.disponivel i{flex:none;width:7px;height:7px;border-radius:50%;background:var(--vivido);box-shadow:0 0 0 3px color-mix(in srgb,var(--vivido) 18%,transparent)}
.mov-ready .disponivel i{animation:pl-pulso 2.2s ease-in-out infinite}
.adic__nota{grid-column:1/13;display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px;margin-top:clamp(20px,2.4vw,30px);font-size:15.5px;color:var(--cinza)}

/* ---------- 05 IA ---------- */
.placa--escuro.ia .d2{color:var(--branco)}
.ia__controle{color:var(--dim)}
.ia .ia__lista li{
  row-gap:4px;margin-bottom:10px;padding:16px 18px;border:1px solid color-mix(in srgb,var(--gelo) 12%,transparent);border-radius:16px;
  background:color-mix(in srgb,var(--gelo) 4%,transparent);transition:background-color .3s,border-color .3s;
}
.ia .ia__lista li:last-child{margin-bottom:0;border-bottom:1px solid color-mix(in srgb,var(--gelo) 12%,transparent)}
.ia .ia__lista li:hover{background:color-mix(in srgb,var(--gelo) 8%,transparent);border-color:color-mix(in srgb,var(--azul) 36%,transparent)}
.ia__lista b{display:flex;align-items:center;gap:10px}
.ia__lista b::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:linear-gradient(135deg,var(--azul),var(--vivido));box-shadow:0 0 0 4px color-mix(in srgb,var(--vivido) 14%,transparent)}
.ia .figura{position:relative}
.ia .figura::before{content:"";position:absolute;z-index:-1;left:10%;right:10%;top:10%;bottom:20%;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--vivido) 28%,transparent),transparent);filter:blur(30px)}
.ia .figura .mock{border-color:color-mix(in srgb,var(--gelo) 22%,transparent);border-radius:18px;box-shadow:0 44px 80px -40px color-mix(in srgb,var(--petroleo) 65%,transparent),0 0 0 7px color-mix(in srgb,var(--gelo) 6%,transparent)}

/* ---------- 06 como começar ---------- */
.comecar__intro{grid-column:1/13;max-width:60ch;margin-top:clamp(18px,2.2vw,28px)}
.passos{grid-column:1/13;position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.6vw,22px);margin-top:clamp(28px,3.4vw,48px)}
.passos::before{content:"";position:absolute;left:8%;right:8%;top:clamp(46px,4.6vw,54px);height:2px;background:linear-gradient(90deg,var(--gelo),var(--azul),var(--vivido))}
.passo{
  position:relative;isolation:isolate;display:flex;flex-direction:column;gap:8px;min-width:0;
  padding:clamp(22px,2.2vw,30px);border-radius:24px;border:1px solid var(--borda-azul);background:var(--branco);box-shadow:var(--sombra-cartao);
}
.passo__n{display:grid;place-items:center;width:48px;height:48px;margin-bottom:10px;border-radius:16px;background:var(--marca);font:600 15px/1 var(--peso);color:var(--petroleo);box-shadow:0 10px 22px -12px color-mix(in srgb,var(--vivido) 70%,transparent)}
.passo__rot{font:600 18px/1.3 var(--peso);color:var(--petroleo)}
.passo__obs{font-size:15.5px;line-height:1.55;color:var(--cinza)}
.comecar__nota{grid-column:1/13;max-width:none;margin-top:22px;text-align:center}
.comecar .comecar__faixa{border-radius:28px;background:radial-gradient(60% 90% at 100% 0%,color-mix(in srgb,var(--vivido) 30%,transparent),transparent 60%),linear-gradient(160deg,var(--petroleo),var(--petroleo-fundo))}

/* ---------- 07 segurança ---------- */
.seg__intro{grid-column:1/13;max-width:62ch}
.seg__cards{grid-column:1/13;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.4vw,20px);margin-top:clamp(28px,3.4vw,48px)}
.seg__card{
  position:relative;isolation:isolate;display:flex;flex-direction:column;gap:10px;min-width:0;
  padding:clamp(22px,2.2vw,30px);border-radius:24px;border:1px solid var(--borda-azul);background:color-mix(in srgb,var(--branco) 88%,transparent);box-shadow:var(--sombra-cartao);
}
.seg__ic{display:grid;place-items:center;width:48px;height:48px;margin-bottom:8px;border-radius:15px;border:1px solid var(--borda-azul);background:linear-gradient(145deg,var(--gelo-claro),var(--gelo));color:var(--azul-fundo)}
.seg__ic .ic{width:22px;height:22px}
.seg__card h3{font:600 18px/1.35 var(--peso);color:var(--petroleo)}
.seg__card p{font-size:15.5px;line-height:1.58;color:var(--cinza)}

/* ---------- 08 perguntas ---------- */
.perguntas{border-top:0}
#perguntas .qa__grade{gap:12px clamp(12px,1.6vw,20px)}
#perguntas details.qa{
  padding:0;border:1px solid var(--linha);border-radius:20px;background:var(--offwhite);
  transition:background-color .3s,box-shadow .4s,border-color .3s;
}
#perguntas details.qa[open]{border-color:var(--borda-azul);background:var(--branco);box-shadow:var(--sombra-cartao)}
#perguntas .qa summary{
  list-style:none;display:grid;grid-template-columns:minmax(0,1fr) 32px;align-items:center;gap:16px;
  margin:0;padding:16px 20px 16px 22px;
}
#perguntas .qa summary::-webkit-details-marker{display:none}
#perguntas .qa summary::after{
  content:"";width:32px;height:32px;border-radius:50%;border:1px solid var(--linha);
  background:var(--branco) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230B1320' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center/14px no-repeat;
  transition:transform .45s var(--curva),background-color .3s;
}
#perguntas details.qa[open] summary::after{transform:rotate(45deg);background-color:var(--gelo)}
#perguntas details.qa p{padding:0 22px 20px}

/* ---------- demonstração e fecho ---------- */
.placa--demo .comecar__faixa{border:1px solid color-mix(in srgb,var(--gelo) 14%,transparent);border-radius:30px;background:color-mix(in srgb,var(--gelo) 4.5%,transparent)}
.rodape__frase{margin-bottom:8px;font-family:var(--display);font-size:clamp(18px,1.5vw,21px);line-height:1.35;color:var(--gelo)}
.placa--marca .fecho__lado p{color:var(--petroleo)}
.placa--marca .link.gelo{color:var(--petroleo);border-color:var(--petroleo)}
.placa--marca .fecho__acao a:focus-visible{outline-color:var(--petroleo)!important}

/* ---------- animações ---------- */
@keyframes pl-deriva{to{transform:translate(12%,-10%) scale(1.12)}}
@keyframes pl-pulso{50%{box-shadow:0 0 0 7px color-mix(in srgb,var(--vivido) 5%,transparent)}}
@keyframes pl-flutuar{50%{translate:0 -10px}}
@keyframes pl-crescer{from{transform:scaleY(.06)}}
@keyframes pl-largura{from{transform:scaleX(0)}}
@keyframes pl-tracar{from{stroke-dashoffset:100}}
@keyframes pl-rosca{from{stroke-dasharray:0 100}}
@keyframes pl-realce{0%,16%,100%{transform:none;box-shadow:none}6%,11%{transform:translateY(-2px);box-shadow:0 6px 14px -6px color-mix(in srgb,var(--vivido) 60%,transparent)}}
@keyframes pl-sino{0%,70%,100%{transform:rotate(0)}74%{transform:rotate(14deg)}78%{transform:rotate(-12deg)}82%{transform:rotate(8deg)}86%{transform:rotate(-4deg)}}
@keyframes pl-sw-fundo{0%,35%{background-color:var(--trilho)}45%,85%{background-color:var(--azul)}95%,100%{background-color:var(--trilho)}}
@keyframes pl-sw-bola{0%,35%{transform:none}45%,85%{transform:translateX(16px)}95%,100%{transform:none}}
@keyframes pl-progresso{to{transform:scaleX(1)}}
@keyframes pl-voz{0%{transform:scale(.92);opacity:.8}100%{transform:scale(1.45);opacity:0}}
@keyframes pl-assinar{0%{stroke-dashoffset:100;opacity:1}45%,88%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes pl-subir{from{opacity:0;transform:translateY(8px)}}

/* ---------- responsivo ---------- */
@media (max-width:1100px){
  .adicionais{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:1000px){
  .abre__mensagem,.abre__palco{grid-column:1/13}
  .abre__palco{max-width:720px}
  .bento .bento__card{grid-column:span 6}
  .tour__tela{grid-template-columns:minmax(0,1fr);align-content:start}
  .tour__moldura,.tour__moldura:hover{transform:none}
  .ganhos__topo{grid-template-columns:minmax(0,1fr)}
  .seg__cards{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:860px){
  .passos{grid-template-columns:minmax(0,1fr)}
  .passos::before{left:calc(clamp(22px,2.2vw,30px) + 23px);right:auto;top:40px;bottom:40px;width:2px;height:auto;background:linear-gradient(180deg,var(--gelo),var(--azul),var(--vivido))}
}
@media (max-width:760px){
  :root{
    --pl-margem:8px;
    --pl-espaco:18px;
    --sombra-placa:0 1px 0 color-mix(in srgb,var(--branco) 95%,transparent) inset,0 0 0 1px color-mix(in srgb,var(--petroleo) 5%,transparent),0 20px 40px -30px color-mix(in srgb,var(--petroleo) 30%,transparent),0 7px 0 -4px var(--folha-1),0 13px 0 -8px var(--folha-2);
    --sombra-placa-escura:0 1px 0 color-mix(in srgb,var(--gelo) 14%,transparent) inset,0 20px 40px -26px color-mix(in srgb,var(--petroleo) 50%,transparent),0 7px 0 -4px var(--folha-escura-1),0 13px 0 -8px var(--dim);
  }
  .placa{border-radius:24px}
  .placa.sec{padding-block:36px}
  .placa--abre{padding-block:24px 30px}
  .placa > .wrap{padding-left:18px;padding-right:18px}
  .mov-faixa{border-radius:20px}

  .palco__cena{padding:24px 0 44px}
  /* No telefone a janela não encolhe a letra: recorta, como os mocks do tour (ver "recorte, não
     miniatura" no index.html). Some a ocupação e o gráfico, e o resto fica legível em 12px. */
  .janela,.palco:hover .janela{font-size:12px;transform:perspective(1200px) rotateX(4deg) rotateY(-4deg)}
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kpis .kpi:nth-child(2){display:none}
  .janela__url{font-size:12px}
  .abre__palco{margin-right:0}
  .janela__app{grid-template-columns:minmax(0,1fr)}
  .inicio{padding:.9em}
  .inicio__grade{grid-template-columns:minmax(0,1fr)}
  .inicio__grade .cartao:last-child{display:none}
  .flutua{font-size:12px;padding:.5em .8em .5em .5em;border-radius:13px}
  .flutua__ic{width:28px;height:28px;border-radius:8px}
  .flutua__ic .ic{width:16px;height:16px}
  .flutua--a{top:0;left:0}
  .flutua--b{bottom:30%;right:0}
  .flutua--c{bottom:8px;left:4%}
  .palco__legenda{margin-left:0}

  .bento .bento__card{grid-column:1/-1;border-radius:22px}
  .vis-agenda__grade{height:110px;gap:6px}
  .vis-agenda__dias{gap:6px}
  .vis-ind{grid-template-columns:minmax(0,1fr);justify-items:center}
  .vis-ind__origem{width:100%}

  .tour{padding:16px;border-radius:24px}
  .tour__abas{border-radius:18px}
  .tour__abas button{padding:0 13px;font-size:14px}
  .tour__moldura{border-radius:14px}
  .tour__moldura .janela__barra{padding:.6em .8em}
  .vitais,.fin-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fin-barras{height:9em;gap:.5em}
  .tele__video{aspect-ratio:4/3}

  .ganhos__topo{padding:22px;border-radius:22px;min-height:0}
  .ganhos__leque{height:220px}
  .leque--1{width:82%}
  .leque--2{width:58%}
  .ganhos__grade{grid-template-columns:minmax(0,1fr)}
  .ganho{grid-template-areas:"rot rot" "texto numero";padding:22px 6px;border-radius:18px}
  .ganho::before{left:6px;right:6px}
  .ganho:nth-last-child(2)::before{display:block}
  .ganho__rot{justify-self:start;text-align:left}
  .ganho__numero{font-size:44px}
  .ganho__numero--palavra{font-size:32px}

  .plano{border-radius:22px}
  .adicionais,.seg__cards{grid-template-columns:minmax(0,1fr)}
  .adic,.seg__card,.passo{border-radius:20px}
  .ia .ia__lista li{padding:14px 16px}
  #perguntas .qa summary{padding:14px 16px;font-size:16px}
  #perguntas details.qa p{padding:0 16px 16px}
  .placa--demo .comecar__faixa{border-radius:22px}
}
@media (max-width:480px){
  .ganho{grid-template-columns:minmax(0,1fr);grid-template-areas:"rot" "numero" "texto";row-gap:8px}
  .ganho__numero{justify-self:start}
  .kpi__valor{font-size:1.45em}
}
@media (prefers-reduced-motion:reduce){
  .janela,.palco:hover .janela{transform:perspective(1800px) rotateY(-6deg) rotateX(4deg)}
  .ganho__seta,.ganho__depois,.ganho__revela{opacity:1!important;transform:none!important}
}