/* =========================================================
   CALCULADORAS.CSS - BARBOSA & LIMA ADVOGADOS ASSOCIADOS
   Arquivo único para:
   - calculadoras.php
   - calculadora_inss.php
   - calculadora_irpf.php

   Direção visual:
   - fundo branco;
   - cartões brancos com sombra leve;
   - sem gradientes;
   - sem faixas/bordas superiores criando efeito de camada;
   - verde musgo/acizentado como identidade principal;
   - vermelho apenas em ações de PDF/impressão/arquivo.
========================================================= */

:root {
    --bl-verde-1: #7f8d84;
    --bl-verde-2: #6c927b;
    --bl-verde-3: #527d63;
    --bl-verde-4: #22382b99;

    --bl-verde-suave: rgba(108, 146, 123, 0.10);
    --bl-verde-suave-2: rgba(127, 141, 132, 0.12);
    --bl-verde-borda: rgba(108, 146, 123, 0.22);

    --bl-vermelho: rgba(143, 1, 1, 0.58);
    --bl-vermelho-hover: rgba(143, 1, 1, 0.72);
    --bl-vermelho-suave: rgba(143, 1, 1, 0.08);
    --bl-vermelho-borda: rgba(143, 1, 1, 0.16);

    --bl-texto: #333333;
    --bl-texto-forte: #202820;
    --bl-texto-suave: #56625a;
    --bl-texto-claro: #ffffff;

    --bl-fundo: #ffffff;
    --bl-fundo-suave: #fbfcfb;
    --bl-fundo-verde: #f7f9f7;

    --bl-borda: rgba(0, 0, 0, 0.075);
    --bl-borda-suave: rgba(0, 0, 0, 0.055);

    --bl-sombra: 0 4px 18px rgba(0, 0, 0, 0.075);
    --bl-sombra-hover: 0 8px 18px rgba(0, 0, 0, 0.080);
    --bl-sombra-suave: 0 6px 18px rgba(0, 0, 0, 0.035);

    --bl-radius: 5px;
    --bl-radius-menor: 5px;
}

/* =========================================================
   BASE GERAL
========================================================= */

*,
*::before,
*::after {
    box-sizing: border-box;
}

.conteudo-principal {
    background-color: #ffffff;
}

.conteudo-principal .container {
    width: min(90%, 1180px);
    max-width: 1180px;
    margin: 0 auto;
    padding: 28px 0 46px;
    text-align: left;
}

/* =========================================================
   TÍTULO DA PÁGINA HUB - calculadoras.php
========================================================= */

.titulo-pagina {
    max-width: 850px;
    margin: 34px auto 22px;
    text-align: center;
}

.titulo-pagina h1 {
    margin: 0 0 12px;
    color: #7f8d84;
    font-size: clamp(28px, 3.1vw, 42px);
    line-height: 1.1;
    letter-spacing: -0.045em;
    font-weight: 700;
}

.titulo-pagina p {
    max-width: 720px;
    margin: 0 auto;
    color: var(--bl-texto-suave);
    font-size: clamp(15px, 1.5vw, 18px);
    line-height: 1.62;
}

/* =========================================================
   INTRODUÇÃO DO HUB
========================================================= */

.calculadoras-intro {
    max-width: 100%;
    margin: 26px auto 36px;
    padding: 28px 34px;
    background-color: #ffffff;
	border-top: 1px solid #7f8d8450;
	border-bottom: 1px solid #7f8d8450;
   
}

.calculadoras-intro p {
    margin: 0 0 10px;
    color: var(--bl-texto-suave);
    font-size: 16px;
    line-height: 1.3;
    text-align: justify;
}

.calculadoras-intro p:last-child {
    margin-bottom: 0;
}

/* =========================================================
   GRID E CARDS DO HUB
========================================================= */

.calculadoras-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    margin: 36px 0 44px;
}

.calculadora-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100%;
    padding: 36px;
    background-color: #ffffff;
   
    border-radius: 5px;
    box-shadow: 0 6px 22px rgba(34, 56, 43, 0.075);
    transition:
        transform 0.15s ease,
        box-shadow 0.15s ease,
        border-color 0.15s ease;
}

