/* Mobile Responsive Design */


@media(max-width:768px) {



    body {

        overflow-x: hidden;

    }



    /* Header */


    h1 {

        font-size: 28px;

    }


    h2 {

        font-size: 24px;

    }



    /* Navigation */


    nav {

        display: none;

    }



    /* Sidebar */


    .sidebar {

        width: 80%;

    }



    /* Hero */


    .hero img {

        width: 95%;

    }


    .hero h2 {

        font-size: 28px;

    }


    .hero p {

        font-size: 16px;

    }



    /* Cards */


    .card-container {

        flex-direction: column;

        align-items: center;

    }


    .card {

        width: 90%;

    }



    /* Gallery */


    .gallery-container {

        grid-template-columns: 1fr;

    }



    /* News */


    .news-container {

        flex-direction: column;

        align-items: center;

    }



    .news-card {

        width: 90%;

    }



    /* Tutorials */


    .tutorial-container {

        flex-direction: column;

        align-items: center;

    }



    .tutorial-card {

        width: 90%;

    }



    /* Statistics */


    .stats-container {

        flex-direction: column;

        align-items: center;

    }



    /* Footer */


    .footer-container {

        flex-direction: column;

        text-align: center;

    }



    .theme-toggle {

        right: 15px;

        top: 15px;

    }


}