*{ box-sizing:border-box; }
body{
  background:var(--claro); color:var(--tinta);
  font-family:var(--corpo); font-size:16px; line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{ font-family:var(--display); margin:0; text-wrap:balance; }
p{ margin:0; }
a{ color:var(--sinal); text-decoration:none; }
a:hover{ color:#1D2E85; }
a:focus-visible{ outline:2px solid var(--sinal); outline-offset:3px; }

.faixa{ display:block; width:100%; box-sizing:border-box; }
.dentro{ max-width:1320px; margin:0 auto; padding:0 72px; }
@media (max-width:1000px){ .dentro{ padding:0 40px; } }
@media (max-width:640px){ .dentro{ padding:0 22px; } }

.rot{ font-family:var(--mono); font-size:11px; font-weight:600; letter-spacing:.18em; text-transform:uppercase; }
.mono{ font-family:var(--mono); font-variant-numeric:tabular-nums; }

/* ---------- cabeçalho do site ---------- */
.cabecalho{ position:sticky; top:0; z-index:20; width:100%; background:rgba(242,242,240,.92); backdrop-filter:blur(10px); border-bottom:1px solid var(--regua); }
.cabecalho .dentro{ height:78px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.cabecalho .lugar{ font-family:var(--mono); font-size:11px; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:var(--tinta3); white-space:nowrap; }
@media (max-width:640px){ .cabecalho .lugar{ display:none; } }
.cabecalho .nome{ font-family:var(--display); font-size:20px; font-weight:800; letter-spacing:-.014em; white-space:nowrap; }
.botao{ display:inline-block; white-space:nowrap; background:var(--sinal); color:#FFFFFF; font-family:var(--display); font-size:16px; font-weight:700; padding:16px 30px; border-radius:6px; }
.botao:hover{ background:var(--carvao); color:var(--claro); }

/* ---------- herói ---------- */
.heroi .dentro{ padding-top:104px; padding-bottom:112px; display:grid; grid-template-columns:minmax(0,1fr) 420px; gap:0 64px; align-items:center; }
@media (max-width:1080px){ .heroi .dentro{ grid-template-columns:1fr; gap:48px; padding-top:84px; padding-bottom:76px; } }
.heroi .lado{ display:flex; flex-direction:column; gap:36px; }
.heroi h1{ font-size:92px; font-weight:900; letter-spacing:-.045em; line-height:.94; margin-top:-8px; }
@media (max-width:1080px){ .heroi h1{ font-size:72px; } }
@media (max-width:640px){ .heroi h1{ font-size:46px; letter-spacing:-.04em; } }
.heroi h1 .virada{ color:var(--sinal); }
.heroi .chamada{ font-size:20px; line-height:1.45; color:var(--tinta2); max-width:42ch; }
.acoes{ display:flex; flex-wrap:wrap; align-items:center; gap:14px 28px; margin-top:-4px; }
.acoes .secundaria{ font-family:var(--display); font-size:16px; font-weight:700; color:var(--tinta); border-bottom:2px solid var(--sinal); padding-bottom:2px; }
.credencial{ font-size:13px; line-height:1.7; color:var(--tinta2); max-width:56ch; text-wrap:balance; }
@media (max-width:760px){ .credencial{ max-width:none; text-wrap:wrap; line-height:1.6; } }

.medidor{ background:var(--superficie); border:1px solid var(--regua); border-radius:16px; padding:30px 30px 26px; display:flex; flex-direction:column; gap:0; box-shadow:0 1px 2px rgba(14,15,18,.04), 0 16px 34px rgba(14,15,18,.05); }
@media (max-width:640px){ .medidor{ padding:24px 22px 22px; border-radius:12px; } }
.medidor .topo{ display:flex; justify-content:space-between; align-items:baseline; gap:16px; padding-bottom:16px; border-bottom:1px solid var(--regua); }
.medidor .topo .rot{ color:var(--tinta2); }
.leitura{ display:flex; flex-direction:column; gap:6px; padding:22px 0; border-bottom:1px solid var(--regua); }
.leitura .oque{ font-size:15px; color:var(--tinta2); }
.linha{ display:flex; align-items:baseline; gap:14px; flex-wrap:wrap; }
.antes{ font-family:var(--mono); font-size:17px; color:var(--tinta3); position:relative; font-variant-numeric:tabular-nums; }
.antes::after{ content:""; position:absolute; left:-3px; right:-3px; top:52%; height:2px; background:#A9ACB4; transform:scaleX(0); transform-origin:left; animation:risca .4s cubic-bezier(.4,0,.2,1) forwards; animation-delay:var(--d); }
.depois{ font-family:var(--mono); font-size:42px; font-weight:700; color:var(--sinal); line-height:.86; letter-spacing:-.045em; font-variant-numeric:tabular-nums; opacity:0; animation:surge .5s ease-out forwards; animation-delay:calc(var(--d) + .28s); }
@media (max-width:640px){ .depois{ font-size:30px; } }
.medidor .nota{ font-family:var(--mono); font-size:11.5px; line-height:1.6; color:var(--tinta3); padding-top:20px; }
@keyframes risca{ to{ transform:scaleX(1); } }
@keyframes surge{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion:reduce){ .antes::after{ animation:none; transform:scaleX(1); } .depois{ animation:none; opacity:1; } }

/* ---------- faixa escura ---------- */
.escura{ background:var(--carvao); color:var(--claro); }
.escura .dentro{ padding-top:104px; padding-bottom:104px; display:flex; flex-direction:column; gap:52px; }
@media (max-width:900px){ .escura .dentro{ padding-top:64px; padding-bottom:64px; gap:36px; } }
.cabeca-secao{ display:flex; flex-direction:column; align-items:flex-start; gap:18px; }
.cabeca-secao h2{ font-size:58px; font-weight:800; letter-spacing:-.038em; line-height:.94; max-width:18ch; }
@media (max-width:900px){ .cabeca-secao h2{ font-size:36px; } }
.cabeca-secao .apoio{ font-size:18px; line-height:1.5; max-width:58ch; }
.cabeca-secao .apoio.larga{ max-width:none; }
.escura .apoio{ color:var(--claro-esc); }

.etapas{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
@media (max-width:900px){ .etapas{ grid-template-columns:1fr; } }
.etapa{ background:var(--carvao2); border-radius:18px; padding:36px 32px 32px; display:flex; flex-direction:column; gap:16px; }
.etapa.destaque{ background:var(--sinal); color:#FFFFFF; }
.etapa .rot{ color:var(--sinal-cl); }
.etapa.destaque .rot{ color:#CBD3F6; }
.etapa h3{ font-size:28px; font-weight:800; letter-spacing:-.024em; }
.etapa p{ font-size:15.5px; line-height:1.55; color:var(--claro-esc); flex:1; }
.etapa.destaque p{ color:#CBD3F6; }
.etapa .preco{ font-family:var(--display); font-size:21px; font-weight:800; }

/* ---------- método ---------- */
.metodo .dentro{ padding-top:104px; padding-bottom:104px; display:flex; flex-direction:column; gap:52px; }
@media (max-width:900px){ .metodo .dentro{ padding-top:64px; padding-bottom:64px; gap:36px; } }
.metodo .apoio{ color:var(--tinta2); }
.fases{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
@media (max-width:1080px){ .fases{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:760px){ .fases{ grid-template-columns:1fr; } }
.fase{ background:var(--superficie); border-radius:16px; display:grid; grid-template-columns:52px 1fr; gap:0 16px; padding:28px 26px 26px 22px; align-items:start; }
.fase.larga{ grid-column:1 / -1; }
@media (max-width:1080px){ .fase.larga{ grid-column:auto; } }
.fase .num{ font-family:var(--mono); font-size:30px; font-weight:700; color:#C9CBD2; line-height:.9; }
.fase.viva .num{ color:var(--sinal); }
.fase h3{ font-size:22px; font-weight:800; letter-spacing:-.018em; }
.fase p{ font-size:15px; line-height:1.5; color:var(--tinta2); padding-top:5px; }
.fase .marca{ font-family:var(--mono); font-size:10px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:var(--sinal); display:block; padding-top:7px; }

/* ---------- trabalhos ---------- */
.trabalhos{ background:var(--superficie); }
.trabalhos .dentro{ padding-top:104px; padding-bottom:104px; display:flex; flex-direction:column; gap:52px; }
@media (max-width:900px){ .trabalhos .dentro{ padding-top:64px; padding-bottom:64px; gap:36px; } }
.trabalhos .apoio{ color:var(--tinta2); }
.cases{ display:flex; flex-direction:column; gap:20px; }
.case{ background:var(--claro); border-radius:20px; padding:40px; display:grid; grid-template-columns:minmax(0,1fr) 290px; gap:0 40px; align-items:stretch; }
.case .texto{ order:1; }
.case .numeros{ order:2; }
@media (max-width:1080px){ .case{ grid-template-columns:1fr; gap:28px; padding:28px 24px; } }
.case .numeros{ display:flex; flex-direction:column; align-items:stretch; text-align:center; gap:0; height:100%; }
.medida{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:5px; }
.medida .v{ font-family:var(--mono); font-size:44px; font-weight:700; color:var(--sinal); line-height:.9; letter-spacing:-.035em; }
.medida .d{ font-size:13.5px; line-height:1.4; color:var(--tinta2); min-height:2.8em; }
@media (max-width:1080px){ .case .numeros{ flex-direction:row; gap:28px; flex-wrap:wrap; padding-bottom:0; } .medida{ flex:1 1 150px; } .medida .v{ font-size:34px; } }
.case .texto{ display:flex; flex-direction:column; gap:18px; }
.case .texto .rot{ color:var(--sinal); }
.case h3 br.q{ display:inline; }
.case h3{ font-size:32px; font-weight:800; letter-spacing:-.026em; line-height:1.02; }
@media (max-width:640px){ .case h3{ font-size:24px; } .case h3 br.q{ display:none; } }
.beat{ display:flex; flex-direction:column; gap:3px; }
.beat .titulo{ font-family:var(--mono); font-size:10.5px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--tinta3); }
.beat p{ font-size:15.5px; line-height:1.55; color:var(--tinta2); max-width:62ch; }
.nota-case{ font-family:var(--mono); font-size:11.5px; line-height:1.6; color:var(--tinta3); max-width:62ch; }
.barras{ display:flex; flex-direction:column; gap:8px; padding-top:4px; }
.barra{ display:grid; grid-template-columns:minmax(96px,120px) minmax(0,1fr) 46px; align-items:center; gap:0 16px; max-width:460px; }
.barra .cat{ font-size:14px; color:var(--tinta2); }
.barra .trilho{ height:10px; background:var(--regua); border-radius:99px; overflow:hidden; }
.barra .cheio{ height:100%; background:var(--sinal); border-radius:99px; }
.barra .num{ font-family:var(--mono); font-size:13px; font-weight:700; text-align:right; font-variant-numeric:tabular-nums; }

/* ---------- ferramenta ---------- */
.ferramenta .dentro{ padding-top:104px; padding-bottom:104px; display:flex; flex-direction:column; gap:48px; }
@media (max-width:900px){ .ferramenta .dentro{ padding-top:64px; padding-bottom:64px; gap:34px; } }
.ferramenta .apoio{ color:var(--tinta2); }
.blocos{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
@media (max-width:900px){ .blocos{ grid-template-columns:1fr; } }
.bloco{ background:var(--superficie); border-radius:18px; padding:30px 28px; display:flex; flex-direction:column; gap:14px; }
.bloco h3{ font-size:22px; font-weight:800; letter-spacing:-.018em; }
.bloco .rot{ color:var(--sinal); }
.bloco .praque{ font-size:15px; line-height:1.5; color:var(--tinta2); }
.itens{ display:flex; flex-wrap:wrap; gap:7px; padding-top:4px; }
.item{ font-family:var(--mono); font-size:12.5px; color:var(--tinta2); background:var(--claro); border-radius:99px; padding:6px 13px; }
.item.forte{ background:var(--sinal-fraco); color:#1D2E85; font-weight:600; }

/* ---------- contato ---------- */
.contato{ background:var(--carvao); color:var(--claro); }
.contato .dentro{ padding-top:112px; padding-bottom:112px; display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,.6fr); gap:0 80px; align-items:center; }
@media (max-width:960px){ .contato .dentro{ grid-template-columns:1fr; gap:44px; padding-top:66px; padding-bottom:66px; } }
.contato .fala-lado{ display:flex; flex-direction:column; gap:30px; }
.contato h2{ font-size:76px; font-weight:900; letter-spacing:-.05em; line-height:.88; max-width:16ch; }
@media (max-width:900px){ .contato h2{ font-size:44px; } }
@media (max-width:640px){ .contato h2{ font-size:34px; } }
.perguntas{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px 44px; }
@media (max-width:820px){ .perguntas{ grid-template-columns:1fr; } }
.pergunta{ font-size:19px; line-height:1.35; padding-left:18px; border-left:3px solid var(--sinal-cl); }
@media (max-width:640px){ .pergunta{ font-size:16px; } }
.contato .fala{ font-size:18px; line-height:1.5; color:var(--claro-esc); max-width:52ch; }
.canais{ background:var(--carvao2); border:1px solid var(--regua-esc); border-radius:16px; padding:34px 30px; display:flex; flex-direction:column; align-items:center; text-align:center; gap:26px; }
@media (max-width:960px){ .canais{ flex-direction:row; flex-wrap:wrap; justify-content:center; gap:26px 44px; padding:28px 24px; } }
.canal{ display:flex; flex-direction:column; align-items:center; gap:5px; }
.canal .rot{ color:var(--tinta3); }
.canal .v{ font-family:var(--mono); font-size:18px; font-weight:600; color:var(--claro); }
.canal a.v{ color:var(--sinal-cl); }
