@media screen and (max-width:2560px){
    header{
        padding: 20px 50px!important;
        top: 40px;
    }
    header a{
        font-size: 16px;
        letter-spacing: 0.1em;
    }
    header .header-logo{
        height: 75px;
    }
    
    /* BANNER */

    .banner h1{
        font-size: 60px;
        line-height: normal;
        margin-bottom: 40px;
    }
    .banner p{
        font-size: 24px;
        letter-spacing: 0.1em;
        line-height: 32px;
    }
    .banner .coluna-img-flutuante{
        width: 600px;
        height: fit-content;
        right: 600px;
        transition: all 1s ease-in-out;
    }
    .banner .coluna-texto{
        width: 600px;
    }

    /* SERVIÇOS */

    .servicos .coluna-texto{
        padding: 20px 50px;
    }
    .servicos-cards{
        gap: 40px;
    }
    .servicos .card{
        gap: 40px;
    }
    .servicos .coluna-icone img{
        width: 80px;
        height: 80px;
    }
    .servicos .card h3{
        font-size: 30px;
        letter-spacing: 0.01em;
    }
    .servicos .card p{
        font-size: 20px;
        letter-spacing: 0.1em;
        line-height: 30px;
    }
    .navegacao a{
        width: 30px;
    }

    /* CONTATO */

    .contato h2{
        font-size: 50px;
        line-height: normal;
    }
    .contato .input{
        font-size: 20px;
        letter-spacing: 0.1em;
        padding: 4px 40px;
    }
    .contato .botao-submit{
        margin: 40px auto 0;
    }
    .contato input[type="submit"]{
        font-size: 20px;
        letter-spacing: 0.1em;
        padding: 20px 40px;
    }
    .contato{
        height: 75dvh;
    }
    /* RODAPÉ */
    .wpp{
        padding: 20px;
        transform: translateX(170px);
    }
    .wpp img{
        width: 40px;
    }
    footer{
        height: 25dvh;
    }
    footer ul{
        margin-bottom: 40px;
    }
    footer p{
        font-size: 16px;
        letter-spacing: 0.1em;
    }
    footer ul a{
        font-size: 20px;
        letter-spacing: 0.1em;
    }
    footer .botoes img{
        width: 20px;
    }
    footer .coluna-direitos{
        margin-top: 30px;
    }
    footer .logo-footer{
        width: 80px;
    }
}
@media screen and (max-width:2340px){
    .banner .coluna-img-flutuante{
        right: 400px;
    }
}
@media screen and (max-width:2000px){
    .banner .coluna-img-flutuante{
        right: 300px;
    }
}
@media screen and (max-width:1921px){
	header {
        padding: 20px 60px !important;
        top: 20px;
    }

    header a {
        font-size: 16px;
    }
    header img,
    header .header-logo{
        height: 60px;
    }
    .banner .coluna-img-flutuante{
        right: 300px;
		width: 500px;
    }
	 .servicos {
        height: 95dvh;
    }
    .servicos .coluna-texto {
        padding: 15px 30px;
    }

    .servicos-cards {
        gap: 30px;
    }

    .servicos .card {
        gap: 25px;
        align-items: center; /* Bom para telas menores */
    }

    .servicos .coluna-icone img {
        width: 60px;
        height: 60px;
    }

    .servicos .card h3 {
        font-size: 24px;
    }

    .servicos .card p {
        font-size: 16px;
        line-height: 24px;
    }

    .navegacao a {
        width: 25px;
    }
	/* CONTATO */
    .contato{
        height: 80dvh; /* Pode precisar de mais espaço */
    }
    .contato h2 {
        font-size: 32px;
        margin-bottom: 10px;
    }

    .contato .input {
        font-size: 16px;
        padding: 0px 20px 20px; /* Ajustei seu padding de 4px */
        line-height: normal;
    }

    .contato .botao-submit {
        margin: 20px auto 0;
        width: 70%; /* Um pouco mais largo */
    }

    .contato input[type="submit"] {
        font-size: 16px;
        padding: 10px 30px;
    }
}
@media screen and (max-width:1800px){
    .banner .coluna-img-flutuante{
        right: 200px;
    }
}
@media screen and (max-width:1600px){
    .banner .coluna-img-flutuante{
        right: 100px;
    }
    .wpp {
        padding: 20px;
        transform: translateX(136px);
    }
}
@media screen and (max-width: 1441px) {
    header {
        padding: 20px 60px !important;
        top: 20px;
    }

    header a {
        font-size: 16px;
    }
    header img,
    header .header-logo{
        height: 60px;
    }
    

    /* BANNER */
    .banner {
        height: 95dvh; /* Pode precisar de 100% da altura */
        padding-top: 10dvh;
    }
    .banner h1 {
        font-size: 48px;
        margin-bottom: 30px;
    }

    .banner p {
        font-size: 20px;
        line-height: 28px;
    }

    .banner .coluna-img-flutuante {
        width: 450px;
        right: 150px; /* Ajustado para caber */
    }

    .banner .coluna-texto {
        width: 600px;
    }

    /* SERVIÇOS */
    .servicos {
        height: 95dvh;
    }
    .servicos .coluna-texto {
        padding: 15px 30px;
    }

    .servicos-cards {
        gap: 30px;
    }

    .servicos .card {
        gap: 25px;
        align-items: center; /* Bom para telas menores */
    }

    .servicos .coluna-icone img {
        width: 60px;
        height: 60px;
    }

    .servicos .card h3 {
        font-size: 24px;
    }

    .servicos .card p {
        font-size: 16px;
        line-height: 24px;
    }

    .navegacao a {
        width: 25px;
    }

    /* CONTATO */
    .contato{
        height: 80dvh; /* Pode precisar de mais espaço */
    }
    .contato h2 {
        font-size: 32px;
        margin-bottom: 10px;
    }

    .contato .input {
        font-size: 16px;
        padding: 0px 20px 20px; /* Ajustei seu padding de 4px */
        line-height: normal;
    }

    .contato .botao-submit {
        margin: 20px auto 0;
        width: 70%; /* Um pouco mais largo */
    }

    .contato input[type="submit"] {
        font-size: 16px;
        padding: 10px 30px;
    }

    /* RODAPÉ */
    .wpp {
        padding: 15px;
        transform: translateX(0); /* Traz de volta para a tela */
        right: 30px;
        bottom: 30px;
    }

    .wpp img {
        width: 35px;
    }

    footer {
        height: auto; /* Deixa o conteúdo definir a altura */
        padding: 30px 0;
    }

    footer ul {
        margin-bottom: 10px;
    }

    footer p {
        font-size: 12px;
    }

    footer ul a {
        font-size: 12px;
    }
    footer br{
        display: none;
    }

    footer .botoes img {
        width: 18px;
    }

    footer .coluna-direitos {
        margin-top: 10px;
    }
    footer .logo-footer{
        width: 50px;
    }

}