.calculadora-card:hover {
    transform: translateY(-1px);
    border-color: rgba(108, 146, 123, 0.24);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.07);
}

.calculadora-icon {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 22px;
    border-radius: 50%;
    background-color: #6c927b90;
    color: var(--bl-verde-3);
}

.calculadora-icon i {
    color: #fff;
    font-size: 25px;
}

.calculadora-card h2 {
    margin: 0 0 13px;
    color: var(--bl-texto-forte);
    font-size: clamp(21px, 2vw, 27px);
    line-height: 1.2;
    letter-spacing: -0.03em;
    font-weight: 700;
}

.calculadora-card p {
    margin: 0 0 22px;
    color: var(--bl-texto-suave);
    font-size: 16px;
    line-height: 1.65;
    text-align: justify;
}

.calculadora-features {
    flex-grow: 1;
    margin: 2px 0 24px;
}

.calculadora-features ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.calculadora-features li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 10px;
    color: #46524a;
    font-size: 15px;
    line-height: 1.45;
}

.calculadora-features i {
    flex: 0 0 auto;
    margin-top: 3px;
    color: var(--bl-verde-3);
    font-size: 13px;
}

/* =========================================================
   BOTÕES
========================================================= */

.btn,
button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: none;
    border-radius: 999px;
    padding: 13px 24px;
    font-family: 'Montserrat', sans-serif;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
    cursor: pointer;
    transition:
        transform 0.22s ease,
        background-color 0.22s ease,
        box-shadow 0.22s ease,
        color 0.22s ease,
        border-color 0.22s ease;
}

.btn i,
button i {
    margin-right: 0;
}

.btn:hover,
button:hover {
    transform: translateY(-1px);
}

.btn-primary,
.btn-success,
button[type="submit"] {
    background-color: var(--bl-verde-2);
    color: #ffffff;
    box-shadow: 0 9px 20px rgba(108, 146, 123, 0.22);
}

.btn-primary:hover,
.btn-success:hover,
button[type="submit"]:hover {
    background-color: var(--bl-verde-3);
    color: #ffffff;
}

.btn-secondary,
button.btn-secondary {
    background-color: #ffffff;
    color: var(--bl-verde-4);
    border: 1px solid rgba(108, 146, 123, 0.25);
    box-shadow: var(--bl-sombra-suave);
}

.btn-secondary:hover,
button.btn-secondary:hover {
    background-color: #f8faf8;
    color: var(--bl-verde-4);
    border-color: rgba(108, 146, 123, 0.38);
}

/* Botões de PDF/arquivo/impressão: vermelho pontual */
#generatePdfButtonINSS,
#generatePdfButtonINSSMobile,
#generatePdfButtonIRPF,
#generatePdfButtonIRPFMobile,
button[id*="Pdf"],
button[id*="PDF"],
button[onclick*="PDF"],
button[onclick*="Pdf"],
button[onclick*="print"],
button[onclick*="imprimir"] {
    background-color: var(--bl-vermelho);
    color: #ffffff;
    box-shadow: 0 9px 20px rgba(143, 1, 1, 0.13);
}

#generatePdfButtonINSS:hover,
#generatePdfButtonINSSMobile:hover,
#generatePdfButtonIRPF:hover,
#generatePdfButtonIRPFMobile:hover,
button[id*="Pdf"]:hover,
button[id*="PDF"]:hover,
button[onclick*="PDF"]:hover,
button[onclick*="Pdf"]:hover,
button[onclick*="print"]:hover,
button[onclick*="imprimir"]:hover {
    background-color: var(--bl-vermelho-hover);
}

.calculadora-card .btn {
    align-self: flex-start;
    margin-top: auto;
}

.center-button {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin: 26px 0 0;
}

.center-button button {
    margin: 0 !important;
}

.button-container,
.resultado-acoes {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-top: 5px;
	padding:20px;
}

