.cgdi{--y:#ffe000;--l:#f0e5ff;font-family:Poppins,Arial,sans-serif;color:#32104f;background:linear-gradient(#fbf8ff,#ead7fb);padding:0 18px 28px}
.cgdi header{max-width:1200px;margin:auto;padding:22px 0;display:flex;justify-content:space-between}
.cgdi header b{font-size:25px;color:var(--p)}
.cgdi header b span{background:var(--p);color:white;padding:7px;border-radius:8px}
.cgdi header small{color:#76558e}
.hero{max-width:1200px;margin:auto;background:#e9d9fb;border-radius:22px;padding:35px;display:grid;grid-template-columns:1.2fr 1fr 270px;gap:20px;align-items:center}.hero em{font-size:11px;color:#8b55b6;font-weight:bold}
.hero h1{font-size:38px;line-height:1.1;color:var(--p)}.hero strong{color:#a56ad1}.hero p{line-height:1.7;font-size:14px}.hero a,.cgdi button{background:var(--p);color:var(--y)!important;border:0;border-radius:8px;padding:13px 20px;text-decoration:none;font-weight:bold;cursor:pointer}
.art{font-size:120px;text-align:center;position:relative}.art i{position:absolute;top:0;left:10%;background:var(--y);color:var(--p);padding:10px;border-radius:50%;font-size:20px}.hero aside{background:#d7baf5;padding:20px;border-radius:14px;font-size:12px}
.cgdi section{max-width:1200px;margin:28px auto}
.cgdi h2{color:var(--p);font-size:23px}
.bar{height:9px;background:#dfc9f3;border-radius:20px;overflow:hidden}
.bar span{display:block;width:25%;height:100%;background:var(--p);transition:.2s}
.cgdi #label{font-size:12px;color:#76558e}.wizard,article{background:#fffaff;border:1px solid #dfc8f0;border-radius:17px;padding:25px}
.step{display:none;min-height:200px}.step.active{display:block}
.step h3{font-size:22px;color:var(--p)}
.cgdi label{display:block;font-size:12px;font-weight:600;margin:12px 0}
.cgdi input[type=number]{display:block;width:100%;padding:11px;border:1px solid #d9c3ed;border-radius:8px}
.cgdi input[type=checkbox]{accent-color:var(--p);margin-right:7px}
.wizard nav{display:flex;justify-content:space-between;margin-top:20px}
.wizard nav #back{background:#e6d4f8;color:var(--p)!important}
.columns{display:grid;grid-template-columns:1fr 1fr;gap:18px}.result,
.summary{background:var(--l);padding:16px;border-radius:12px;margin-top:15px}
.result strong{display:block;font-size:28px;color:var(--p)}
.summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.summary span{font-size:18px;color:var(--p)}#checks label{font-weight:500}
.cgdi > header {
    display: none !important;
}

body {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* =========================================
   SEÇÃO: O QUE É IMPOSTO DE RENDA
========================================= */

.cgdi-about-ir {
    max-width: 1200px;
    margin: 40px auto !important;
    padding: 35px;
    background: #ffffff;
    border: 1px solid #dfc8f0;
    border-radius: 20px;
    box-shadow: 0 5px 18px rgba(91, 7, 144, 0.06);
}

.cgdi-about-label {
    color: #8b55b6;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
}

.cgdi-about-ir h2 {
    color: #5b0790;
    font-size: 32px;
    margin: 10px 0 15px;
}

.cgdi-about-ir p {
    color: #76558e;
    font-size: 14px;
    line-height: 1.8;
}

.cgdi-about-points {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin-top: 25px;
}

.cgdi-about-points > div {
    background: #f0e5ff;
    padding: 18px;
    border-radius: 14px;
}

.cgdi-about-points strong {
    color: #5b0790;
    font-size: 15px;
}

.cgdi-about-points p {
    font-size: 13px;
    margin-bottom: 0;
}

/* =========================================
   SEÇÃO: COMO DECLARAR
========================================= */

.cgdi-how-to {
    max-width: 1200px;
    margin: 40px auto !important;
    padding: 35px 0;
}

.cgdi-how-header {
    text-align: center;
    margin-bottom: 30px;
}

.cgdi-how-header span {
    color: #8b55b6;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
}

.cgdi-how-header h2 {
    color: #5b0790;
    font-size: 32px;
    margin: 10px 0;
}

.cgdi-how-header p {
    color: #76558e;
    font-size: 14px;
    line-height: 1.7;
}

.cgdi-how-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.cgdi-how-card {
    background: #fffaff;
    border: 1px solid #dfc8f0;
    border-radius: 17px;
    padding: 25px;
    box-shadow: 0 5px 18px rgba(91, 7, 144, 0.06);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.cgdi-how-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(91, 7, 144, 0.13);
}

.cgdi-how-number {
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #5b0790;
    color: #ffe000;
    border-radius: 12px;
    font-weight: 700;
    margin-bottom: 18px;
}

.cgdi-how-card h3 {
    color: #5b0790;
    font-size: 18px;
    margin: 0 0 10px;
}

.cgdi-how-card p {
    color: #76558e;
    font-size: 13px;
    line-height: 1.7;
    margin: 0;
}

.cgdi-how-alert {
    background: #e9d9fb;
    border-radius: 17px;
    padding: 25px;
    margin-top: 25px;
}

.cgdi-how-alert strong {
    color: #5b0790;
    font-size: 18px;
}

.cgdi-how-alert p {
    color: #32104f;
    font-size: 13px;
    line-height: 1.7;
    margin: 10px 0 20px;
}

.cgdi-how-alert .cgdi-button {
    display: inline-block;
    background: #5b0790;
    color: #ffe000 !important;
    border-radius: 8px;
    padding: 13px 20px;
    text-decoration: none;
    font-weight: 700;
}

@media (max-width: 900px) {
    .cgdi-about-points,
    .cgdi-how-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .cgdi-about-ir {
        padding: 22px;
    }

    .cgdi-about-ir h2,
    .cgdi-how-header h2 {
        font-size: 25px;
    }

    .cgdi-about-points,
    .cgdi-how-grid {
        grid-template-columns: 1fr;
    }

    .cgdi-how-card,
    .cgdi-how-alert {
        padding: 20px;
    }

    .cgdi header small {
        display: none;
    }
}

.cgdi-example {
    margin-top: 22px;
    padding: 18px;
    background: #fff8d6;
    border-left: 5px solid #ffe000;
    border-radius: 12px;
}

.cgdi-example strong {
    color: #5b0790;
    font-size: 15px;
}

.cgdi-example p {
    margin-bottom: 0;
    color: #5f4b22;
}

/* Conteúdo detalhado da seção "O que é Imposto de Renda?" */
.cgdi-about-ir h3 {
    margin-top: 26px;
    margin-bottom: 10px;
}

.cgdi-about-ir ul {
    margin: 12px 0 20px 22px;
    padding: 0;
}

.cgdi-about-ir li {
    margin-bottom: 10px;
    line-height: 1.6;
}

/* =========================================
   RESPONSIVIDADE APRIMORADA - CELULAR
========================================= */
.cgdi,
.cgdi *,
.cgdi *::before,
.cgdi *::after {
    box-sizing: border-box;
}

.cgdi {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

.cgdi img,
.cgdi svg,
.cgdi iframe {
    max-width: 100%;
}

.cgdi .cgdi-header {
    gap: 16px;
    align-items: center;
}

.cgdi .cgdi-header small {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px 14px;
}

.cgdi .cgdi-header small a {
    color: #5b0790;
    text-decoration: none;
    font-size: 12px;
    font-weight: 600;
}

.cgdi .hero > div,
.cgdi .hero > aside {
    min-width: 0;
}

.cgdi .hero h1 {
    overflow-wrap: anywhere;
}

.cgdi input,
.cgdi button,
.cgdi a {
    max-width: 100%;
}

.cgdi input[type="number"] {
    min-width: 0;
    width: 100%;
    max-width: 100%;
}

.cgdi .wizard nav {
    gap: 12px;
}

.cgdi .wizard nav button {
    flex: 1 1 0;
    min-width: 0;
    white-space: normal;
}

.cgdi .summary {
    min-width: 0;
}

.cgdi .summary b {
    min-width: 0;
    overflow-wrap: anywhere;
}

.cgdi .summary span {
    font-size: clamp(14px, 3.5vw, 18px);
    overflow-wrap: anywhere;
}

.cgdi .cgdi-about-ir ul {
    overflow-wrap: anywhere;
}

@media (max-width: 900px) {
    .cgdi {
        padding-left: 12px;
        padding-right: 12px;
    }

    .cgdi .hero {
        grid-template-columns: 1fr 1fr;
        padding: 28px;
    }

    .cgdi .hero > aside {
        grid-column: 1 / -1;
    }

    .cgdi .columns {
        grid-template-columns: 1fr;
    }

    .cgdi .summary {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .cgdi {
        padding: 0 10px 22px;
        font-size: 14px;
    }

    .cgdi .cgdi-header {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        padding: 16px 0;
        gap: 12px;
    }

    .cgdi .cgdi-header b {
        font-size: 21px;
    }

    .cgdi .cgdi-header small {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .cgdi .cgdi-header small a {
        display: block;
        background: #f0e5ff;
        border-radius: 8px;
        padding: 10px 6px;
        text-align: center;
        font-size: 11px;
    }

    .cgdi .hero {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 18px;
        padding: 22px 18px;
        border-radius: 16px;
    }

    .cgdi .hero h1 {
        font-size: clamp(28px, 8vw, 36px);
        margin: 10px 0;
    }

    .cgdi .hero p {
        font-size: 13px;
        line-height: 1.65;
    }

    .cgdi .hero a,
    .cgdi .hero aside,
    .cgdi .cgdi-button {
        width: 100%;
        display: block;
        text-align: center;
    }

    .cgdi .art {
        font-size: 80px;
    }

    .cgdi section {
        width: 100%;
        margin: 22px auto;
    }

    .cgdi h2 {
        font-size: 21px;
        line-height: 1.3;
    }

    .cgdi .wizard,
    .cgdi article,
    .cgdi .cgdi-about-ir {
        padding: 18px;
        border-radius: 14px;
    }

    .cgdi .step {
        min-height: auto;
    }

    .cgdi .step h3 {
        font-size: 19px;
        line-height: 1.35;
    }

    .cgdi .wizard nav {
        flex-direction: column-reverse;
    }

    .cgdi .wizard nav button {
        width: 100%;
        padding: 12px 14px;
    }

    .cgdi .summary {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .cgdi .summary b {
        background: #fff;
        padding: 12px;
        border-radius: 10px;
    }

    .cgdi .columns {
        display: flex;
        flex-direction: column;
        gap: 18px;
    }

    .cgdi .cgdi-about-ir h2,
    .cgdi .cgdi-how-header h2 {
        font-size: 25px;
        line-height: 1.25;
    }

    .cgdi .cgdi-about-ir h3 {
        font-size: 18px;
        line-height: 1.4;
    }

    .cgdi .cgdi-about-ir p,
    .cgdi .cgdi-how-header p,
    .cgdi .cgdi-how-card p,
    .cgdi .cgdi-how-alert p {
        font-size: 13px;
        line-height: 1.75;
    }

    .cgdi .cgdi-about-ir ul {
        margin-left: 18px;
        padding-left: 4px;
    }

    .cgdi .cgdi-about-points,
    .cgdi .cgdi-how-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .cgdi .cgdi-about-points > div,
    .cgdi .cgdi-how-card,
    .cgdi .cgdi-how-alert {
        padding: 17px;
    }

    .cgdi .cgdi-how-to {
        padding: 0;
    }

    .cgdi .cgdi-how-header {
        margin-bottom: 20px;
    }

    .cgdi .cgdi-example {
        padding: 15px;
        overflow-wrap: anywhere;
    }

    .cgdi label {
        font-size: 12px;
        line-height: 1.5;
    }

    .cgdi input[type="number"] {
        font-size: 16px;
        padding: 12px;
    }

    .cgdi button,
    .cgdi .hero a,
    .cgdi .cgdi-button {
        min-height: 44px;
    }
}

@media (max-width: 360px) {
    .cgdi {
        padding-left: 7px;
        padding-right: 7px;
    }

    .cgdi .hero,
    .cgdi .wizard,
    .cgdi article,
    .cgdi .cgdi-about-ir {
        padding: 15px;
    }

    .cgdi .cgdi-header small a {
        font-size: 10px;
    }
}
