/* Calculadora da Reforma — estilo único da página e das três páginas legais.
   Identidade AUDITLocOne: branco dominante, verde só como destaque, Poppins. */

:root{
  --verde:#1ca800;
  --verde-2:#72a133;
  --verde-claro:#eef8ea;
  --tinta:#1a1a1a;
  --tinta-2:#4a4a4a;
  --cinza:#9b9b9b;
  --cinza-2:#c9ccc6;
  --fundo:#ffffff;
  --superficie:#f5f7f4;
  --borda:#e4e8e1;
  --raio:16px;
  --iva:#341f97;
  --iva-claro:#ecebf7;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fundo);color:var(--tinta);
     font:400 16px/1.55 Poppins,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
img{max-width:100%;display:block}
h1,h2,h3{margin:0;line-height:1.15;letter-spacing:-.02em}
p{margin:0}
a{color:var(--verde)}
button,input{font:inherit;color:inherit}

.caixa{width:100%;max-width:1120px;margin-inline:auto;padding-inline:20px}

.rotulo{font-size:.78rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--verde-2)}

/* ── topo ─────────────────────────────────────────── */
.topo{border-bottom:1px solid var(--borda)}
.topo__linha{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-block:14px}
.topo__marcas{display:flex;align-items:center;gap:16px;min-width:0}
.topo__logo{width:130px;height:auto}
.topo__logo-iva{width:172px;height:auto}
.topo__traco{width:1px;height:32px;background:var(--borda)}

/* IVA Locadora: parceira. O roxo dela só aparece nos pontos que levam ao Instagram. */
.ig{display:inline-flex;align-items:center;gap:6px;font-size:.85rem;font-weight:600;color:var(--iva);
    text-decoration:none;padding:6px 12px;border:1.5px solid var(--iva-claro);border-radius:99px;transition:background .15s}
.ig:hover{background:var(--iva-claro)}
.ig svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2}
.ig .ig__ponto{fill:currentColor;stroke:none}

/* ── herói ────────────────────────────────────────── */
.heroi{padding-block:clamp(36px,6vw,64px) clamp(24px,4vw,40px);text-align:center}
.heroi h1{font-size:clamp(1.9rem,4.3vw,2.9rem);font-weight:800;max-width:34ch;margin:12px auto 14px}
.heroi h1 span{color:var(--verde)}
.heroi__sub{max-width:520px;margin-inline:auto;color:var(--tinta-2);font-size:1.02rem}
/* ── painéis ──────────────────────────────────────── */
.calc{display:grid;grid-template-columns:minmax(0,370px) minmax(0,1fr);gap:20px;align-items:start}
/* min-width:0 é obrigatório aqui: item de grid nasce com min-width:auto, e aí a
   tabela do passo a passo (min-width 480px) estica a coluna, alarga a página e o
   celular abre com zoom pra fora — foi o que aconteceu em 17/09/2026. */
.painel{background:var(--fundo);border:1px solid var(--borda);border-radius:var(--raio);
        padding:clamp(20px,3vw,28px);min-width:0}
