
@media (min-width: 568px)  {
    .banner-titulo {
        font-size: 2.75rem;
    }

    .banner-texto {
        font-size: 1.5rem;
    }

    .banner-container-btn {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
    }

    .servicos-container {
        grid-template-columns: repeat(2, 1fr);
    }

    .portifolio-project-card-container {
        grid-template-columns: repeat(1, 1fr);
    }

}

@media (min-width: 768px)  {

    /* Header - Mostrar logo completo */
    .cabecalho-logo-simbolo.oculto {
        visibility: visible;
        position: static;
        width: auto;
        height: auto;
    }

    /* Banner - Ajustar tamanhos */
    .banner {
        background-image: url('../../src/img/banner-tablet.png');
    }

    .banner-titulo {
        font-size: 3rem;
        word-spacing: 0.5rem;
    }

    .banner-texto {
        font-size: 1.75rem;
        padding: 1.5rem 2rem;
    }

    .banner-container-btn {
        flex-direction: row;
        gap: 1.5rem;
    }

    /* Serviços - Grid de 2 colunas */
    .servicos-container {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.5rem;
        padding: 3rem 2rem;
    }

    .servicos-title {
        font-size: 3rem;
    }

    .servicos-text {
        font-size: 1.75rem;
        padding: 0 2rem;
    }

    /* Porque Escolher */
    .porque-escolher {
        flex-direction:column;
        align-items: center;
        justify-content: center;
        padding: 2rem;
    }
    
   

    /* Portfólio */
    

    .portifolio-item {
        flex: 0 1 calc(50% - 1rem);
        max-width: 400px;
    }

    .portifolio-project-card-container {
        grid-template-columns: repeat(2, 1fr);
        
        gap: 1rem;
        padding: 2rem;
    }

    .portifolio-project-card {
        width: 100%;
        margin: 0;
    }

    /* Contato */
   

    .contato-form {
        width: 100%;
        max-width: 600px;
        margin: 0 auto;
        align-items: center;
    }

    /* Rodapé */
    .rodape-grade {
        grid-template-columns: repeat(2, 1fr);
    }

    .rodape-rodape {
        flex-direction: row;
        justify-content: space-between;
    }
}

@media (min-width: 1024px)  {

    /* Header - Esconder menu hambúrguer, mostrar menu normal */
    .menu-hamburguer {
        display: none;
    }
    .cabecalho{
        width: 100%;
        
    }

    .cabecalho-menu {
        position: static;
        right: auto;
        width: auto;
        max-width: none;
        height: auto;
        background-color: transparent;
        box-shadow: none;
        overflow: visible;
        
    }

    .cabecalho-menu.active {
        right: auto;
    }

    .cabecalho-menu-ul {
        flex-direction: row;
        gap: 3rem;
        
        align-items: center;
        justify-content: space-between;
    }

    .menu-li-a {
        position: relative;
        padding: 0rem .3rem 0 0.18rem;
        
      
    }
    .menu-li-a:hover {
        background-color: transparent;
    }

    .menu-li-a:after {
       content: '';
       position: absolute;
       bottom: 0;
       left: 0;
       width: 0%;
       height: 0.12rem;
       background-color: var(--primary-color);
       transition: all 0.5s ease;
    }
    .menu-li-a:hover::after {
        width: 100%;
    }

    .bg-blue-menu {
        padding: 0.625rem 1.25rem;
        background-color: var(--primary-color);
        color: var(--secondary-color);
        border-radius: 0.6875rem;
        border: 0.0625rem solid var(--primary-color);
        
    }

    .bg-blue-menu:hover {
        background-color: var(--secondary-color);
        color: var(--primary-color);

    }

    /* Banner - Imagem desktop */
    .banner {
        background-image: url('../../src/img/hero-bg.png');
    }

    .banner-titulo {
        font-size: 3.5rem;
        word-spacing: 0.5rem;
    }

    .banner-texto {
        font-size: 2rem;
        padding: 2rem 4rem;
    }

    .banner-container-btn {
        gap: 2rem;
    }

    .btn {
        padding: 1.25rem 2.5rem;
        font-size: 1.3rem;
    }

    /* Serviços - Grid de 3 colunas */
    .servicos-container {
        grid-template-columns: repeat(3, 1fr);
        gap: 2rem;
        padding: 4rem 3rem;
        max-width: 1200px;
        margin: 0 auto;
    }

    .servicos-title {
        font-size: 3.5rem;
    }

    .servicos-text {
        font-size: 2rem;
        padding: 0 4rem;
    }

    /* Porque Escolher */
    .porque-escolher {
        flex-direction: row;
        justify-content: space-between;
        padding: 2rem 4rem;
    }

   
    .porque-escolher-title {
        font-size: 2rem;
    }
    .porque-escolher-text {
        font-size: 1.2rem;
        padding: 0 4rem;
    }
    .porque-escolher-container {
        flex-direction: column;
        align-items: start;
        gap: .5rem;
        width: 100%;
    }
    .porque-escolher-item {
       width: 100%;

        
    }

    /* Portfólio */
    .portifolio-container {
        justify-content: space-around;
        padding: 2rem 4rem;
    }

    .portifolio-item {
        flex: 0 1 calc(33.333% - 1rem);
        max-width: 350px;
    }

    .portifolio-project-container {
        grid-template-columns: repeat(2, 1fr);
        max-width: 1200px;
        margin: 0 auto;
        padding: 3rem;
    }

    .portifolio-title {
        font-size: 3rem;
    }

    .portifolio-text {
        font-size: 1.75rem;
        padding: 0 4rem;
    }

    .portifolio-project-card-container {
        grid-template-columns: repeat(2, 1fr);
        
    }
    
    /* Contato */
    .contato {
        flex-direction: column;
        align-items: center;
         
    }

    .contato-content {
        flex: 1;
        padding: 3rem;
    }

    .contato-container {
        flex: 1;
        max-width: 600px;
    }

    .contato-form {
        width: 100%;
        max-width: 100%;
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
    }

    .contato-title {
        font-size: 3rem;
    }

    .contato-text {
        font-size: 1.75rem;
    }
    .grupo-formulario {
        width: 100%;
    }
    .grupo-formulario:nth-child(3),.grupo-formulario:nth-child(4),.contato-form button {
      grid-column: span 2;
        
    }
    

    /* Rodapé */
    .rodape {
        padding: 4rem 2rem;
    }

    .rodape-container {
        max-width: 1200px;
    }

    .rodape-grade {
        grid-template-columns: repeat(4, 1fr);
        gap: 3rem;
    }
}


@media (min-width: 1440px) {
    .banner-titulo {
        font-size: 4rem;
    }

    .banner-texto {
        font-size: 2.25rem;
    }

    .servicos-container {
        max-width: 1400px;
        gap: 2.5rem;
    }

    .servicos-title {
        font-size: 4rem;
    }

    .porque-container {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        gap: 2rem;
    }

    .porque-escolher-title {
        font-size: 3rem;
    }
    .porque-escolher-text {
        font-size: 1.5rem;
    }
    .porque-escolher-container {
        gap: 1rem;
    }
 

    .portifolio-project-container {
        max-width: 1400px;
    }
    .portifolio-project-card-container {
        grid-template-columns: repeat(3, 1fr);
    }

    .rodape-container {
        max-width: 1400px;
    }
}





