/* CriarContrato — design v2 (handoff Claude Design), mobile-first, sem framework
   Tokens derivados do accent #0bb35f e dark #081d2c do protótipo. */

:root {
    --accent: #0bb35f;
    --accent-escuro: #098f4c;      /* accent + 20% preto */
    --accent-deep: #066837;        /* accent + 42% preto */
    --accent-light: #60ce97;       /* accent + 35% branco */
    --accent-tint: #e7f7ef;        /* accent + 90% branco */
    --accent-tint-borda: #c2ecd7;  /* accent + 75% branco */
    --accent-rgb: 11, 179, 95;

    --dark: #081d2c;
    --tinta: #0c1b26;
    --texto: #2c3e4c;
    --cinza: #5a6b7a;
    --cinza-suave: #8296a3;
    --borda: #e6edf1;
    --fundo: #f7fafb;
    --branco: #ffffff;
    --erro: #dc2626;
    --amarelo: #fef3c7;

    --raio: 16px;
    --raio-card: 22px;
    --sombra: 0 8px 28px rgba(10, 31, 48, .07);
    --sombra-card: 0 22px 55px rgba(10, 31, 48, .12);

    --fonte-titulo: 'Sora', system-ui, sans-serif;
    --fonte-texto: 'Instrument Sans', system-ui, sans-serif;

    /* aliases da v1 (views antigas ainda referenciam) */
    --verde: var(--accent);
    --verde-escuro: var(--accent-escuro);
    --azul: var(--accent);
    --cinza-claro: var(--borda);
}

* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
    margin: 0;
    font-family: var(--fonte-texto);
    color: var(--tinta);
    background: var(--fundo);
    line-height: 1.6;
    font-size: 16px;
    -webkit-font-smoothing: antialiased;
}

.container { max-width: 720px; margin: 0 auto; padding: 0 16px; }
.container-largo { max-width: 1100px; margin: 0 auto; padding: 0 20px; }

