@media (max-width: 1100px) {
    .desktop-nav__list {
        gap: 32px;
    }
}

@media (max-width: 900px) {
    .site-header__inner {
        padding-block: 28px;
    }

    .desktop-nav {
        display: none;
    }

    .menu-toggle {
        display: block;
    }

    .mobile-menu {
        position: fixed;
        inset: 0;
        z-index: 1000;
        background: #111111;
        padding: 96px 24px 40px;
    }

    .mobile-nav__list {
        display: flex;
        flex-direction: column;
        gap: 24px;
        margin: 0;
        padding: 0;
        list-style: none;
        animation: menu-in 180ms ease-out;
    }

    .mobile-nav a {
        color: #b8b8b8;
        text-decoration: none;
        font-family: "DM Sans", sans-serif;
        font-size: clamp(2rem, 8vw, 4rem);
        line-height: 1;
    }

    .mobile-nav a:hover,
    .mobile-nav a:focus-visible {
        color: #ffffff;
    }

    body.menu-open {
        overflow: hidden;
    }

    .container {
        padding-inline: 32px;
    }

    .hero {
        padding-block: 38px 120px;
    }

    .hero h1 {
        font-size: clamp(30px, 8vw, 64px);
        line-height: 1;
    }

    .publications__grid {
        grid-template-columns: 1fr;
        gap: 48px;
    }

    .publication__title {
        font-size: 17px;
    }

    .service__title {
        font-size: 17px;
    }

    .site-footer {
        margin-top: 112px;
        padding-block: 80px 32px;
    }

    .site-footer__intro {
        margin-bottom: 48px;
    }

    .site-footer__contact {
        margin-bottom: 56px;
    }
}

@keyframes menu-in {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}