/* =====================================================
   OSP SZYNWAŁD
   RESPONSYWNOŚĆ - TELEFONY I TABLETY
===================================================== */


/* ================= TABLETY ================= */

@media (max-width: 1100px) {


    .container {

        width: 92%;

    }


    nav ul {

        gap: 20px;

    }


    .about-grid {

        grid-template-columns: repeat(2,1fr);

    }


    .stats-grid {

        grid-template-columns: repeat(2,1fr);

    }


    .news-grid {

        grid-template-columns: repeat(2,1fr);

    }


    .gallery-grid {

        grid-template-columns: repeat(2,1fr);

    }


}



/* ================= TELEFONY ================= */


@media (max-width: 768px) {



    /* HEADER */


    .header-container {

        min-height:80px;

    }


    .logo img {

        width:50px;

        height:50px;

    }


    .logo-text h2 {

        font-size:14px;

    }


    .logo-text p {

        font-size:16px;

    }



    /* MENU */


    nav {

        position:absolute;

        top:80px;

        left:0;

        width:100%;

        background:white;

        display:none;

        box-shadow:0 10px 30px rgba(0,0,0,.15);

    }



    nav.active {

        display:block;

    }



    nav ul {

        flex-direction:column;

        gap:0;

        padding:20px;

        text-align:center;

    }



    nav li {

        padding:15px 0;

    }



    .hamburger {

        display:block;

    }




    /* HERO */


    .hero {

        min-height:650px;

    }


    .hero h1 {

        font-size:38px;

    }



    .hero p {

        font-size:16px;

        padding:0 15px;

    }



    .hero-buttons {

        flex-direction:column;

        align-items:center;

    }



    .btn {

        width:220px;

        justify-content:center;

    }



    /* SEKCJE */


    section {

        padding:70px 0;

    }



    .section-title h2 {

        font-size:32px;

    }




    /* O NAS */


    .about-grid {

        grid-template-columns:1fr;

    }




    /* STATYSTYKI */


    .stats-grid {

        grid-template-columns:1fr;

    }



    .stat-box h3 {

        font-size:38px;

    }





    /* AKTUALNOŚCI */


    .news-grid {

        grid-template-columns:1fr;

    }



    .news-image {

        height:220px;

    }





    /* GALERIA */


    .gallery-grid {

        grid-template-columns:1fr;

    }



    .gallery-item {

        height:280px;

    }





    /* KONTAKT */


    .contact-grid {

        grid-template-columns:1fr;

    }



    .contact-box {

        padding:30px 20px;

    }




    /* FOOTER */


    .footer-content {

        flex-direction:column;

        text-align:center;

    }


    .footer-logo {

        flex-direction:column;

    }


    .footer-links {

        justify-content:center;

    }


}





/* ================= MAŁE TELEFONY ================= */


@media(max-width:400px){


    .hero h1 {

        font-size:32px;

    }


    .logo-text h2 {

        font-size:12px;

    }


    .logo-text p {

        font-size:14px;

    }


}