/* =========================================
   LARGE TABLETS — max-width: 992px
========================================= */

@media (max-width: 992px){

    /* Hero */

    .hero-container{
        grid-template-columns:1fr;
        text-align:center;
        gap:60px;
    }

    .hero-right{
        order:-1;
    }

    .hero-description{
        max-width:650px;
        margin:0 auto 40px;
    }

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

    .hero-title{
        font-size:4.5rem;
    }

    .image-wrapper{
        width:280px;
        margin:auto;
    }

    /* About */

    .about-grid{
        grid-template-columns:1fr;
        gap:60px;
    }

    .section-title{
        font-size:3rem;
    }

    /* Projects */

    .project-card,
    .project-card:nth-child(even){
        grid-template-columns:1fr;
        gap:40px;
    }

    .project-card:nth-child(even) .project-image,
    .project-card:nth-child(even) .project-content{
        order:unset;
    }

    /* Tech Stack */

    .skills-wrapper{
        grid-template-columns:1fr;
        gap:20px;
    }

    /* Certifications */

    .cert-columns{
        grid-template-columns:1fr;
        gap:50px;
    }

    /* Timeline */

    .timeline-item{
        flex-direction:column;
        gap:14px;
    }

    .timeline::before{
        left:9px;
    }

    .year::after{
        right:auto;
        left:-5px;
    }

    .timeline-content{
        padding-left:0;
    }

}

/* =========================================
   MOBILE — max-width: 768px
========================================= */

@media (max-width:768px){

    /* Navbar */

    .nav-menu{
        position:fixed;
        top:0;
        right:-100%;
        width:280px;
        height:100vh;
        background:rgba(15,14,12,.98);
        backdrop-filter:blur(20px);
        display:flex;
        flex-direction:column;
        justify-content:center;
        align-items:center;
        gap:35px;
        transition:right .4s var(--ease);
        box-shadow:-10px 0 30px rgba(0,0,0,.08);
        z-index:1100;
    }

    .nav-menu.active{
        right:0;
    }

    .nav-menu a{
        font-size:1.2rem;
    }

    .menu-toggle{
        display:block;
        z-index:1200;
    }

    .resume-btn{
        display:none;
    }

    /* Hero */

    .hero{
        padding-top:120px;
    }

    .hero-title{
        font-size:3.3rem;
    }

    .hero-description{
        font-size:1rem;
    }

    .hero-buttons{
        flex-direction:column;
        width:100%;
    }

    .btn,
    .btn-outline{
        width:100%;
        max-width:260px;
        margin:auto;
    }

    .hero-social{
        margin-top:10px;
    }

    .image-wrapper{
        width:230px;
    }

    /* Section */

    section{
        padding:90px 0;
    }

    .section-title{
        font-size:2.4rem;
    }

    /* Projects */

    .project-content h3{
        font-size:1.8rem;
    }

    /* Contact */

    .contact-links{
        flex-direction:column;
        align-items:center;
    }

    .contact-links a{
        width:230px;
        text-align:center;
    }

}

/* =========================================
   SMALL DEVICES — max-width: 480px
========================================= */

@media (max-width:480px){

    .hero-title{
        font-size:2.7rem;
    }

    .section-title{
        font-size:2rem;
    }

    .logo{
        font-size:1.7rem;
    }

    .hero-buttons{
        gap:15px;
    }

    .skill-list{
        gap:10px;
    }

}