.button-container button,
.resultado-acoes button {
    flex: 1 1 0;
}

/* =========================================================
   BLOCO COMO UTILIZAR / INFORMAÇÕES
========================================================= */

.calculadoras-info,
.calculadora-info {
    max-width: 100%;
    margin: 34px auto 24px;
    padding: 36px 40px;
    background-color: #ffffff;
	border-top: 1px solid #7f8d8450;
	border-bottom: 1px solid #7f8d8450;
	
}

.calculadoras-info h2,
.calculadora-info h2 {
    margin: 0 0 20px;
    color: var(--bl-texto-forte);
    font-size: clamp(22px, 2.3vw, 30px);
    line-height: 1.15;
    letter-spacing: -0.03em;
}

.calculadoras-info h3,
.calculadora-info h3 {
    margin: 24px 0 12px;
    color: var(--bl-verde-4);
    font-size: 19px;
}

.calculadoras-info p,
.calculadora-info p,
.calculadoras-info ul,
.calculadora-info ul {
    margin: 0 0 15px;
    color: var(--bl-texto-suave);
    line-height: 1.3;
	
}

.calculadoras-info ol {
    margin: 0;
    padding-left: 23px;
	
}

.calculadoras-info li,
.calculadora-info li {
    margin-bottom: 12px;
    color: var(--bl-texto-suave);
    font-size: 16px;
    line-height: 1.15;

}

.calculadoras-info li::marker,
.calculadora-info li::marker {
    color: var(--bl-verde-3);
    font-weight: 700;
}

/* =========================================================
   BLOCO FINAL DE DÚVIDAS
========================================================= */

.calculadoras-duvidas,
.calculadora-duvidas {
    max-width: 990px;
    margin: 28px auto 46px;
    padding: 36px 40px;
    background-color: var(--bl-verde-4);
    border-radius: 5px;
    box-shadow: 0 10px 26px rgba(34, 56, 43, 0.16);
    color: #ffffff;
}

.calculadoras-duvidas h3,
.calculadora-duvidas h3 {
    margin: 0 0 13px;
    color: #ffffff;
    font-size: clamp(22px, 2.2vw, 30px);
    line-height: 1.18;
    letter-spacing: -0.03em;
}

.calculadoras-duvidas p,
.calculadora-duvidas p {
    max-width: 860px;
    margin: 0 0 12px;
    color: rgba(255, 255, 255, 0.86);
    font-size: 16px;
    line-height: 1.65;
}

.calculadoras-duvidas .btn,
.calculadora-duvidas .btn {
    margin-top: 10px;
    background-color: #ffffff;
    color: var(--bl-verde-4);
    box-shadow: none;
}

.calculadoras-duvidas .btn:hover,
.calculadora-duvidas .btn:hover {
    background-color: #f4f6f4;
    color: var(--bl-verde-4);
}

/* =========================================================
   CALCULADORAS INDIVIDUAIS - INSS / IRPF
========================================================= */

.calculadora-centralizada {
    width: min(92%, 840px);
    max-width: 840px;
    margin: 34px auto 48px;
    padding: 0;
    background-color: #ffffff;
    border: 1px solid var(--bl-borda-suave);
    border-radius: var(--bl-radius);
    box-shadow: var(--bl-sombra);
    overflow: hidden;
}

.calculadora-container {
    width: 100%;
    margin: 0;
    overflow: hidden;
    background-color: #ffffff;
}

.calculadora-intro {
    padding: 30px 34px 24px;
    background-color: #ffffff;
    border-bottom: 1px solid rgba(0, 0, 0, 0.055);
    text-align: center;
}

.lado_lado {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin-bottom: 14px;
}

.calculadora-intro h1 {
    margin: 0;
    color: var(--bl-texto-forte);
    font-size: clamp(22px, 2.4vw, 30px);
    line-height: 1.15;
    letter-spacing: -0.035em;
    font-weight: 700;
}

.calculadora-intro .ico-c {
    width: 42px;
    height: 42px;
    min-width: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background-color: rgba(108, 146, 123, 0.14);
    color: var(--bl-verde-3);
}

