@import url('https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300..900;1,300..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300..900;1,300..900&family=Rowdies:wght@300;400;700&display=swap');




/* Navbar padrão horizontal */
.navbar {
    display: flex;
    gap: 1.5rem;
    list-style: none;
}

.text {
    text-align: center;
}

h1 {
    font-family: "Rowdies", sans-serif;
    font-weight: 700;
    font-size: 10rem; 
    color: transparent;
    background-image: url(../image/logom.png);
    background-repeat: repeat-x;
    background-size: contain; 
    -webkit-background-clip: text;
    background-clip: text;
    /* Animação do background */
    animation: moveBackground 35s linear infinite;
    display: inline-block;
}

/* Animação do background */
@keyframes moveBackground {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: 2000px 0; 
    }
}


.active {
    font-family: "Rowdies", sans-serif;
    font-weight: 700;
    color: #dda15e;
    text-decoration: none;
    list-style: none;
}

.navbar li a { 
    text-decoration: none;
    color: #dda15e; 
    font-weight: 500;
    font-size: 1.1rem; 
    font-family: "Rowdies", sans-serif;
 }

 .navbar i { 
    margin-right: 15px;
 } 

 .nav::before .active { 
    transform: rotateY(180deg);
 } 

 a { 
    text-decoration: none;
     color: #dda15e;
      font-size: 1.1rem;
       font-weight: 500;
}

.active:hover, 
a:hover { 
    border-bottom: #926c15 solid 2px; 
} 

.name { 
    font-size: 2rem;
      font-weight: 800;
     }

/* Botão Hamburger escondido em telas grandes */
.hamburger {
    display: none;
    font-size: 1.8rem;
    cursor: pointer;
    color: #dda15e;
}

/* Media Query para telas pequenas */
@media (max-width: 768px) {
    .hamburger {
        display: block; /* Mostra o botão */
    }

    .nav {
        display: none; /* Esconde navbar inicialmente */
        width: 100%;
    }

    .nav.active {
        display: block; /* Mostra quando clicar no hamburger */
    }

    .navbar {
        flex-direction: column;
        gap: 1rem;
        text-align: center;
    }

    .name {
        width: 100%;
        text-align: center;
        margin-bottom: 0.5rem;
    }
}