@media screen and (max-width: 1950px){

    
}

@media screen and (max-width: 1760px) and (min-width: 1350px){


    
}

@media screen and (max-width: 1350px) and (min-width: 1250px){

    

}

@media screen and (max-width: 1250px) and (min-width: 1025px){
    
    
}

@media (max-width: 1025px){
    body{
        background-size: 55vw auto, 15vw auto !important;
    }

    .sobrenos__sec a {
        font-size: 10pt !important;
    }

    #inicio {
        height: auto !important;
      }

    #inicio > div > div:first-child {
        height: auto !important;
    }

    #inicio > div > div:first-child img {
        width: 120% !important;
        height: auto !important;
    }

    #inicio > div > div:nth-child(2) {
        flex: 50% !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        height: auto !important;
        padding-left: 2% !important;
    }

    #inicio h1 {
        font-size: 14pt !important;
        margin-bottom: 20px !important;
    }

    #inicio p {
        font-size: 10pt !important;
    }

    #campo h2 {
        font-size: 15pt !important;
        margin-bottom: 15px !important;
    }

    #campo p {
        font-size: 12pt !important;
        padding-bottom: 5% !important;
    }

    #footer img {
        width: auto !important;
        height: 25px !important;
    }

    #footer div p:first-child {
        font-size: 3.5vw !important; /* Usa largura da viewport para tornar a fonte responsiva */
        color: #ffffff; /* Cor branca */
    }
    
    #footer div p:last-child {
        font-size: 2vw !important; /* Usa largura da viewport para tornar a fonte responsiva */
        color: #ffffff; /* Cor branca */
    }

}

@font-face {
    font-family: 'League Spartan';
    src: url('/font/LeagueSpartan-VariableFont_wght.ttf') format('truetype');
    font-weight: 100 900; /* Como é uma fonte variável, suporta pesos de 100 a 900 */
    font-style: normal;
}

body {
    background-color: white;
    background-image: url('/src/img/Ativo-1.png'), url('/src/img/Ativo-2.png');
    background-position: top left, center right;
    background-repeat: no-repeat;
    background-size: auto;
    background-size: 30vw auto, 10vw auto;
    font-family: 'League Spartan', sans-serif;
}

#inicio {
    height: 100vh; /* Faz a seção ocupar 100% da altura da tela */
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 3%;
}

#inicio > div {
    display: flex;
    align-items: center; /* Alinha a imagem e o texto verticalmente */
    gap: 3%; /* Espaçamento entre a imagem e o texto */
    width: 100%; /* Ocupa toda a largura disponível */
}

#inicio > div > div:first-child {
    flex: 40%; /* Imagem ocupa 40% da largura */
    height: 100vh; /* Garante que a imagem ocupe toda a altura da tela */
}

#inicio > div > div:first-child img {
    width: 100%; /* Faz a imagem ocupar todo o espaço do contêiner */
    height: 100vh; /* Faz a imagem ocupar 100% da altura da tela */
    object-fit: cover; /* Garante que a imagem cubra o espaço sem distorcer */
}

#inicio > div > div:nth-child(2) {
    flex: 60%; /* Texto ocupa 60% da largura */
    display: flex;
    flex-direction: column;
    justify-content: center; /* Centraliza o texto verticalmente */
    height: 100vh; /* Garante que o conteúdo tenha a mesma altura que a imagem */
}

#inicio h1 {
    font-size: 50pt; /* Tamanho da fonte */
    color: #E64C3B;  /* Cor do texto */
    font-weight: 900;
    margin-bottom: 20px;
    line-height: 1.2;
}

#inicio p {
    font-size: 20pt; /* Tamanho da fonte */
    color: #000000;  /* Cor preta */
}


.sobrenos__sec a {
    font-size: 30pt;
    color: black;
}




#menu {
    display: flex;
    justify-content: flex-end; /* Alinha o conteúdo à direita */
    margin: 3% 3% 0 3%; /* Margem: topo 3%, direita 3%, baixo 0, esquerda 3% */
}

#inicio h1,
#campo h2 {
    text-transform: uppercase; /* Transforma todo o texto em maiúsculo */
}


#campo {
    display: flex; /* Mantém os elementos lado a lado */
    align-items: center; /* Alinha verticalmente */
    justify-content: space-between; /* Mantém a separação */
    gap: 20px; /* Espaço entre os elementos */
    margin-left: 5%; /* Adiciona a margem lateral */
    margin-top: 10vh; /* Adiciona espaço no topo (10% da altura da viewport) */
}




#campo div {
    width: 50%; /* Cada parte ocupa metade da tela */
}

#campo h2 {
    font-weight: 900;
    font-size: 50pt; /* Define o tamanho da fonte */
    color: #204D7D; /* Cor do texto */
    margin-bottom: 20px;
    line-height: 1.2;
}

#campo p {
    font-size: 20pt; /* Define o tamanho da fonte */
    color: #000000; /* Preto */
    padding-bottom: 5%;
}
#campo img {
    width: 100%; /* Garante que a imagem ocupe toda a largura disponível */
    height: auto; /* Mantém a proporção da imagem */
    max-width: 100%; /* Garante que a imagem não ultrapasse a largura da tela */
    object-fit: contain; /* Ajusta a imagem dentro do contêiner sem cortar ou distorcer */
}




.bg-img-3 {
    background-image: url('/src/img/Ativo-3.png');
    background-size: 5vw auto;
    background-repeat: no-repeat;
    background-position: bottom left;
    
    width: 5vw;
    height: 5vw; /* Ajuste conforme necessário */
    z-index: 10;
}


#footer {
    display: flex; /* Coloca os elementos lado a lado */
    justify-content: space-between; /* Espaça os elementos nas extremidades */
    align-items: center; /* Alinha verticalmente */
    width: 100%; /* Ocupa toda a largura disponível */
    padding: 20px; /* Adiciona um pouco de espaço interno */
    background-color: #204D7D; /* Define a cor de fundo */
}

#footer div p:first-child {
    font-size: 2vw; /* Usa largura da viewport para tornar a fonte responsiva */
    color: #ffffff; /* Cor branca */
}

#footer div p:last-child {
    font-size: 1.5vw; /* Usa largura da viewport para tornar a fonte responsiva */
    color: #ffffff; /* Cor branca */
}

#footer img {
    width: auto; /* Ajusta a largura automaticamente */
    height: 166px; /* Define a altura da imagem como 166px */
}