.calculadora-intro .ico-c i {
    color: var(--bl-verde-3);
    font-size: 17px;
}

.calculadora-intro p {
    max-width: 660px;
    margin: 0 auto;
    color: var(--bl-texto-suave);
    font-size: 15.5px;
    line-height: 1.65;
    text-align: center;
}

.calculadora-form {
    padding: 30px 34px 34px;
    border-bottom: none;
    background-color: #ffffff;
}

.form-group {
    margin-bottom: 20px;
}

.form-group label {
    display: block;
    margin-bottom: 8px;
    color: var(--bl-texto-forte);
    font-size: 14.5px;
    font-weight: 700;
}

.descrição_campo {
    margin: -2px 0 9px;
    color: var(--bl-texto-suave);
    font-size: 12.5px;
    line-height: 1.55;
    text-align: justify;
}

.form-control {
    width: 100%;
    min-height: 48px;
    padding: 12px 14px;
    border: 1px solid rgba(127, 141, 132, 0.36);
    border-radius: var(--bl-radius);
    background-color: #ffffff;
    color: var(--bl-texto);
    font-family: 'Montserrat', sans-serif;
    font-size: 15.5px;
    outline: none;
    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        transform 0.25s ease;
}

.form-control:focus {
    border-color: var(--bl-verde-2);
    box-shadow: 0 8px 18px rgba(108, 146, 123, 0.14);
    transform: translateY(-1px);
}

.input-group {
    display: flex;
    align-items: stretch;
    width: 100%;
    margin: 8px 0 0;
}

.input-group span,
.input-prefix {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 58px;
    padding: 0 15px;
    border: 1px solid rgba(127, 141, 132, 0.36);
    border-right: none;
    border-radius: var(--bl-radius) 0 0 var(--bl-radius);
    background-color: #f7f9f7;
    color: var(--bl-verde-4);
    font-weight: 700;
}

.input-group .form-control,
.input-group input[type="text"] {
    width: 100%;
    min-height: 48px;
    border-radius: 0 var(--bl-radius) var(--bl-radius) 0;
}

.form-help {
    margin-top: 8px;
    color: var(--bl-texto-suave);
    font-size: 13px;
}

.form-help a {
    color: var(--bl-verde-3);
    font-weight: 700;
    text-decoration: none;
}

.form-help a:hover {
    text-decoration: underline;
}

.form-actions {
    margin-top: 24px;
    text-align: center;
}

/* =========================================================
   COMPETÊNCIA - SELECT ANO/MÊS
========================================================= */

.competencia-calendario {
    width: 100%;
}

.competencia-calendario__linha {
    display: grid;
    grid-template-columns: 130px 1fr;
    gap: 12px;
}

.competencia-calendario__campo label {
    display: block;
    margin-bottom: 6px;
    color: var(--bl-texto-suave);
    font-size: 12.5px;
    font-weight: 700;
}

.competencia-calendario select,
.competencia-calendario .form-control {
    width: 100%;
    height: 48px;
    border-radius: var(--bl-radius);
    border: 1px solid rgba(127, 141, 132, 0.36);
    background-color: #ffffff;
    color: var(--bl-texto);
    font-family: 'Montserrat', sans-serif;
    font-size: 15px;
}

.competencia-calendario__aviso {
    margin-top: 9px;
    color: rgba(143, 1, 1, 0.78);
    font-size: 13px;
    font-weight: 700;
}

/* =========================================================
   ALERTAS E OBSERVAÇÕES
========================================================= */

.alert,
.alert-info {
    padding: 15px 16px;
    margin-bottom: 20px;
    border: 1px solid rgba(108, 146, 123, 0.18);
    border-radius: 12px;
    background-color: #f8faf8;
    color: var(--bl-texto-suave);
}

.alerta-erro {
    margin: 20px 34px 30px;
    padding: 14px 16px;
    border: 1px solid rgba(143, 1, 1, 0.18);
    border-radius: 12px;
    background-color: rgba(143, 1, 1, 0.045);
    color: #7a1f1f;
    font-size: 14px;
    line-height: 1.55;
}

