@media (max-width: 992px) {

    .about-section .container {

        grid-template-columns: 1fr;
    }

    .header-btn {

        display: none;
    }
}


@media (max-width: 768px) {

    section {

        padding: 90px 0;
    }

    .menu-toggle {

        display: block;

        z-index: 1001;
    }

    .site-nav {

        position: fixed;

        top: 0;
        right: -100%;

        width: 300px;
        height: 100vh;

        background: white;

        padding: 120px 40px;

        transition: var(--transition);
    }

    .site-nav.open {

        right: 0;
    }

    .nav-menu {

        flex-direction: column;

        gap: 25px;
    }

    body.menu-open {

        overflow: hidden;
    }

    .hero-content {

        padding: 20px;
    }

    .footer-inner {

        flex-direction: column;
    }
}