/* ===================================================
   IRZALGIT Portal v1.0
   Responsive Layout
   File : css/portal-responsive.css
=================================================== */

/* Tablet */
@media (max-width: 992px) {

    .hero h2{
        font-size:40px;
    }

    .hero p{
        font-size:18px;
        max-width:90%;
    }

    nav a{
        margin-left:15px;
    }

}

/* Mobile */
@media (max-width:768px){

    header .container{
        flex-direction:column;
        gap:15px;
    }

    .logo{
        text-align:center;
    }

    nav{
        display:flex;
        flex-wrap:wrap;
        justify-content:center;
        gap:12px;
    }

    nav a{
        margin:0;
    }

    .hero{
        padding:60px 20px;
    }

    .hero h2{
        font-size:32px;
        line-height:1.3;
    }

    .hero p{
        font-size:16px;
    }

    .hero-button{
        flex-direction:column;
        align-items:center;
    }

    .btn-primary,
    .btn-secondary{
        width:240px;
        text-align:center;
    }

    .projects{
        padding:50px 20px;
    }

    .projects h2{
        font-size:28px;
    }

}

/* Small Mobile */
@media (max-width:480px){

    .logo h1{
        font-size:24px;
    }

    .logo span{
        font-size:12px;
    }

    .hero h2{
        font-size:28px;
    }

    .hero p{
        font-size:15px;
    }

    .card{
        padding:20px;
    }

    footer{
        font-size:14px;
        padding:25px;
    }

}