.observacao-calculo {
    margin-top: 18px;
    padding: 16px 18px;
    border-radius: 14px;
    background-color: #f8faf8;
    color: var(--bl-texto-suave);
    font-size: 14px;
    line-height: 1.65;
}

/* =========================================================
   RESULTADOS
========================================================= */

.calculadora-resultado,
#calculadora-resultado,
#resultadoCalculoPdf,
#resultado-irpf-content {
    padding: 32px 34px 20px;
    background-color: #ffffff;
}

.resultado-header {
    margin-bottom: 24px;
    text-align: center;
}

.resultado-header h1,
.resultado-header h2 {
    margin: 0;
    color: var(--bl-texto-forte);
    font-size: clamp(23px, 2.5vw, 31px);
    line-height: 1.15;
    letter-spacing: -0.035em;
    font-weight: 700;
}

.resultado-summary,
.salary-display {
    margin-bottom: 24px;
    padding: 0;
    background-color: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none;
}

.resultado-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 14px;
    text-align: left;
}

.summary-item {
    display: flex;
    flex-direction: column;
    min-height: 102px;
    padding: 16px;
    border: 1px solid var(--bl-borda-suave);
    border-radius: 5px;
    background-color: #ffffff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
}

.summary-item.highlight {
    border-color: var(--bl-vermelho-borda);
    background-color: rgba(143, 1, 1, 0.035);
}

.summary-label {
    margin-bottom: 7px;
    color: var(--bl-texto-suave);
    font-size: 11.5px;
    font-weight: 700;
    line-height: 1.35;
    text-transform: uppercase;
    letter-spacing: 0.045em;
}

.summary-value {
    margin-top: auto;
    color: var(--bl-verde-4);
    font-size: 18px;
    font-weight: 800;
    line-height: 1.25;
}

.summary-item.highlight .summary-value {
    color: rgba(143, 1, 1, 0.82);
}

.resultado-detalhes {
    margin-top: 26px;
}

.resultado-detalhes h3 {
    margin: 0 0 16px;
    color: var(--bl-texto-forte);
    text-align: center;
    font-size: clamp(19px, 2vw, 23px);
    letter-spacing: -0.025em;
}

/* =========================================================
   TABELAS
========================================================= */

.table-responsive {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.table,
table {
    width: 100%;
    min-width: 620px;
    margin: 18px 0;
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
    border: 1px solid var(--bl-borda-suave);
    border-radius: 5px;
    background-color: #ffffff;
    box-shadow: 0 5px 16px rgba(0, 0, 0, 0.045);
    font-size: 14px;
}

.table th,
.table td,
table th,
table td {
    padding: 12px 14px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.055);
    border-right: 1px solid rgba(0, 0, 0, 0.04);
    color: var(--bl-texto);
    text-align: left;
    vertical-align: middle;
}

.table th:last-child,
.table td:last-child,
table th:last-child,
table td:last-child {
    border-right: none;
}

.table tr:last-child td,
table tr:last-child td {
    border-bottom: none;
}

.table th,
table th {
    background-color: #f7f9f7;
    color: var(--bl-verde-4);
    font-weight: 800;
    text-align: center;
}

.table tr:nth-child(even) td,
table tr:nth-child(even) td {
    background-color: #fcfdfc;
}

.table tr:hover td,
table tr:hover td {
    background-color: #f8faf8;
}

.total-row,
.total,
tr.highlight.total {
    color: var(--bl-verde-4);
    font-weight: 800;
}

.total-row td,
.total td,
tr.highlight.total td {
    background-color: #f3f6f3 !important;
    color: var(--bl-verde-4);
}

tr.highlight th {
    background-color: #f7f9f7;
}

/* =========================================================
   RESPONSIVIDADE
========================================================= */

