@font-face{font-family:'Space Grotesk';font-style:normal;font-weight:500 700;font-display:swap;src:url(fonts/SpaceGrotesk.woff2) format('woff2')}
@font-face{font-family:'Pinyon Script';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/PinyonScript.woff2) format('woff2')}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:400 600;font-display:swap;src:url(fonts/InstrumentSans.woff2) format('woff2')}
/* Só para o nome da marca, que segue o manual em marca/LEEME.txt. */
@font-face{font-family:'EB Garamond';font-style:italic;font-weight:400 500;font-display:swap;src:url(fonts/EBGaramond-italic.woff2) format('woff2')}

:root{
  --space:#05060B;
  --ivory:#F2EFE8;
  --stone:#C4C7CE;
  --stone-dim:#9498A2;
  --prata:#D9DCE2;
  --metal:linear-gradient(105deg,#F7F5EF 0%,#C2C6CE 42%,#F2F1EC 62%,#A3A8B2 100%);
  /* Palavra em destaque nos títulos. */
  --destaque:linear-gradient(100deg,#F09A52 0%,#E8873A 100%);
  --sun:#E8873A;
  --line:rgba(196,199,206,.18);
  --vidro:linear-gradient(135deg,rgba(255,255,255,.08),rgba(255,255,255,.015));
  --sombra-vidro:0 0 0 1px rgba(255,255,255,.1),0 25px 50px -12px rgba(0,0,0,.8),inset 0 1px 1px rgba(255,255,255,.16);
  --display:'Space Grotesk',ui-sans-serif,system-ui,sans-serif;
  --assinatura:'Pinyon Script',cursive;
  --campo:rgba(5,6,11,.7);
  --etiqueta:rgba(242,239,232,.1);
  --laterais:max(var(--pad),calc((100vw - var(--largura))/2 + var(--pad)));
  --sans:'Instrument Sans',ui-sans-serif,system-ui,sans-serif;
  --r-pilula:9999px;
  --r-md:1rem;
  --r-card:1.5rem;
  --r-lg:1.75rem;
  --r-xl:2.5rem;
  --curva:cubic-bezier(.4,0,.2,1);
  --largura:1350px;
  --pad:clamp(20px,4vw,48px);
  color-scheme:dark;
}

*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;scroll-padding-top:32px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--space);color:var(--ivory);font-family:var(--sans);font-size:clamp(16px,1.2vw,18px);line-height:1.6}
img,svg{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--display);font-weight:500;letter-spacing:-.03em;line-height:1;margin:0}
p{margin:0}
:focus-visible{outline:2px solid var(--prata);outline-offset:3px}

/* céu */
#ceu{position:fixed;inset:0;z-index:0;width:100%;height:100%;display:block;pointer-events:none}
.nebulosa{position:fixed;inset:0;z-index:0;pointer-events:none;background:radial-gradient(60% 50% at 85% 110%,rgba(150,165,200,.08),transparent 70%),radial-gradient(50% 40% at 10% -5%,rgba(110,130,200,.07),transparent 70%)}
main,.rodape,.topo{position:relative;z-index:1}

.pular{position:absolute;left:-999px;top:0;background:var(--prata);color:var(--space);padding:10px 16px;border-radius:var(--r-pilula);z-index:60}
.pular:focus{left:12px;top:12px}

/* cabeçalho */
.topo{display:flex;align-items:center;justify-content:space-between;gap:24px;max-width:var(--largura);margin:0 auto;padding:24px var(--pad) 32px}
.marca{display:inline-flex;align-items:center;gap:10px;font-family:'EB Garamond',Georgia,serif;font-style:italic;font-size:1.65rem;text-decoration:none;line-height:1}
.marca img{width:auto;height:38px}
.nav{display:flex;align-items:center;gap:clamp(18px,3vw,36px);font-family:var(--display);font-weight:700;font-size:.9rem}
.nav a{text-decoration:none;transition:opacity .15s}
.nav a:hover{opacity:.6}
.nav .btn:hover{opacity:1}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 28px;border:1px solid var(--prata);border-radius:var(--r-pilula);background:var(--metal);color:var(--space);font-family:var(--display);font-size:1rem;font-weight:700;text-decoration:none;cursor:pointer;transition:transform .15s var(--curva),background .2s,border-color .2s}
/* O Sol é o único ponto de cor da interface. */
.btn::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--sun);flex:none}
.btn:hover{transform:scale(1.03)}
.btn--linha{background:rgba(5,6,11,.4);color:var(--ivory);border-color:var(--line)}
.btn--linha::before,.nav .btn::before,.consent .btn::before{display:none}
.btn--linha:hover{border-color:var(--stone)}
.nav .btn{min-height:44px;padding:8px 22px;font-size:.9rem;white-space:nowrap}

