:root{
  --primary:#a51c22;
  --primary-dark:#6e1116;
  --primary-light:#c92a2f;
  --primary-tint:#fbe9e7;
  --ink:#141312;
  --bg:#f6f4f1;
  --surface:#ffffff;
  --border:#e6e0d6;
  --text:#221f1d;
  --muted:#726a61;
  --success:#1c7c4c;
  --success-tint:#e7f5ee;
  --warn:#9a6b00;
  --warn-tint:#fff4dd;
  --font-display: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --radius:14px;
  --radius-lg:18px;
  --radius-pill:100px;
  --shadow: 0 1px 2px rgba(20,19,18,.04), 0 10px 28px -16px rgba(20,19,18,.14);
  --shadow-hover: 0 4px 10px rgba(20,19,18,.06), 0 18px 36px -16px rgba(165,28,34,.16);
  --ease: cubic-bezier(.22,1,.36,1);
}
*{box-sizing:border-box;}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:var(--font-body);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px 90px;}

/* ---------- Header ---------- */
header.top{
  background:var(--surface);
  border-bottom:1px solid var(--border);
  position:sticky; top:0; z-index:50;
}
header.top .inner{
  max-width:1180px;margin:0 auto;padding:16px 20px;
  display:flex;align-items:center;justify-content:space-between;gap:20px;
}
.brandbar{display:flex;align-items:center;gap:14px;}
.brand-logo-link{display:block; line-height:0; transition:opacity .2s var(--ease);}
.brand-logo-link:hover{opacity:.8;}
.brandbar img{height:38px;width:auto;display:block;}
.brandbar .divider{width:1px;height:28px;background:var(--border);}
.brandbar .titles{line-height:1.3;}
.brandbar .eyebrow{font-family:var(--font-display);font-size:14px;letter-spacing:-.01em;color:var(--ink);font-weight:700;}
.brandbar .subtitle{font-size:11.5px;color:var(--muted);letter-spacing:.02em;}
.statuspill{
  display:inline-flex; align-items:center; gap:8px;
  border:1px solid var(--border); background:linear-gradient(180deg,#fff,#fdfcfb);
  padding:8px 16px; border-radius:var(--radius-pill); font-size:12.5px; font-weight:600; color:var(--muted);
  white-space:nowrap;
}
.statuspill .dot{
  width:7px; height:7px; border-radius:50%; background:var(--success); flex:none;
  box-shadow:0 0 0 0 rgba(28,124,76,.5);
  animation:pulseDot 2.2s var(--ease) infinite;
}
@keyframes pulseDot{
  0%{box-shadow:0 0 0 0 rgba(28,124,76,.45);}
  70%{box-shadow:0 0 0 7px rgba(28,124,76,0);}
  100%{box-shadow:0 0 0 0 rgba(28,124,76,0);}
}
header.top .topbar-accent{height:3px;background:linear-gradient(90deg,var(--primary-dark),var(--primary),var(--primary-light));}

.pagehead{padding:34px 0 6px;}
.pagehead .kicker{font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--primary);font-weight:700;margin-bottom:8px;}
.pagehead h1{font-family:var(--font-display);margin:0 0 8px;font-size:29px;font-weight:800;letter-spacing:-.02em;color:var(--ink);}
.pagehead p{margin:0;color:var(--muted);font-size:14.5px;max-width:640px;}

/* ---------- Reveal ---------- */
@keyframes revealUp{
  from{opacity:0; transform:translateY(14px);}
  to{opacity:1; transform:translateY(0);}
}
.reveal{ animation:revealUp .6s var(--ease) both; animation-delay:var(--delay, 0s); }
@media (prefers-reduced-motion: reduce){ .reveal{animation:none;} }

/* ---------- Layout 2 colunas ---------- */
.simgrid{display:grid;grid-template-columns:1fr 1.15fr;gap:20px;align-items:start;margin-top:24px;}
@media (max-width:960px){.simgrid{grid-template-columns:1fr;}}

/* ---------- Cards ---------- */
.card{
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg);
  box-shadow:var(--shadow); overflow:hidden;
  transition:box-shadow .3s var(--ease), transform .3s var(--ease);
}
.card:hover{box-shadow:var(--shadow-hover);}
.card .cardbar{height:4px;background:linear-gradient(90deg,var(--primary-dark),var(--primary));}
.card .cardbody{padding:26px 26px 28px;}
.form-card{position:sticky; top:88px;}