@media (max-width: 1024px) {
    .conteudo-principal .container {
        width: min(92%, 1180px);
        padding-top: 22px;
    }

    .calculadoras-grid {
        gap: 22px;
    }

    .calculadora-card {
        padding: 32px;
    }

    .calculadoras-info,
    .calculadora-info,
    .calculadoras-duvidas,
    .calculadora-duvidas {
        padding: 32px;
    }
}

@media (max-width: 768px) {
    .conteudo-principal .container {
        width: 100%;
        padding: 18px 16px 38px;
    }

    .titulo-pagina {
        margin: 24px auto 18px;
        padding: 0 4px;
        text-align: left;
    }

    .titulo-pagina h1 {
        font-size: 30px;
    }

    .titulo-pagina p {
        font-size: 15px;
    }

    .calculadoras-intro {
        margin: 20px auto 28px;
        padding: 23px;
       
    }

    .calculadoras-intro p {
        font-size: 13px;
        line-height: 1.62;
        text-align: left;
    }

    .calculadoras-grid {
        grid-template-columns: 1fr;
        gap: 20px;
        margin: 28px 0 32px;
    }

    .calculadora-card {
        padding: 28px;
        border-radius: 5px;
    }

    .calculadora-card:hover {
        transform: none;
    }

    .calculadora-card h2 {
        font-size: 24px;
    }

    .calculadora-card p {
        font-size: 15px;
        line-height: 1.5;
        text-align: left;
    }

    .calculadora-card .btn {
        width: 100%;
    }

    .calculadora-features li {
        font-size: 14px;
    }

    .calculadoras-info,
    .calculadora-info {
        margin: 28px auto 22px;
        padding: 26px;
       
    }

    .calculadoras-info h2,
    .calculadora-info h2 {
        font-size: 24px;
    }

    .calculadoras-info ol {
        padding-left: 19px;
    }

    .calculadoras-info li,
    .calculadora-info li {
        font-size: 15px;
        line-height: 1.58;
    }

    .calculadoras-duvidas,
    .calculadora-duvidas {
        margin: 24px auto 34px;
        padding: 28px;
        border-radius: 5px;
    }

    .calculadoras-duvidas h3,
    .calculadora-duvidas h3 {
        font-size: 24px;
    }

    .calculadoras-duvidas p,
    .calculadora-duvidas p {
        font-size: 15px;
        line-height: 1.58;
    }

    .calculadoras-duvidas .btn,
    .calculadora-duvidas .btn {
        width: 100%;
    }

    .calculadora-centralizada {
        width: calc(100% - 28px);
        margin: 24px auto 38px;
        border-radius: 5px;
    }

    .calculadora-intro {
        padding: 26px 24px 22px;
    }

    .lado_lado {
        gap: 12px;
    }

    .calculadora-intro p {
        text-align: left;
        font-size: 15px;
    }

    .calculadora-form,
    .calculadora-resultado,
    #calculadora-resultado,
    #resultadoCalculoPdf,
    #resultado-irpf-content {
        padding: 26px 24px;
    }

    .competencia-calendario__linha {
        grid-template-columns: 1fr 1fr;
    }

    .resultado-summary {
        grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    }

    .button-container,
    .resultado-acoes,
    .center-button {
        flex-direction: column;
        align-items: stretch;
    }

    .button-container button,
    .resultado-acoes button,
    .center-button button,
    .btn {
        width: 100%;
    }

    .table th,
    .table td,
    table th,
    table td {
        padding: 10px 11px;
        font-size: 12.5px;
    }
}

@media (max-width: 576px) {
    .resultado-summary {
        grid-template-columns: 1fr;
    }

    .summary-item {
        min-height: auto;
    }

    .summary-value {
        font-size: 16px;
    }

    .btn,
    button {
        padding: 12px 18px;
        font-size: 13.5px;
    }

    .table,
    table {
        min-width: 600px;
        font-size: 12px;
    }
}

