/* Calculadora de Financiamento (DecoderX): layout claro */
:root {
    --cf-ink: #1c2b3a;
    --cf-ink-2: #4a5b6c;
    --cf-azul: #1a3a5c;
    --cf-acao: #2563a8;
    --cf-acao-esc: #1d4f89;
    --cf-ambar: #c97d00;
    --cf-fundo: #f5f8fc;
    --cf-card: #ffffff;
    --cf-linha: #dbe5ef;
    --cf-suave: #eaf3fc;
    --cf-aviso: #fff7e6;
    --cf-aviso-borda: #f1d9a3;
    --cf-erro: #b42318;
    --cf-ok: #17683a;
    --cf-raio: 14px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
    margin: 0;
    background: var(--cf-fundo);
    color: var(--cf-ink);
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    line-height: 1.6;
    font-size: 1rem;
}
a { color: var(--cf-acao); }
a:hover { color: var(--cf-acao-esc); }
img { max-width: 100%; height: auto; }
.cf-wrap { width: 100%; max-width: 1140px; margin: 0 auto; padding: 0 16px; }
.cf-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ── Cabeçalho: faixa azul com o logo + barra de menu ───── */
.cf-topo { background: #0d1f33; }
.cf-topo-logo .cf-wrap { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 12px; padding-bottom: 12px; }
.cf-marca { text-decoration: none; color: #fff; font-size: 1.5rem; font-weight: 700; line-height: 1.1; }
.cf-marca:hover { color: #fff; }
.cf-marca b { color: #e8a020; font-weight: 700; }
.cf-marca small { display: block; font-size: .72rem; font-weight: 500; color: #9db4c9; }
.cf-menu-bt { display: none; appearance: none; align-items: center; gap: 9px; background: rgba(255, 255, 255, .1); color: #fff; border: 1.5px solid rgba(255, 255, 255, .35); border-radius: 10px; padding: 8px 14px; font: inherit; font-weight: 650; font-size: .95rem; cursor: pointer; }
.cf-menu-bt:hover { background: rgba(255, 255, 255, .18); }
.cf-menu-bt:focus-visible { outline: 3px solid #e8a020; outline-offset: 2px; }
.cf-menu-ico, .cf-menu-ico::before, .cf-menu-ico::after { display: block; width: 20px; height: 2.5px; background: #fff; border-radius: 2px; transition: transform .2s, opacity .2s; }
.cf-menu-ico { position: relative; }
.cf-menu-ico::before, .cf-menu-ico::after { content: ""; position: absolute; left: 0; }
.cf-menu-ico::before { top: -6.5px; }
.cf-menu-ico::after { top: 6.5px; }
.cf-menu-bt[aria-expanded="true"] .cf-menu-ico { background: transparent; }
.cf-menu-bt[aria-expanded="true"] .cf-menu-ico::before { top: 0; transform: rotate(45deg); }
.cf-menu-bt[aria-expanded="true"] .cf-menu-ico::after { top: 0; transform: rotate(-45deg); }
.cf-barra-menu { background: #fff; border-bottom: 1px solid var(--cf-linha); box-shadow: 0 2px 8px rgba(26, 58, 92, .06); }
.cf-nav { display: flex; flex-wrap: wrap; gap: 4px; padding: 8px 0; }
.cf-nav a { text-decoration: none; color: var(--cf-ink-2); font-weight: 650; font-size: .92rem; padding: 8px 14px; border-radius: 8px; }
.cf-nav a:hover { background: var(--cf-suave); color: var(--cf-azul); }
.cf-nav a[aria-current="page"] { background: #e8a020; color: #0d1f33; font-weight: 750; box-shadow: 0 2px 6px rgba(232, 160, 32, .45); }

/* ── Abertura ────────────────────────────────────────────── */
.cf-hero { background: linear-gradient(180deg, #eaf3fc 0%, #f5f8fc 100%); padding: 34px 0 10px; text-align: center; }
.cf-hero h1 { margin: 0 0 10px; font-size: 2.1rem; line-height: 1.2; color: var(--cf-azul); font-weight: 750; }
.cf-hero p { margin: 0 auto; max-width: 780px; color: var(--cf-ink-2); font-size: 1.05rem; }
.cf-selos { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin: 16px 0 0; padding: 0; }
.cf-selos li { background: #fff; border: 1px solid var(--cf-linha); border-radius: 999px; padding: 4px 14px; font-size: .85rem; font-weight: 600; color: var(--cf-azul); }

/* ── Simulador ───────────────────────────────────────────── */
.cf-main { padding: 18px 0 40px; }
.cf-grade { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 22px; align-items: start; }
.cf-card { background: var(--cf-card); border: 1px solid var(--cf-linha); border-radius: var(--cf-raio); box-shadow: 0 6px 22px rgba(26, 58, 92, .07); padding: 22px; }
.cf-card h2 { margin: 0 0 4px; font-size: 1.25rem; color: var(--cf-azul); }
.cf-sub { margin: 0 0 14px; color: var(--cf-ink-2); font-size: .92rem; }

.cf-abas { display: flex; gap: 4px; margin-bottom: 16px; border-bottom: 1px solid var(--cf-linha); }
.cf-abas button { appearance: none; background: none; border: 0; border-bottom: 3px solid transparent; padding: 9px 14px; font: inherit; font-weight: 650; font-size: .93rem; color: var(--cf-ink-2); cursor: pointer; margin-bottom: -1px; }
.cf-abas button[aria-selected="true"] { color: var(--cf-azul); border-bottom-color: var(--cf-ambar); }
.cf-abas button:hover { color: var(--cf-azul); }

.cf-campo { margin-bottom: 14px; }
.cf-campo label, .cf-rotulo { display: block; font-weight: 650; font-size: .9rem; color: var(--cf-azul); margin-bottom: 4px; }
.cf-opc { font-weight: 400; color: #5b6b7c; font-size: .82rem; }
.cf-dica { display: block; font-size: .8rem; color: #5b6b7c; margin-top: 3px; }
.cf-in { display: flex; align-items: stretch; border: 1.5px solid #c3d1df; border-radius: 10px; background: #fff; overflow: hidden; }
.cf-in:focus-within { border-color: var(--cf-acao); box-shadow: 0 0 0 3px rgba(37, 99, 168, .18); }
.cf-in span { display: flex; align-items: center; padding: 0 11px; background: #f0f5fa; color: var(--cf-ink-2); font-weight: 650; font-size: .92rem; white-space: nowrap; }
.cf-in { min-width: 0; }
.cf-in input, .cf-in select { flex: 1; min-width: 0; width: 100%; border: 0; outline: 0; background: transparent; font: inherit; font-size: 1.05rem; padding: 10px 12px; height: 46px; color: var(--cf-ink); }
.cf-in select { flex: 0 0 auto; width: auto; max-width: 48%; font-size: .95rem; font-weight: 600; background: #f0f5fa; border-left: 1.5px solid #c3d1df; cursor: pointer; }
.cf-in input[aria-invalid="true"] { background: #fff5f4; }
.cf-par { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
.cf-par > *, .cf-campo { min-width: 0; }
.cf-erro { color: var(--cf-erro); font-size: .83rem; min-height: 1.1em; margin-top: 2px; }

.cf-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 7px; }
.cf-chips button { appearance: none; border: 1.5px solid #c3d1df; background: #fff; color: var(--cf-ink-2); border-radius: 999px; padding: 3px 12px; font: inherit; font-size: .84rem; font-weight: 600; cursor: pointer; }
.cf-chips button:hover { border-color: var(--cf-acao); color: var(--cf-acao-esc); }
.cf-chips button[aria-pressed="true"] { background: var(--cf-suave); border-color: var(--cf-acao); color: var(--cf-azul); }

.cf-bc { appearance: none; margin-top: 8px; border: 1.5px dashed var(--cf-acao); background: #f4f9ff; color: var(--cf-acao-esc); border-radius: 10px; padding: 8px 12px; font: inherit; font-size: .88rem; font-weight: 650; cursor: pointer; width: 100%; }
.cf-bc:hover { background: var(--cf-suave); }
.cf-bc:disabled { opacity: .7; cursor: progress; }
.cf-fonte { font-size: .82rem; color: var(--cf-ok); margin-top: 6px; }
.cf-fonte:empty { display: none; }
.cf-fonte-erro { color: var(--cf-erro); }

.cf-mais { border: 1px solid var(--cf-linha); border-radius: 12px; background: #fafcfe; margin-bottom: 14px; }
.cf-mais summary { cursor: pointer; padding: 11px 14px; font-weight: 650; font-size: .92rem; color: var(--cf-azul); list-style-position: inside; }
.cf-mais[open] summary { border-bottom: 1px solid var(--cf-linha); }
.cf-mais-corpo { padding: 14px; }
.cf-mais-corpo .cf-par .cf-campo { margin-bottom: 10px; }
.cf-check { display: flex; gap: 9px; align-items: flex-start; font-size: .9rem; margin: 6px 0 10px; color: var(--cf-ink); }
.cf-check input { margin-top: 4px; width: 17px; height: 17px; accent-color: var(--cf-acao); flex: none; }
.cf-iof-box { margin: 0 0 10px 0; padding: 10px 12px; background: var(--cf-aviso); border: 1px solid var(--cf-aviso-borda); border-radius: 10px; }
.cf-iof-box[hidden] { display: none; }

.cf-botoes { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 4px; }
.cf-bt { appearance: none; border: 1.5px solid transparent; border-radius: 10px; padding: 11px 20px; font: inherit; font-weight: 700; font-size: .97rem; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; justify-content: center; line-height: 1.2; }
.cf-bt-prim { background: var(--cf-acao); color: #fff; flex: 1 1 200px; }
.cf-bt-prim:hover { background: var(--cf-acao-esc); color: #fff; }
.cf-bt-sec { background: #fff; color: var(--cf-azul); border-color: #b5c6d8; }
.cf-bt-sec:hover { background: var(--cf-suave); border-color: var(--cf-acao); color: var(--cf-azul); }
.cf-bt:disabled { opacity: .65; cursor: progress; }
.cf-bt:focus-visible, .cf-chips button:focus-visible, .cf-bc:focus-visible, .cf-abas button:focus-visible, .cf-mais summary:focus-visible { outline: 3px solid rgba(37, 99, 168, .45); outline-offset: 2px; }

/* ── Resultado ───────────────────────────────────────────── */
.cf-painel { position: sticky; top: 14px; }
.cf-vazio { text-align: center; padding: 18px 8px; color: var(--cf-ink-2); }
.cf-vazio strong { display: block; color: var(--cf-azul); font-size: 1.1rem; margin-bottom: 6px; }
.cf-vazio .cf-bt { margin-top: 12px; }
.cf-vazio[hidden], #cf-resultado[hidden], #cf-r2[hidden] { display: none; }

.cf-aviso { scroll-margin-top: 14px; background: var(--cf-aviso); border: 1px solid var(--cf-aviso-borda); border-radius: 10px; padding: 8px 12px; font-size: .86rem; color: #5a4208; margin-bottom: 14px; }
.cf-velho { opacity: .45; }
.cf-destaque { background: linear-gradient(135deg, #eaf3fc, #dcebfa); border: 1px solid #b9d4ee; border-radius: 14px; padding: 16px 18px; text-align: center; margin-bottom: 14px; }
.cf-dest-linha { display: flex; align-items: baseline; justify-content: center; gap: 10px; flex-wrap: wrap; color: var(--cf-azul); }
.cf-dest-n { font-size: 2.3rem; font-weight: 800; line-height: 1; }
.cf-dest-de { font-size: 1rem; font-weight: 600; color: var(--cf-ink-2); }
.cf-dest-v { font-size: 2.3rem; font-weight: 800; line-height: 1; }
.cf-dest-cet { margin-top: 8px; font-weight: 650; color: var(--cf-azul); font-size: .98rem; }

.cf-linhas { margin: 0 0 12px; }
.cf-linha { display: flex; justify-content: space-between; gap: 14px; padding: 8px 2px; border-bottom: 1px solid #e7eef6; font-size: .94rem; }
.cf-linha dt { margin: 0; color: var(--cf-ink-2); font-weight: 500; }
.cf-linha dd { margin: 0; font-weight: 650; text-align: right; color: var(--cf-ink); }
.cf-linha small { font-weight: 500; color: #5b6b7c; }
.cf-linha-forte { background: #f4f9ff; border-radius: 8px; border-bottom: 0; padding: 9px 8px; margin: 2px 0; }
.cf-linha-forte dt { color: var(--cf-azul); font-weight: 650; }

.cf-barra { display: flex; height: 14px; border-radius: 999px; overflow: hidden; background: #e7eef6; margin: 6px 0 8px; }
.cf-barra i { display: block; height: 100%; }
.cf-barra .p { background: #5b9bd5; }
.cf-barra .j { background: #e8a020; }
.cf-legenda { display: flex; flex-wrap: wrap; gap: 4px 18px; font-size: .84rem; color: var(--cf-ink-2); margin-bottom: 12px; }
.cf-legenda span::before { content: ""; display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 6px; vertical-align: -1px; }
.cf-legenda .p::before { background: #5b9bd5; }
.cf-legenda .j::before { background: #e8a020; }

.cf-nota { font-size: .86rem; color: var(--cf-ink-2); background: #f5f8fc; border-radius: 10px; padding: 8px 12px; margin: 0 0 10px; }
.cf-nota[hidden] { display: none; }
.cf-acoes { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.cf-acoes .cf-bt { flex: 1 1 130px; padding: 10px 12px; }
.cf-msg { font-size: .86rem; min-height: 1.2em; margin-top: 6px; }
.cf-msg-ok { color: var(--cf-ok); }
.cf-msg-erro { color: var(--cf-erro); }
.cf-ta-oculto { position: fixed; left: -9999px; top: 0; }

.cf-resultado-h3 { font-size: 1.02rem; color: var(--cf-azul); margin: 20px 0 8px; }
.cf-rolagem { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.cf-tab { width: 100%; border-collapse: collapse; font-size: .88rem; }
.cf-tab th { text-align: right; background: #eef4fa; color: var(--cf-azul); font-weight: 650; padding: 7px 9px; white-space: nowrap; }
.cf-tab td { text-align: right; padding: 6px 9px; border-bottom: 1px solid #e7eef6; white-space: nowrap; }
.cf-tab th:first-child, .cf-tab td:first-child { text-align: left; }
.cf-tab .cf-atual td { background: #fff7e6; font-weight: 700; }
.cf-meses-box { margin-top: 14px; }
.cf-meses-box summary { cursor: pointer; font-weight: 650; color: var(--cf-acao-esc); font-size: .93rem; }
.cf-meses-box .cf-rolagem { max-height: 340px; overflow-y: auto; margin-top: 8px; border: 1px solid var(--cf-linha); border-radius: 10px; }

/* ── Conteúdo ────────────────────────────────────────────── */
.cf-conteudo { padding: 8px 0 30px; }
.cf-conteudo section { margin-bottom: 26px; }
.cf-conteudo h2 { font-size: 1.5rem; color: var(--cf-azul); margin: 0 0 10px; line-height: 1.25; }
.cf-conteudo h3 { font-size: 1.1rem; color: var(--cf-azul); margin: 18px 0 6px; }
.cf-conteudo p, .cf-conteudo li { color: #2d3e50; }
.cf-conteudo ol, .cf-conteudo ul { padding-left: 1.3rem; }
.cf-texto { max-width: 860px; }
.cf-formula { background: #fff; border: 1px solid var(--cf-linha); border-left: 4px solid var(--cf-ambar); border-radius: 10px; padding: 12px 16px; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .95rem; overflow-x: auto; margin: 12px 0; }
.cf-grid3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.cf-mini { background: #fff; border: 1px solid var(--cf-linha); border-radius: 12px; padding: 14px 16px; }
.cf-mini h3 { margin-top: 0; font-size: 1rem; }
.cf-mini p { margin: 0; font-size: .92rem; }
.cf-faq details { background: #fff; border: 1px solid var(--cf-linha); border-radius: 12px; margin-bottom: 8px; }
.cf-faq summary { cursor: pointer; padding: 13px 16px; font-weight: 650; color: var(--cf-azul); }
.cf-faq details p { margin: 0; padding: 0 16px 14px; }
.cf-veja { display: flex; flex-wrap: wrap; gap: 10px; padding: 0; list-style: none; }
.cf-veja a { display: block; background: #fff; border: 1px solid var(--cf-linha); border-radius: 10px; padding: 9px 14px; font-weight: 600; text-decoration: none; }
.cf-veja a:hover { background: var(--cf-suave); }
.cf-aviso-legal { font-size: .88rem; color: var(--cf-ink-2); border-top: 1px solid var(--cf-linha); padding-top: 14px; }

.cf-rodape { background: #fff; border-top: 1px solid var(--cf-linha); padding: 22px 0; text-align: center; font-size: .86rem; color: var(--cf-ink-2); }
.cf-rodape a { color: var(--cf-acao-esc); }
.cf-rodape p { margin: 4px 0; }

@media (max-width: 899.98px) {
    .cf-grade { grid-template-columns: minmax(0, 1fr); }
    .cf-painel { position: static; }
    .cf-grid3 { grid-template-columns: minmax(0, 1fr); }
    .cf-hero h1 { font-size: 1.7rem; }
}
@media (max-width: 767.98px) {
    .cf-menu-bt { display: inline-flex; }
    .cf-barra-menu { display: none; border-top: 1px solid var(--cf-linha); }
    .cf-barra-menu.cf-aberto { display: block; }
    .cf-nav { flex-direction: column; flex-wrap: nowrap; gap: 2px; padding: 8px 0 12px; }
    .cf-nav a { padding: 13px 14px; font-size: 1rem; }
    .cf-hero { padding-top: 22px; }
    .cf-hero p { font-size: .98rem; }
    .cf-selos { margin-top: 12px; }
    .cf-selos li { font-size: .8rem; padding: 3px 11px; }
}
@media (max-width: 480px) {
    .cf-card { padding: 16px; }
    .cf-par { grid-template-columns: minmax(0, 1fr); gap: 0; }
    .cf-par.cf-par-fixo { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
    .cf-dest-n, .cf-dest-v { font-size: 1.9rem; }
    .cf-linha { font-size: .9rem; gap: 10px; }
}

/* ── Documento (impressão e PDF) ─────────────────────────── */
.cf-doc { font-family: Arial, Helvetica, sans-serif; color: #111; font-size: 10pt; line-height: 1.45; }
.cf-doc-topo { display: flex; justify-content: space-between; align-items: baseline; border-bottom: 2px solid #1a3a5c; padding-bottom: 3mm; margin-bottom: 4mm; }
.cf-doc-marca { font-size: 17pt; font-weight: 700; color: #1a3a5c; }
.cf-doc-marca span { color: #c97d00; }
.cf-doc-data { font-size: 9pt; color: #555; }
.cf-doc h1 { font-size: 15pt; margin: 0 0 3mm; color: #1a3a5c; }
.cf-doc h2 { font-size: 11.5pt; margin: 6mm 0 2mm; color: #1a3a5c; }
.cf-doc-aviso { background: #fff7e6; border: 1px solid #e3c47a; padding: 2mm 3mm; border-radius: 2mm; font-size: 9pt; margin: 0 0 4mm; }
.cf-doc-destaque { background: #eaf3fc; border: 1px solid #9ec2e6; border-radius: 3mm; padding: 4mm; text-align: center; margin-bottom: 4mm; }
.cf-doc-destaque span { font-size: 13pt; }
.cf-doc-destaque strong { font-size: 20pt; color: #1a3a5c; margin-left: 2mm; }
.cf-doc-destaque em { display: block; font-style: normal; margin-top: 1.5mm; font-weight: 700; color: #1a3a5c; }
.cf-doc-tab { width: 100%; border-collapse: collapse; }
.cf-doc-tab th { text-align: left; font-weight: 400; padding: 1.6mm 2mm; border-bottom: 1px solid #d5dee8; width: 58%; }
.cf-doc-tab td { text-align: right; font-weight: 700; padding: 1.6mm 2mm; border-bottom: 1px solid #d5dee8; }
.cf-doc-forte th, .cf-doc-forte td { background: #f1f6fb; font-weight: 700; }
.cf-doc-nota { font-size: 8.5pt; color: #444; margin: 2.5mm 0 0; }
.cf-doc-tab2 { width: 100%; border-collapse: collapse; font-size: 8.5pt; }
.cf-doc-tab2 th { background: #eef4fa; text-align: right; padding: 1mm 2mm; }
.cf-doc-tab2 td { text-align: right; padding: .8mm 2mm; border-bottom: 1px solid #e1e8f0; }
.cf-doc-tab2 th:first-child, .cf-doc-tab2 td:first-child { text-align: left; }
.cf-doc-rodape { margin-top: 6mm; font-size: 8pt; color: #555; border-top: 1px solid #ccc; padding-top: 2mm; }
#cf-print { display: none; }
@media print {
    @page { size: A4; margin: 8mm 10mm; }
    body > *:not(#cf-print) { display: none !important; }
    #cf-print { display: block !important; }
    #cf-print tr, #cf-print .cf-doc-destaque { break-inside: avoid; }
}