/* ---------- Fieldset / legend ---------- */
fieldset{border:none;margin:0 0 22px;padding:0;}
legend{
  font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted);font-weight:700;
  padding-bottom:9px;display:block;width:100%;border-bottom:1px solid var(--border);
  margin-bottom:16px;
}

.field{margin-bottom:16px;}
.field label{font-size:12.5px;font-weight:600;color:var(--ink);display:block;margin-bottom:8px;letter-spacing:.01em;}

input[type=text], input[type=number], select{
  width:100%;padding:12px 14px;border:1.5px solid var(--border);border-radius:var(--radius-pill);
  font-size:14px;background:#fdfcfb;color:var(--text); font-family:var(--font-body);
  transition:border-color .2s var(--ease), box-shadow .2s var(--ease), background .2s var(--ease);
}
input[type=text]:hover, input[type=number]:hover, select:hover{border-color:#d8d0c3;}
input[type=text]:focus, input[type=number]:focus, select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 4px rgba(165,28,34,.1);background:#fff;}

/* ---------- Radios como pílulas ---------- */
.radio-row, .radio-grid{display:flex;flex-wrap:wrap;gap:8px;}
.radio-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.radio-row input[type=radio], .radio-grid input[type=radio]{
  position:absolute; opacity:0; width:0; height:0;
}
.radio-row label, .radio-grid label{
  flex:1;min-width:fit-content;cursor:pointer;
  display:block;padding:10px 14px;border:1.5px solid var(--border);border-radius:var(--radius-pill);
  font-size:13px;text-align:center;background:#fdfcfb;transition:all .2s var(--ease);
  color:var(--muted);font-weight:600;
}
.radio-row label:hover, .radio-grid label:hover{border-color:var(--primary-light); color:var(--primary-dark);}
.radio-row input[type=radio]:checked + label, .radio-grid input[type=radio]:checked + label{
  background:linear-gradient(135deg,var(--primary-light),var(--primary)); border-color:var(--primary);
  color:#fff; box-shadow:0 4px 14px -4px rgba(165,28,34,.5);
}

.area-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
@media (max-width:480px){.area-grid{grid-template-columns:1fr;}}

/* ---------- Botões ---------- */
button{
  border:1.5px solid var(--border); background:#fff; color:var(--text);
  padding:12px 20px; border-radius:var(--radius-pill); font-size:14px; font-weight:700;
  cursor:pointer; transition:border-color .2s var(--ease), color .2s var(--ease), transform .15s var(--ease), box-shadow .2s var(--ease), background .2s var(--ease);
  display:inline-flex; align-items:center; justify-content:center; gap:7px; font-family:var(--font-body);
}
button:hover{border-color:var(--primary); color:var(--primary); transform:translateY(-1px); box-shadow:0 6px 16px -8px rgba(165,28,34,.25);}
button:active{transform:translateY(0);}
.calc-btn{
  width:100%;
  background:linear-gradient(135deg,var(--primary-light),var(--primary)); border-color:var(--primary); color:#fff;
  box-shadow:0 4px 14px -4px rgba(165,28,34,.5); margin-top:6px; padding:14px 20px; font-size:15px;
}
.calc-btn:hover{background:linear-gradient(135deg,var(--primary),var(--primary-dark)); border-color:var(--primary-dark); color:#fff; box-shadow:0 8px 20px -6px rgba(165,28,34,.55);}

/* ---------- Relatório ---------- */
.report{min-height:200px;}
.report-empty{
  background:var(--surface); border:1.5px dashed var(--border); border-radius:var(--radius-lg);
  padding:60px 30px; text-align:center; color:var(--muted);
}
.report-empty .icon{
  width:52px;height:52px;border-radius:50%;background:var(--primary-tint);color:var(--primary);
  display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:700;
  margin:0 auto 16px;
}
.report-empty p{max-width:340px;margin:0 auto;font-size:14px;line-height:1.6;}

.report-content{display:none;}
.report-content.show{display:block; animation:revealUp .4s var(--ease) both;}
.report-content h1{
  font-family:var(--font-display); font-size:20px; font-weight:800; color:var(--ink);
  letter-spacing:-.01em; margin:0 0 6px;
}
.report-content .ref{font-size:12.5px;color:var(--muted);margin-bottom:20px;}
.report-content .ref strong{color:var(--primary);font-family:var(--font-display);}

.block{
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg);
  padding:22px 24px; margin-bottom:16px; box-shadow:var(--shadow);
}
.block-title{
  font-size:12px;text-transform:uppercase;letter-spacing:.07em;color:var(--primary);
  font-weight:700;margin-bottom:14px;
}
.row{display:flex;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px dashed var(--border);font-size:13.5px;}
.row:last-child{border-bottom:none;}
.row .lbl{color:var(--muted);}
.row .lbl small{display:block;color:#a39c90;font-size:11px;margin-top:2px;}
.row .val{font-weight:700;color:var(--ink);text-align:right;}
.row.featured{background:var(--primary-tint);margin:6px -10px;padding:12px 10px;border-radius:10px;border-bottom:none;}
.row.featured .val{color:var(--primary-dark);}

.vau-source{font-size:12px;color:var(--muted);margin-top:10px;}
.vau-source strong{color:var(--text);}

table.projecao{width:100%;border-collapse:collapse;font-size:13.5px;}
table.projecao td{padding:11px 0;border-bottom:1px dashed var(--border);}
table.projecao tr:last-child td{border-bottom:none;}
table.projecao .val-num{text-align:right;font-variant-numeric:tabular-nums;font-weight:700;}
table.projecao tr.reducao td{color:var(--success);}
table.projecao tr.total-pagar td{
  font-family:var(--font-display); font-size:18px; font-weight:800; color:var(--primary-dark);
  padding-top:16px;
}
.aviso-sutil{font-size:11.5px;color:var(--muted);margin-top:10px;font-style:italic;}

.wa-btn{
  display:flex; align-items:center; justify-content:center; gap:10px; width:100%;
  background:linear-gradient(135deg,#22c35e,#128c4a); color:#fff; text-decoration:none;
  padding:14px 20px; border-radius:var(--radius-pill); font-weight:700; font-size:14.5px;
  box-shadow:0 4px 14px -4px rgba(18,140,74,.5); transition:transform .15s var(--ease), box-shadow .2s var(--ease);
}
.wa-btn:hover{transform:translateY(-1px); box-shadow:0 8px 20px -6px rgba(18,140,74,.55);}
.wa-note{font-size:12px;color:var(--muted);text-align:center;margin-top:10px;}

.detalhe-toggle{
  width:100%; background:#fdfcfb; justify-content:space-between; padding:14px 18px;
  color:var(--text); font-weight:700; font-size:13.5px;
}
.detalhe-toggle:hover{background:var(--primary-tint); color:var(--primary-dark); border-color:var(--primary-light);}
.detalhe-toggle.ativo{border-color:var(--primary);}
#btn-detalhe-icon{transition:transform .25s var(--ease); font-size:11px;}
.detalhe-toggle.ativo #btn-detalhe-icon{transform:rotate(180deg);}

.result-card{
  background:var(--primary-tint); border:1.5px solid var(--primary); border-radius:var(--radius);
  padding:20px; text-align:center;
}
.result-card .lbl{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px;font-weight:700;}
.result-card .total{font-family:var(--font-display); font-size:32px; font-weight:800; color:var(--primary-dark);}
.result-card .currency{font-size:18px;font-weight:700;margin-right:4px;}

table.dctf-table{width:100%;border-collapse:collapse;font-size:12.5px;}
table.dctf-table th, table.dctf-table td{padding:10px 8px;border-bottom:1px solid var(--border);text-align:left;}
table.dctf-table th{color:var(--muted);font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:.04em;border-bottom:2px solid var(--border);}
table.dctf-table td:last-child{text-align:right;font-variant-numeric:tabular-nums;font-weight:600;}
table.dctf-table tfoot td{font-weight:800;color:var(--primary-dark);border-top:2px solid var(--ink);border-bottom:none;}
table.dctf-table tbody tr:hover{background:var(--primary-tint);}

/* ---------- Site footer (padrão RPA) ---------- */
.sitefooter{ margin-top:50px; background:var(--ink); color:#cfcac4; border-top:3px solid var(--primary); }
.footinner{
  max-width:1180px; margin:0 auto; padding:28px 20px 20px;
  display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
}
.footlogo{height:26px; width:auto; display:block; opacity:.95;}
.footsocial{display:flex; gap:10px;}
.footsocial a{
  width:32px; height:32px; border-radius:8px; background:rgba(255,255,255,.05);
  border:1px solid rgba(165,28,34,.4); display:flex; align-items:center; justify-content:center;
  color:#cfcac4; transition:background .2s var(--ease), color .2s var(--ease), transform .2s var(--ease), border-color .2s var(--ease);
}
.footsocial a svg{width:15px; height:15px;}
.footsocial a:hover{background:var(--primary); border-color:var(--primary); color:#fff; transform:translateY(-2px);}
.footbottom{
  border-top:1px solid rgba(255,255,255,.1);
  max-width:1180px; margin:0 auto; padding:14px 20px 22px;
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px;
  font-size:11.5px; color:#8a8379;
}
.devby{ display:inline-flex; align-items:center; gap:6px; color:#8a8379; text-decoration:none; font-size:11.5px; transition:color .2s var(--ease); }
.devby img{height:20px; width:auto; opacity:.9; transition:opacity .2s var(--ease);}
.devby:hover{color:#fff;}
.devby:hover img{opacity:1;}

/* =====================================================================
   RESPONSIVO — MOBILE / TABLET
   ===================================================================== */

/* Sticky do formulário só faz sentido no layout de 2 colunas.
   Em 1 coluna ele trava e o relatório rola por cima (esconde o Calcular). */
@media (max-width:960px){
  .form-card{position:static; top:auto;}
  .simgrid{gap:16px; margin-top:18px;}
  .wrap{padding:0 16px 60px;}
  .card .cardbody{padding:20px 18px 22px;}
  .block{padding:18px 16px;}
  .report-empty{padding:40px 22px;}
  .pagehead{padding:24px 0 4px;}
  .pagehead h1{font-size:24px;}
  .pagehead p{font-size:14px;}
}

/* Header compacto */
@media (max-width:720px){
  header.top{position:static;}
  header.top .inner{padding:12px 16px; gap:12px;}
  .brandbar{gap:10px; min-width:0;}
  .brandbar img{height:30px;}
  .brandbar .divider{height:24px;}
  .brandbar .titles{min-width:0;}
  .brandbar .eyebrow{font-size:13px;}
  .brandbar .subtitle{font-size:10.5px; line-height:1.35;}
  .statuspill{padding:6px 12px; font-size:11.5px;}
}

@media (max-width:560px){
  header.top .inner{flex-wrap:wrap;}
  /* o pill "Ferramenta pública" espremia o título em 3 linhas */
  .statuspill{display:none;}
  .brandbar .subtitle{white-space:normal;}
}

@media (max-width:480px){
  .wrap{padding:0 14px 48px;}
  .card .cardbody{padding:18px 14px 20px;}
  .block{padding:16px 14px;}
  .pagehead h1{font-size:21px;}
  .pagehead .kicker{font-size:10.5px; letter-spacing:.08em;}

  /* 16px evita o zoom automático do iOS ao focar o campo */
  input[type=text], input[type=number], select{font-size:16px; padding:12px 14px;}
  .field label{font-size:12px;}

  /* pílulas de rádio: empilhar em vez de espremer */
  .radio-row{display:grid; grid-template-columns:1fr 1fr;}
  .radio-row label, .radio-grid label{
    padding:11px 10px; font-size:12.5px; min-width:0; word-break:break-word;
  }
  .radio-grid{grid-template-columns:1fr;}

  .report-empty{padding:32px 18px;}
  .report-content h1{font-size:18px;}
  .result-card .total{font-size:26px;}

  .row{font-size:13px; gap:10px;}
  .row .val{word-break:break-word;}
  table.projecao{font-size:12.5px;}
  table.projecao tr.total-pagar td{font-size:16px;}

  /* tabela DCTF pode ser larga — rolagem própria, nunca a página */
  .dctf-wrap{overflow-x:auto; -webkit-overflow-scrolling:touch;}
  table.dctf-table{min-width:420px;}

  .wa-btn{font-size:13.5px; padding:14px 16px;}
  .detalhe-toggle{font-size:12.5px; padding:13px 14px;}

  .footinner{flex-direction:column; align-items:flex-start; gap:16px; padding:22px 16px 16px;}
  .footbottom{padding:14px 16px 20px;}
}

/* Alvos de toque confortáveis em qualquer touchscreen */
@media (hover:none){
  button, .radio-row label, .radio-grid label, .wa-btn{min-height:44px;}
  .card:hover{box-shadow:var(--shadow);}
  button:hover{transform:none; box-shadow:none;}
  .wa-btn:hover{transform:none;}
}