* {
    margin: 0;
    padding: 0;
}
/* FOOTER */
footer {
    background-color: #333;
    color: rgb(230, 230, 230);
    background-color: #222;
    padding-top: 20px;
    padding-bottom: 20px;
   
}


.container_footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
 opacity: 0; /* Inicia invisível */
    animation: fadeInFooter 1s ease-in-out forwards; /* Animação de fade-in */
    animation-delay: 1s; /* Atraso de 1 segundo antes de começar */
}

@keyframes fadeInFooter {
    from {
        opacity: 0; /* Totalmente invisível */
    }
    to {
        opacity: 1; /* Totalmente visível */
    }
}


.logo_footer {
    flex: 1;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.img_logo_footer img {
    width: 100px;
    height: auto;
    display: block;
}

.menu_footer {
    flex: 1;
    text-align: center;
}

.menu_footer ul {
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 20px;
}

.menu_footer ul li {
    white-space: nowrap;
    display: inline-block;
    margin: 0 10px;
}

.menu_footer ul li a {
    color: rgb(230, 230, 230);
    text-decoration: none;
    font-family: "league spartan", sans-serif;
    font-weight: 500;
    font-size: 15px;
    text-transform: uppercase;
}

.menu_footer ul li a:hover {
    color: #089eb7;
    transition: all .5s;
}

/* CONTATOS NO FOOTER */
.contatos_footer {
    flex: 1;
    text-align: right;
}

.contatos_footer p {
    margin: 5px 0;
    font-family: "league spartan", sans-serif;
    font-size: 16px !important;
    font-weight: 500;
}

.social_icon {
    width: 24px;
    height: 24px;
    vertical-align: middle;
}

.a_instagram {
    text-decoration: none;
    color: #089eb7;
    font-weight: 500;
}

.instagram_link img {
    display: inline-block;
}

.instagram_link p {
    display: inline-block;
    margin-left: 10px;
}

/* CRÉDITOS NO FOOTER */
.desenvolvido_por {
    text-align: center;
    padding: 10px 0;
    background-color: #000000;
}

.desenvolvido_por p {
    font-family: "league spartan", sans-serif;
    margin: 0;
    color: #ffffff;
    font-size: 13px !important;
    font-weight: bolder;
    font-weight: 400;
}

/* Responsividade */
@media (max-width: 768px) {
    .container_footer {
        flex-direction: column;
        text-align: center;
    }

    .logo_footer, .menu_footer, .contatos_footer {
        margin-bottom: 20px;
    }

    .contatos_footer {
        text-align: center;
    }

    .menu_footer ul li {
        display: block;
        margin: 10px 0;
    }

    .img_logo_footer img {
        width: 70px;
    }

    .contatos_footer p {
        font-size: 12px;
    }
}


.contatos_footer ul li {
margin-bottom: 15px; /* Adiciona espaço de 15px entre os itens */
}

.contatos_footer ul li:last-child {
margin-bottom: 0; /* Remove o espaço inferior do último item da lista */
}
/* Para telas muito pequenas (menores que 450px) */
@media (max-width: 450px) {
    .img_logo_footer img {
        width: 60px;
    }

    .menu_footer ul li a {
        font-size: 14px;
    }

    .contatos_footer p {
        font-size: 11px;
    }

    .social_icon {
        width: 20px;
        height: 20px;
    }
}

/* Ajuste para o menu no footer entre 1055px e telas menores */
@media (max-width: 1055px) {
.container_footer {
display: flex;
justify-content: space-between; /* Mantém o alinhamento adequado */
align-items: center;
padding: 0 20px; /* Adiciona um espaçamento horizontal */
}

.menu_footer ul {
display: flex;
justify-content: center; /* Centraliza os itens */
gap: 15px; /* Adiciona um espaço entre os itens do menu */
flex-grow: 1; /* Permite que o menu cresça e ocupe o espaço disponível */
white-space: nowrap; /* Evita a quebra de linha */
}

.menu_footer ul li {
white-space: nowrap; /* Evita que as palavras quebrem em diferentes linhas */
}

.logo_footer {
flex-shrink: 1; /* Garante que o logo não ocupe muito espaço */
}

.contatos_footer {
flex-shrink: 1; /* Garante que os contatos também não ocupem muito espaço */
}
}

/* Ajuste adicional para telas menores que 768px */
@media (max-width: 768px) {
.container_footer {
flex-direction: column; /* Organiza os elementos em coluna */
align-items: center; /* Centraliza os elementos */
}

.menu_footer ul {
justify-content: center;
flex-grow: unset; /* Remove o crescimento flexível */
}

.logo_footer, .contatos_footer {
margin-bottom: 15px; /* Espaçamento entre os blocos */
}
}



.contatos_footer ul {
list-style-type: none; /* Remove os marcadores (bolinhas) da lista */
padding: 0;
margin: 0;
}


.contatos_footer ul li a {
display: block; /* Faz com que os links ocupem toda a linha e fiquem um embaixo do outro */
text-decoration: none; /* Remove sublinhado dos links */
color: #089eb7; /* Cor do texto dos links */
font-family: "League Spartan", sans-serif;
font-size: 17px; /* Ajusta o tamanho da fonte */
font-weight: 500; /* Ajusta o peso da fonte */
}

.contatos_footer ul li a:hover {
text-decoration: underline; /* Adiciona sublinhado ao passar o mouse */
}


.whats_icon {
width: 20px;
height: 20px;
margin-left: 5px; /* Espaçamento entre o texto e a imagem */
vertical-align: middle; /* Alinha verticalmente ao centro do texto */
}
.instagram_icon {
width: 20px;
height: 20px;
margin-left: 5px; /* Espaçamento entre o texto e a imagem */
vertical-align: middle; /* Alinha verticalmente ao centro do texto */
}