/* blocos */
.bloco{max-width:var(--largura);margin:0 auto;padding:clamp(80px,9vw,120px) var(--pad)}
.rotulo{display:block;color:var(--stone);font-family:var(--display);font-size:.875rem;font-weight:700;letter-spacing:.025em;text-transform:uppercase;margin-bottom:16px}
.titulo{font-size:clamp(2.6rem,6.6vw,5.2rem);line-height:1.08;max-width:15ch}
/* Assinatura: só em palavras ou frases curtas, senão perde leitura. */
.titulo em,h1 em,.cena__titulo em{padding:.05em .14em .08em;margin:0 -.1em 0 -.12em;font-family:var(--assinatura);font-style:normal;font-weight:400;font-size:1.3em;letter-spacing:0;line-height:.9;background:var(--destaque);-webkit-background-clip:text;background-clip:text;-webkit-box-decoration-break:clone;box-decoration-break:clone;color:transparent}

/* Ritmo de cor: preto metálico (padrão), prata e Sol. */
.tema{position:relative;z-index:1;max-width:none;padding-left:var(--laterais);padding-right:var(--laterais);border-radius:var(--r-xl);color:var(--ivory)}
.tema-prata{--ivory:#0B0C14;--stone:#2F333C;--stone-dim:#454A55;--prata:#0B0C14;--space:#F2EFE8;--line:rgba(11,12,20,.18);--metal:linear-gradient(105deg,#0B0C14,#2B2F3A);--destaque:linear-gradient(100deg,#9A4310,#B4541A);--vidro:rgba(255,255,255,.42);--sombra-vidro:inset 0 1px 0 rgba(255,255,255,.65),0 14px 30px rgba(11,12,20,.14);--campo:rgba(255,255,255,.8);--etiqueta:rgba(11,12,20,.08);background:linear-gradient(115deg,#EEF0F3 0%,#C6CAD2 45%,#E4E6EB 65%,#B4B9C3 100%)}
.tema-sol{--ivory:#140A03;--stone:#2A1608;--stone-dim:#2A1608;--prata:#140A03;--space:#F2EFE8;--line:rgba(20,10,3,.25);--metal:linear-gradient(105deg,#0B0C14,#23262F);--destaque:linear-gradient(100deg,#140A03,#3A2110);--vidro:rgba(255,255,255,.2);--sombra-vidro:inset 0 1px 0 rgba(255,255,255,.35),0 14px 30px rgba(120,55,10,.2);--campo:rgba(255,255,255,.82);--etiqueta:rgba(20,10,3,.1);color:var(--ivory);background:linear-gradient(150deg,#F4A765 0%,#E8873A 50%,#D46F25 100%)}
.apoio{color:var(--stone);max-width:58ch;margin-top:24px;font-size:1.12em;font-weight:500;line-height:1.625}
.nota{color:var(--stone-dim);font-size:.85rem;margin-top:14px}

/* abertura */
.abertura{max-width:var(--largura);margin:0 auto;padding:clamp(8px,2vw,24px) var(--pad) 0;text-align:center}
h1{max-width:15ch;margin:0 auto;font-size:clamp(2.9rem,7.4vw,5.8rem);line-height:1.02;animation:subir .5s var(--curva) both}
.abertura .apoio{margin:28px auto 0;max-width:640px;animation:subir .7s var(--curva) both}
.acoes{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:32px;animation:subir .7s var(--curva) both}
.brilho{position:absolute;border-radius:50%;filter:blur(64px);pointer-events:none}
.brilho--a{top:-120px;left:-80px;width:288px;height:288px;background:#AEB7CC;opacity:.22}
.brilho--b{right:-100px;bottom:-140px;width:320px;height:320px;background:#F2EFE8;opacity:.12}

/* faixa */
.faixa{overflow:hidden;margin-top:64px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.faixa__trilho{display:flex;gap:14px;width:max-content;animation:faixa 52s linear infinite}
.faixa span{flex:none;padding:12px 24px;border:1px solid var(--line);border-radius:var(--r-pilula);background:rgba(5,6,11,.5);color:var(--stone);font-family:var(--display);font-weight:700;font-size:.95rem}

/* números */
.numeros{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:clamp(32px,5vw,56px)}
.numero{padding:clamp(20px,3vw,32px);border-radius:var(--r-card);background:var(--vidro);box-shadow:var(--sombra-vidro)}
.numero span{display:block;color:var(--stone);font-size:.95rem}
.numero b{display:block;font-family:var(--display);font-weight:600;letter-spacing:-.025em;font-size:clamp(3rem,8vw,6rem);line-height:1.05}

/* demonstração: o site toca como um vídeo */
.demo{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,4vw,56px);align-items:center;margin-top:clamp(32px,5vw,56px)}
.tela{overflow:hidden;border-radius:var(--r-card);background:#0B0C14;box-shadow:var(--sombra-vidro)}
.tela__barra{display:flex;align-items:center;gap:7px;padding:12px 16px;border-bottom:1px solid var(--line);font-size:.8rem;color:var(--stone-dim)}
.tela__barra i{width:10px;height:10px;border-radius:50%;background:rgba(196,199,206,.28)}
.tela__barra span{margin-left:10px;padding:2px 14px;border-radius:var(--r-pilula);background:rgba(242,239,232,.07)}
.tela__corpo{position:relative;height:440px;overflow:hidden}
.quadro-cena{position:absolute;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:20px}
.quadro-cena.ativa{display:flex}
.pausado .quadro-cena *{animation-play-state:paused!important}
.a{animation:aparecer .5s var(--curva) var(--d,0s) both}
.clique{animation:clicar .4s var(--curva) var(--d,0s) both}
.aviso-cena{padding:9px 16px;border-radius:var(--r-pilula);background:var(--sun);color:#140A03;font-weight:600;font-size:.85rem;text-align:center}
.anuncio{width:min(100%,300px);border-radius:var(--r-md);background:#15161F;overflow:hidden}
.anuncio__topo{display:flex;align-items:center;gap:10px;padding:10px 12px;font-size:.85rem}
.anuncio__topo i{width:30px;height:30px;border-radius:50%;background:var(--metal)}
.anuncio__topo b{display:block;line-height:1.2}
.anuncio__topo small{color:var(--stone-dim)}
.anuncio__img{display:grid;place-items:center;height:140px;background:linear-gradient(135deg,#2B2F3A,#14161F);color:var(--stone);font-family:var(--display)}
.anuncio__cta{margin:10px 12px 12px;padding:8px;border-radius:var(--r-pilula);background:var(--metal);color:var(--space);text-align:center;font-weight:600;font-size:.88rem}
.cursor{position:absolute;width:20px;height:20px;border-radius:50%;background:rgba(242,239,232,.9);box-shadow:0 0 0 6px rgba(242,239,232,.2)}
.cursor--anuncio{left:50%;top:50%;animation:cursor-anuncio 1.4s var(--curva) var(--d,0s) both}
.falso-form{display:grid;gap:9px;width:min(100%,340px);padding:18px;border-radius:var(--r-md);background:#15161F;font-size:.8rem;color:var(--stone-dim)}
.falso-form>b{color:var(--ivory);font-family:var(--display);font-size:1.1rem}
.falso-form label{display:grid;gap:3px}
.falso-form span{min-height:38px;padding:8px 16px;border:1px solid var(--line);border-radius:var(--r-pilula);color:var(--ivory);font-size:.9rem}
.falso-botao{padding:9px;border-radius:var(--r-pilula);background:var(--metal);color:var(--space);text-align:center;font-weight:600;font-size:.9rem}
.conversa{display:grid;gap:10px;width:min(100%,380px)}
.balao{justify-self:end;max-width:84%;padding:10px 14px;border-radius:1rem 1rem .25rem 1rem;background:#1F3A2D;font-size:.92rem}
.balao--eles{justify-self:start;border-radius:1rem 1rem 1rem .25rem;background:#20222C}
.quadro{position:relative;width:100%;height:190px}
.quadro__cols{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;height:100%}
.quadro__cols span{padding:10px 8px;border-radius:var(--r-md);background:rgba(242,239,232,.05);color:var(--stone-dim);font-family:var(--display);font-weight:700;font-size:.82rem;text-align:center}
.ficha{position:absolute;top:46px;left:var(--para);width:calc(25% - 6px);padding:10px;border-radius:.8rem;background:var(--metal);color:var(--space);font-size:.8rem;line-height:1.25;animation:mover .9s var(--curva) var(--d,0s) both}
.ficha b{display:block}
.ficha small{font-size:.68rem}
.valor{text-align:center}
.valor b{display:block;font-family:var(--display);font-size:2.6rem;line-height:1.1;color:var(--sun)}
.valor small{color:var(--stone)}
.retorno{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center;width:100%;max-width:440px}
.retorno__origem{padding:12px 16px;border-radius:var(--r-md);background:var(--sun);color:#140A03;font-weight:600;font-size:.9rem}
.retorno__destinos{display:grid;gap:8px}
.retorno__destinos div{padding:9px 14px;border-radius:var(--r-md);background:var(--vidro);box-shadow:var(--sombra-vidro);font-weight:600;font-size:.9rem}
.retorno__destinos small{display:block;color:var(--stone-dim);font-weight:400}
.publico{display:grid;grid-template-columns:repeat(10,16px);gap:8px}
.publico i{width:16px;height:16px;border-radius:50%;background:rgba(196,199,206,.2)}
.publico i.parecido{background:var(--sun);animation:acender .5s var(--curva) var(--d,0s) both}
.etapas{list-style:none;margin:0;padding:0}
.com-demo .etapa:not(.ativa){display:none}
.etapa{padding:12px 0}
.etapa__num{color:var(--stone-dim);font-family:var(--display);font-weight:700;font-size:.8rem;text-transform:uppercase;margin-bottom:10px}
.etapa h3{font-size:clamp(2rem,3.4vw,2.8rem);margin-bottom:20px}
.lados{display:grid;gap:12px}
.lados>div{padding:18px 20px;border:1px solid var(--line);border-radius:var(--r-card)}
.lados b{display:block;font-family:var(--display);font-size:.8rem;text-transform:uppercase;color:var(--stone-dim);margin-bottom:6px}
.lados p{color:var(--stone-dim)}
.lados .lados__nosso{background:var(--vidro);box-shadow:var(--sombra-vidro);border-color:transparent}
.lados__nosso b,.lados__nosso p{color:var(--ivory)}
.demo__controles{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr;gap:12px 20px;align-items:center}
.demo__tocar{min-width:104px;min-height:44px;padding:8px 20px;border:1px solid var(--stone-dim);border-radius:var(--r-pilula);background:transparent;color:var(--ivory);font-family:var(--display);font-weight:700;cursor:pointer}
.passos{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.passo{display:grid;gap:5px;padding:4px 0;border:0;background:none;color:var(--stone-dim);font:inherit;font-size:.82rem;text-align:left;cursor:pointer}
.passo.atual,.passo.feito{color:var(--ivory)}
.passo i{display:block;height:4px;border-radius:var(--r-pilula);overflow:hidden}
.passo__comum{background:var(--stone)}
.passo__comum--fora{background:repeating-linear-gradient(90deg,var(--line) 0 5px,transparent 5px 10px)}
.passo__nosso{background:var(--line)}
.passo__nosso u{display:block;height:100%;width:0;background:var(--sun)}
.passo.feito .passo__nosso u{width:100%}
.passos__legenda{grid-column:2;display:flex;gap:20px;color:var(--stone-dim);font-size:.8rem}
.passos__legenda span{display:inline-flex;align-items:center;gap:7px}
.passos__legenda i{width:18px;height:4px;border-radius:var(--r-pilula);background:var(--stone)}
.passos__legenda span+span i{background:var(--sun)}
@keyframes aparecer{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes clicar{0%{transform:scale(1)}50%{transform:scale(.94);filter:brightness(1.2)}100%{transform:scale(1)}}
@keyframes mover{from{left:var(--de)}to{left:var(--para)}}
@keyframes acender{from{background:rgba(196,199,206,.2)}to{background:var(--sun)}}
@keyframes cursor-anuncio{from{opacity:0;transform:translate(120px,160px)}to{opacity:1;transform:translate(10px,58px)}}

/* cena: o funil vira dado, e o dado volta para a campanha */
.cena{position:relative;max-width:var(--largura);margin:0 auto;padding:clamp(64px,8vw,96px) var(--pad)}
.cena__palco{position:relative;display:grid;place-items:center;gap:40px;perspective:1500px}
.cena__palco::before{content:'';position:absolute;inset:0;pointer-events:none;background-size:60px 60px;background-image:linear-gradient(to right,rgba(242,238,231,.05) 1px,transparent 1px),linear-gradient(rgba(242,238,231,.05) 1px,transparent 1px);-webkit-mask-image:radial-gradient(black 0%,transparent 70%);mask-image:radial-gradient(black 0%,transparent 70%)}
.cena__titulo{position:relative;text-align:center}
.cena__titulo h2{font-size:clamp(2.25rem,6vw,5.5rem);line-height:1.02}
.cena__titulo h2 span{display:block;color:var(--stone)}
.cena__cartao{position:relative;width:100%;max-width:1040px;padding:clamp(20px,3vw,40px);border-radius:var(--r-lg);background:rgba(10,11,18,.92);box-shadow:var(--sombra-vidro)}
.cena__nota{margin-top:20px;color:var(--stone-dim);font-size:.85rem;text-align:center}
.diagrama{position:relative;display:grid;grid-template-columns:1fr minmax(180px,.8fr) 1fr;gap:clamp(40px,7vw,96px);align-items:center}
.diagrama__linhas{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.diagrama__linhas path{fill:none;stroke:var(--sun);stroke-width:1.6;stroke-dasharray:6 7;animation:fluir 1.1s linear infinite}
.diagrama__lista,.servidor{position:relative;z-index:1}
.diagrama__linhas marker path{fill:var(--sun);stroke:none;stroke-dasharray:none;animation:none}
@keyframes fluir{to{stroke-dashoffset:-13}}
.diagrama__lista{display:grid;gap:12px;margin:0;padding:0;list-style:none}
.selo{padding:14px 18px;border-radius:var(--r-md);background:var(--vidro);box-shadow:var(--sombra-vidro);font-weight:500}
.selo small{display:block;color:var(--stone-dim);font-size:.78rem;font-family:var(--sans);font-weight:400}
.servidor{padding:28px 20px;border-radius:var(--r-card);background:linear-gradient(150deg,#F4A765,#E8873A 55%,#D46F25);color:#140A03;text-align:center;font-family:var(--display);font-weight:700;font-size:1.35rem;line-height:1.1}
.servidor small{display:block;margin-top:8px;font-family:var(--sans);font-weight:500;font-size:.8rem;line-height:1.3}
/* Com a cena presa, a seção vira a pista de rolagem e o palco fica fixo. */
.com-cena .cena{height:300vh;padding-top:0;padding-bottom:0}
.com-cena .cena__palco{position:sticky;top:0;height:100vh}
.com-cena .cena__titulo{position:absolute;top:50%;left:0;right:0;transform:translateY(-50%)}
.com-cena .cena__cartao{will-change:transform,opacity}

/* calculadora */
.calculadora{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:clamp(32px,5vw,56px);max-width:900px}
.resultado{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:900px;margin-top:16px}
.resultado>div{padding:clamp(20px,3vw,32px);border-radius:var(--r-card);background:var(--vidro);box-shadow:var(--sombra-vidro)}
.resultado span{display:block;color:var(--stone);font-size:.95rem}
.resultado b{display:block;font-family:var(--display);font-weight:600;letter-spacing:-.025em;font-size:clamp(2.2rem,6vw,4rem);line-height:1.15}

/* vídeo */
.video video{width:100%;max-width:1040px;margin-top:clamp(32px,5vw,56px);border-radius:var(--r-lg);box-shadow:var(--sombra-vidro);background:#000}

/* serviços: título preso e cards passando por cima */
.servicos__cabeca{display:flex;flex-direction:column;justify-content:center}
.servicos{display:grid;gap:clamp(16px,3vw,48px);margin-top:clamp(32px,5vw,56px)}
.servico{position:relative;overflow:hidden;padding:clamp(24px,3vw,36px);border-radius:var(--r-card);background:#0B0C14;box-shadow:var(--sombra-vidro);transition:transform .3s var(--curva)}
.servico:hover{transform:translateY(-4px)}
.servico h3{font-size:clamp(1.6rem,2.5vw,2rem);line-height:1.15;margin-bottom:12px}
.servico p{color:var(--stone)}
.brilho-mouse{position:absolute;inset:0;pointer-events:none;background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(196,199,206,.13) 0%,transparent 45%)}

/* segmentos */
.segmentos{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:clamp(32px,5vw,56px)}
.segmento{display:flex;flex-direction:column;gap:12px;padding:clamp(22px,3vw,30px);border-radius:var(--r-card);background:var(--vidro);box-shadow:var(--sombra-vidro);color:var(--ivory);text-decoration:none;transition:transform .3s var(--curva)}
a.segmento:hover{transform:translateY(-4px)}
.segmento h3{font-size:1.5rem;line-height:1.15}
.segmento p{color:var(--stone);flex:1}
.segmento span{color:var(--sun);font-family:var(--display);font-weight:700;font-size:.9rem}
.rodape__segmentos{display:flex;flex-wrap:wrap;gap:8px 24px;margin-bottom:24px}

/* casos */
.caso{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center;margin-top:clamp(24px,4vw,40px);padding:clamp(14px,2vw,20px);border-radius:var(--r-card);background:var(--vidro);box-shadow:var(--sombra-vidro)}
.caso>div{padding:clamp(10px,2vw,24px)}
.navegador{display:block;overflow:hidden;border-radius:1.1rem;background:#fff;box-shadow:0 14px 30px rgba(11,12,20,.25);color:#2F333C;text-decoration:none;transition:transform .3s var(--curva)}
.navegador:hover{transform:translateY(-4px)}
.navegador__barra{display:flex;align-items:center;gap:6px;padding:9px 12px;background:#E9EBEF}
.navegador__barra i{width:9px;height:9px;border-radius:50%;background:#B4B9C3}
.navegador__barra b{flex:1;margin-left:8px;padding:3px 14px;border-radius:var(--r-pilula);background:#fff;font:500 .76rem var(--sans);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.navegador img{display:block;width:100%;height:auto}
.outros__cabeca{margin-top:clamp(40px,6vw,64px)}
.outros__cabeca h3{font-size:clamp(1.8rem,3vw,2.6rem);line-height:1.05}
.outros__cabeca p{margin-top:10px;color:var(--stone)}
.caso__local{display:inline-block;padding:5px 12px;border-radius:var(--r-pilula);background:var(--etiqueta);color:var(--stone);font-family:var(--display);font-size:.72rem;font-weight:700;text-transform:uppercase;margin-bottom:14px}
.caso h3{font-size:clamp(1.8rem,3vw,2.6rem);line-height:1.05;margin-bottom:14px}
.caso__texto{color:var(--stone)}
.dados{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px 24px;margin:24px 0 0}
.dados dt{color:var(--stone);font-size:.88rem}
.dados dd{margin:0;font-family:var(--display);font-weight:600;letter-spacing:-.025em;font-size:1.7rem;line-height:1.2;white-space:nowrap}
.outros{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,3vw,24px);margin-top:clamp(16px,3vw,24px)}
.outros article{padding:12px 12px 20px;border-radius:var(--r-card);background:var(--vidro);box-shadow:var(--sombra-vidro)}
.outros .caso__local{margin:16px 8px 8px}
.outros .caso__texto{padding:0 8px}
.fluxo{list-style:none;margin:0;padding:clamp(10px,2vw,24px);counter-reset:fluxo}
.fluxo li{counter-increment:fluxo;display:flex;align-items:center;gap:14px;padding:11px 0;border-top:1px solid var(--line);font-family:var(--display);font-weight:700;font-size:1.1rem}
.fluxo li:first-child{border-top:0}
.fluxo li::before{content:counter(fluxo);flex:none;width:32px;height:32px;display:grid;place-items:center;border-radius:50%;background:var(--metal);color:var(--space);font-size:.82rem}

/* linha do tempo do método */
.linha{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;list-style:none;margin:clamp(40px,6vw,72px) 0 0;padding:0}
.linha::before,.linha::after{content:'';position:absolute;left:12.5%;right:12.5%;top:19px;height:2px;background:var(--line)}
.linha::after{background:var(--prata);transform:scaleX(0);transform-origin:left;transition:transform 1.4s ease-out}
.linha.visivel::after{transform:scaleX(1)}
.linha li{position:relative;z-index:1;text-align:center;opacity:0;transform:translateY(20px);transition:opacity .7s ease-out,transform .7s ease-out}
.linha li:nth-child(2){transition-delay:.2s}
.linha li:nth-child(3){transition-delay:.4s}
.linha li:nth-child(4){transition-delay:.6s}
.linha.visivel li{opacity:1;transform:none}
.linha__n{display:grid;place-items:center;width:40px;height:40px;margin:0 auto 18px;border-radius:50%;background:var(--metal);color:var(--space);font-family:var(--display);font-weight:700}
.linha h3{font-size:1.5rem;line-height:1.15;margin-bottom:8px}
.linha p{color:var(--stone);font-size:.95rem}

/* conceito */
.conceito{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:clamp(32px,6vw,96px);align-items:center}
.citacao{font-family:var(--display);font-weight:500;letter-spacing:-.025em;font-size:clamp(2rem,4.4vw,3.6rem);line-height:1.02;margin:0}

/* sobre */
.sobre{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:clamp(32px,6vw,96px);align-items:center}
.sobre__foto{position:relative}
.sobre__foto::before{content:'';position:absolute;inset:-20px;border-radius:50%;background:rgba(150,165,200,.16);filter:blur(64px)}
.sobre__foto img{position:relative;width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--r-lg);box-shadow:var(--sombra-vidro)}
.credenciais{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:28px 0 0}
.credenciais div{padding:16px 18px;border-radius:var(--r-md);background:var(--vidro);box-shadow:var(--sombra-vidro)}
.credenciais dd{margin:0;font-family:var(--display);font-weight:600;letter-spacing:-.025em;font-size:clamp(1.7rem,3vw,2.3rem);line-height:1.1}
.credenciais dt{color:var(--stone);font-size:.84rem;line-height:1.3;margin-top:4px}
.citacao--menor{font-size:clamp(1.3rem,2.2vw,1.7rem);line-height:1.15;margin-top:28px;max-width:30ch}

/* perguntas */
.perguntas{display:grid;gap:12px;max-width:768px;margin:clamp(32px,5vw,56px) auto 0}
.perguntas__cabeca{text-align:center}
.perguntas__cabeca .titulo{margin:0 auto}
.perguntas details{padding:16px 20px;border-radius:var(--r-md);background:var(--vidro);box-shadow:var(--sombra-vidro)}
.perguntas summary{display:flex;align-items:center;justify-content:space-between;gap:16px;list-style:none;cursor:pointer;font-family:var(--display);font-weight:700;font-size:1.08rem;line-height:1.25}
.perguntas summary::-webkit-details-marker{display:none}
.perguntas summary::after{content:'+';flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--metal);color:var(--space);font-size:1.2rem;transition:transform .3s}
.perguntas details[open] summary::after{transform:rotate(45deg)}
.perguntas details p{margin-top:12px;color:var(--stone)}

/* contato */
.contato__cartao{position:relative;overflow:hidden;max-width:1024px;margin:0 auto;padding:clamp(48px,7vw,80px) clamp(24px,5vw,48px);border-radius:2rem;text-align:center}
.contato__cartao>*{position:relative}
.contato__cartao>.brilho{position:absolute}
.contato__cartao .titulo{margin:0 auto;font-size:clamp(2.5rem,5.4vw,3.75rem)}
.contato__cartao .apoio{margin:20px auto 32px}

.form{display:grid;gap:18px}
.campo{display:grid;gap:7px}
.campo label{font-size:.92rem;font-weight:500;color:var(--stone)}
.campo input{width:100%;min-height:48px;padding:10px 20px;border:1px solid var(--line);border-radius:var(--r-pilula);background:var(--campo);color:var(--ivory);font:inherit}
.campo input:focus{outline:2px solid var(--prata);outline-offset:0;border-color:var(--prata)}
.campo.tem-erro input{border-color:var(--ivory)}
.erro{display:none;color:var(--ivory);font-size:.86rem;padding-left:20px}
.campo.tem-erro .erro{display:block}
.aviso{color:var(--stone-dim);font-size:.85rem;text-align:center}
.aviso a{color:var(--stone)}
.form .btn{width:100%}

/* janela do formulário */
.janela{width:min(480px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:clamp(26px,5vw,40px);border:0;border-radius:var(--r-lg);background:#0B0C14;box-shadow:var(--sombra-vidro);color:var(--ivory)}
.janela::backdrop{background:rgba(5,6,11,.85)}
.janela h2{font-size:2.2rem;padding-right:32px}
.janela .apoio{margin:10px 0 24px;font-size:1em}
.janela__fechar{position:absolute;top:12px;right:12px;width:44px;height:44px;border:0;border-radius:50%;background:none;color:var(--stone);font-size:1.7rem;line-height:1;cursor:pointer}
.janela__fechar:hover{color:var(--ivory)}

/* trilha: o sol percorre a analemma conforme a página desce */
/* botão flutuante do WhatsApp: abre o formulário */
.whats{position:fixed;right:clamp(14px,2vw,28px);bottom:clamp(14px,3vh,26px);z-index:21;display:grid;place-items:center;width:60px;height:60px;padding:0;border:0;border-radius:50%;background:#25D366;color:#fff;box-shadow:0 10px 28px rgba(0,0,0,.45);cursor:pointer;transition:transform .15s var(--curva)}
.whats:hover{transform:scale(1.07)}
.whats svg{width:30px;height:30px}
.trilha{position:fixed;right:clamp(8px,2vw,22px);bottom:calc(clamp(14px,3vh,26px) + 72px);z-index:20;padding:12px 14px;border-radius:var(--r-card);background:rgba(5,6,11,.8)}
#trilha{width:58px;height:116px;overflow:visible}
#trilha .ponto{fill:var(--stone-dim);cursor:pointer;transition:fill .3s}
#trilha .ponto.visto{fill:var(--ivory)}
#trilha .ponto:hover,#trilha .ponto:focus{fill:var(--prata);outline:none}

/* revelar ao rolar */
.revela{opacity:0;transition:opacity .7s var(--curva),transform .7s var(--curva)}
.revela--cima{transform:translateY(40px)}
.revela--esq{transform:translateX(-56px)}
.revela--dir{transform:translateX(56px)}
.revela.visivel{opacity:1;transform:none}

/* mascote: Mozart ao piano */
.mascote{position:fixed;left:clamp(4px,1.5vw,20px);bottom:0;z-index:19;width:132px;pointer-events:none}
.mascote__palco{position:relative;height:95px;overflow:hidden}
.piano,.moz svg{position:absolute;inset:0;width:132px;height:95px}
.moz{position:absolute;inset:0;transform:translateX(-70px);opacity:0;transition:transform 3.6s linear,opacity .4s}
.mascote.chegou .moz,.mascote.anda .moz{opacity:1}
.mascote.chegou .moz{transform:none}
.moz__sentado{display:none}
.mascote.sentado .moz__sentado{display:block}
.mascote.sentado .moz__pe{display:none}
.mascote.volta .moz__pe{transform:scaleX(-1);transform-origin:22px 50%}
.perna{transform-origin:0 120px}
.mascote.anda .perna--a{animation:passo .7s ease-in-out infinite alternate}
.mascote.anda .perna--b{animation:passo .7s ease-in-out infinite alternate-reverse}
.mascote.anda .moz__corpo{animation:balanco .35s ease-in-out infinite alternate}
.mascote.toca .moz__braco{animation:tocar .42s ease-in-out infinite alternate}
.mascote.toca .moz__cabeca{animation:cabeca 1.7s ease-in-out infinite alternate}
.nota-voa{opacity:0}
.mascote.toca .nota-voa{animation:nota 2.2s ease-out infinite}
.mascote.toca .nota-voa--b{animation-delay:1.1s}
.mascote__som{position:absolute;left:4px;bottom:98px;padding:4px 10px;border:1px solid var(--stone-dim);border-radius:var(--r-pilula);background:rgba(5,6,11,.88);color:var(--ivory);font:600 .66rem var(--sans);white-space:nowrap;cursor:pointer;pointer-events:auto}
.mascote__som:hover{border-color:var(--ivory)}
@keyframes passo{from{transform:rotate(-16deg)}to{transform:rotate(16deg)}}
@keyframes balanco{from{transform:translateY(0)}to{transform:translateY(-2px)}}
@keyframes tocar{from{transform:translateY(0)}to{transform:translateY(2.5px)}}
@keyframes cabeca{from{transform:translate(1px,84px) rotate(-2deg)}to{transform:translate(1px,84px) rotate(3deg)}}
@keyframes nota{0%{opacity:0;transform:translateY(8px)}25%{opacity:1}100%{opacity:0;transform:translateY(-22px)}}

/* rodapé */
.rodape{max-width:var(--largura);margin:0 auto;padding:48px var(--pad);color:var(--stone-dim);font-size:.9rem}
.rodape__topo{display:flex;flex-wrap:wrap;gap:12px 28px;margin-bottom:22px}
.rodape a{color:var(--stone)}
.rodape button{padding:0;border:0;background:none;color:var(--stone);font:inherit;text-decoration:underline;cursor:pointer}

/* páginas legais */
.legal{position:relative;z-index:1;max-width:760px;margin:0 auto;padding:clamp(32px,6vw,72px) 20px}
.legal h1{margin:0 0 12px;max-width:none;font-size:clamp(2.4rem,6vw,3.6rem);line-height:1}
.legal h2{font-size:1.6rem;line-height:1.15;margin:42px 0 12px}
.legal p,.legal ul{color:var(--stone);margin:0 0 14px}
.legal li{margin-bottom:7px}
.legal strong{color:var(--ivory);font-weight:600}
.legal table{width:100%;border-collapse:collapse;margin:0 0 16px;color:var(--stone);font-size:.95rem}
.legal th,.legal td{padding:11px 12px 11px 0;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.legal th{color:var(--ivory);font-weight:600}
.data{color:var(--stone-dim)}

/* consentimento */
.consent{position:fixed;left:16px;right:16px;bottom:16px;z-index:50;max-width:var(--largura);margin:0 auto;padding:20px 24px;border-radius:var(--r-card);background:rgba(11,12,20,.97);box-shadow:var(--sombra-vidro)}
.consent__corpo{display:flex;align-items:center;justify-content:space-between;gap:16px 32px;flex-wrap:wrap}
.consent p{color:var(--stone);max-width:68ch;font-size:.92rem}
.consent p a{color:var(--ivory)}
.consent__acoes{display:flex;flex-wrap:wrap;gap:10px}
.consent .btn{min-width:124px;min-height:44px;padding:8px 20px;background:transparent;color:var(--ivory);border-color:var(--stone)}
.consent__opcoes{display:grid;gap:12px;margin-top:18px;padding-top:18px;border-top:1px solid var(--line)}
.consent__opcoes label{display:flex;gap:12px;align-items:flex-start;color:var(--stone);font-size:.93rem}
.consent__opcoes input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--prata);flex:none}
.consent__opcoes strong{color:var(--ivory);font-weight:600}

@keyframes subir{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
@keyframes faixa{to{transform:translateX(-50%)}}

/* A partir de 1024 px: título preso e cards alternando por cima. */
@media (min-width:1024px){
  .servicos__cabeca{position:sticky;top:0;height:100vh}
  .servicos{display:flex;flex-direction:column;gap:22vh;margin-top:-100vh;padding-bottom:12vh}
  .servico{width:47%}
  .servico:nth-child(odd){margin-left:auto}
}
@media (max-width:1023px){
  .revela--esq,.revela--dir{transform:translateY(40px)}
}
@media (max-width:980px){
  .demo{grid-template-columns:1fr}
  .tela__corpo{height:470px}
  .caso,.conceito,.sobre{grid-template-columns:1fr}
  .segmentos{grid-template-columns:1fr 1fr}
  .conceito img{width:min(72%,300px)}
  /* Foto quadrada: sem altura fixa, aparece inteira e nada do rosto é cortado. */
  .sobre__foto{width:min(100%,340px);justify-self:center}
  .sobre__foto img{height:auto;aspect-ratio:1}
  .diagrama{grid-template-columns:1fr;gap:42px}
  .diagrama__linhas{display:none}
  /* Sem espaço para linhas laterais, as setas descem entre os blocos. */
  .servidor::before,.servidor::after{content:'↓';position:absolute;left:50%;transform:translateX(-50%);color:var(--sun);font-size:1.5rem;line-height:1}
  .servidor::before{top:-34px}
  .servidor::after{bottom:-34px}
  .linha{grid-template-columns:1fr 1fr;row-gap:36px}
  .linha::before,.linha::after{display:none}
}
@media (max-width:640px){
  .mascote{width:92px;left:2px}
  .mascote__palco{height:66px}
  .piano,.moz svg{width:92px;height:66px}
  .mascote__som{bottom:68px;left:2px;padding:3px 8px;font-size:.6rem}
  .nav a:not(.btn){display:none}
  .acoes .btn{width:100%}
  .outros,.calculadora,.segmentos,.credenciais{grid-template-columns:1fr}
  .passo span{display:none}
  .demo__controles{grid-template-columns:1fr}
  .passos__legenda{grid-column:1}
  .ficha{padding:7px;font-size:.68rem}
  .ficha small{display:none}
  .numeros{gap:8px}
  .numero{padding:16px 12px;border-radius:var(--r-md)}
  .numero span{font-size:.82rem}
  .numero b{font-size:clamp(2.4rem,12vw,3rem)}
  .resultado{gap:8px}
  .resultado>div{padding:16px 12px;border-radius:var(--r-md)}
  .resultado b{font-size:clamp(1.7rem,8vw,2.2rem)}
  #trilha{width:32px;height:64px}
  .trilha{padding:6px 8px;opacity:.7;right:14px;bottom:82px}
  .whats{width:54px;height:54px}
  .consent{left:8px;right:8px;bottom:8px;padding:16px}
  .consent .btn{flex:1 1 40%;min-width:0}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition:none!important;animation:none!important}
  .revela,.linha li{opacity:1;transform:none}
  .cursor{display:none}
  .moz{transition:none}
  .linha::after{transform:none}
}