a { color: #1c5d8f; text-decoration: none; }
a:hover { color: #0e3f66; }

h1, h2, h3 { font-family: var(--fonte-titulo); color: var(--tinta); }

:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

@keyframes fadeUp { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }

/* ---------- Header flutuante (pílula) ---------- */

.topo {
    position: sticky;
    top: 12px;
    z-index: 50;
    padding: 0 16px;
}

.topo-inner {
    max-width: 1060px;
    margin: 0 auto;
    background: rgba(255, 255, 255, .85);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid #e3ebf0;
    border-radius: 999px;
    padding: 10px 12px 10px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    box-shadow: var(--sombra);
}

.logo {
    display: flex;
    align-items: center;
    gap: 9px;
    text-decoration: none;
}

.logo-marca {
    width: 30px;
    height: 30px;
    border-radius: 9px;
    background: linear-gradient(135deg, var(--accent), var(--accent-escuro));
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-family: var(--fonte-titulo);
    font-weight: 800;
    font-size: 15px;
}

.logo-nome {
    font-family: var(--fonte-titulo);
    font-weight: 700;
    font-size: 16.5px;
    letter-spacing: -0.01em;
    color: var(--tinta);
}

.topo-cta {
    background: var(--tinta);
    color: #fff !important;
    font-weight: 600;
    font-size: 14px;
    padding: 11px 20px;
    border-radius: 999px;
    white-space: nowrap;
    transition: background .15s ease;
}

.topo-cta:hover { background: var(--accent); }

.selo-lei {
    font-size: .78rem;
    font-weight: 600;
    color: var(--accent-deep);
    background: var(--accent-tint);
    border: 1px solid var(--accent-tint-borda);
    padding: 5px 12px;
    border-radius: 999px;
    white-space: nowrap;
}

/* ---------- Botões ---------- */

.btn {
    display: inline-block;
    width: 100%;
    text-align: center;
    padding: 16px 28px;
    border: 0;
    border-radius: 999px;
    font-family: var(--fonte-titulo);
    font-size: 1.02rem;
    font-weight: 700;
    cursor: pointer;
    text-decoration: none;
    transition: background .15s ease, transform .15s ease, box-shadow .15s ease;
}

.btn-primario {
    background: var(--accent);
    color: #fff !important;
    box-shadow: 0 10px 30px rgba(var(--accent-rgb), .32);
}

.btn-primario:hover {
    background: var(--accent-escuro);
    transform: translateY(-2px);
    box-shadow: 0 14px 36px rgba(var(--accent-rgb), .4);
}

.btn-secundario {
    background: var(--branco);
    color: var(--tinta) !important;
    border: 1.5px solid var(--borda);
    font-weight: 600;
}

.btn-secundario:hover { border-color: var(--cinza-suave); }

/* ---------- Landing: hero ---------- */

.lp-hero {
    position: relative;
    overflow: hidden;
    padding: 56px 20px 90px;
}

.lp-hero-glow-1, .lp-hero-glow-2 { position: absolute; pointer-events: none; }

.lp-hero-glow-1 {
    top: -180px; left: 50%; transform: translateX(-50%);
    width: 900px; height: 600px;
    background: radial-gradient(closest-side, rgba(var(--accent-rgb), .14), transparent 70%);
}

.lp-hero-glow-2 {
    bottom: -220px; right: -140px;
    width: 640px; height: 640px;
    background: radial-gradient(closest-side, rgba(28, 93, 143, .12), transparent 70%);
}

.lp-hero-inner {
    position: relative;
    max-width: 1100px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    gap: 56px;
    align-items: center;
}

.lp-hero-texto { flex: 1 1 380px; min-width: 300px; animation: fadeUp .5s ease both; }

.lp-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1px solid var(--accent-tint-borda);
    color: var(--accent-deep);
    font-size: 13px;
    font-weight: 600;
    padding: 7px 14px;
    border-radius: 999px;
    margin-bottom: 22px;
    box-shadow: 0 2px 10px rgba(var(--accent-rgb), .08);
}

.lp-badge::before {
    content: "";
    width: 7px; height: 7px;
    border-radius: 50%;
    background: var(--accent);
}

.lp-h1 {
    font-weight: 800;
    font-size: clamp(34px, 5.6vw, 56px);
    line-height: 1.06;
    margin: 0 0 18px;
    letter-spacing: -0.032em;
    text-wrap: pretty;
}

.grad-text {
    background: linear-gradient(120deg, var(--accent), var(--accent-escuro));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.lp-sub {
    font-size: clamp(16px, 2vw, 18.5px);
    line-height: 1.55;
    color: #4a5d6b;
    margin: 0 0 30px;
    max-width: 44ch;
    text-wrap: pretty;
}

.lp-hero-acoes { display: flex; flex-direction: column; gap: 14px; align-items: flex-start; }

.lp-hero-acoes .btn { width: auto; font-size: 18px; padding: 18px 36px; }

.lp-micro { font-size: 13.5px; color: var(--cinza); margin: 0; }
.lp-micro strong { color: var(--tinta); }

.chips { display: flex; flex-wrap: wrap; gap: 8px; padding: 0; margin: 0; list-style: none; }

.chip {
    background: #fff;
    border: 1px solid var(--borda);
    border-radius: 999px;
    padding: 6px 13px;
    font-size: 13px;
    font-weight: 500;
    color: #4a5d6b;
}

/* Hero: demo animado do wizard */

.demo-wrap { flex: 1 1 320px; min-width: 290px; display: flex; justify-content: center; }

.demo-card {
    position: relative;
    width: min(380px, 100%);
    background: #fff;
    border: 1px solid var(--borda);
    border-radius: var(--raio-card);
    box-shadow: 0 30px 70px rgba(10, 31, 48, .16);
    padding: 26px 26px 24px;
    animation: fadeUp .6s ease both;
}

.demo-topo { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.demo-titulo { font-family: var(--fonte-titulo); font-weight: 700; font-size: 15px; }

.demo-passo {
    background: #f2f6f8;
    color: var(--cinza);
    font-size: 12px;
    font-weight: 600;
    padding: 5px 11px;
    border-radius: 999px;
    white-space: nowrap;
}

.demo-track { height: 6px; background: #eef3f6; border-radius: 999px; overflow: hidden; margin-bottom: 20px; }
.demo-fill { height: 6px; border-radius: 999px; background: var(--accent); width: 0%; transition: width .35s ease; }

.demo-campos { display: flex; flex-direction: column; gap: 14px; }
.demo-campo-rotulo { font-size: 12.5px; font-weight: 600; color: var(--cinza); margin-bottom: 6px; }

.demo-campo-caixa {
    border: 1.5px solid var(--borda);
    background: #fff;
    border-radius: 12px;
    padding: 12px 14px;
    min-height: 21px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    font-size: 14px;
    font-weight: 500;
    transition: border-color .25s, background .25s;
}

.demo-campo-caixa.ativo { border-color: var(--accent); }
.demo-campo-caixa.completo { border-color: var(--accent-tint-borda); background: var(--accent-tint); }
.demo-check { color: var(--accent); font-weight: 700; font-size: 14px; }

.demo-btn {
    margin-top: 20px;
    background: #eef3f6;
    color: #93a5b1;
    font-family: var(--fonte-titulo);
    font-weight: 700;
    font-size: 15px;
    padding: 14px;
    border-radius: 999px;
    text-align: center;
    transition: background .35s, color .35s, box-shadow .35s;
}

.demo-btn.pronto {
    background: var(--accent);
    color: #fff;
    box-shadow: 0 8px 22px rgba(var(--accent-rgb), .3);
}

.demo-toast {
    position: absolute;
    top: -15px; right: -8px;
    background: var(--tinta);
    color: #fff;
    font-size: 11.5px;
    font-weight: 600;
    padding: 8px 14px;
    border-radius: 999px;
    box-shadow: 0 8px 20px rgba(12, 27, 38, .3);
    opacity: 0;
    transform: scale(.85);
    transition: opacity .3s, transform .3s;
}

.demo-toast.visivel { opacity: 1; transform: scale(1); }

.demo-selo-tempo {
    position: absolute;
    bottom: -20px; left: -18px;
    background: #fff;
    border: 1px solid #e3ebf0;
    border-radius: 14px;
    padding: 10px 14px;
    display: flex;
    align-items: center;
    gap: 9px;
    box-shadow: 0 10px 26px rgba(10, 31, 48, .12);
    font-size: 11.5px;
    font-weight: 600;
    line-height: 1.25;
}

.demo-selo-tempo .icone {
    width: 28px; height: 28px;
    border-radius: 8px;
    background: var(--accent-tint);
    color: var(--accent-deep);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 13px;
}

.demo-selo-tempo small { font-weight: 400; color: var(--cinza-suave); display: block; }

/* ---------- Landing: seções ---------- */

.lp-secao { padding: 40px 20px 80px; }

.lp-kicker {
    display: inline-block;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: .1em;
    color: var(--accent-deep);
    margin-bottom: 12px;
    text-transform: uppercase;
}

.lp-h2 {
    font-weight: 700;
    font-size: clamp(26px, 3.8vw, 38px);
    margin: 0;
    letter-spacing: -0.025em;
    line-height: 1.15;
    text-wrap: pretty;
}

.lp-centro { text-align: center; margin-bottom: 44px; }

.cards-passos {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 16px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.card-passo {
    background: #fff;
    border: 1px solid var(--borda);
    border-radius: 20px;
    padding: 28px 24px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    transition: transform .2s, box-shadow .2s;
}

.card-passo:hover { transform: translateY(-4px); box-shadow: 0 16px 36px rgba(10, 31, 48, .1); }

.card-passo .num {
    font-family: var(--fonte-titulo);
    font-weight: 800;
    font-size: 15px;
    color: #fff;
    background: linear-gradient(135deg, var(--accent), var(--accent-escuro));
    width: 38px; height: 38px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.card-passo strong { font-family: var(--fonte-titulo); font-weight: 600; font-size: 17px; letter-spacing: -0.01em; }
.card-passo p { margin: 0; font-size: 14.5px; line-height: 1.55; color: var(--cinza); }

.lp-cta-meio { text-align: center; margin-top: 40px; }
.lp-cta-meio .btn { width: auto; }
.lp-cta-meio .lp-micro { margin-top: 12px; }

/* Seção escura (validade jurídica / CTA final) */

.secao-dark-wrap { padding: 0 16px; }

.secao-dark {
    max-width: 1160px;
    margin: 0 auto;
    background: var(--dark);
    color: #e8eff5;
    border-radius: 28px;
    padding: clamp(44px, 6vw, 72px) clamp(24px, 5vw, 64px);
    position: relative;
    overflow: hidden;
}

.secao-dark::before {
    content: "";
    position: absolute;
    top: -160px; right: -120px;
    width: 520px; height: 520px;
    background: radial-gradient(closest-side, rgba(var(--accent-rgb), .16), transparent 70%);
    pointer-events: none;
}

.secao-dark-inner { position: relative; display: flex; flex-wrap: wrap; gap: 44px; align-items: flex-start; }

.secao-dark .lp-h2 { color: #fff; margin-bottom: 16px; }

.badge-dark {
    display: inline-block;
    background: rgba(96, 206, 151, .12);
    border: 1px solid rgba(96, 206, 151, .3);
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: .08em;
    padding: 7px 14px;
    border-radius: 999px;
    margin-bottom: 20px;
    color: var(--accent-light);
    text-transform: uppercase;
}

.secao-dark p { font-size: 16.5px; line-height: 1.6; color: #a9bccb; margin: 0 0 16px; max-width: 52ch; }
.secao-dark p.nota { font-size: 14px; color: #7e94a6; margin: 0; }

.painel-clausulas {
    flex: 1 1 320px;
    min-width: 280px;
    background: rgba(255, 255, 255, .05);
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 20px;
    padding: 28px 26px;
}

.painel-clausulas h3 { font-weight: 600; font-size: 15.5px; margin: 0 0 18px; color: #fff; }

.grade-clausulas { display: grid; grid-template-columns: 1fr 1fr; gap: 13px 16px; padding: 0; margin: 0; list-style: none; }

.grade-clausulas li {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    font-size: 14px;
    color: #cfdde8;
    line-height: 1.35;
}

.grade-clausulas li::before { content: "✓"; color: var(--accent-light); font-weight: 700; flex-shrink: 0; }

/* O que você recebe */

.lp-duas-colunas {
    max-width: 1100px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    gap: 52px;
    align-items: center;
}

.lp-duas-colunas > div { flex: 1 1 340px; min-width: 280px; }

.doc-card-wrap { display: flex; justify-content: center; }

.doc-card {
    background: #fff;
    border: 1px solid var(--borda);
    border-radius: var(--raio-card);
    box-shadow: var(--sombra-card);
    padding: 30px 28px;
    width: min(390px, 100%);
    transform: rotate(-1deg);
}

.doc-card-titulo {
    font-family: var(--fonte-titulo);
    font-weight: 700;
    font-size: 12px;
    letter-spacing: .08em;
    text-align: center;
    border-bottom: 2px solid var(--tinta);
    padding-bottom: 10px;
    margin-bottom: 14px;
}

.doc-card-corpo { font-size: 11px; line-height: 1.75; color: #3d4f5c; }
.doc-card-corpo p { margin: 0 0 9px; }
.doc-card-corpo strong { color: var(--tinta); }

.doc-card-rodape {
    margin-top: 16px;
    padding-top: 10px;
    border-top: 1px solid #e7edf2;
    font-size: 9.5px;
    color: var(--cinza-suave);
    text-align: center;
}

.lista-recebe { display: flex; flex-direction: column; gap: 13px; padding: 0; margin: 0; list-style: none; }

.lista-recebe li {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    font-size: 15.5px;
    color: var(--texto);
    line-height: 1.45;
}

.lista-recebe li::before {
    content: "✓";
    background: var(--accent-tint);
    color: var(--accent-deep);
    width: 22px; height: 22px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    flex-shrink: 0;
    margin-top: 1px;
}

/* Prova social (ligar apenas com dados reais) */

.prova-numero { font-family: var(--fonte-titulo); font-weight: 800; font-size: clamp(40px, 6vw, 64px); letter-spacing: -0.03em; line-height: 1; }
.prova-legenda { font-size: 17px; color: #4a5d6b; margin-top: 8px; }

.depoimentos { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 16px; padding: 0; margin: 0; list-style: none; }

.depoimento {
    background: #fff;
    border: 1px solid var(--borda);
    border-radius: 20px;
    padding: 28px 26px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.depoimento.destaque { background: var(--accent-tint); border-color: var(--accent-tint-borda); }
.depoimento .estrelas { color: var(--accent); font-size: 15px; letter-spacing: 2px; }
.depoimento blockquote { margin: 0; font-size: 15px; line-height: 1.6; color: var(--texto); flex: 1; }

.depoimento .autor { display: flex; align-items: center; gap: 11px; }

.depoimento .avatar {
    width: 38px; height: 38px;
    border-radius: 50%;
    background: var(--tinta);
    color: #fff;
    font-family: var(--fonte-titulo);
    font-weight: 700;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.depoimento .nome { font-weight: 600; font-size: 14px; }
.depoimento .papel { font-size: 12.5px; color: var(--cinza); }

/* FAQ */

.faq-lista { display: flex; flex-direction: column; gap: 10px; max-width: 720px; margin: 0 auto; }

.faq-item { background: #fff; border: 1px solid var(--borda); border-radius: 16px; padding: 0 22px; }

.faq-item summary {
    cursor: pointer;
    list-style: none;
    padding: 18px 0;
    font-weight: 600;
    font-size: 15.5px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

.faq-item summary::-webkit-details-marker { display: none; }

.faq-icone { color: var(--accent); font-size: 19px; flex-shrink: 0; transition: transform .2s ease; }

.faq-item[open] .faq-icone { transform: rotate(45deg); }

.faq-item .resposta { padding: 0 0 20px; font-size: 14.5px; line-height: 1.6; color: #4a5d6b; }

/* CTA final escuro */

.cta-final-dark { text-align: center; }
.cta-final-dark::before { top: -140px; left: 50%; right: auto; transform: translateX(-50%); width: 700px; height: 420px; }
.cta-final-dark .lp-h2 { font-weight: 800; font-size: clamp(28px, 4.5vw, 44px); margin-bottom: 14px; }
.cta-final-dark p { margin: 0 auto 30px; }
.cta-final-dark .btn { width: auto; font-size: 18px; padding: 18px 40px; }
.cta-final-dark .lp-micro { color: #7e94a6; margin-top: 16px; }

/* ---------- Wizard ---------- */

.wizard-wrap { padding-top: 26px; padding-bottom: 60px; }

.progresso-linha { display: flex; align-items: center; gap: 12px; margin-bottom: 6px; }

.progresso-track { flex: 1; height: 6px; background: #eef3f6; border-radius: 999px; overflow: hidden; }
.progresso-fill { height: 6px; border-radius: 999px; background: var(--accent); transition: width .35s ease; }

.progresso-chip {
    background: #f2f6f8;
    color: var(--cinza);
    font-size: 12px;
    font-weight: 600;
    padding: 5px 11px;
    border-radius: 999px;
    white-space: nowrap;
}

.progresso-rotulo { font-size: .8rem; color: var(--cinza); margin: 0 0 18px; }

.cartao {
    background: var(--branco);
    border: 1px solid var(--borda);
    border-radius: var(--raio-card);
    box-shadow: var(--sombra);
    padding: 24px 20px;
}

.cartao h1 {
    font-size: 1.35rem;
    margin: 0 0 4px;
    letter-spacing: -0.02em;
    font-weight: 700;
}

.cartao .ajuda { color: var(--cinza); font-size: .93rem; margin: 0 0 20px; }

fieldset { border: 0; padding: 0; margin: 0 0 20px; }

legend {
    font-family: var(--fonte-titulo);
    font-weight: 600;
    font-size: 1.02rem;
    padding: 0;
    margin-bottom: 10px;
}

.grupo { margin-bottom: 16px; }

label.rotulo { display: block; font-weight: 600; font-size: .9rem; margin-bottom: 6px; }

.dica { font-weight: 400; color: var(--cinza); font-size: .85rem; }

input[type="text"],
input[type="email"],
input[type="date"],
input[type="number"],
input[type="tel"],
select {
    width: 100%;
    padding: 13px 14px;
    font-size: 1rem;
    border: 1.5px solid var(--borda);
    border-radius: 12px;
    background: var(--branco);
    color: var(--tinta);
    font-family: var(--fonte-texto);
    appearance: none;
    transition: border-color .15s ease;
}

input:focus, select:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(var(--accent-rgb), .15);
}

.campo-erro { border-color: var(--erro) !important; }

.msg-erro { color: var(--erro); font-size: .85rem; margin-top: 4px; display: block; }

.alerta-erros {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: var(--erro);
    border-radius: var(--raio);
    padding: 12px 14px;
    font-size: .9rem;
    margin-bottom: 18px;
}

.linha-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

/* Faixa de reasseguro (etapa 1) — reduz ansiedade de preço/tempo */
.reasseguro {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
    justify-content: center;
    list-style: none;
    margin: 0 0 16px;
    padding: 12px 14px;
    background: var(--accent-tint);
    border: 1px solid var(--accent-tint-borda);
    border-radius: 12px;
}
.reasseguro li {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: .84rem;
    font-weight: 600;
    color: var(--accent-deep);
}
.reasseguro li span { font-size: .95rem; }

/* Cards de escolha grandes (etapa 1) com auto-avançar */

.cards-escolha { display: grid; gap: 10px; }

.card-escolha {
    position: relative;
    display: flex;
    align-items: center;
    gap: 14px;
    border: 1.5px solid var(--borda);
    border-radius: 14px;
    padding: 16px 16px 16px 18px;
    cursor: pointer;
    background: var(--branco);
    transition: border-color .15s ease, background .15s ease, transform .1s ease, box-shadow .15s ease;
}

.card-escolha:hover { border-color: var(--accent-tint-borda); }
.card-escolha input { position: absolute; opacity: 0; pointer-events: none; }

.card-escolha-icone {
    flex-shrink: 0;
    width: 46px; height: 46px;
    border-radius: 12px;
    background: var(--fundo);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.5rem;
    transition: background .15s ease;
}

.card-escolha-texto { flex: 1; min-width: 0; }
.card-escolha-texto strong { display: block; font-size: 1.05rem; letter-spacing: -0.01em; }
.card-escolha-texto small { color: var(--cinza); font-size: .88rem; }

.card-escolha-check {
    flex-shrink: 0;
    width: 24px; height: 24px;
    border-radius: 50%;
    border: 2px solid var(--cinza-claro);
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: .8rem; font-weight: 800;
    transition: background .15s ease, border-color .15s ease;
}

.card-escolha:has(input:checked) {
    border-color: var(--accent);
    background: var(--accent-tint);
    box-shadow: 0 0 0 3px rgba(var(--accent-rgb), .12);
}
.card-escolha:has(input:checked) .card-escolha-icone { background: #fff; }
.card-escolha:has(input:checked) .card-escolha-check { background: var(--accent); border-color: var(--accent); }
.card-escolha:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; }
.card-escolha.avancando { transform: scale(.99); }

/* Cards de opção (radio) */

.opcoes { display: grid; gap: 10px; }

.opcao {
    position: relative;
    display: block;
    border: 1.5px solid var(--borda);
    border-radius: 14px;
    padding: 14px 14px 14px 46px;
    cursor: pointer;
    background: var(--branco);
    transition: border-color .15s ease, background .15s ease;
}

.opcao input {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    accent-color: var(--accent);
}

.opcao strong { display: block; font-size: 1rem; }
.opcao .desc { color: var(--cinza); font-size: .85rem; }

.opcao:has(input:checked) {
    border-color: var(--accent);
    background: var(--accent-tint);
}

.tag-recomendado {
    display: inline-block;
    background: var(--accent-tint);
    color: var(--accent-deep);
    font-size: .72rem;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 999px;
    margin-left: 6px;
    vertical-align: middle;
}

.opcao:has(input:checked) .tag-recomendado { background: #fff; }

.condicional { display: none; margin-top: 14px; }
.condicional.visivel { display: block; }

/* Aviso dentro do formulário (ex.: anuência do cônjuge do fiador) */
.callout-form {
    background: #fef3c7;
    border: 1px solid #fde68a;
    border-radius: 12px;
    padding: 12px 14px;
    margin-bottom: 14px;
    font-size: .86rem;
    line-height: 1.5;
    color: #7c5b12;
}
.callout-form strong { display: block; margin-bottom: 3px; }

.acoes { margin-top: 24px; display: grid; gap: 10px; }

/* Blocos de formulário (etapa 2: locador / locatário / imóvel) */

.bloco-form {
    border: 1px solid var(--borda);
    border-radius: 16px;
    padding: 18px 16px;
    margin-bottom: 18px;
    background: #fcfdfe;
}

.bloco-form-cabecalho {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 14px;
    margin-bottom: 16px;
    border-bottom: 1px dashed var(--borda);
}

.bloco-form-cabecalho strong {
    display: block;
    font-family: var(--fonte-titulo);
    font-size: 1.02rem;
    letter-spacing: -0.01em;
}

.bloco-form-cabecalho small { color: var(--cinza); font-size: .82rem; }

.bloco-icone {
    width: 38px;
    height: 38px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 17px;
    flex-shrink: 0;
}

.bloco-icone-locador { background: var(--accent-tint); border: 1px solid var(--accent-tint-borda); }
.bloco-icone-locatario { background: #eef4f8; border: 1px solid #dbe7ee; }
.bloco-icone-imovel { background: #fdf6e9; border: 1px solid #f5e6c8; }

/* Bloco opcional recolhível (ex.: testemunhas) */

.bloco-opcional {
    border: 1px solid var(--borda);
    border-radius: 16px;
    background: #fcfdfe;
    margin-bottom: 18px;
    overflow: hidden;
}

.bloco-opcional > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px;
    cursor: pointer;
    list-style: none;
}

.bloco-opcional > summary::-webkit-details-marker { display: none; }
.bloco-opcional > summary strong { display: block; font-family: var(--fonte-titulo); font-size: 1rem; }
.bloco-opcional > summary small { color: var(--cinza); font-size: .82rem; display: block; margin-top: 2px; }

.tag-opcional {
    display: inline-block;
    background: #eef2f5;
    color: var(--cinza);
    font-size: .68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    padding: 2px 7px;
    border-radius: 999px;
    margin-left: 4px;
    vertical-align: middle;
}

.bloco-opcional-seta { color: var(--cinza); transition: transform .2s ease; flex-shrink: 0; }
.bloco-opcional[open] .bloco-opcional-seta { transform: rotate(180deg); }
.bloco-opcional-corpo { padding: 0 16px 16px; }

/* Card dedicado do valor do aluguel (etapa 3) */

.card-valor {
    background: var(--accent-tint);
    border: 1.5px solid var(--accent-tint-borda);
    border-radius: 16px;
    padding: 18px 16px;
    margin-bottom: 18px;
    text-align: center;
}

.card-valor .rotulo { margin-bottom: 10px; }

.card-valor-campo {
    display: flex;
    align-items: center;
    gap: 10px;
    max-width: 300px;
    margin: 0 auto;
}

.card-valor-campo .prefixo {
    font-family: var(--fonte-titulo);
    font-weight: 700;
    font-size: 1.3rem;
    color: var(--accent-deep);
}

.card-valor-campo input {
    font-family: var(--fonte-titulo);
    font-size: 1.5rem;
    font-weight: 700;
    text-align: center;
    color: var(--tinta);
    background: #fff;
}

/* Grid de garantia (etapa 3) */

.opcoes-grid { display: grid; gap: 10px; }

.opcao-g {
    position: relative;
    display: block;
    border: 1.5px solid var(--borda);
    border-radius: 14px;
    padding: 16px 14px;
    cursor: pointer;
    background: var(--branco);
    text-align: center;
    transition: border-color .15s ease, background .15s ease;
}

.opcao-g input { position: absolute; opacity: 0; pointer-events: none; }

.opcao-g-icone { display: block; font-size: 1.4rem; margin-bottom: 6px; }

.opcao-g strong { display: block; font-size: .98rem; margin-bottom: 2px; }
.opcao-g .desc { color: var(--cinza); font-size: .8rem; line-height: 1.35; display: block; }

.opcao-g:has(input:checked) {
    border-color: var(--accent);
    background: var(--accent-tint);
    box-shadow: 0 0 0 3px rgba(var(--accent-rgb), .12);
}

.opcao-g:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; }

/* Pills de opção (multa, encargos) */

.pills { display: flex; flex-wrap: wrap; gap: 8px; }

.pill { position: relative; cursor: pointer; }

.pill input { position: absolute; opacity: 0; pointer-events: none; }

.pill span {
    display: inline-block;
    border: 1.5px solid var(--borda);
    background: var(--branco);
    border-radius: 999px;
    padding: 9px 16px;
    font-size: .88rem;
    font-weight: 600;
    color: var(--texto);
    transition: border-color .15s ease, background .15s ease, color .15s ease;
}

.pill:has(input:checked) span {
    border-color: var(--accent);
    background: var(--accent-tint);
    color: var(--accent-deep);
}

.pill:has(input:focus-visible) span { outline: 2px solid var(--accent); outline-offset: 2px; }

/* Campo de valor liberado abaixo de um encargo (condomínio/IPTU/água) */

.campo-valor-encargo { margin-top: 12px; max-width: 260px; }

.input-prefixo {
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1.5px solid var(--borda);
    border-radius: 12px;
    padding: 0 12px;
    background: var(--branco);
    transition: border-color .15s ease, box-shadow .15s ease;
}

.input-prefixo:focus-within {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(var(--accent-rgb), .15);
}

.input-prefixo span {
    font-family: var(--fonte-titulo);
    font-weight: 700;
    color: var(--accent-deep);
    font-size: .95rem;
}

.input-prefixo input {
    border: 0 !important;
    box-shadow: none !important;
    padding-left: 0;
    padding-right: 0;
    background: transparent;
}

/* ---------- Tela de geração (interstitial) ---------- */

.gerando-card {
    background: var(--branco);
    border: 1px solid var(--borda);
    border-radius: var(--raio-card);
    box-shadow: var(--sombra-card);
    padding: 40px 26px 34px;
    text-align: center;
    max-width: 480px;
    margin: 24px auto 0;
}

.gerando-card h1 { font-size: 1.5rem; letter-spacing: -0.02em; margin: 18px 0 4px; }
.gerando-card .ajuda { color: var(--cinza); margin: 0 0 24px; }

.gerando-anel { position: relative; width: 44px; height: 44px; margin: 0 auto; }
.gerando-anel svg { transform: rotate(-90deg); }
.anel-fundo { fill: none; stroke: var(--borda); stroke-width: 4; }
.anel-progresso {
    fill: none;
    stroke: var(--accent);
    stroke-width: 4;
    stroke-linecap: round;
    stroke-dasharray: 119.4;
    stroke-dashoffset: 119.4;
    transition: stroke-dashoffset .4s linear;
}
.gerando-check {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--accent);
    font-size: 1.4rem;
    font-weight: 800;
    opacity: 0;
    transform: scale(.5);
    transition: opacity .25s, transform .25s;
}
.gerando-anel.concluido .anel-progresso { stroke-dashoffset: 0; }
.gerando-anel.concluido svg { opacity: 0; }
.gerando-anel.concluido .gerando-check { opacity: 1; transform: scale(1); }

.gerando-passos { list-style: none; margin: 0 auto; padding: 0; max-width: 340px; text-align: left; }
.gerando-passos li {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 9px 4px;
    font-size: .95rem;
    color: var(--cinza-suave);
    opacity: .45;
    transition: opacity .3s, color .3s;
}
.gerando-passos li::before {
    content: "";
    width: 18px; height: 18px;
    border-radius: 50%;
    border: 2px solid var(--cinza-claro);
    flex-shrink: 0;
    transition: border-color .3s, background .3s;
    background-size: 11px;
    background-position: center;
    background-repeat: no-repeat;
}
.gerando-passos li.ativo {
    opacity: 1;
    color: var(--tinta);
    font-weight: 500;
}
.gerando-passos li.ativo::before {
    border-color: var(--accent);
    border-right-color: transparent;
    animation: girar .7s linear infinite;
}
.gerando-passos li.feito { opacity: 1; color: var(--tinta); }
.gerando-passos li.feito::before {
    border-color: var(--accent);
    background-color: var(--accent);
    animation: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 8.5l3.5 3.5L13 4'/%3E%3C/svg%3E");
}

@keyframes girar { to { transform: rotate(360deg); } }

/* ---------- Preview (o "wow moment") ---------- */

.preview-hero { text-align: center; margin-bottom: 18px; }

.preview-hero h1 {
    font-size: 1.6rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    margin: 0 0 6px;
}

.preview-hero .ajuda { max-width: 46ch; margin: 0 auto 16px; }

.stats-chips {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.stats-chips li {
    background: var(--branco);
    border: 1px solid var(--borda);
    border-radius: 14px;
    padding: 10px 12px;
    text-align: center;
}

.stats-chips small { display: block; color: var(--cinza); font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; font-weight: 600; }
.stats-chips strong { font-family: var(--fonte-titulo); font-size: .98rem; }

.doc-preview {
    position: relative;
    background: var(--branco);
    border: 1px solid var(--borda);
    border-radius: var(--raio-card);
    box-shadow: var(--sombra-card);
    padding: 28px 22px;
    font-family: Georgia, "Times New Roman", serif;
    font-size: .95rem;
    line-height: 1.7;
    overflow: hidden;
    user-select: none;
    -webkit-user-select: none;
    -webkit-touch-callout: none;
}

.doc-preview h1 { font-family: Georgia, serif; font-size: 1.05rem; text-align: center; text-transform: uppercase; letter-spacing: .03em; }
.doc-preview h2 { font-family: Georgia, serif; font-size: .95rem; text-transform: uppercase; margin-top: 22px; }
.doc-preview p { text-align: justify; }

/* Prévia truncada: só o começo do contrato chega ao navegador; o corte
   com fade + cadeado sinaliza que o restante é liberado após o pagamento. */
.doc-truncado { padding-bottom: 96px; }

.doc-corte {
    position: absolute;
    left: 0; right: 0; bottom: 52px;
    height: 130px;
    background: linear-gradient(180deg, transparent, var(--branco) 78%);
    z-index: 6;
    pointer-events: none;
}

.doc-cadeado {
    position: absolute;
    left: 0; right: 0; bottom: 0;
    padding: 16px;
    display: flex;
    justify-content: center;
    z-index: 7;
}

.doc-cadeado-selo {
    background: var(--tinta);
    color: #fff;
    font-family: var(--fonte-titulo);
    font-size: .82rem;
    font-weight: 600;
    padding: 9px 18px;
    border-radius: 999px;
    box-shadow: var(--sombra);
    text-align: center;
}

/* Marca d'água em tile SVG — cobre o documento inteiro, em qualquer altura */
.marca-dagua {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 5;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='360' height='250'%3E%3Ctext x='10' y='140' transform='rotate(-30 180 125)' font-family='Arial' font-size='24' font-weight='bold' fill='rgba(11,179,95,0.11)'%3ECRIARCONTRATO.COM.BR%3C/text%3E%3C/svg%3E");
    background-repeat: repeat;
}

.preview-acoes-doc { text-align: center; margin-top: 14px; }
.preview-acoes-doc .btn { width: auto; }
.preview-acoes-doc .dica { display: block; margin-top: 10px; }

.badges-garantia {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
    padding: 0;
    margin: 18px 0 0;
    list-style: none;
}

.badges-garantia li {
    background: var(--branco);
    border: 1px solid var(--borda);
    border-radius: 999px;
    padding: 9px 12px;
    font-size: .82rem;
    font-weight: 600;
    color: var(--texto);
    text-align: center;
}

/* Bloco de oferta + quebra de objeções (revelação do preço no preview) */
.oferta {
    background: var(--branco);
    border: 1px solid var(--borda);
    border-radius: var(--raio-card);
    box-shadow: var(--sombra);
    padding: 22px 20px;
    margin-top: 18px;
}

.oferta-preco {
    text-align: center;
    padding-bottom: 18px;
    margin-bottom: 16px;
    border-bottom: 1px dashed var(--borda);
}
.oferta-preco-rotulo { display: block; font-size: .82rem; color: var(--cinza); text-transform: uppercase; letter-spacing: .05em; font-weight: 600; }
.oferta-preco-valor { display: block; font-family: var(--fonte-titulo); font-weight: 800; font-size: 2.4rem; letter-spacing: -0.02em; line-height: 1.1; margin: 4px 0 2px; color: var(--accent-deep); }
.oferta-preco-nota { display: block; font-size: .85rem; color: var(--cinza); }

.oferta-objecoes { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.oferta-objecoes li {
    display: flex;
    gap: 11px;
    align-items: flex-start;
    font-size: .92rem;
    color: var(--texto);
    line-height: 1.45;
}
.oferta-objecoes li span { font-size: 1.05rem; flex-shrink: 0; line-height: 1.2; }
.oferta-objecoes strong { color: var(--tinta); }

.cta-fixa {
    position: sticky;
    bottom: 0;
    background: linear-gradient(0deg, var(--fundo) 75%, transparent);
    padding: 18px 0 14px;
    margin-top: 8px;
}

.cta-fixa .nota { text-align: center; font-size: .8rem; color: var(--cinza); margin: 8px 0 0; }

.aviso-impressao { display: none; }

/* Imprimir a prévia não leva o contrato: só o PDF pago imprime */
@media print {
    .doc-preview, .cta-fixa, .topo, .rodape-site, .badges-garantia, .preview-acoes-doc { display: none !important; }
    .aviso-impressao { display: block; text-align: center; font-size: 1rem; padding: 40px 0; }
}

/* ---------- Checkout ---------- */

.resumo { list-style: none; margin: 0 0 18px; padding: 0; }

.resumo li {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px dashed var(--borda);
    font-size: .97rem;
}

.resumo li span:last-child { white-space: nowrap; }

.resumo li.total {
    border-bottom: 0;
    font-family: var(--fonte-titulo);
    font-weight: 800;
    font-size: 1.15rem;
    padding-top: 14px;
}

.bump {
    display: block;
    border: 2px dashed var(--accent);
    background: var(--accent-tint);
    border-radius: var(--raio);
    padding: 16px 16px 16px 48px;
    position: relative;
    cursor: pointer;
    margin-bottom: 18px;
}

.bump input {
    position: absolute;
    left: 16px;
    top: 20px;
    width: 22px;
    height: 22px;
    accent-color: var(--accent);
}

.bump strong { font-size: 1rem; }
.bump .bump-preco { color: var(--accent-deep); font-weight: 800; }
.bump p { margin: 6px 0 0; font-size: .88rem; color: #374151; }

/* PIX */

.pix-box { text-align: center; }

.pix-qr {
    width: 240px;
    height: 240px;
    margin: 0 auto 14px;
    border: 1px solid var(--borda);
    border-radius: var(--raio);
    background: var(--branco);
}

.pix-codigo {
    width: 100%;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: .78rem;
    padding: 12px;
    border: 1.5px dashed var(--borda);
    border-radius: var(--raio);
    background: var(--fundo);
    word-break: break-all;
    margin-bottom: 10px;
}

.pix-expira {
    font-size: .9rem;
    color: #b45309;
    background: #fef3c7;
    border: 1px solid #fde68a;
    border-radius: 999px;
    display: inline-block;
    padding: 6px 16px;
    margin: 0 0 12px;
}

.pix-expira strong { font-variant-numeric: tabular-nums; }

.prova-pagamento {
    background: var(--branco);
    border: 1px solid var(--borda);
    border-radius: var(--raio-card);
    padding: 18px 20px;
    margin-top: 14px;
}

.prova-pagamento-imagem {
    display: block;
    max-width: 100%;
    max-height: 120px;
    margin: 0 auto 12px;
    border-radius: 10px;
}

.prova-pagamento ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 9px; }
.prova-pagamento li { font-size: .9rem; color: var(--texto); font-weight: 500; }

.pix-status { margin-top: 16px; font-size: .95rem; color: var(--cinza); }

.pix-status .pulsando::before {
    content: "●";
    color: #f59e0b;
    margin-right: 6px;
    animation: pulsa 1.2s infinite;
}

@keyframes pulsa { 50% { opacity: .3; } }

/* Sucesso / downloads */

.lista-downloads { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }

.lista-downloads a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: var(--branco);
    border: 1.5px solid var(--borda);
    border-radius: 14px;
    padding: 14px 16px;
    text-decoration: none;
    color: var(--tinta);
    font-weight: 600;
}

.lista-downloads a:hover { border-color: var(--accent); }

.icone-ok {
    display: inline-flex;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--accent-tint);
    color: var(--accent);
    font-size: 1.8rem;
    align-items: center;
    justify-content: center;
    margin-bottom: 12px;
}

/* ---------- Página-artigo (educacional / SEO) ---------- */

.artigo-hero {
    position: relative;
    overflow: hidden;
    padding: 48px 20px 40px;
    text-align: center;
}

.artigo-hero .lp-hero-glow-1 { top: -220px; }

.artigo-hero h1 {
    font-size: clamp(28px, 5vw, 46px);
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1.1;
    margin: 14px 0 14px;
    text-wrap: pretty;
}

.artigo-hero .sub {
    color: #4a5d6b;
    font-size: clamp(15px, 2vw, 18px);
    max-width: 52ch;
    margin: 0 auto 22px;
    text-wrap: pretty;
}

.artigo-layout {
    max-width: 1100px;
    margin: 0 auto;
    padding: 20px 20px 60px;
    display: grid;
    gap: 32px;
}

.artigo-toc {
    background: var(--branco);
    border: 1px solid var(--borda);
    border-radius: var(--raio-card);
    padding: 20px 22px;
}

.artigo-toc strong {
    display: block;
    font-family: var(--fonte-titulo);
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--accent-deep);
    margin-bottom: 12px;
}

.artigo-toc ol { margin: 0; padding: 0; list-style: none; counter-reset: toc; }

.artigo-toc li { counter-increment: toc; margin-bottom: 2px; }

.artigo-toc a {
    display: flex;
    gap: 10px;
    padding: 7px 8px;
    border-radius: 8px;
    color: var(--texto);
    font-size: .92rem;
    line-height: 1.35;
}

.artigo-toc a::before {
    content: counter(toc);
    flex: 0 0 22px;
    height: 22px;
    background: var(--accent-tint);
    color: var(--accent-deep);
    border-radius: 6px;
    font-size: .75rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

.artigo-toc a:hover { background: var(--fundo); color: var(--accent-deep); }

.artigo-conteudo { min-width: 0; }

.artigo-secao {
    background: var(--branco);
    border: 1px solid var(--borda);
    border-radius: var(--raio-card);
    padding: 26px 22px;
    margin-bottom: 16px;
    scroll-margin-top: 80px;
}

.artigo-secao h2 {
    font-size: 1.4rem;
    letter-spacing: -0.02em;
    margin: 0 0 6px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.artigo-secao h2 .n {
    flex: 0 0 34px;
    height: 34px;
    background: linear-gradient(135deg, var(--accent), var(--accent-escuro));
    color: #fff;
    border-radius: 10px;
    font-size: .95rem;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
}

.artigo-secao h3 { font-size: 1.05rem; margin: 18px 0 6px; }

.artigo-secao p { color: var(--texto); margin: 0 0 12px; }

.artigo-secao ul, .artigo-secao ol { margin: 0 0 12px; padding-left: 20px; color: var(--texto); }
.artigo-secao li { margin-bottom: 7px; }

.artigo-secao .lei-ref {
    font-size: .82rem;
    color: var(--cinza);
    font-style: italic;
}

.callout {
    border-radius: 12px;
    padding: 14px 16px;
    margin: 14px 0;
    font-size: .93rem;
    border: 1px solid;
}

.callout strong { display: block; margin-bottom: 3px; }

.callout-info { background: var(--accent-tint); border-color: var(--accent-tint-borda); color: #14532d; }
.callout-alerta { background: #fef3c7; border-color: #fde68a; color: #7c5b12; }

.tabela-info {
    width: 100%;
    border-collapse: collapse;
    margin: 12px 0;
    font-size: .9rem;
}

.tabela-info th, .tabela-info td {
    border: 1px solid var(--borda);
    padding: 9px 11px;
    text-align: left;
    vertical-align: top;
}

.tabela-info th {
    background: var(--fundo);
    font-family: var(--fonte-titulo);
    font-size: .82rem;
    text-transform: uppercase;
    letter-spacing: .03em;
}

.tabela-scroll { overflow-x: auto; }

.artigo-cta {
    background: var(--dark);
    color: #e8eff5;
    border-radius: var(--raio-card);
    padding: 28px 24px;
    text-align: center;
    margin: 16px 0;
    position: relative;
    overflow: hidden;
}

.artigo-cta::before {
    content: "";
    position: absolute;
    top: -120px; left: 50%;
    transform: translateX(-50%);
    width: 500px; height: 340px;
    background: radial-gradient(closest-side, rgba(var(--accent-rgb), .18), transparent 70%);
}

.artigo-cta h2 { color: #fff; font-size: 1.35rem; margin: 0 0 8px; position: relative; }
.artigo-cta p { color: #a9bccb; margin: 0 0 18px; position: relative; }
.artigo-cta .btn { width: auto; position: relative; }

.artigo-disclaimer {
    font-size: .82rem;
    color: var(--cinza-suave);
    border-top: 1px solid var(--borda);
    padding-top: 16px;
    margin-top: 8px;
}

@media (min-width: 900px) {
    .artigo-layout { grid-template-columns: 260px 1fr; align-items: start; }
    .artigo-toc { position: sticky; top: 84px; }
    .artigo-secao { padding: 30px 32px; }
}

/* Código de acompanhamento na página de sucesso */
.codigo-acompanhamento {
    background: var(--accent-tint);
    border: 1px dashed var(--accent-tint-borda);
    border-radius: var(--raio);
    padding: 16px;
    margin-top: 20px;
    text-align: center;
}
.codigo-acompanhamento small { display: block; color: var(--accent-deep); font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; font-weight: 700; }
.codigo-acompanhamento strong { display: block; font-family: var(--fonte-titulo); font-size: 1.7rem; letter-spacing: .12em; margin: 4px 0 8px; }
.codigo-acompanhamento p { font-size: .82rem; color: var(--texto); margin: 0; }

/* ---------- Verificação pública ---------- */

.verificar-hero { text-align: center; margin-bottom: 18px; }
.verificar-icone { font-size: 2.2rem; }
.verificar-hero h1 { font-size: 1.6rem; letter-spacing: -0.02em; margin: 8px 0 4px; }
.verificar-hero .ajuda { max-width: 42ch; margin: 0 auto; }

.verificar-form { max-width: 460px; margin: 0 auto; }
.verificar-form #codigo { text-align: center; font-family: var(--fonte-titulo); font-size: 1.3rem; letter-spacing: .12em; text-transform: uppercase; }
.verificar-form .btn { margin-top: 12px; }

.verificar-resultado {
    max-width: 560px;
    margin: 18px auto 0;
    display: flex;
    gap: 14px;
    align-items: flex-start;
    border-radius: var(--raio);
    padding: 16px 18px;
    border: 1px solid;
}
.verificar-resultado strong { display: block; font-size: 1.05rem; }
.verificar-resultado p { margin: 4px 0 0; font-size: .9rem; }
.verificar-resultado.valido { background: var(--accent-tint); border-color: var(--accent-tint-borda); color: #14532d; }
.verificar-resultado.invalido { background: #fef2f2; border-color: #fecaca; color: #991b1b; }

.verificar-status-icone {
    flex-shrink: 0;
    width: 34px; height: 34px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-weight: 800; color: #fff; font-size: 1.1rem;
}
.verificar-resultado.valido .verificar-status-icone { background: var(--accent); }
.verificar-resultado.invalido .verificar-status-icone { background: var(--erro); }

.verificar-detalhe { max-width: 560px; margin: 12px auto 0; }
.verificar-dl { display: grid; grid-template-columns: 120px 1fr; gap: 10px 14px; margin: 0; }
.verificar-dl dt { color: var(--cinza); font-size: .9rem; }
.verificar-dl dd { margin: 0; font-weight: 500; font-size: .95rem; }
.verificar-cpf { color: var(--cinza); font-weight: 400; font-size: .85rem; display: block; }
.verificar-privacidade { font-size: .8rem; color: var(--cinza-suave); border-top: 1px solid var(--borda); padding-top: 12px; margin: 16px 0 0; }

.verificar-rodape { text-align: center; margin-top: 22px; font-size: .9rem; color: var(--cinza); }

@media (max-width: 480px) {
    .verificar-dl { grid-template-columns: 1fr; gap: 3px 0; }
    .verificar-dl dt { margin-top: 8px; }
}

/* ---------- Páginas legais ---------- */

.pagina-legal { padding: 32px 0 48px; }
.pagina-legal h1 { font-size: 1.5rem; }
.pagina-legal h2 { font-size: 1.1rem; margin-top: 28px; }
.pagina-legal p, .pagina-legal li { font-size: .95rem; color: #374151; }

/* ---------- Rodapé ---------- */

.rodape-site { padding: 36px 20px 40px; color: var(--cinza); margin-top: 40px; }

.rodape-inner { max-width: 1100px; margin: 0 auto; display: flex; flex-direction: column; gap: 20px; }

.rodape-linha {
    display: flex;
    flex-wrap: wrap;
    gap: 14px 28px;
    align-items: center;
    justify-content: space-between;
}

.rodape-logo { font-family: var(--fonte-titulo); font-weight: 700; font-size: 15px; color: var(--tinta); }

.rodape-links { display: flex; flex-wrap: wrap; gap: 10px 22px; font-size: 13.5px; }
.rodape-links a { color: var(--cinza); }
.rodape-links a:hover { color: var(--tinta); }

.rodape-disclaimer {
    font-size: 12.5px;
    line-height: 1.6;
    margin: 0;
    border-top: 1px solid var(--borda);
    padding-top: 18px;
    max-width: 78ch;
    color: var(--cinza-suave);
}

/* ---------- Painel Admin ---------- */

body.admin {
    display: flex;
    min-height: 100vh;
    background: var(--fundo);
}

.admin-side {
    width: 220px;
    flex-shrink: 0;
    background: var(--dark);
    color: #cfdde8;
    display: flex;
    flex-direction: column;
    padding: 18px 14px;
    position: sticky;
    top: 0;
    height: 100vh;
}

.admin-logo {
    display: flex;
    align-items: center;
    gap: 9px;
    color: #fff;
    font-family: var(--fonte-titulo);
    font-weight: 700;
    font-size: 1.05rem;
    text-decoration: none;
    margin-bottom: 22px;
}

.admin-nav { display: flex; flex-direction: column; gap: 3px; flex: 1; }

.admin-nav a {
    color: #a9bccb;
    text-decoration: none;
    padding: 10px 12px;
    border-radius: 10px;
    font-size: .95rem;
    font-weight: 500;
}

.admin-nav a:hover { background: rgba(255, 255, 255, .06); color: #fff; }
.admin-nav a.ativo { background: var(--accent); color: #fff; }

.admin-side-rodape { display: flex; flex-direction: column; gap: 8px; font-size: .85rem; border-top: 1px solid rgba(255,255,255,.1); padding-top: 14px; }
.admin-side-rodape a { color: #8296a3; }
.admin-side-rodape a:hover { color: #fff; }

.admin-main { flex: 1; padding: 26px 28px; min-width: 0; }

.admin-cabecalho { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
.admin-cabecalho h1 { font-size: 1.5rem; margin: 0; }

.admin-periodo, .admin-cabecalho .admin-periodo { display: flex; gap: 4px; background: var(--branco); border: 1px solid var(--borda); border-radius: 999px; padding: 4px; }
.admin-periodo a { padding: 6px 14px; border-radius: 999px; font-size: .85rem; color: var(--cinza); text-decoration: none; }
.admin-periodo a.ativo { background: var(--accent); color: #fff; }

.admin-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; margin-bottom: 22px; }
.admin-cards-3 { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.admin-card { background: var(--branco); border: 1px solid var(--borda); border-radius: 14px; padding: 16px 18px; }
.admin-card small { display: block; color: var(--cinza); font-size: .8rem; margin-bottom: 6px; }
.admin-card strong { font-family: var(--fonte-titulo); font-size: 1.5rem; }
.admin-pct { font-size: .9rem; color: var(--accent-deep); font-weight: 600; }

/* Cards de destaque (topo do funil, estilo do print) */
.admin-card.destaque { text-align: center; padding: 22px 18px; }
.admin-card.destaque strong { display: block; font-size: 2rem; color: var(--accent-deep); letter-spacing: -0.02em; margin-bottom: 4px; }
.admin-card.destaque small { margin-bottom: 0; text-transform: uppercase; letter-spacing: .04em; font-size: .74rem; font-weight: 600; }

/* Box de conversões Google Ads */
.admin-ads { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
.admin-ads h2 { margin: 0; font-size: 1.05rem; }
.admin-ads a[aria-disabled="true"] { opacity: .45; pointer-events: none; }

/* Tabela diária do funil */
.admin-funil-tabela th.num, .admin-funil-tabela td.num { text-align: right; white-space: nowrap; }
.admin-funil-tabela td.num { font-variant-numeric: tabular-nums; }
.admin-funil-tabela .cel-pct { display: block; font-size: .72rem; color: var(--accent-deep); font-weight: 600; margin-top: 1px; }
.admin-funil-tabela td.receita { font-weight: 700; color: var(--accent-deep); }
.admin-funil-tabela .dia-semana { display: block; color: var(--cinza); font-size: .72rem; font-weight: 400; }

.admin-funil { background: var(--branco); border: 1px solid var(--borda); border-radius: 16px; padding: 20px; }
.funil-linha { margin-bottom: 16px; }
.funil-linha:last-child { margin-bottom: 0; }
.funil-info { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 6px; }
.funil-rotulo { font-weight: 600; font-size: .92rem; }
.funil-numeros strong { font-family: var(--fonte-titulo); font-size: 1.05rem; margin-right: 6px; }
.funil-pct { font-size: .82rem; color: var(--accent-deep); font-weight: 600; }
.funil-barra { height: 12px; background: var(--fundo); border-radius: 999px; overflow: hidden; }
.funil-preenchida { height: 12px; background: linear-gradient(90deg, var(--accent), var(--accent-escuro)); border-radius: 999px; transition: width .4s ease; }

.admin-nota { font-size: .82rem; color: var(--cinza); margin: 12px 0 0; }

.admin-bloco { background: var(--branco); border: 1px solid var(--borda); border-radius: 16px; padding: 20px; margin-top: 18px; }
.admin-bloco h2 { font-size: 1.1rem; margin: 0 0 12px; }

.admin-grid-2 { display: grid; gap: 18px; }

.admin-flash { border-radius: 10px; padding: 10px 14px; font-size: .9rem; margin-bottom: 16px; }
.admin-flash.ok { background: var(--accent-tint); border: 1px solid var(--accent-tint-borda); color: #14532d; }
.admin-flash.erro { background: #fef2f2; border: 1px solid #fecaca; color: var(--erro); }

.admin-filtros { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; }
.admin-filtros input, .admin-filtros select { width: auto; flex: 1 1 200px; }
.admin-filtros select { flex: 0 0 auto; }

.admin-tabela-wrap { overflow-x: auto; background: var(--branco); border: 1px solid var(--borda); border-radius: 14px; }
.admin-tabela { width: 100%; border-collapse: collapse; font-size: .88rem; }
.admin-tabela th { text-align: left; padding: 11px 12px; border-bottom: 1px solid var(--borda); font-family: var(--fonte-titulo); font-size: .78rem; text-transform: uppercase; letter-spacing: .03em; color: var(--cinza); white-space: nowrap; }
.admin-tabela td { padding: 11px 12px; border-bottom: 1px solid var(--borda); vertical-align: top; }
.admin-tabela tr:last-child td { border-bottom: 0; }
.admin-email { color: var(--cinza); max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-nowrap { white-space: nowrap; }
.admin-msg { max-width: 420px; }
.admin-msg pre { background: var(--fundo); border-radius: 8px; padding: 8px; font-size: .78rem; overflow-x: auto; margin: 6px 0 0; }
.admin-vazio { text-align: center; color: var(--cinza); padding: 28px 0; }
.admin-link { color: var(--accent-deep); font-weight: 600; text-decoration: none; }

.admin-badge { display: inline-block; padding: 3px 9px; border-radius: 999px; font-size: .75rem; font-weight: 700; text-transform: capitalize; }
.admin-badge-cinza { background: #eef2f5; color: #5a6b7a; }
.admin-badge-azul { background: #e6effb; color: #1c5d8f; }
.admin-badge-verde { background: var(--accent-tint); color: var(--accent-deep); }
.admin-badge-vermelho { background: #fef2f2; color: var(--erro); }

.admin-dl { display: grid; grid-template-columns: 120px 1fr; gap: 8px 12px; margin: 0; font-size: .9rem; }
.admin-dl dt { color: var(--cinza); }
.admin-dl dd { margin: 0; font-weight: 500; }

.admin-switch { display: inline-flex; align-items: center; gap: 12px; cursor: pointer; font-weight: 600; }
.admin-switch input { position: absolute; opacity: 0; }
.admin-switch-visual { width: 46px; height: 26px; background: var(--cinza-claro); border-radius: 999px; position: relative; transition: background .2s; flex-shrink: 0; }
.admin-switch-visual::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; background: #fff; border-radius: 50%; transition: transform .2s; }
.admin-switch input:checked + .admin-switch-visual { background: var(--accent); }
.admin-switch input:checked + .admin-switch-visual::after { transform: translateX(20px); }

.admin-login-body { align-items: center; justify-content: center; }
.admin-login { background: var(--branco); border: 1px solid var(--borda); border-radius: var(--raio-card); box-shadow: var(--sombra-card); padding: 30px; width: min(360px, 92vw); }
.admin-login .btn { margin-top: 8px; }

@media (max-width: 720px) {
    body.admin { flex-direction: column; }
    .admin-side { width: auto; height: auto; position: static; flex-direction: row; align-items: center; flex-wrap: wrap; gap: 10px; }
    .admin-nav { flex-direction: row; flex-wrap: wrap; }
    .admin-side-rodape { flex-direction: row; border-top: 0; padding-top: 0; }
    .admin-main { padding: 18px 16px; }
    .admin-grid-2 { grid-template-columns: 1fr; }
}

/* ---------- Desktop ---------- */

@media (min-width: 700px) {
    .cartao { padding: 32px 34px; }
    .acoes { grid-template-columns: 1fr auto; direction: rtl; }
    .acoes > * { direction: ltr; }
    .acoes .btn-primario { width: auto; padding-left: 44px; padding-right: 44px; }
    .doc-preview { padding: 44px 48px; }
    .opcoes-grid { grid-template-columns: repeat(2, 1fr); }
    .stats-chips { grid-template-columns: repeat(4, 1fr); }
    .badges-garantia { grid-template-columns: repeat(4, 1fr); }
    .bloco-form { padding: 22px 22px; }
}

@media (max-width: 560px) {
    .grade-clausulas { grid-template-columns: 1fr; }
    .demo-selo-tempo { left: 0; }
}