/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 1000px) {
    .frame {
        width: 100%;
    }

    .nav-bar {
        width: calc(100% - 72px);
        top: 50px;
    }

    .nav-bar .menu-items {
        visibility: hidden;
        transform: translateY(0.5rem) translate(-50%, -50%);
        position: fixed;
        top: 185px;
        width: calc(100% - 30px);
        left: 50%;
        right: 50%;
        padding: 15px;
        transition: all 0.5s cubic-bezier(0.16, 1, 0.5, 1);
        opacity: 0;
        flex-direction: column;
        text-align: center;
        background-color: #24242499;
        border: 2px solid #262626;
        border-radius: 10px;
    }

    .nav-bar .menu-items.show {
        visibility: visible;
        opacity: 1;
        z-index: 1001;
        transform: translateY(0rem) translate(-50%, -50%);
        backdrop-filter: blur(16px) brightness(100%);
        -webkit-backdrop-filter: blur(16px) brightness(100%);
    }

    .blur-nav.show {
        display: flex;
        position: fixed;
        backdrop-filter: blur(16px) brightness(100%);
        top: 195px;
        border-radius: 10px;
        width: calc(100% - 24px);
        height: 198px;
        left: 50%;
        right: 50%;
        transform: translate(-50%, -50%);
    }

    .nav-bar .menu-burger {
        display: flex;
    }

    .nav-bar .menu-burger img {
        width: 50px;
    }

    .main-block {
        background-position: center top;
    }

    .main-block .main-view {
        padding: 0 20px;
    }

    .benefits-block {
        margin: -40px 0 0;
        padding: 60px 0 0;
        background: linear-gradient(180deg, rgba(26, 26, 26, 0.00) 3.76%, rgba(26, 26, 26, 0.27) 5.26%, rgba(26, 26, 26, 0.47) 28.06%, rgba(26, 26, 26, 0.72) 21.04%, rgba(26, 26, 26, 0.80) 26.78%, rgba(26, 26, 26, 0.87) 32.24%, rgba(26, 26, 26, 0.93) 38.74%, #1A1A1A 45.17%);
    }

    .benefits-block .container {
        width: 100%;
        padding: 0 20px;
    }

    .benefits-block .container .items {
        flex-direction: column;
        align-items: center;
        gap: 40px;
    }

    .benefits-block .container .items .item {
        gap: 15px;
        width: calc(100% - 40px);
    }

    .services-block {
        margin: 100px 0 0;
        padding: 0 20px;
        width: auto;
    }

    .services-block .items {
        align-items: center;
        flex-direction: column;
        align-content: center;
    }

    .services-block .items .item {
        width: calc(100% - 52px);
    }

    .app-block {
        width: auto;
        padding: 0 20px;
        margin: 100px 0 0;
    }

    .app-block .content .tabs-content .app .screenshots img {
        width: 100%;
    }

    .app-block .content .instruction {
        padding: 0 20px 60px;
    }

    .app-block .content .instruction > .items {
        flex-direction: column;
        align-items: center;
        gap: 30px;
    }

    .app-block .content .instruction > .items .item {
        width: 100%;
    }

    .tariffs-block {
        width: auto;
        padding: 20px;
        margin: 100px 0 0;
    }

    .tariffs-block .items {
        flex-direction: column;
    }

    .tariffs-block .items > .item {
        width: auto;
    }

    .tariffs-block .items > .item .name {
        font-size: 22px;
    }

    .tariffs-block .items > .item .benefits .item {
        font-size: 22px;
    }

    .tariffs-block .items > .item .btn {
        padding: 12px 16px;
        font-size: 20px;
    }

    .already-with-us-block {
        width: auto;
        padding: 0 20px;
    }

    .already-with-us-block .form {
        flex-direction: column;
        align-items: center;
        gap: 15px;
    }

    .already-with-us-block .form input {
        width: 300px;
    }

    .already-with-us-block .form .btn {
        width: 200px;
    }

    .already-with-us-block .agreements {
        text-align: center;
    }

    .footer {
        padding: 60px 0;
    }

    .footer .menu {
        flex-direction: column;
        align-items: center;
    }

    .footer .bottom {
        flex-direction: column;
        gap: 20px;
        padding: 20px 0;
    }

    .footer .bottom .links {
        flex-direction: column;
        gap: 10px;
        align-items: center;
    }

    .footer .bottom .links .item:not(:last-child) {
        border-right: none;
    }
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {

}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {

}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {

}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {

}