@media (max-width: 480px) {
    .conteudo-principal .container {
        padding: 14px 13px 34px;
    }

    .titulo-pagina h1 {
        font-size: 27px;
    }

    .titulo-pagina p {
        font-size: 14px;
    }

    .calculadoras-intro,
    .calculadora-card,
    .calculadoras-info,
    .calculadora-info,
    .calculadoras-duvidas,
    .calculadora-duvidas {
        padding: 22px 20px;
    }

    .calculadora-icon {
        width: 56px;
        height: 56px;
    }

    .calculadora-icon i {
        font-size: 22px;
    }

    .calculadora-card h2 {
        font-size: 22px;
    }

    .calculadora-card p,
    .calculadoras-info li,
    .calculadora-info li,
    .calculadoras-duvidas p,
    .calculadora-duvidas p {
        font-size: 14px;
    }

    .calculadora-features li {
        font-size: 13.5px;
    }

    .calculadora-centralizada {
        width: calc(100% - 20px);
        margin-top: 18px;
    }

    .calculadora-intro,
    .calculadora-form,
    .calculadora-resultado,
    #calculadora-resultado,
    #resultadoCalculoPdf,
    #resultado-irpf-content {
        padding: 22px 20px;
    }

    .lado_lado {
        flex-direction: column-reverse;
        gap: 10px;
    }

    .calculadora-intro h1 {
        font-size: 23px;
        text-align: center;
    }

    .competencia-calendario__linha {
        grid-template-columns: 1fr;
    }

    .alerta-erro {
        margin: 18px 20px 24px;
    }
}


/* =========================================================
   OVERLAY DE CARREGAMENTO - PDF MOBILE
========================================================= */

.bl-pdf-loading {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(0, 0, 0, 0.42);
    backdrop-filter: blur(2px);
}

.bl-pdf-loading.ativo {
    display: flex;
}

.bl-pdf-loading__caixa {
    width: min(86vw, 320px);
    padding: 28px 24px;
    background: #ffffff;
    border-radius: 14px;
    text-align: center;
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.22);
    font-family: 'Montserrat', sans-serif;
}

.bl-pdf-loading__spinner {
    width: 42px;
    height: 42px;
    margin: 0 auto 16px;
    border-radius: 50%;
    border: 4px solid rgba(108, 146, 123, 0.22);
    border-top-color: #6c927b;
    animation: blPdfSpin 0.85s linear infinite;
}

.bl-pdf-loading__texto {
    margin: 0;
    color: #22382b;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.35;
}

.bl-pdf-loading__subtexto {
    margin: 6px 0 0;
    color: #56625a;
    font-size: 12.5px;
    line-height: 1.45;
}

body.bl-pdf-loading-travado {
    overflow: hidden;
    touch-action: none;
}

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

/* =========================================================
   TABELA COMPACTA NO RESULTADO - MOBILE
   Remove rolagem horizontal e força adaptação à tela
========================================================= */

@media (max-width: 768px) {
    .resultado-detalhes {
        margin-top: 18px;
    }

    .resultado-detalhes h3 {
        margin-bottom: 10px;
        font-size: 17px;
    }

    .table-responsive {
        width: 100%;
        overflow-x: hidden;
        -webkit-overflow-scrolling: auto;
    }

    .table,
    table {
        width: 100%;
        min-width: 0;
        max-width: 100%;
        table-layout: fixed;
        margin: 10px 0 0;
        font-size: 10.5px;
        border-radius: 4px;
        box-shadow: none;
    }

    .table th,
    .table td,
    table th,
    table td {
        padding: 5px 4px;
        font-size: 10.5px;
        line-height: 1.15;
        vertical-align: middle;
        word-break: normal;
        overflow-wrap: anywhere;
    }

    .table th,
    table th {
        font-size: 9.5px;
        line-height: 1.12;
        font-weight: 800;
        text-align: center;
    }

    .table td,
    table td {
        font-weight: 400;
    }

    .total-row td,
    .total td,
    tr.highlight.total td {
        font-size: 10px;
        font-weight: 800;
    }

    .observacao-calculo {
        margin-top: 12px;
        padding: 12px;
        font-size: 12px;
        line-height: 1.45;
    }
}

/* =========================================================
   TABELA INSS - DISTRIBUIÇÃO DAS COLUNAS NO MOBILE
========================================================= */

