@media (min-width: 1200px) {
    .wrapper-center {
        width: 1000px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .wrapper-center {
        width: 900px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .wrapper-center {
        width: 700px;
    }
}

@media (max-width: 767px) {
    html, body {
        font-size: 15px;
    }

    nav {
        height: 4rem;
    }

    nav a {
        font-size: 1.1rem;
    }

    nav .logo img {
        height: 5.33rem;
    }

    .nav-wrapper {
        padding: 1.5rem 0;
    }

    .wrapper-center {
        width: 100%;
        padding: 0 1.5rem;
    }

    .grid {
        grid-template-columns: 1fr;
    }

    footer .grid {
        gap: 7rem;
    }
}

@media (max-width: 480px) {
    html, body {
        font-size: 14px;
    }
}