/******************************************************************************************
 * Responsive
******************************************************************************************/

@media (max-width: 1024px){

    .navbar{
        padding:20px 30px;
    }

    .nav-menu{
        gap:18px;
    }

    .hero{
        gap:40px;
    }

    .hero h1{
        font-size:3.8rem;
    }

    .projects-container,
    .services-container,
    .experience-container{
        grid-template-columns:repeat(2,1fr);
    }

    .tech-grid{
        grid-template-columns:repeat(3,1fr);
    }

}

@media (max-width: 768px){

    .navbar{
        flex-wrap:wrap;
        gap:20px;
    }

    .nav-menu{
        width:100%;
        justify-content:center;
        flex-wrap:wrap;
        gap:15px;
    }

    .btn-cv{
        display:none;
    }

    .hero{
        flex-direction:column;
        text-align:center;
        padding-top:160px;
    }

    .hero h1{
        font-size:3.2rem;
    }

    .tech-list,
    .hero-buttons{
        justify-content:center;
    }

    .about-container,
    .contact-card{
        grid-template-columns:1fr;
        display:grid;
    }

    .about-container{
        text-align:center;
    }

    .stats{
        grid-template-columns:1fr 1fr;
    }

    .projects-container,
    .services-container,
    .experience-container,
    .tech-grid{
        grid-template-columns:1fr;
    }

    .contact-card{
        padding:35px 25px;
    }

}

@media (max-width: 480px){

    .logo p{
        display:none;
    }

    .hero h1{
        font-size:2.6rem;
    }

    .hero-subtitle{
        font-size:1.4rem;
    }

    .hero h2{
        font-size:1.3rem;
    }

    .section-title h2{
        font-size:2.2rem;
    }

    .stats{
        grid-template-columns:1fr;
    }

    .project-image{
        height:180px;
    }

    .contact-info h3{
        font-size:1.8rem;
    }

}