@import url('https://fonts.googleapis.com/css2?family=Bai+Jamjuree:wght@400;600&display=swap');
@import url(./utilitarios.css);
@import url(./global.css);



.header-bg {
    min-height: 400px;
    background-image: url("../images/bg-header-desktop.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

}

.header {
    display: flex;
    flex-direction: column;
    padding-top: 120px;
    text-align: center;
    padding-bottom: 120px;
}


.header img {
    width: 93px;
    height: 93px;
    padding-bottom: 30px;
}


.header h1 {
    padding-bottom: 30px;
}

.header p {
    padding-bottom: 50px;
    max-width: 80ch;
}

.subtitulo {
    text-align: center;
    padding-bottom: 100px;
    display: flex;
    flex-direction: column;
}

.subtitulo p {
    max-width: 80ch;
    padding-top: 20px;
}

.trechos {
    display: flex;
    gap: 120px;
}

.trechos-img img {
    width: 100%;
    height: auto;
}

.img-mobile {
    display: none;
}


.trechos-conteudo {
    padding-top: 60px;
}

.trechos-conteudo li+li {
    padding-top: 50px;
}

.trechos-conteudo p {
    max-width: 55ch;
}

.trechos-conteudo h3 {
    padding-bottom: 10px;
}

.main {
    padding-bottom: 120px;
}

.transferencia {
    display: flex;
    flex-direction: column;
    padding-bottom: 100px;
}

.ferramentas {
    padding-bottom: 150px;
}

.ferramentas-itens {
    display: flex;
    text-align: center;
}

.ferramentas-itens li {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.ferramentas-itens p {
    max-width: 32ch;
}


.parceiros {
    padding-bottom: 150px;
}

.parceiros-itens {
    display: flex;
    gap: 105px;
}

.botoes {
    display: flex;
    justify-content: center;
    gap: 20px;
}

.ios {
    padding-bottom: 120px;
}

.footer {
    display: flex;
    padding: 25px 120px;
}

.footer-bg {
    background: var(--c3);
}

.footer-redes {
    display: flex;
    gap: 20px;
    align-items: center;
}

.links {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.footer-links {
    display: flex;
    gap: 100px;
    padding-right: 350px;
}

.footer-logo {
    padding-right: 50px;
}

@media(max-width:1200px) {
    .header {
        padding-bottom: 70px;
    }

    .subtitulo {
        padding-bottom: 70px;

    }

    .subtitulo p {
        max-width: 60ch;

    }

    .trechos {
        gap: 40px;
    }

    .trechos img {
        width: 500px;

    }

    .trechos-conteudo li+li {
        padding-top: 20px;
    }

    .trechos-conteudo {
        padding-top: 10px;
    }

    .trechos picture {
        .img-desktop {
            display: block;
        }

        .img-mobile {
            display: none;
        }
    }

    .transferencia img {
        width: 500px;
    }

    .ferramentas-itens {
        display: flex;
        flex-direction: column;
        gap: 45px;
    }


    .parceiros-itens {
        gap: 40px;

    }

    .footer {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: 40px 20px;
        gap: 40px;
    }

    .footer-links {
        flex-direction: column;
        gap: 20px;
        padding-right: 0;
        align-items: center;
    }

    .footer-logo {
        padding-right: 0;
    }

    .trechos picture {
        .img-mobile {
            display: none;
        }


        .links {
            flex-direction: row;
            max-width: 1200px;
            margin-left: auto;
            margin-right: auto;
            gap: 20px;
        }

        .titulo-xxl {
            font-size: 2.25rem;
        }

        .titulo-xl {
            font-size: 1.5rem;
        }

        .titulo-m {
            font-size: 1.125rem;
        }
    }
}


    @media(max-width:800px) {
        .botoes {
            flex-direction: column;
            align-items: center;
        }

        .subtitulo p {
            max-width: 32ch;

        }

        .subtitulo h2 {
            max-width: 28ch;
        }

        .trechos {
            flex-direction: column;
            align-items: center;
            gap: 50px;
        }

        .trechos img {
            width: 300px;

        }

        .trechos-conteudo {
            text-align: center;

        }

        .trechos-conteudo p {
            max-width: 32ch;
        }

        .trechos picture {
            .img-desktop {
                display: none;
            }

            .img-mobile {
                display: block;
            }
        }

        .trechos-conteudo li+li {
            padding-top: 40px;
        }

        .trechos-conteudo {
            padding-top: 30px;
        }

        .transferencia img {
            width: 300px;
        }

        .ferramentas-itens {
            display: flex;
            flex-direction: column;
            gap: 45px;
        }


        .parceiros-itens {
            display: flex;
            flex-direction: column;
            gap: 80px;
            align-items: center;

        }


        .links {
            flex-direction: column;

        }

        .titulo-xxl {
            font-size: 1.875rem;
        }

        .titulo-xl {
            font-size: 1.375rem;
        }

        .titulo-m {
            font-size: 1.0625rem;
        }

        .txt-l {
            font-size: 0.9375rem;
        }

        .txt-m {
            font-size: 0.8125rem;
        }
    }