.desktop-hidden{
    display: none;
}


/* MOBILE */

@media screen and (max-width: 768px){
    footer br{
        display: block;
    }
    html{
        scroll-behavior: smooth
    }
    body.no-scroll {
        overflow: hidden !important; /* Importante para garantir que não seja sobrescrito */
        height: 100vh;
        width: 100vw;
    }
    .desktop-hidden{
        display: block;
    }
    .mobile-hidden{
        display: none;
    }
    .container{
        padding: 0 40px;
    }
    header::before{
        content: none;
    }
    header{
        width: 80%;
        left: 0;
        border-radius: 0;
        transform: none;
        background: none;
        padding: 25px 40px !important;
    }

    .menu {
        display: flex;
        justify-content: space-between;
        padding: 40px 0 0;
        align-items: flex-start;
    }


    .menu-mobile {
        position: fixed;
        background: #ffffff24;
        height: 0vh;
        width: 264px;
        z-index: 1;
        top: -100dvh;
        padding: 0;
        overflow: hidden;
        right: 60px;
        gap: 40px;
        display: flex;
        align-items: center;
        text-align: center;
        flex-direction: column;
        transition: 1s all;
        justify-content: center;
        border-radius: 20px;
        transform: translate(10px, -20px);

    }
    .menu-mobile::before{
        background: transparent;
        opacity: 0.9;
        /* padding: 100px 40px; */
        backdrop-filter: blur(20px);
        --webkit-backdrop-filter: blur(20px);
        background-color: rgba(255, 255, 255, 0.08);
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 264px;
        height: 100%;
        border-radius: 20px;
        z-index: -1;
    }
    .menu-mobile ul {
        display: flex;
        flex-direction: column;
        gap: 60px;
        list-style: none;
        padding: 0;
    }
    header a{
        font-size: 18px;
    }
    header .botoes img{
        width: 20px;
    }
    header .botoes{
        width: 60%;
    }
    .menu-dois {
        display: flex;
        width: 100%;
        justify-content: space-between;
        align-items: center;
        /* position: absolute; */
        left: 0;
        background: var(--azulescuro);
        padding: 20px;
        top: 0;
        height: 10%;
        z-index: 3;
        justify-content: right;
    }

    .burger {
        position: sticky;
        width: 40px;
        height: 25px;
        top: 40px;
        right: 40px;
        background: transparent;
        cursor: pointer;
        display: block;
        z-index: 4;
    }

    .burger input {
        display: none;
    }

    .burger span {
        display: block;
        position: absolute;
        height: 2px;
        width: 100%;
        background: #CBE4F8;
        border-radius: 9px;
        opacity: 1;
        left: 0;
        transform: rotate(0deg);
        transition: .25s ease-in-out;
        z-index: 5;
    }

    .burger span:nth-of-type(1) {
        top: 0px;
        transform-origin: left center;
    }

    .burger span:nth-of-type(2) {
        top: 50%;
        transform: translateY(-50%);
        transform-origin: left center;
    }

    .burger span:nth-of-type(3) {
        top: 100%;
        transform-origin: left center;
        transform: translateY(-100%);
    }

    .burger input:checked~span:nth-of-type(1) {
        transform: rotate(45deg);
        top: 0px;
        left: 5px;
    }

    .burger input:checked~span:nth-of-type(2) {
        width: 0%;
        opacity: 0;
    }

    .burger input:checked~span:nth-of-type(3) {
        transform: rotate(-45deg);
        top: 28px;
        left: 5px;
    }

    .burger input:checked~.menu-mobile {
        height: fit-content;
        padding: 100px 40px 40px!important;
        top: auto;
    }
    .servicos{
        padding: 100px 0;
        height: fit-content;
        margin-top: -13px;
    }
    .banner{
        z-index: 1;
        height: 700px;
    }
    .banner .coluna-texto{
        width: 100%;
    }
    .banner .coluna-img-flutuante{
        width: 120%;
        right: -30%;
        bottom: -6%;
        margin-bottom: -30px;
    }
    .banner::before{
        content: none;
    }
    .banner img{
        z-index: -1;
        opacity: 0.33;
        position: relative;
    }
    .banner h1{
        font-size: 38px;
        letter-spacing: 0.02em;
        line-height: 38px;
    }
    .banner p{
        font-size: 18px;
        letter-spacing: 0.04em;
        /* line-height: 22px; */
    }
    .navegacao a{
        width: 45px;
    }

    .servicos .card{
        flex-wrap: wrap;
        justify-content: center;
    }
    .servicos .card h3{
        letter-spacing: 0.04em;
        text-align: center;
    }
    .servicos .card p{
        font-size: 18px;
        letter-spacing: 0.03em;
        text-align: center;
        margin-top: 5px;
    }
    .servicos .coluna-texto::before{
        border-radius: 30px;
    }
    .servicos .coluna-texto{
        padding: 20px 20px;
    }
    .contato .botao-submit,
    .contato .input{
        width: 100%;
    }
    .contato .botao-submit{
        margin-top: 40px;
    }
    .contato{
        height: fit-content;
        padding: 100px 0;
    }
    footer{
        height: fit-content;
        padding: 30px 0 60px;
    }
    .rodape img{
        width: 44px;
        position: absolute;
        transform:translate(30px, -50%);
        z-index: 2;
    }
    footer ul{
        margin-bottom: 40px;
    }
    footer .botoes{
        gap: 10px;
    }
    .wpp{
        bottom: 2dvh;
        width: 60px;
        height: 60px;
        display: flex;
        justify-content: center;
        align-items: center;
        z-index: 100;
    }
    .wpp img{
        width: 24px;
    }
    .flex-diretos-mobile{
        align-items: center;
    }
    footer .botoes img{
        width: 21px;
    }
    
    .servicos .card{
        margin: 0 20px;
    }
    p.arraste{
        font-size: 16px;
        letter-spacing: 0.02em;
        text-align: center;
        font-family: "Antic";
        margin-top: 5px;
        color: #7d8ea2;
        margin-top: 40px;
    }
    header{
        top: 0;
    }
    .servicos::before{
        /* background-attachment: fixed; */
        background-position-x: 17%;
        position: fixed;
    }
    footer{
        position: relative;
        z-index: 1;
    }
    .contato h2{
        margin-bottom: 40px;
    }
}
@media screen and (max-width: 400px){
    /* footer{
        height: 35dvh;
    } */
    .banner {
        height: 620px;
    }
    header{
        padding: 10px 10px!important;
    }
    .container{
        padding: 0 30px;
    }
    .servicos .card{
        margin: 0;
    }
    .servicos .card p{
        font-size: 14px;
    }
    .servicos .card h3{
        font-size: 18px;
    }
    .servicos .coluna-texto{
        padding: 20px;
    }
    .contato h2{
        font-size: 24px;
        margin-bottom: 40px;
    }
    .contato input[type="submit"]{
        padding: 0;
    }
    .contato .input{
        font-size: 14px;
        line-height: normal;
        padding: 0 20px 20px;
    }
    .menu-mobile{
        width: 231px;
        transform: translate(30px, -20px);
    }
}