@media (max-width: 1024px) {
    .navbar {
        justify-content: space-between;
    }
    .header {
        padding: 20px !important;
    }
    .links {
        display: none !important;
    }
    .menu {
        display: block !important;
    }

    .langs {
        display: flex;
        align-items: center;
        gap: 20px;
    }
    .lang-sys > button {
        width: 30px;
        border: none !important;
        border-radius: 100px !important;
        span {
            display: none !important;
        }
        div {
            display: block !important;
        }
    }


    .hero {
        padding: 20px !important;
        flex-direction: column;
        .content,
        .vectors {
            width: 100% !important;
        }
    }

    .cta {
        margin-left: 0 !important;
    }
}

@media (max-width: 520px) {
    .cta {
        padding: 0px !important;
        span {
            display: none;
        }
    }

    .adv {
        flex-direction: column !important;
        .tag {
            width: 100% !important;
        }
    }

    .content > .text {
        width: 100% !important;
    }

    .rating {
        flex-direction: column !important;
    }
}