/*
 * Estilos de public_html/includes/home-v2-body.php.
 *
 * Extraido do(s) bloco(s) inline em 2026-07-30 (consultoria STD-A02).
 * Conteudo byte a byte identico ao que estava na pagina — verificado por hash.
 */

    .main-nav .nav-valores{ position:relative; font-weight:800; padding-left:1.15rem; }
    .main-nav .nav-valores::before{ content:''; position:absolute; left:0; top:50%; width:9px; height:9px; margin-top:-4.5px; border-radius:50%; background:var(--brand); animation:navValoresPulse 1.6s ease-out infinite; }
    @keyframes navValoresPulse{ 0%{ box-shadow:0 0 0 0 rgba(52, 209, 132,.6); } 70%{ box-shadow:0 0 0 10px rgba(52, 209, 132,0); } 100%{ box-shadow:0 0 0 0 rgba(52, 209, 132,0); } }
    @media (prefers-reduced-motion: reduce){ .main-nav .nav-valores::before{ animation:none; } }
    .calc-inner{ position:relative; z-index:1; padding:2.5rem 1.5rem; text-align:center; }
    .calc-kicker{ display:inline-block; font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; font-weight:700;
        color:var(--brand); background:rgba(52, 209, 132,.12); border:1px solid rgba(52, 209, 132,.22); padding:.4rem .9rem; border-radius:999px; margin-bottom:1.4rem; }
    .calc-users{ font-size:1.1rem; color:rgba(255,255,255,.82); margin-bottom:.5rem; font-weight:600; }
    .calc-users #calcUsersVal{ color:#fff; font-weight:800; font-size:1.35rem; }
    .calc-info{ position:relative; display:inline-flex; align-items:center; margin-left:.4rem; color:rgba(255,255,255,.5); cursor:help; font-size:.95rem; vertical-align:middle; outline:none; }
    .calc-info:hover, .calc-info:focus{ color:var(--brand); }
    .calc-info .calc-tooltip{ position:absolute; bottom:calc(100% + 12px); left:50%; transform:translateX(-50%) translateY(4px); width:266px; max-width:78vw; background:#0b1f14; color:rgba(255,255,255,.9); border:1px solid rgba(52, 209, 132,.3); border-radius:12px; padding:.75rem .9rem; font-size:.82rem; font-weight:500; line-height:1.5; text-align:left; opacity:0; visibility:hidden; transition:opacity .18s ease, transform .18s ease; box-shadow:0 14px 34px rgba(2,7,4,.55); z-index:6; pointer-events:none; }
    .calc-info .calc-tooltip::after{ content:''; position:absolute; top:100%; left:50%; transform:translateX(-50%); border:6px solid transparent; border-top-color:#0b1f14; }
    .calc-info:hover .calc-tooltip, .calc-info:focus .calc-tooltip, .calc-info:focus-within .calc-tooltip{ opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
    .calc-price-main{ font-size:3.2rem; font-weight:800; color:#fff; line-height:1; letter-spacing:-.02em; }
    .calc-price-cents{ font-size:1.5rem; font-weight:700; color:var(--brand); vertical-align:.45em; }
    .calc-price-suffix{ font-size:1.15rem; font-weight:600; color:rgba(255,255,255,.55); }
    .calc-price-per{ margin-top:.55rem; font-size:1rem; color:var(--brand); font-weight:600; }
    .calc-quote-title{ font-size:2rem; font-weight:800; color:#fff; }
    .calc-quote-sub{ margin-top:.6rem; font-size:1rem; color:rgba(255,255,255,.72); max-width:420px; margin:0 auto; line-height:1.6; }
    .calc-slider{ margin:2rem auto 1.8rem; max-width:460px; }
    .calc-range{ -webkit-appearance:none; appearance:none; width:100%; height:8px; border-radius:999px; outline:none; cursor:pointer;
        background:linear-gradient(to right, var(--brand) 0%, var(--brand) var(--pct,18%), rgba(255,255,255,.16) var(--pct,18%), rgba(255,255,255,.16) 100%); }
    .calc-range::-webkit-slider-thumb{ -webkit-appearance:none; appearance:none; width:26px; height:26px; border-radius:50%;
        background:#fff; border:5px solid var(--brand); box-shadow:0 4px 14px rgba(2,7,4,.45); cursor:grab; transition:transform .1s; }
    .calc-range::-webkit-slider-thumb:active{ transform:scale(1.12); cursor:grabbing; }
    .calc-range::-moz-range-thumb{ width:26px; height:26px; border-radius:50%; background:#fff; border:5px solid var(--brand); box-shadow:0 4px 14px rgba(2,7,4,.45); cursor:grab; }
    .calc-range::-moz-range-track{ height:8px; border-radius:999px; background:rgba(255,255,255,.16); }
    .calc-range::-moz-range-progress{ height:8px; border-radius:999px; background:var(--brand); }
    .calc-range-labels{ display:flex; justify-content:space-between; margin-top:.7rem; font-size:.82rem; color:rgba(255,255,255,.5); font-weight:600; }
    .calc-ctas{ display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; }
    @media (max-width:560px){ .calc-price-main{ font-size:2.5rem; } .calc-quote-title{ font-size:1.6rem; } }
    
/* ============================================================
   VITRINE DE PLANOS (secao #planos)
   Substitui a calculadora por usuario, que morreu junto com a
   precificacao por usuario (2026-08-07). Os cards saem da tabela
   `planos` com exibir_landing = 1, entao preco muda sem deploy.
   ============================================================ */
.lp-planos{
    display:grid; gap:1.25rem; margin-top:2.5rem;
    grid-template-columns:repeat(auto-fit, minmax(230px, 1fr));
    align-items:stretch;
}
.lp-plano{
    position:relative; display:flex; flex-direction:column;
    padding:2rem 1.5rem 1.75rem; border-radius:18px;
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.10);
    transition:transform .25s ease, border-color .25s ease, background .25s ease;
}
.lp-plano:hover{ transform:translateY(-4px); border-color:rgba(52,209,132,.45); background:rgba(255,255,255,.06); }
.lp-plano--destaque{
    border-color:var(--brand);
    background:linear-gradient(180deg, rgba(52,209,132,.14) 0%, rgba(255,255,255,.04) 60%);
}
.lp-plano-selo{
    position:absolute; top:-13px; left:50%; transform:translateX(-50%);
    background:var(--brand); color:#04301c; font-size:.72rem; font-weight:800;
    letter-spacing:.04em; text-transform:uppercase; padding:.35rem .85rem; border-radius:999px;
    white-space:nowrap;
}
.lp-plano-nome{ font-size:1.4rem; font-weight:800; color:#fff; margin:0 0 .3rem; }
.lp-plano-desc{ font-size:.9rem; color:rgba(255,255,255,.6); margin:0 0 1.1rem; min-height:2.4em; }
.lp-plano-preco{ margin-bottom:.5rem; line-height:1; }
.lp-plano-cifra{ font-size:1.1rem; font-weight:700; color:var(--brand); vertical-align:.7em; }
.lp-plano-valor{ font-size:2.5rem; font-weight:800; color:#fff; letter-spacing:-.02em; }
.lp-plano-mes{ font-size:1rem; font-weight:600; color:rgba(255,255,255,.55); }
.lp-plano-consulta{ font-size:1.75rem; font-weight:800; color:#fff; }
.lp-plano-faixa{ font-size:.88rem; color:var(--brand); font-weight:600; margin:0 0 1.1rem; }
.lp-plano-itens{ list-style:none; padding:0; margin:0 0 1.5rem; display:grid; gap:.55rem; }
.lp-plano-itens li{ font-size:.88rem; color:rgba(255,255,255,.78); display:flex; align-items:center; gap:.5rem; }
.lp-plano-itens i{ color:var(--brand); font-size:.85rem; flex-shrink:0; }
.lp-plano-cta{ margin-top:auto; width:100%; justify-content:center; }
/* Microcopy sob o botao: responde "vou ser cobrado agora?" no exato momento em
   que a pergunta aparece — depois do clique ja e tarde. */
.lp-plano-nota{
    display:block; margin-top:.6rem; text-align:center;
    font-size:.76rem; color:rgba(255,255,255,.5); line-height:1.35;
}
.lp-planos-nota{
    margin-top:1.75rem; text-align:center; font-size:.9rem;
    color:rgba(255,255,255,.55); max-width:640px; margin-left:auto; margin-right:auto;
}
/* Faixa de reducao de risco acima dos precos. */
.pricing-risco{
    display:flex; align-items:center; justify-content:center; flex-wrap:wrap;
    gap:.5rem; margin:1.25rem auto 0; padding:.7rem 1.1rem;
    max-width:760px; border-radius:999px;
    background:rgba(47,201,125,.1); border:1px solid rgba(47,201,125,.28);
    color:rgba(255,255,255,.86); font-size:.86rem; font-weight:600; text-align:center;
}
.pricing-risco i{ color:var(--brand); }
@media (max-width:640px){
    .lp-planos{ grid-template-columns:1fr; }
    .lp-plano-desc{ min-height:0; }
    /* Pilula vira bloco no celular: em 360px o texto quebra em 3 linhas e o
       border-radius de 999px deixa as pontas cortando a primeira e a ultima. */
    .pricing-risco{ border-radius:16px; font-size:.8rem; padding:.75rem .9rem; }
}