.entradas{background:var(--superficie);position:sticky;top:16px}
.painel__titulo{display:flex;align-items:center;gap:10px;font-size:1.05rem;font-weight:700;margin-bottom:22px}
.painel__titulo b{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;
                  background:var(--verde);color:#fff;font-size:.8rem}

/* ── campos ───────────────────────────────────────── */
.campo{display:block;margin-bottom:22px}
.campo:last-child{margin-bottom:0}
.campo__nome{display:flex;justify-content:space-between;align-items:baseline;gap:8px;
             font-size:.88rem;font-weight:600;margin-bottom:8px}
.campo__nome output{font-weight:700;color:var(--verde);font-size:1rem;font-variant-numeric:tabular-nums}
.campo__dica{display:block;margin-top:8px;font-size:.78rem;color:var(--tinta-2)}

.dinheiro{display:flex;align-items:center;gap:8px;background:var(--fundo);border:1.5px solid var(--borda);
          border-radius:12px;padding:0 14px;transition:border-color .15s}
.dinheiro:focus-within{border-color:var(--verde)}
.dinheiro span{font-weight:600;color:var(--cinza)}
.dinheiro.pct input{font-size:1.15rem;padding:9px 0}
.dinheiro input{border:0;outline:0;background:none;width:100%;padding:12px 0;font-size:1.5rem;
                font-weight:700;font-variant-numeric:tabular-nums}

/* as duas margens lado a lado, sob um título só */
.par{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.par__nome{display:flex;justify-content:space-between;align-items:baseline;gap:6px;font-size:.8rem;font-weight:500;color:var(--tinta-2)}
.par__nome output{font-weight:700;color:var(--verde);font-size:.95rem;font-variant-numeric:tabular-nums}

/* "Seus números" fica grudado na lateral enquanto o resultado rola: tem que
   caber inteiro numa tela de notebook (768 px), senão o fim some. Pedido de
   30/09/2026 — antes media 903 px. */
.entradas .painel__titulo{margin-bottom:14px}
.entradas .campo{margin-bottom:14px}
.entradas .campo__nome{margin-bottom:5px}
.entradas .campo__dica{margin-top:3px;font-size:.74rem;line-height:1.35}
.entradas .dinheiro input{padding:7px 0;font-size:1.3rem}
.entradas .dinheiro.pct input{padding:5px 0;font-size:1.05rem}
.entradas input[type=range]{height:24px}

.form .campo input{width:100%;border:1.5px solid var(--borda);border-radius:12px;padding:11px 14px;
                   background:var(--fundo);outline:0;transition:border-color .15s}
.form .campo input:focus{border-color:var(--verde)}
.form .campo{margin-bottom:14px}

.nota{display:flex;gap:10px;align-items:flex-start;margin-bottom:22px;padding:12px 14px;
      background:var(--fundo);border:1px solid var(--borda);border-radius:12px;font-size:.8rem;line-height:1.5;color:var(--tinta-2)}
.nota svg{flex:none;width:18px;height:18px;margin-top:1px;stroke:var(--verde);stroke-width:2.4;fill:none;stroke-linecap:round}
.nota b{display:block;color:var(--tinta);font-weight:600;margin-bottom:2px}

input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:28px;background:none;cursor:pointer;margin:0}
input[type=range]::-webkit-slider-runnable-track{height:6px;border-radius:6px;
  background:linear-gradient(var(--verde),var(--verde)) 0/var(--p,50%) 100% no-repeat,var(--cinza-2)}
input[type=range]::-moz-range-track{height:6px;border-radius:6px;background:var(--cinza-2)}
input[type=range]::-moz-range-progress{height:6px;border-radius:6px;background:var(--verde)}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;margin-top:-8px;border-radius:50%;
  background:#fff;border:3px solid var(--verde)}
input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#fff;border:3px solid var(--verde)}
input[type=range]:focus-visible{outline:2px solid var(--verde);outline-offset:4px;border-radius:6px}

/* ── cenários ─────────────────────────────────────── */
.cenarios{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cenario{display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;cursor:pointer;
         background:var(--fundo);border:1.5px solid var(--borda);border-radius:14px;padding:18px;
         transition:border-color .15s,background .15s}
.cenario:hover{border-color:var(--cinza-2)}
.cenario[aria-checked="true"]{border-color:var(--verde);background:var(--verde-claro)}
.cenario__nome{font-size:.84rem;font-weight:500;color:var(--tinta-2);min-height:2.6em}
.cenario__nome b{color:var(--tinta)}
.cenario__preco{font-size:clamp(1.6rem,3.2vw,2.2rem);font-weight:800;letter-spacing:-.02em;
                font-variant-numeric:tabular-nums;line-height:1.1}
.chip{display:inline-block;border-radius:99px;padding:3px 10px;font-size:.82rem;font-weight:700;
      background:var(--tinta);color:#fff;font-variant-numeric:tabular-nums}
.cenario[aria-checked="true"] .chip{background:var(--verde)}
.tomador{display:flex;justify-content:space-between;align-items:baseline;gap:8px;width:100%;
         margin-top:8px;padding-top:10px;border-top:1px dashed var(--cinza-2);font-size:.8rem;color:var(--tinta-2)}
.tomador b{font-size:1.05rem;font-weight:700;color:var(--tinta);font-variant-numeric:tabular-nums;white-space:nowrap}
.tomador small{font-size:.75rem;font-weight:600;color:var(--tinta-2);margin-left:4px}

/* ── barras ───────────────────────────────────────── */
.sub{font-size:.95rem;font-weight:700;margin:28px 0 14px}
.barra{margin-bottom:14px}
.barra__topo{display:flex;justify-content:space-between;font-size:.85rem;margin-bottom:6px}
.barra__topo span{color:var(--tinta-2);font-weight:500}
.barra__topo b{font-variant-numeric:tabular-nums}
.barra__trilho{display:flex;height:34px;gap:2px}
.barra__trilho div{height:100%;min-width:0;transition:flex-basis .35s ease;display:flex;align-items:center;
                   justify-content:center;overflow:hidden;white-space:nowrap;font-size:.72rem;font-weight:600;color:#fff}
.barra__trilho div:first-child{border-radius:8px 0 0 8px}
.barra__trilho div:last-child{border-radius:0 8px 8px 0}
.c-custo{background:var(--tinta)}
.c-reaj{background:var(--cinza)}
.c-margem{background:var(--verde-2)}
.c-imp{background:var(--verde)}
.legenda{display:flex;flex-wrap:wrap;gap:6px 16px;list-style:none;padding:0;margin:4px 0 0;font-size:.78rem;color:var(--tinta-2)}
.legenda i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}

/* ── sacada ───────────────────────────────────────── */
.sacada{display:flex;gap:12px;align-items:flex-start;margin-top:24px;padding:16px 18px;
        background:var(--superficie);border-radius:12px;border-left:4px solid var(--verde)}
.sacada svg,.obrigado svg{flex:none;width:22px;height:22px;stroke:var(--verde);stroke-width:3;fill:none;
                          stroke-linecap:round;stroke-linejoin:round}
.sacada p{font-size:.9rem;color:var(--tinta-2)}
.sacada b{color:var(--tinta)}

/* ── passo a passo ────────────────────────────────── */
.passos{margin-top:18px;border-top:1px solid var(--borda);padding-top:14px}
.passos summary{cursor:pointer;font-weight:600;font-size:.88rem;color:var(--verde);list-style:none}
.passos summary::-webkit-details-marker{display:none}
.passos summary::before{content:"+ "}
.passos[open] summary::before{content:"− "}
.rolar{overflow-x:auto;margin-top:12px;min-width:0;max-width:100%}
.passos table{width:100%;min-width:480px;border-collapse:collapse;font-size:.82rem;font-variant-numeric:tabular-nums}
.passos th,.passos td{padding:8px 10px;border-bottom:1px solid var(--borda);text-align:right;white-space:nowrap}
.passos th:first-child,.passos td:first-child{text-align:left;white-space:normal}
.passos th{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:var(--cinza)}
/* "Reforma Tributária" em cima das duas colunas do depois, com o traço verde marcando o grupo */
.passos tr.grupo th{border-bottom:0;padding-bottom:0}
.passos tr.grupo th[colspan]{text-align:center;color:var(--verde);padding-top:4px}
.passos tr.grupo th[colspan]::after{content:"";display:block;height:2px;margin-top:6px;border-radius:2px;background:var(--verde)}
.passos tr.total td{font-weight:700;border-bottom:2px solid var(--tinta)}
.passos td.vazio{color:var(--cinza-2)}

/* ── captura ──────────────────────────────────────── */
.lead{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);gap:clamp(24px,5vw,64px);
      align-items:center;padding-block:clamp(56px,8vw,96px)}
.lead h2{font-size:clamp(1.5rem,3vw,2.1rem);font-weight:800;margin:10px 0 22px;max-width:20ch}
.checks{list-style:none;padding:0;margin:0}
.checks li{position:relative;padding-left:32px;margin-bottom:12px;color:var(--tinta-2)}
.checks li::before{content:"";position:absolute;left:0;top:3px;width:20px;height:20px;border-radius:50%;
  background:var(--verde-claro) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231ca800' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/12px no-repeat}
.form{border-color:var(--verde);border-width:1.5px}
.form h3{font-size:1.15rem;font-weight:700;margin-bottom:18px}
.botao{display:block;width:100%;text-align:center;border:0;border-radius:12px;padding:14px 18px;margin-top:6px;
       background:var(--verde);color:#fff;font-weight:700;font-size:1rem;cursor:pointer;text-decoration:none;
       transition:background .15s,transform .1s}
.botao:hover{background:#178f00}
.botao:active{transform:translateY(1px)}
.botao:disabled{opacity:.6;cursor:wait}
.form__erro{margin-top:10px;font-size:.85rem;color:#b3261e;font-weight:500}
.form__erro a{color:var(--verde);font-weight:700}
.form__lgpd{display:block;margin-top:12px;font-size:.75rem;color:var(--cinza)}
.form__lgpd a{color:var(--tinta-2)}
.obrigado{text-align:center;padding-block:12px}
.obrigado svg{width:44px;height:44px;margin:0 auto 10px;padding:8px;border-radius:50%;background:var(--verde-claro)}
.obrigado h3{margin-bottom:8px}
.obrigado p{color:var(--tinta-2);font-size:.92rem;margin-bottom:16px}
.segue{display:flex;align-items:center;gap:12px;margin-top:18px;padding:12px 14px;text-align:left;
       border-radius:12px;background:var(--iva-claro);color:var(--tinta-2);text-decoration:none;font-size:.84rem;
       transition:filter .15s}
.segue:hover{filter:brightness(.97)}
.segue img{width:40px;height:auto;flex:none;margin:0}
.segue span{flex:1}
.segue b{display:block;color:var(--iva);font-size:1rem}
.obrigado .segue svg{width:20px;height:20px;padding:0;margin:0;background:none;stroke:var(--iva);border-radius:0}

/* ── rodapé ───────────────────────────────────────── */
.rodape{border-top:1px solid var(--borda);background:var(--superficie);padding-block:28px;
        font-size:.78rem;color:var(--tinta-2);text-align:center}
.rodape p{margin-bottom:8px}
.rodape p:last-child{margin-bottom:0}
.rodape__aviso{max-width:620px;margin-inline:auto}
.rodape a{color:var(--tinta-2)}
.rodape__parceria{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 12px;margin-bottom:14px!important}
.rodape .rodape__parceria .marca{display:inline-flex;transition:opacity .15s}
.rodape__parceria .marca:hover{opacity:.75}
.rodape__parceria .marca img{width:100px;height:auto}
.rodape__parceria .marca img[src$="logo.png"]{width:80px}

/* ── ajuda: fica no canto o tempo todo, abre o WhatsApp com a conta escrita ── */
.ajuda{position:fixed;right:20px;bottom:20px;z-index:10;display:flex;align-items:center;gap:8px;
       padding:11px 18px 11px 14px;border-radius:99px;background:var(--tinta);color:#fff;text-decoration:none;
       font-size:.88rem;font-weight:600;box-shadow:0 6px 20px rgba(0,0,0,.18);transition:background .15s,transform .15s}
.ajuda:hover{background:var(--verde);transform:translateY(-2px)}
.ajuda svg{width:20px;height:20px;stroke:currentColor;stroke-width:2.2;fill:none;stroke-linecap:round;stroke-linejoin:round}

/* ── celular ──────────────────────────────────────── */
@media (max-width:860px){
  .calc,.lead{grid-template-columns:minmax(0,1fr)}
  .entradas{position:static}
}
/* Celular. Duas regras guiam tudo aqui: a mesma margem lateral em TODA seção
   (o que dá o prumo da página), e rótulo em cima do número quando os dois não
   cabem na mesma linha — meio a meio é o que fazia o bloco parecer solto. */
@media (max-width:480px){
  .caixa{padding-inline:16px}

  .topo__linha{padding-block:12px}
  .topo__marcas{gap:10px}
  .topo__logo{width:92px}
  .topo__logo-iva{width:118px}
  .topo__traco{height:24px}
  .ig{padding:9px}            /* 40px de alvo pro dedo */
  .ig span{display:none}

  .heroi{text-align:left;padding-block:28px 20px}
  .heroi h1{margin-inline:0;margin-bottom:12px}
  .heroi__sub{margin-inline:0}

  .calc{gap:14px}
  .painel{padding:18px}
  .painel__titulo{margin-bottom:18px}
  .campo{margin-bottom:18px}

  .cenarios{grid-template-columns:1fr;gap:10px}
  .cenario{padding:16px}
  .cenario__nome{min-height:0}
  .tomador{flex-direction:column;align-items:flex-start;gap:2px;margin-top:10px}
  .tomador b{font-size:1.15rem}

  .sub{margin:24px 0 12px}
  .barra__trilho{height:30px}
  .legenda{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px}
  .sacada{margin-top:20px;padding:14px 16px}

  .lead{padding-block:44px;gap:24px}
  .lead h2{margin-bottom:18px}
  .form h3{margin-bottom:16px}

  .rodape{padding-block:24px 84px}   /* o botão de ajuda não cobre os links */
  .ajuda{right:16px;bottom:16px}
  .rodape__parceria{gap:8px}
}

/* ── páginas legais ───────────────────────────────── */
.doc{padding-block:clamp(40px,6vw,72px)}
.doc .caixa{max-width:760px}
.doc__voltar{display:inline-block;color:var(--tinta-2);font-size:.85rem;font-weight:600;margin-bottom:24px;text-decoration:none}
.doc h1{font-size:clamp(1.8rem,4vw,2.4rem);font-weight:800;margin-bottom:8px}
.doc__data{color:var(--cinza);font-size:.85rem;margin-bottom:32px}
.doc__resumo{background:var(--superficie);border-left:4px solid var(--verde);border-radius:0 12px 12px 0;
             padding:20px 24px;margin-bottom:36px}
.doc__resumo p{margin-bottom:8px}
.doc__resumo p:last-child{margin:0}
.doc h2{font-size:1.25rem;font-weight:700;margin:34px 0 12px;padding-top:22px;border-top:1px solid var(--borda)}
.doc p{margin-bottom:14px;color:var(--tinta-2)}
.doc ul,.doc ol{padding-left:22px;color:var(--tinta-2)}
.doc li{margin-bottom:8px}
.doc strong{color:var(--tinta)}
.doc table{width:100%;border-collapse:collapse;margin:6px 0 20px;font-size:.88rem}
.doc th,.doc td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--borda);vertical-align:top}
.doc th{color:var(--cinza);font-size:.72rem;text-transform:uppercase;letter-spacing:.05em}
.doc td:first-child{font-weight:600;color:var(--tinta)}
.doc__acao{margin:0 0 32px}
.doc__acao .botao{display:inline-block;width:auto}
.doc__acao small{display:block;margin-top:8px;color:var(--cinza)}
.doc__contato{margin-top:40px;padding:20px 24px;background:var(--superficie);border-radius:12px}
.doc__contato p{margin:0}

/* ── área do cliente (08/10/2026): Instagram + Acessos (admin) + Sair, no topo ── */
.conta{display:flex;align-items:center;gap:8px}
.conta__bt{font:inherit;font-size:.85rem;font-weight:600;color:var(--tinta-2);background:var(--fundo);
           border:1px solid var(--borda);border-radius:99px;padding:6px 14px;cursor:pointer;text-decoration:none}
.conta__bt:hover{border-color:var(--verde);color:var(--verde)}
@media (max-width:600px){.conta .ig span{display:none}.conta .ig{padding:6px}}