@media (max-width: 768px) {
    #resultadoCalculoPdf .table th:nth-child(1),
    #resultadoCalculoPdf .table td:nth-child(1) {
        width: 10%;
        text-align: center;
    }

    #resultadoCalculoPdf .table th:nth-child(2),
    #resultadoCalculoPdf .table td:nth-child(2) {
        width: 34%;
        text-align: left;
    }

    #resultadoCalculoPdf .table th:nth-child(3),
    #resultadoCalculoPdf .table td:nth-child(3) {
        width: 19%;
        text-align: right;
    }

    #resultadoCalculoPdf .table th:nth-child(4),
    #resultadoCalculoPdf .table td:nth-child(4) {
        width: 15%;
        text-align: center;
    }

    #resultadoCalculoPdf .table th:nth-child(5),
    #resultadoCalculoPdf .table td:nth-child(5) {
        width: 22%;
        text-align: right;
    }
}

/* =========================================================
   TABELA IRPF - DISTRIBUIÇÃO DAS COLUNAS NO MOBILE
========================================================= */

@media (max-width: 768px) {
    #resultado-irpf-content .table th:nth-child(1),
    #resultado-irpf-content .table td:nth-child(1) {
        width: 68%;
        text-align: left;
    }

    #resultado-irpf-content .table th:nth-child(2),
    #resultado-irpf-content .table td:nth-child(2) {
        width: 32%;
        text-align: right;
    }

    #resultado-irpf-content .table td:nth-child(2) {
        white-space: normal;
    }
}

@media (max-width: 420px) {
    .table,
    table {
        font-size: 9.5px;
    }

    .table th,
    .table td,
    table th,
    table td {
        padding: 4px 3px;
        font-size: 9.5px;
        line-height: 1.08;
    }

    .table th,
    table th {
        font-size: 8.8px;
    }

    #resultadoCalculoPdf .table th:nth-child(2),
    #resultadoCalculoPdf .table td:nth-child(2) {
        width: 32%;
    }

    #resultadoCalculoPdf .table th:nth-child(5),
    #resultadoCalculoPdf .table td:nth-child(5) {
        width: 24%;
    }
}

/* =========================================================
   PUBLICIDADE - CALCULADORAS
   Usa o bloco global fluido_geral
========================================================= */

.bloco-anuncio-calculadoras {
    width: 100%;
    min-height: 160px;
    height: auto;

    margin: 24px 0 34px;
    padding: 0;

    display: block;

    background: transparent;
    border: 0;
    border-radius: 0;
}

.bloco-anuncio-calculadoras .adsbygoogle,
.bloco-anuncio-calculadoras ins.adsbygoogle {
    display: block;
    width: 100%;
    min-height: 160px;
}

@media (max-width: 768px) {
    .bloco-anuncio-calculadoras {
        min-height: 140px;
        margin: 18px 0 28px;
    }

    .bloco-anuncio-calculadoras .adsbygoogle,
    .bloco-anuncio-calculadoras ins.adsbygoogle {
        min-height: 140px;
    }
}


/* =========================================================
   ADSENSE: FALLBACK DE PUBLICIDADE NÃO CARREGADA
========================================================= */

.bl-ad-nao-carregado {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;
    min-height: 52px !important;
    height: 52px !important;
    max-height: 52px !important;

    margin: 14px auto !important;
    padding: 0 14px !important;
    box-sizing: border-box !important;

    background: #f5f5f5 !important;
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
    border-radius: 10px !important;

    overflow: hidden !important;
}

.bl-ad-nao-carregado::before {
    content: "Publicidade";
    display: block;

    color: #777;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-align: center;
}

.bl-ad-nao-carregado ins.adsbygoogle,
.bl-ad-nao-carregado iframe {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    visibility: hidden !important;
}

.bl-ad-nao-carregado script {
    display: none !important;
}


.linha_meio + .bl-ad-nao-carregado {
    margin-top: -18px !important;
    margin-bottom: -18px !important;
}